Skip to content

Commit

Permalink
chore: remove old settings store, format files
Browse files Browse the repository at this point in the history
  • Loading branch information
bryanlundberg committed Nov 12, 2024
1 parent fa43dff commit 09e4872
Show file tree
Hide file tree
Showing 4 changed files with 109 additions and 140 deletions.
208 changes: 98 additions & 110 deletions src/components/dialogs/dialog-import-backup/dialog-import-backup.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -7,120 +7,108 @@ import { getAllCubes } from "@/db/dbOperations";
import Loading from "../../Loading";
import { useRouter } from "next/navigation";
import {
Dialog,
DialogContent,
DialogDescription,
DialogFooter,
DialogHeader,
DialogTitle,
} from "@/components/ui/dialog"
DialogContent,
DialogDescription,
DialogFooter,
DialogHeader,
DialogTitle,
} from "@/components/ui/dialog";

export default function DialogImportBackup() {
const t = useTranslations("Index.backup-modal");
const [isImporting, setIsImporting] = useState(false);
const dataInputRef = useRef<HTMLInputElement>(null);
const { setSelectedCube, setCubes, setTimerStatistics } = useTimerStore();
const router = useRouter();
const t = useTranslations("Index.backup-modal");
const [isImporting, setIsImporting] = useState(false);
const dataInputRef = useRef<HTMLInputElement>(null);
const { setSelectedCube, setCubes, setTimerStatistics } = useTimerStore();
const router = useRouter();

return (


<DialogContent className="sm:max-w-[425px]">
<DialogHeader>
return (
<DialogContent className="sm:max-w-[425px]">
<DialogHeader>
<div className="flex flex-auto items-center justify-center">
<DialogTitle>{t("title")}</DialogTitle>
</div>
<DialogDescription>{t("description")}</DialogDescription>
</DialogHeader>
{!isImporting ? (
<div className="relative border-2 border-dashed border-blue-900 w-full h-20 text-md flex justify-center items-center hover:border-blue-600 transition duration-200 ">
<input
type="file"
accept=".txt"
ref={dataInputRef}
onChange={async (e) => {
try {
setIsImporting(true);
const response = await importDataFromFile(e);
if (response) {
const cubesDB = await getAllCubes();
setCubes(cubesDB);
router.push("/cubes");
setSelectedCube(null);
setTimerStatistics();
alert(`${t("alert-category")}`);
}
} catch (error) {
console.error(error);
} finally {
setIsImporting(false);
}
}}
className="absolute z-50 w-full h-full opacity-0 hover:cursor-pointer"
/>
<div className="absolute z-40 text-center text-xs">
{t("drag-drop")}
</div>
</div>
) : (
<div className="text-center mx-auto flex-col items-center gap-2">
<div className="flex justify-center mt-3">
<Loading />
</div>
<div className="mx-auto mt-2">{t("loading-part-1")}</div>
<div className="font-bold">{t("loading-part-2")}</div>
</div>
)}
<div className="flex flex-auto items-center justify-center">
<DialogTitle>{t("title")}</DialogTitle>
<div className="font-medium mt-3">{t("welcome")}</div>
</div>
<DialogDescription>
{t("description")}
</DialogDescription>
</DialogHeader>
{!isImporting ? (
<div className="relative border-2 border-dashed border-blue-900 w-full h-20 text-md flex justify-center items-center hover:border-blue-600 transition duration-200 ">
<input
type="file"
accept=".txt"
ref={dataInputRef}
onChange={async (e) => {
try {
setIsImporting(true);
const response = await importDataFromFile(e);
if (response) {
const cubesDB = await getAllCubes();
setCubes(cubesDB);
router.push("/cubes");
setSelectedCube(null);
setTimerStatistics();
alert(`${t("alert-category")}`);
}
} catch (error) {
console.error(error);
} finally {
setIsImporting(false);
}
}}
className="absolute z-50 w-full h-full opacity-0 hover:cursor-pointer"
/>
<div className="absolute z-40 text-center">
{t("drag-drop")}
</div>
</div>
) : (
<div className="text-center mx-auto flex-col items-center gap-2">
<div className="flex justify-center mt-3">
<Loading />
</div>
<div className="mx-auto mt-2">{t("loading-part-1")}</div>
<div className="font-bold">{t("loading-part-2")}</div>
</div>
)}
<div className="flex flex-auto items-center justify-center">
<div className="font-medium mt-3">{t("welcome")}</div>
</div>
<DialogFooter>
<ul className="flex items-center justify-center flex-auto gap-2 ">
<Image
src={"/timer-logos/nexustimer.jpg"}
alt="nexustimer logo"
width={64}
height={64}
className="rounded-2xl"
draggable={false}
/>
<Image
src={"/timer-logos/cstimer.jpg"}
alt="cstimer logo"
width={64}
height={64}
className="rounded-2xl"
draggable={false}
/>

<Image
src={"/timer-logos/twistytimer.jpg"}
alt="twistytimer logo"
width={64}
height={64}
className="rounded-2xl"
draggable={false}
/>

<Image
src={"/timer-logos/cubedesk.jpg"}
alt="cubedesk logo"
width={64}
height={64}
className="rounded-2xl"
draggable={false}
/>

</ul>
</DialogFooter>


</DialogContent>


)
<DialogFooter>
<ul className="flex items-center justify-center flex-auto gap-2 ">
<Image
src={"/timer-logos/nexustimer.jpg"}
alt="nexustimer logo"
width={64}
height={64}
className="rounded-2xl"
draggable={false}
/>
<Image
src={"/timer-logos/cstimer.jpg"}
alt="cstimer logo"
width={64}
height={64}
className="rounded-2xl"
draggable={false}
/>

<Image
src={"/timer-logos/twistytimer.jpg"}
alt="twistytimer logo"
width={64}
height={64}
className="rounded-2xl"
draggable={false}
/>

}
<Image
src={"/timer-logos/cubedesk.jpg"}
alt="cubedesk logo"
width={64}
height={64}
className="rounded-2xl"
draggable={false}
/>
</ul>
</DialogFooter>
</DialogContent>
);
}
22 changes: 8 additions & 14 deletions src/components/menu-settings/DataImportExport.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -3,27 +3,21 @@ import { useTranslations } from "next-intl";
import { Button } from "../ui/button";
import { DownloadIcon, UploadIcon } from "@radix-ui/react-icons";
import DialogImportBackup from "../dialogs/dialog-import-backup/dialog-import-backup";
import {
Dialog,
DialogTrigger,
} from "@/components/ui/dialog"
import { Dialog, DialogTrigger } from "@/components/ui/dialog";

