feat: Note search, locale time string

This commit is contained in:
Artemy 2023-04-05 20:10:05 +03:00
parent 482031b1f6
commit a34ae82215
9 changed files with 118 additions and 33 deletions

14
package-lock.json generated
View file

@ -15,6 +15,7 @@
"crypto-js": "^4.1.1",
"dotenv": "^16.0.3",
"express": "^4.18.2",
"fuse.js": "^6.6.2",
"js-sha3": "^0.8.0",
"openai": "^3.2.1",
"react": "^18.2.0",
@ -2299,6 +2300,14 @@
"resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.1.tgz",
"integrity": "sha512-yIovAzMX49sF8Yl58fSCWJ5svSLuaibPxXQJFLmBObTuCr0Mf1KiPopGM9NiFjiYBCbfaa2Fh6breQ6ANVTI0A=="
},
"node_modules/fuse.js": {
"version": "6.6.2",
"resolved": "https://registry.npmjs.org/fuse.js/-/fuse.js-6.6.2.tgz",
"integrity": "sha512-cJaJkxCCxC8qIIcPBF9yGxY0W/tVZS3uEISDxhYIdtk8OL93pe+6Zj7LjCqVV4dzbqcriOZ+kQ/NE4RXZHsIGA==",
"engines": {
"node": ">=10"
}
},
"node_modules/gensync": {
"version": "1.0.0-beta.2",
"resolved": "https://registry.npmjs.org/gensync/-/gensync-1.0.0-beta.2.tgz",
@ -7231,6 +7240,11 @@
"resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.1.tgz",
"integrity": "sha512-yIovAzMX49sF8Yl58fSCWJ5svSLuaibPxXQJFLmBObTuCr0Mf1KiPopGM9NiFjiYBCbfaa2Fh6breQ6ANVTI0A=="
},
"fuse.js": {
"version": "6.6.2",
"resolved": "https://registry.npmjs.org/fuse.js/-/fuse.js-6.6.2.tgz",
"integrity": "sha512-cJaJkxCCxC8qIIcPBF9yGxY0W/tVZS3uEISDxhYIdtk8OL93pe+6Zj7LjCqVV4dzbqcriOZ+kQ/NE4RXZHsIGA=="
},
"gensync": {
"version": "1.0.0-beta.2",
"resolved": "https://registry.npmjs.org/gensync/-/gensync-1.0.0-beta.2.tgz",

View file

@ -18,6 +18,7 @@
"crypto-js": "^4.1.1",
"dotenv": "^16.0.3",
"express": "^4.18.2",
"fuse.js": "^6.6.2",
"js-sha3": "^0.8.0",
"openai": "^3.2.1",
"react": "^18.2.0",

View file

@ -97,4 +97,5 @@ export {
SettingsTextInput,
SettingsSelectInput,
SettingsSection,
setSetting,
};

View file

@ -4,11 +4,16 @@ function printDate(time) {
return i < 10 ? "0" + i : "" + i;
}
let dateStr = `${padStr(time.getHours())}:${padStr(
time.getMinutes()
)}:${padStr(time.getSeconds())} ${padStr(time.getDate())}.${padStr(
1 + time.getMonth()
)}.${padStr(time.getFullYear())}`;
let dateStr =
settings.language === "ru" || settings.language === "ru-RU"
? `${padStr(time.getHours())}:${padStr(time.getMinutes())}:${padStr(
time.getSeconds()
)} ${padStr(time.getDate())}.${padStr(1 + time.getMonth())}.${padStr(
time.getFullYear()
)}`
: `${time.toLocaleTimeString("en-US")} ${padStr(
1 + time.getMonth()
)}/${padStr(time.getDate())}/${padStr(time.getFullYear())}`;
return dateStr;
}

View file

@ -50,6 +50,8 @@ let en = {
BroadcastSync: "Getting notes, settings from another device",
SyncAll: "Send data to all devices",
Sync: "Sync",
Search: "Search",
NoNotesFound: "No notes found",
};
export default en;

View file

@ -51,6 +51,8 @@ let ru = {
BroadcastSync: "Получение заметок, настроек с другого устройства",
SyncAll: "Отправить данные",
Sync: "Синхронизация",
Search: "Поиск",
NoNotesFound: "Заметок не найдено",
};
export default ru;

