From df89a0c8a53a5cfd64ab23ff5d537bb314dc62b0 Mon Sep 17 00:00:00 2001 From: Donkie Date: Sat, 15 Jul 2023 14:38:40 +0200 Subject: [PATCH 1/5] Client: Created general useSavedState function --- client/src/pages/spools/list.tsx | 7 +++++-- client/src/utils/saveload.ts | 14 +++++++------- 2 files changed, 12 insertions(+), 9 deletions(-) diff --git a/client/src/pages/spools/list.tsx b/client/src/pages/spools/list.tsx index 36c9c46..0918c30 100644 --- a/client/src/pages/spools/list.tsx +++ b/client/src/pages/spools/list.tsx @@ -20,7 +20,7 @@ import { ISpool } from "./model"; import { TableState, useInitialTableState, - useShowArchive, + useSavedState, useStoreInitialState, } from "../../utils/saveload"; import { @@ -55,7 +55,10 @@ export const SpoolList: React.FC = () => { const initialState = useInitialTableState("spoolList"); // State for the switch to show archived spools - const [showArchived, setShowArchived] = useShowArchive("spoolList"); + const [showArchived, setShowArchived] = useSavedState( + "spoolList-showArchived", + false + ); // Fetch data from the API const { diff --git a/client/src/utils/saveload.ts b/client/src/utils/saveload.ts index a20aaa0..6677e7e 100644 --- a/client/src/utils/saveload.ts +++ b/client/src/utils/saveload.ts @@ -60,17 +60,17 @@ export function useStoreInitialState(tableId: string, state: TableState) { }, [tableId, state.showColumns]); } -export function useShowArchive(tableId: string) { - const [showArchive, setShowArchive] = React.useState(() => { - const savedShowArchive = isLocalStorageAvailable ? localStorage.getItem(`${tableId}-showArchive`) : null; - return savedShowArchive ? JSON.parse(savedShowArchive) : false; +export function useSavedState(id: string, defaultValue: T) { + const [state, setState] = React.useState(() => { + const savedState = isLocalStorageAvailable ? localStorage.getItem(`savedStates-${id}`) : null; + return savedState ? JSON.parse(savedState) : defaultValue; }); React.useEffect(() => { if (isLocalStorageAvailable) { - localStorage.setItem(`${tableId}-showArchive`, JSON.stringify(showArchive)); + localStorage.setItem(`savedStates-${id}`, JSON.stringify(state)); } - }, [tableId, showArchive]); + }, [id, state]); - return [showArchive, setShowArchive] as const; + return [state, setState] as const; } From 980a0ab6513b8d6624d2a9369e63028406117b3d Mon Sep 17 00:00:00 2001 From: Donkie Date: Sat, 29 Jul 2023 21:49:25 +0200 Subject: [PATCH 2/5] Added svg icon source files --- client/icons/spool.svg | 95 ++++++++++++++++++++++++++++++++++++++ client/icons/spoolman.svg | 97 +++++++++++++++++++++++++++++++++++++++ 2 files changed, 192 insertions(+) create mode 100644 client/icons/spool.svg create mode 100644 client/icons/spoolman.svg diff --git a/client/icons/spool.svg b/client/icons/spool.svg new file mode 100644 index 0000000..19047cd --- /dev/null +++ b/client/icons/spool.svg @@ -0,0 +1,95 @@ + + Created with Fabric.js 5.3.0 diff --git a/client/icons/spoolman.svg b/client/icons/spoolman.svg new file mode 100644 index 0000000..d396c8f --- /dev/null +++ b/client/icons/spoolman.svg @@ -0,0 +1,97 @@ + + Created with Fabric.js 5.3.0 From cac6220d95b11d888e07a172a33f9a41af2d6e7b Mon Sep 17 00:00:00 2001 From: Donkie Date: Sat, 29 Jul 2023 22:03:13 +0200 Subject: [PATCH 3/5] Added a monochrome spoolman icon --- client/icons/spoolman_monochrome.svg | 75 ++++++++++++++++++++++++++++ 1 file changed, 75 insertions(+) create mode 100644 client/icons/spoolman_monochrome.svg diff --git a/client/icons/spoolman_monochrome.svg b/client/icons/spoolman_monochrome.svg new file mode 100644 index 0000000..8f89719 --- /dev/null +++ b/client/icons/spoolman_monochrome.svg @@ -0,0 +1,75 @@ + + Created with Fabric.js 5.3.0 From 6b1420a3fa0411da497e66917ba8dc02f4cc63d6 Mon Sep 17 00:00:00 2001 From: Donkie Date: Sun, 30 Jul 2023 10:27:43 +0200 Subject: [PATCH 4/5] Cleaned up svg layers --- client/icons/spool.svg | 58 +++++++++++++++--------------- client/icons/spoolman.svg | 76 ++++++++++++++++++--------------------- 2 files changed, 62 insertions(+), 72 deletions(-) diff --git a/client/icons/spool.svg b/client/icons/spool.svg index 19047cd..6d53b3b 100644 --- a/client/icons/spool.svg +++ b/client/icons/spool.svg @@ -20,9 +20,9 @@ inkscape:pageopacity="0.0" inkscape:pagecheckerboard="true" inkscape:deskcolor="#d1d1d1" - inkscape:zoom="2.346" - inkscape:cx="117.43393" - inkscape:cy="250" + inkscape:zoom="1.6588725" + inkscape:cx="132.92161" + inkscape:cy="209.47963" inkscape:window-width="1350" inkscape:window-height="1237" inkscape:window-x="1189" @@ -30,33 +30,31 @@ inkscape:window-maximized="0" inkscape:current-layer="svg5" /> Created with Fabric.js 5.3.0 + id="path5" + inkscape:label="hole" /> diff --git a/client/icons/spoolman.svg b/client/icons/spoolman.svg index d396c8f..56c2755 100644 --- a/client/icons/spoolman.svg +++ b/client/icons/spoolman.svg @@ -22,7 +22,7 @@ inkscape:deskcolor="#d1d1d1" inkscape:zoom="5.3318182" inkscape:cx="110" - inkscape:cy="136.35124" + inkscape:cy="106.53026" inkscape:window-width="1898" inkscape:window-height="1360" inkscape:window-x="868" @@ -30,68 +30,60 @@ inkscape:window-maximized="0" inkscape:current-layer="svg8" /> Created with Fabric.js 5.3.0 + id="path8" + inkscape:label="bean1_fg" /> From c08b4cb81a6f3cc43636fda2546db389bfe72b55 Mon Sep 17 00:00:00 2001 From: Donkie Date: Sun, 30 Jul 2023 10:27:58 +0200 Subject: [PATCH 5/5] Improved monochrome spoolman icon --- client/icons/spoolman_monochrome.svg | 48 ++++++++++------------------ 1 file changed, 17 insertions(+), 31 deletions(-) diff --git a/client/icons/spoolman_monochrome.svg b/client/icons/spoolman_monochrome.svg index 8f89719..a480ab2 100644 --- a/client/icons/spoolman_monochrome.svg +++ b/client/icons/spoolman_monochrome.svg @@ -20,49 +20,35 @@ inkscape:pageopacity="0.0" inkscape:pagecheckerboard="true" inkscape:deskcolor="#d1d1d1" - inkscape:zoom="3.7701648" - inkscape:cx="117.10363" - inkscape:cy="78.245917" + inkscape:zoom="2.6659091" + inkscape:cx="73.333333" + inkscape:cy="97.1526" inkscape:window-width="1898" inkscape:window-height="1360" - inkscape:window-x="868" + inkscape:window-x="684" inkscape:window-y="0" inkscape:window-maximized="0" inkscape:current-layer="svg8" /> Created with Fabric.js 5.3.0 + clip-path="url(#clipPath13)" + inkscape:path-effect="#path-effect13" + inkscape:original-d="M 0 -22.46181 C 12.39892 -22.46181 22.46181 -12.39892 22.46181 0 C 22.46181 12.39892 12.39892 22.46181 0 22.46181 C -12.39892 22.46181 -22.46181 12.39892 -22.46181 0 C -22.46181 -12.39892 -12.39892 -22.46181 0 -22.46181 z" />