export function DataImportExport() {

const t = useTranslations("Index.Settings-menu");

return (
<div className="flex flex-wrap gap-2 ps-3">
<Dialog>
<DialogTrigger asChild
className="flex items-center gap-1">
<Button variant={"outline"}>
<DownloadIcon /> {t("import-from-file")}
</Button>
</DialogTrigger>
<DialogImportBackup/>
<DialogTrigger asChild className="flex items-center gap-1">
<Button variant={"outline"}>
<DownloadIcon /> {t("import-from-file")}
</Button>
</DialogTrigger>
<DialogImportBackup />
</Dialog>

<Button
variant={"outline"}
className="flex items-center gap-1"
Expand Down
3 changes: 1 addition & 2 deletions src/hooks/useTimer.ts
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,7 @@ export default function useTimer() {
setTimerStatistics,
} = useTimerStore();

const { settings, setSettingsOpen } = useSettingsModalStore();
const { settings } = useSettingsModalStore();
const holdTimeRequired = settings.timer.holdToStart.status ? 500 : 0;
const inspectionRequired = settings.timer.inspection.status;
const inspectionDuration = 16000;
Expand Down Expand Up @@ -300,7 +300,6 @@ export default function useTimer() {
holdTimeRequired,
isSolving,
setIsSolving,
setSettingsOpen,
setSolvingTime,
inspectionRequired,
selectedCube,
Expand Down
16 changes: 2 additions & 14 deletions src/store/SettingsModalStore.ts
Original file line number Diff line number Diff line change
Expand Up @@ -2,28 +2,16 @@ import { Settings } from "@/interfaces/Settings";
import { defaultSettings } from "@/lib/const/defaultSettings";
import { create } from "zustand";

interface Modal {
settingsOpen: boolean;
importModalOpen: boolean;
setSettingsOpen: (status: boolean) => void;
interface SettingsStoreProps {
settings: Settings;
setSettings: (settings: Settings) => void;
setImportModalOpen: (status: boolean) => void;
}

export const useSettingsModalStore = create<Modal>((set) => ({
settingsOpen: false,
export const useSettingsModalStore = create<SettingsStoreProps>((set) => ({
settings: defaultSettings,
importModalOpen: false,
setSettings: (settings: Settings) => {
set({
settings: settings,
});
},
setSettingsOpen: (status: boolean) => {
set({ settingsOpen: status });
},
setImportModalOpen: (status: boolean) => {
set({ importModalOpen: status });
},
}));

0 comments on commit 09e4872

Please sign in to comment.