View file

@ -1,43 +1,96 @@
import { ButtonWithIcon } from "../components/button";
import { ChevronDoubleRightIcon } from "@heroicons/react/24/outline";
import { printDate } from "../components/utils";
import Fuse from "fuse.js";
import { inputStyle } from "../components/styles";
import { useState } from "react";
import { setSetting } from "../components/settingsInputs";
function Notes() {
let notes = Object.entries(localStorage.getObj("Notes"))
.sort((a, b) => {
return b[1].time - a[1].time;
})
.map((val) => {
return (
<div
className="grid grid-cols-1 lg:grid-cols-2 border border-blue-300 rounded-lg m-2 p-2 justify-items-start"
key={val[0]}
>
<div className="font-medium leading-tight text-4xl mt-0 mb-2">
{val[1].name}
</div>
<div className="grid grid-cols-1 lg:grid-cols-2 justify-self-center lg:justify-self-end">
<div className="text-center">{printDate(val[1].time)}</div>
<div className="">
<ButtonWithIcon
href={`/notes/${val[0]}`}
reverse={true}
icon={ChevronDoubleRightIcon}
text={locals.Open}
/>
</div>
if (!settings.newNotes) {
let notesObj = localStorage.getObj("Notes");
let notes = Object.entries(notesObj);
for (let [id, note] of notes) {
note.id = id;
note.textTime = printDate(note.time);
notesObj[id] = note;
}
localStorage.setObj("Notes", notesObj);
setSetting("newNotes", true);
}
let n = Object.values(localStorage.getObj("Notes"));
let fuse = new Fuse(n, {
keys: ["name", "text", "textTime", "tags"],
});
let [search, setSearch] = useState("");
let found = search === "" ? n : fuse.search(search);
if (search !== "") {
found = found
.sort((a, b) => {
return b.refIndex - a.refIndex;
})
.map(({ item }) => item);
} else {
found = found.sort((a, b) => {
return b.time - a.time;
});
}
let notes = found.map((item) => {
return (
<div
className="grid grid-cols-1 lg:grid-cols-2 border border-blue-300 rounded-lg m-2 p-2 justify-items-start"
key={item.id}
>
<div className="font-medium leading-tight text-4xl mt-0 mb-2">
{item.name}
</div>
<div className="grid grid-cols-1 lg:grid-cols-2 justify-self-center lg:justify-self-end">
<div className="text-center">{printDate(item.time)}</div>
<div className="">
<ButtonWithIcon
href={`/notes/${item.id}`}
reverse={true}
icon={ChevronDoubleRightIcon}
text={locals.Open}
/>
</div>
</div>
);
});
</div>
);
});
if (notes.length === 0)
if (n.length === 0) {
return (
<div className="md">
<h3>{locals.NoNotesYet}</h3>
</div>
);
return notes;
}
return (
<div className="">
<input
type="text"
className={`mb-2 md:w-1/6 w-full ${inputStyle}`}
placeholder={locals.Search}
onChange={(e) => {
setSearch(e.target.value);
}}
/>
{notes}
{found.length === 0 && (
<div className="md">
<h3>{locals.NoNotesFound}</h3>
</div>
)}
</div>
);
}
export default Notes;

View file

@ -1,4 +1,5 @@
import { Navigate } from "react-router-dom";
import { printDate } from "../components/utils";
function uuidv4() {
return ([1e7] + -1e3 + -4e3 + -8e3 + -1e11).replace(/[018]/g, (c) =>
@ -19,10 +20,14 @@ function Save() {
let notesObj = localStorage.getObj("Notes");
let time = Date.now();
notesObj[id] = {
id,
name,
text,
time: Date.now(),
time,
textTime: printDate(time),
pubTime,
pub: !!pubTime,
};

View file

@ -3,6 +3,7 @@ import {
SettingsTextInput,
SettingsSelectInput,
SettingsSection,
setSetting,
} from "../components/settingsInputs";
import { reRenderPage } from "../components/utils";
import Locales from "../localisation/main";
@ -125,6 +126,7 @@ function Settings() {
Locales[navigator.userLanguage] ||
Locales.en;
setSetting("newNotes", false);
reRenderPage();
}}
/>