From ba1dacb89927eff232a0f8901d34612ad2495886 Mon Sep 17 00:00:00 2001 From: Shinji Yamada Date: Tue, 18 Apr 2023 23:23:42 +0900 Subject: [PATCH] feat: settings dialog and moved theme settings to dialog from sidebar (#570) * feat: settings dialog and moved theme settings to dialog from sidebar. * chore(locale): move some labels to settings from sidebar --- .../Chatbar/components/ChatbarSettings.tsx | 32 ++++-- components/Settings/SettingDialog.tsx | 105 ++++++++++++++++++ pages/api/home/home.tsx | 13 ++- public/locales/ar/settings.json | 4 + public/locales/bn/settings.json | 4 + public/locales/bn/sidebar.json | 4 +- public/locales/de/settings.json | 4 + public/locales/de/sidebar.json | 4 +- public/locales/es/settings.json | 4 + public/locales/es/sidebar.json | 4 +- public/locales/fr/settings.json | 4 + public/locales/fr/sidebar.json | 4 +- public/locales/he/settings.json | 4 + public/locales/he/sidebar.json | 4 +- public/locales/id/settings.json | 4 + public/locales/id/sidebar.json | 4 +- public/locales/it/settings.json | 4 + public/locales/it/sidebar.json | 4 +- public/locales/ja/settings.json | 7 ++ public/locales/ja/sidebar.json | 3 +- public/locales/ko/settings.json | 4 + public/locales/ko/sidebar.json | 4 +- public/locales/pl/settings.json | 4 + public/locales/pl/sidebar.json | 4 +- public/locales/pt/settings.json | 4 + public/locales/pt/sidebar.json | 4 +- public/locales/ro/settings.json | 4 + public/locales/ro/sidebar.json | 6 +- public/locales/ru/settings.json | 4 + public/locales/ru/sidebar.json | 4 +- public/locales/si/settings.json | 4 + public/locales/si/sidebar.json | 4 +- public/locales/sv/settings.json | 4 + public/locales/sv/sidebar.json | 4 +- public/locales/te/settings.json | 4 + public/locales/te/sidebar.json | 4 +- public/locales/vi/settings.json | 4 + public/locales/vi/sidebar.json | 4 +- public/locales/zh/settings.json | 4 + public/locales/zh/sidebar.json | 4 +- types/settings.ts | 3 + utils/app/settings.ts | 23 ++++ 42 files changed, 259 insertions(+), 69 deletions(-) create mode 100644 components/Settings/SettingDialog.tsx create mode 100644 public/locales/ar/settings.json create mode 100644 public/locales/bn/settings.json create mode 100644 public/locales/de/settings.json create mode 100644 public/locales/es/settings.json create mode 100644 public/locales/fr/settings.json create mode 100644 public/locales/he/settings.json create mode 100644 public/locales/id/settings.json create mode 100644 public/locales/it/settings.json create mode 100644 public/locales/ja/settings.json create mode 100644 public/locales/ko/settings.json create mode 100644 public/locales/pl/settings.json create mode 100644 public/locales/pt/settings.json create mode 100644 public/locales/ro/settings.json create mode 100644 public/locales/ru/settings.json create mode 100644 public/locales/si/settings.json create mode 100644 public/locales/sv/settings.json create mode 100644 public/locales/te/settings.json create mode 100644 public/locales/vi/settings.json create mode 100644 public/locales/zh/settings.json create mode 100644 types/settings.ts create mode 100644 utils/app/settings.ts diff --git a/components/Chatbar/components/ChatbarSettings.tsx b/components/Chatbar/components/ChatbarSettings.tsx index de85399..1ca84a6 100644 --- a/components/Chatbar/components/ChatbarSettings.tsx +++ b/components/Chatbar/components/ChatbarSettings.tsx @@ -1,10 +1,17 @@ -import { IconFileExport, IconMoon, IconSun } from '@tabler/icons-react'; -import { useContext } from 'react'; +import { + IconFileExport, + IconMoon, + IconSettings, + IconSun, +} from '@tabler/icons-react'; +import { useContext, useState } from 'react'; import { useTranslation } from 'next-i18next'; import HomeContext from '@/pages/api/home/home.context'; +import { SettingDialog } from '@/components/Settings/SettingDialog'; + import { Import } from '../../Settings/Import'; import { Key } from '../../Settings/Key'; import { SidebarButton } from '../../Sidebar/SidebarButton'; @@ -14,6 +21,7 @@ import { PluginKeys } from './PluginKeys'; export const ChatbarSettings = () => { const { t } = useTranslation('sidebar'); + const [isSettingDialogOpen, setIsSettingDialog] = useState(false); const { state: { @@ -49,16 +57,9 @@ export const ChatbarSettings = () => { /> : - } - onClick={() => - homeDispatch({ - field: 'lightMode', - value: lightMode === 'light' ? 'dark' : 'light', - }) - } + text={t('Settings')} + icon={} + onClick={() => setIsSettingDialog(true)} /> {!serverSideApiKeyIsSet ? ( @@ -66,6 +67,13 @@ export const ChatbarSettings = () => { ) : null} {!serverSidePluginKeysSet ? : null} + + { + setIsSettingDialog(false); + }} + /> ); }; diff --git a/components/Settings/SettingDialog.tsx b/components/Settings/SettingDialog.tsx new file mode 100644 index 0000000..004a9cf --- /dev/null +++ b/components/Settings/SettingDialog.tsx @@ -0,0 +1,105 @@ +import { FC, useContext, useEffect, useReducer, useRef } from 'react'; + +import { useTranslation } from 'next-i18next'; + +import { useCreateReducer } from '@/hooks/useCreateReducer'; + +import { getSettings, saveSettings } from '@/utils/app/settings'; + +import { Settings } from '@/types/settings'; + +import HomeContext from '@/pages/api/home/home.context'; + +interface Props { + open: boolean; + onClose: () => void; +} + +export const SettingDialog: FC = ({ open, onClose }) => { + const { t } = useTranslation('settings'); + const settings: Settings = getSettings(); + const { state, dispatch } = useCreateReducer({ + initialState: settings, + }); + const { dispatch: homeDispatch } = useContext(HomeContext); + const modalRef = useRef(null); + + useEffect(() => { + const handleMouseDown = (e: MouseEvent) => { + if (modalRef.current && !modalRef.current.contains(e.target as Node)) { + window.addEventListener('mouseup', handleMouseUp); + } + }; + + const handleMouseUp = (e: MouseEvent) => { + window.removeEventListener('mouseup', handleMouseUp); + onClose(); + }; + + window.addEventListener('mousedown', handleMouseDown); + + return () => { + window.removeEventListener('mousedown', handleMouseDown); + }; + }, [onClose]); + + const handleSave = () => { + homeDispatch({ field: 'lightMode', value: state.theme }); + saveSettings(state); + }; + + // Render nothing if the dialog is not open. + if (!open) { + return <>; + } + + // Render the dialog. + return ( +
+
+
+ +
+
+ ); +}; diff --git a/pages/api/home/home.tsx b/pages/api/home/home.tsx index e5c6239..292e2ed 100644 --- a/pages/api/home/home.tsx +++ b/pages/api/home/home.tsx @@ -23,6 +23,7 @@ import { } from '@/utils/app/conversation'; import { saveFolders } from '@/utils/app/folders'; import { savePrompts } from '@/utils/app/prompts'; +import { getSettings } from '@/utils/app/settings'; import { Conversation } from '@/types/chat'; import { KeyValuePair } from '@/types/data'; @@ -68,7 +69,7 @@ const Home = ({ conversations, selectedConversation, prompts, - temperature + temperature, }, dispatch, } = contextValue; @@ -250,9 +251,12 @@ const Home = ({ // ON LOAD -------------------------------------------- useEffect(() => { - const theme = localStorage.getItem('theme'); - if (theme) { - dispatch({ field: 'lightMode', value: theme as 'dark' | 'light' }); + const settings = getSettings(); + if (settings.theme) { + dispatch({ + field: 'lightMode', + value: settings.theme, + }); } const apiKey = localStorage.getItem('apiKey'); @@ -419,6 +423,7 @@ export const getServerSideProps: GetServerSideProps = async ({ locale }) => { 'sidebar', 'markdown', 'promptbar', + 'settings', ])), }, }; diff --git a/public/locales/ar/settings.json b/public/locales/ar/settings.json new file mode 100644 index 0000000..9f81a10 --- /dev/null +++ b/public/locales/ar/settings.json @@ -0,0 +1,4 @@ +{ + "Dark mode": "الوضع الداكن", + "Light mode": "الوضع الفاتح" +} diff --git a/public/locales/bn/settings.json b/public/locales/bn/settings.json new file mode 100644 index 0000000..ba14e14 --- /dev/null +++ b/public/locales/bn/settings.json @@ -0,0 +1,4 @@ +{ + "Dark mode": "ডার্ক মোড", + "Light mode": "লাইট মোড" +} diff --git a/public/locales/bn/sidebar.json b/public/locales/bn/sidebar.json index 85be459..b2c6d6d 100644 --- a/public/locales/bn/sidebar.json +++ b/public/locales/bn/sidebar.json @@ -7,7 +7,5 @@ "Import data": "আলাপচারিতা ইমপোর্ট", "Are you sure?": "আপনি কি নিশ্চিত?", "Clear conversations": "কথোপকথন পরিষ্কার করুন", - "Export data": "আলাপচারিতা এক্সপোর্ট", - "Dark mode": "ডার্ক মোড", - "Light mode": "লাইট মোড" + "Export data": "আলাপচারিতা এক্সপোর্ট" } diff --git a/public/locales/de/settings.json b/public/locales/de/settings.json new file mode 100644 index 0000000..e251b18 --- /dev/null +++ b/public/locales/de/settings.json @@ -0,0 +1,4 @@ +{ + "Dark mode": "Dark Mode", + "Light mode": "Light Mode" +} diff --git a/public/locales/de/sidebar.json b/public/locales/de/sidebar.json index c417342..5a1411b 100644 --- a/public/locales/de/sidebar.json +++ b/public/locales/de/sidebar.json @@ -7,7 +7,5 @@ "Import data": "Konversationen importieren", "Are you sure?": "Bist du sicher?", "Clear conversations": "Konversationen löschen", - "Export data": "Konversationen exportieren", - "Dark mode": "Dark Mode", - "Light mode": "Light Mode" + "Export data": "Konversationen exportieren" } diff --git a/public/locales/es/settings.json b/public/locales/es/settings.json new file mode 100644 index 0000000..bbc73eb --- /dev/null +++ b/public/locales/es/settings.json @@ -0,0 +1,4 @@ +{ + "Dark mode": "Modo oscuro", + "Light mode": "Modo claro" +} diff --git a/public/locales/es/sidebar.json b/public/locales/es/sidebar.json index b4c24ec..b5374b3 100644 --- a/public/locales/es/sidebar.json +++ b/public/locales/es/sidebar.json @@ -7,7 +7,5 @@ "Import data": "Importar conversaciones", "Are you sure?": "¿Estás seguro?", "Clear conversations": "Borrar conversaciones", - "Export data": "Exportar conversaciones", - "Dark mode": "Modo oscuro", - "Light mode": "Modo claro" + "Export data": "Exportar conversaciones" } diff --git a/public/locales/fr/settings.json b/public/locales/fr/settings.json new file mode 100644 index 0000000..776539e --- /dev/null +++ b/public/locales/fr/settings.json @@ -0,0 +1,4 @@ +{ + "Dark mode": "Mode sombre", + "Light mode": "Mode clair" +} diff --git a/public/locales/fr/sidebar.json b/public/locales/fr/sidebar.json index e8af126..dded5b8 100644 --- a/public/locales/fr/sidebar.json +++ b/public/locales/fr/sidebar.json @@ -7,7 +7,5 @@ "Import data": "Importer des conversations", "Are you sure?": "Êtes-vous sûr ?", "Clear conversations": "Effacer les conversations", - "Export data": "Exporter les conversations", - "Dark mode": "Mode sombre", - "Light mode": "Mode clair" + "Export data": "Exporter les conversations" } diff --git a/public/locales/he/settings.json b/public/locales/he/settings.json new file mode 100644 index 0000000..9a57b5a --- /dev/null +++ b/public/locales/he/settings.json @@ -0,0 +1,4 @@ +{ + "Dark mode": "מצב כהה", + "Light mode": "מצב בהיר" +} diff --git a/public/locales/he/sidebar.json b/public/locales/he/sidebar.json index 16646fd..c2f07de 100644 --- a/public/locales/he/sidebar.json +++ b/public/locales/he/sidebar.json @@ -7,7 +7,5 @@ "Import data": "ייבוא שיחות", "Are you sure?": "אתה בטוח?", "Clear conversations": "ניקוי שיחות", - "Export data": "ייצוא שיחות", - "Dark mode": "מצב כהה", - "Light mode": "מצב בהיר" + "Export data": "ייצוא שיחות" } diff --git a/public/locales/id/settings.json b/public/locales/id/settings.json new file mode 100644 index 0000000..1df5b73 --- /dev/null +++ b/public/locales/id/settings.json @@ -0,0 +1,4 @@ +{ + "Dark mode": "Mode gelap", + "Light mode": "Mode terang" +} diff --git a/public/locales/id/sidebar.json b/public/locales/id/sidebar.json index 79c82fc..2e3d982 100644 --- a/public/locales/id/sidebar.json +++ b/public/locales/id/sidebar.json @@ -7,7 +7,5 @@ "Import data": "Impor percakapan", "Are you sure?": "Apakah Anda yakin?", "Clear conversations": "Hapus percakapan", - "Export data": "Ekspor percakapan", - "Dark mode": "Mode gelap", - "Light mode": "Mode terang" + "Export data": "Ekspor percakapan" } diff --git a/public/locales/it/settings.json b/public/locales/it/settings.json new file mode 100644 index 0000000..5abbcd3 --- /dev/null +++ b/public/locales/it/settings.json @@ -0,0 +1,4 @@ +{ + "Dark mode": "Modalità scura", + "Light mode": "Modalità chiara" +} diff --git a/public/locales/it/sidebar.json b/public/locales/it/sidebar.json index 14886e1..385d2ac 100644 --- a/public/locales/it/sidebar.json +++ b/public/locales/it/sidebar.json @@ -7,7 +7,5 @@ "Import data": "Importa dati", "Are you sure?": "Sei sicuro?", "Clear conversations": "Elimina conversazioni", - "Export data": "Esporta dati", - "Dark mode": "Modalità scura", - "Light mode": "Modalità chiara" + "Export data": "Esporta dati" } diff --git a/public/locales/ja/settings.json b/public/locales/ja/settings.json new file mode 100644 index 0000000..71de70b --- /dev/null +++ b/public/locales/ja/settings.json @@ -0,0 +1,7 @@ +{ + "Settings": "設定", + "Theme": "テーマ", + "Save": "保存", + "Dark mode": "ダークモード", + "Light mode": "ライトモード" +} diff --git a/public/locales/ja/sidebar.json b/public/locales/ja/sidebar.json index d1c0349..74da736 100644 --- a/public/locales/ja/sidebar.json +++ b/public/locales/ja/sidebar.json @@ -9,5 +9,6 @@ "Clear conversations": " 会話をクリア", "Export data": "会話履歴をエクスポート", "Dark mode": "ダークモード", - "Light mode": "ライトモード" + "Light mode": "ライトモード", + "Settings": "設定" } diff --git a/public/locales/ko/settings.json b/public/locales/ko/settings.json new file mode 100644 index 0000000..b2e5ec6 --- /dev/null +++ b/public/locales/ko/settings.json @@ -0,0 +1,4 @@ +{ + "Dark mode": "다크 모드", + "Light mode": "라이트 모드" +} diff --git a/public/locales/ko/sidebar.json b/public/locales/ko/sidebar.json index b75ae2e..f233b7a 100644 --- a/public/locales/ko/sidebar.json +++ b/public/locales/ko/sidebar.json @@ -7,7 +7,5 @@ "Import data": "대화 가져오기", "Are you sure?": "확실합니까?", "Clear conversations": "대화 지우기", - "Export data": "대화 내보내기", - "Dark mode": "다크 모드", - "Light mode": "라이트 모드" + "Export data": "대화 내보내기" } diff --git a/public/locales/pl/settings.json b/public/locales/pl/settings.json new file mode 100644 index 0000000..672785d --- /dev/null +++ b/public/locales/pl/settings.json @@ -0,0 +1,4 @@ +{ + "Dark mode": "Tryb ciemny", + "Light mode": "Tryb jasny" +} diff --git a/public/locales/pl/sidebar.json b/public/locales/pl/sidebar.json index 175dfc8..81b6c5a 100644 --- a/public/locales/pl/sidebar.json +++ b/public/locales/pl/sidebar.json @@ -7,7 +7,5 @@ "Import data": "Import rozmów", "Are you sure?": "Czy jesteś pewien?", "Clear conversations": "Usuń rozmowy", - "Export data": "Eksport rozmów", - "Dark mode": "Tryb ciemny", - "Light mode": "Tryb jasny" + "Export data": "Eksport rozmów" } diff --git a/public/locales/pt/settings.json b/public/locales/pt/settings.json new file mode 100644 index 0000000..530f4ca --- /dev/null +++ b/public/locales/pt/settings.json @@ -0,0 +1,4 @@ +{ + "Dark mode": "Modo escuro", + "Light mode": "Modo claro" +} diff --git a/public/locales/pt/sidebar.json b/public/locales/pt/sidebar.json index e772aa1..f9e8966 100644 --- a/public/locales/pt/sidebar.json +++ b/public/locales/pt/sidebar.json @@ -7,7 +7,5 @@ "Import data": "Importar conversas", "Are you sure?": "Tem certeza?", "Clear conversations": "Apagar conversas", - "Export data": "Exportar conversas", - "Dark mode": "Modo escuro", - "Light mode": "Modo claro" + "Export data": "Exportar conversas" } diff --git a/public/locales/ro/settings.json b/public/locales/ro/settings.json new file mode 100644 index 0000000..d2bf1b7 --- /dev/null +++ b/public/locales/ro/settings.json @@ -0,0 +1,4 @@ +{ + "Dark mode": "Modul întunecat", + "Light mode": "Modul de golire" +} diff --git a/public/locales/ro/sidebar.json b/public/locales/ro/sidebar.json index b7a4b49..d4bb80a 100644 --- a/public/locales/ro/sidebar.json +++ b/public/locales/ro/sidebar.json @@ -7,7 +7,5 @@ "Import data": "Importați conversații", "Are you sure?": "Esti sigur?", "Clear conversations": "Ștergeți conversațiile", - "Export data": "Exportați conversații", - "Dark mode": "Modul întunecat", - "Light mode": "Modul de golire" -} \ No newline at end of file + "Export data": "Exportați conversații" +} diff --git a/public/locales/ru/settings.json b/public/locales/ru/settings.json new file mode 100644 index 0000000..d03b2e3 --- /dev/null +++ b/public/locales/ru/settings.json @@ -0,0 +1,4 @@ +{ + "Dark mode": "Темный режим", + "Light mode": "Светлый режим" +} diff --git a/public/locales/ru/sidebar.json b/public/locales/ru/sidebar.json index 54bb4e2..e94def0 100644 --- a/public/locales/ru/sidebar.json +++ b/public/locales/ru/sidebar.json @@ -7,7 +7,5 @@ "Import data": "Импортировать чаты", "Are you sure?": "Вы уверены?", "Clear conversations": "Удалить чаты", - "Export data": "Экспортировать чаты", - "Dark mode": "Темный режим", - "Light mode": "Светлый режим" + "Export data": "Экспортировать чаты" } diff --git a/public/locales/si/settings.json b/public/locales/si/settings.json new file mode 100644 index 0000000..eccd7db --- /dev/null +++ b/public/locales/si/settings.json @@ -0,0 +1,4 @@ +{ + "Dark mode": "අඳුරු මාදිලිය", + "Light mode": "ආලෝක මාදිලිය" +} diff --git a/public/locales/si/sidebar.json b/public/locales/si/sidebar.json index 539c25f..eb9c26b 100644 --- a/public/locales/si/sidebar.json +++ b/public/locales/si/sidebar.json @@ -7,7 +7,5 @@ "Import data": "සංවාද ආයාත කරන්න", "Are you sure?": "ඔබට විශ්වාස ද?", "Clear conversations": "සංවාද මකන්න", - "Export data": "සංවාද නිර්යාත කරන්න", - "Dark mode": "අඳුරු මාදිලිය", - "Light mode": "ආලෝක මාදිලිය" + "Export data": "සංවාද නිර්යාත කරන්න" } diff --git a/public/locales/sv/settings.json b/public/locales/sv/settings.json new file mode 100644 index 0000000..ca66633 --- /dev/null +++ b/public/locales/sv/settings.json @@ -0,0 +1,4 @@ +{ + "Dark mode": "Mörkt läge", + "Light mode": "Ljust läge" +} diff --git a/public/locales/sv/sidebar.json b/public/locales/sv/sidebar.json index 0db3fa3..755976e 100644 --- a/public/locales/sv/sidebar.json +++ b/public/locales/sv/sidebar.json @@ -7,7 +7,5 @@ "Import data": "Importera konversationer", "Are you sure?": "Är du säker?", "Clear conversations": "Radera konversationer", - "Export data": "Exportera konversationer", - "Dark mode": "Mörkt läge", - "Light mode": "Ljust läge" + "Export data": "Exportera konversationer" } diff --git a/public/locales/te/settings.json b/public/locales/te/settings.json new file mode 100644 index 0000000..6502c36 --- /dev/null +++ b/public/locales/te/settings.json @@ -0,0 +1,4 @@ +{ + "Dark mode": "డార్క్ మోడ్", + "Light mode": "లైట్ మోడ్" +} diff --git a/public/locales/te/sidebar.json b/public/locales/te/sidebar.json index 246a1d1..7b6b148 100644 --- a/public/locales/te/sidebar.json +++ b/public/locales/te/sidebar.json @@ -7,7 +7,5 @@ "Import data": "సంభాషణలు దిగుమతి చేయండి", "Are you sure?": "మీరు ఖచ్చితంగా ఉన్నారా?", "Clear conversations": "సంభాషణలు తొలగించు", - "Export data": "సంభాషణలు ఎగుమతి చేయండి", - "Dark mode": "డార్క్ మోడ్", - "Light mode": "లైట్ మోడ్" + "Export data": "సంభాషణలు ఎగుమతి చేయండి" } diff --git a/public/locales/vi/settings.json b/public/locales/vi/settings.json new file mode 100644 index 0000000..e6b26bb --- /dev/null +++ b/public/locales/vi/settings.json @@ -0,0 +1,4 @@ +{ + "Dark mode": "Chế độ tối", + "Light mode": "Chế độ sáng" +} diff --git a/public/locales/vi/sidebar.json b/public/locales/vi/sidebar.json index 04165de..557732e 100644 --- a/public/locales/vi/sidebar.json +++ b/public/locales/vi/sidebar.json @@ -7,7 +7,5 @@ "Import data": "Nhập dữ liệu hội thoại", "Are you sure?": "Bạn chắc chắn chứ?", "Clear conversations": "Xoá các đoạn hội thoại", - "Export data": "Xuất dữ liệu hội thoại", - "Dark mode": "Chế độ tối", - "Light mode": "Chế độ sáng" + "Export data": "Xuất dữ liệu hội thoại" } diff --git a/public/locales/zh/settings.json b/public/locales/zh/settings.json new file mode 100644 index 0000000..72b7a03 --- /dev/null +++ b/public/locales/zh/settings.json @@ -0,0 +1,4 @@ +{ + "Dark mode": "深色模式", + "Light mode": "浅色模式" +} diff --git a/public/locales/zh/sidebar.json b/public/locales/zh/sidebar.json index 3d16437..c46ed03 100644 --- a/public/locales/zh/sidebar.json +++ b/public/locales/zh/sidebar.json @@ -7,7 +7,5 @@ "Import data": "导入对话", "Are you sure?": "确定吗？", "Clear conversations": "清空对话", - "Export data": "导出对话", - "Dark mode": "深色模式", - "Light mode": "浅色模式" + "Export data": "导出对话" } diff --git a/types/settings.ts b/types/settings.ts new file mode 100644 index 0000000..d4b6335 --- /dev/null +++ b/types/settings.ts @@ -0,0 +1,3 @@ +export interface Settings { + theme: 'light' | 'dark'; +} diff --git a/utils/app/settings.ts b/utils/app/settings.ts new file mode 100644 index 0000000..acf371e --- /dev/null +++ b/utils/app/settings.ts @@ -0,0 +1,23 @@ +import { Settings } from '@/types/settings'; + +const STORAGE_KEY = 'settings'; + +export const getSettings = (): Settings => { + let settings: Settings = { + theme: 'dark', + }; + const settingsJson = localStorage.getItem(STORAGE_KEY); + if (settingsJson) { + try { + let savedSettings = JSON.parse(settingsJson) as Settings; + settings = Object.assign(settings, savedSettings); + } catch (e) { + console.error(e); + } + } + return settings; +}; + +export const saveSettings = (settings: Settings) => { + localStorage.setItem(STORAGE_KEY, JSON.stringify(settings)); +};