1
0
mirror of https://github.com/upscayl/upscayl.git synced 2024-12-18 18:35:58 +01:00
upscayl/renderer/components/sidebar/settings-tab/save-output-folder-toggle.tsx
NayamAmarshe 95843ded88
Refactor Renderer Code (#987)
* Initial refactor

* Remove unused imports

* Update code

* Refactor and Update Code

- Change file names to kebab-caase
- Add new useTranslation Hook
- Change useLog hook name to useLogger
- Update translation hook to provide autocomplete

* Update import and component name

* Rename files and components

* Update locales

* Update electron commands

* Update var

* Change Lowercase

* Replace filter with map

* Add props

* Update flag check

* Add validate paths

* Update formats

* Update import

* Update function

* Update function and translation

* Update handlePaste
2024-10-04 14:45:54 +05:30

45 lines
1.2 KiB
TypeScript

import { translationAtom } from "@/atoms/translations-atom";
import {
savedOutputPathAtom,
rememberOutputFolderAtom,
} from "@/atoms/user-settings-atom";
import { useAtom, useAtomValue } from "jotai";
export function SaveOutputFolderToggle() {
const [outputPath, setOutputPath] = useAtom(savedOutputPathAtom);
const [rememberOutputFolder, setRememberOutputFolder] = useAtom(
rememberOutputFolderAtom,
);
const t = useAtomValue(translationAtom);
return (
<div className="flex flex-col gap-2">
<p className="text-sm font-medium">
{t("SETTINGS.SAVE_OUTPUT_FOLDER.TITLE")}
</p>
<p className="text-xs text-base-content/80">
{t("SETTINGS.SAVE_OUTPUT_FOLDER.DESCRIPTION")}
</p>
<p className="font-mono text-sm">{outputPath}</p>
<input
type="checkbox"
className="toggle"
checked={rememberOutputFolder}
onClick={() => {
setRememberOutputFolder((oldValue) => {
if (oldValue === true) {
setOutputPath("");
}
return !oldValue;
});
localStorage.setItem(
"rememberOutputFolder",
JSON.stringify(!rememberOutputFolder),
);
}}
/>
</div>
);
}