hotfix/wrap configurations on slice store

src/doing/Clock.jsx

@@ -5,7 +5,7 @@ import './Clock.css'
 
 export const Clock = () => {
   const store = Store()
-  const text = store.language.current === "english" ? store.language.text().english : store.language.text().spanish
+  const text = store.configs.language.current === "english" ? store.configs.language.text().english : store.configs.language.text().spanish
   const countdownRef = useRef(null)
   const audioStart = new Audio('/start.mp3')
   const audioAlarm = new Audio('/clock_alarm.mp3')

src/doing/Doing.jsx

@@ -5,7 +5,7 @@ import { Footer } from './Footer.jsx'
 
 export const Doing = () => {
   const store = Store()
-  const text = store.language.current === "english" ? store.language.text().english : store.language.text().spanish
+  const text = store.configs.language.current === "english" ? store.configs.language.text().english : store.configs.language.text().spanish
 
   return (
     <div className='Doing'>

src/doing/Footer.jsx

@@ -9,7 +9,7 @@ export const Footer = () => {
   const [show3, setShow3] = useState(false) // "CONFIRM OR CANCEL" RESETING DIALOG (show or hide)
   const [show4, setShow4] = useState(true) // "RESET TOTAL WORKED HOURS" BUTTON (show or hide)
   // catch english or spanish json texts, this change when the user clicks on change language buttons
-  const text = store.language.current === "english" ? store.language.text().english : store.language.text().spanish
+  const text = store.configs.language.current === "english" ? store.configs.language.text().english : store.configs.language.text().spanish
 
   const infoBtn = () => (setShow1(!show1), setShow2(false), setShow3(false), setShow4(true))
   const settingsBtn = () => (setShow2(!show2), setShow1(false), setShow3(false), setShow4(true))
@@ -19,7 +19,7 @@ export const Footer = () => {
 
   useEffect(() => localStorage.setItem("infoVisibility", show1), [show1])
   useEffect(() => localStorage.setItem("settingsVisibility", show2), [show2])
-  useEffect(() => localStorage.setItem("currentLanguage", store.language.current), [store.language])
+  useEffect(() => localStorage.setItem("currentLanguage", store.configs.language.current), [store.configs.language])
 
   return (
     <div className="Footer sub-container">
@@ -48,8 +48,8 @@ export const Footer = () => {
           </div>
         </div>
         <div>{text.doing.footer.settings.language.message}
-          <button onClick={() => store.language.setCurrent("spanish")}>ESPAÑOL</button>
-          <button onClick={() => store.language.setCurrent("english")}>ENGLISH</button>
+          <button onClick={() => store.configs.language.setCurrent("spanish")}>ESPAÑOL</button>
+          <button onClick={() => store.configs.language.setCurrent("english")}>ENGLISH</button>
         </div>
         <div>
           <span>{text.doing.footer.settings.theme.message}</span>
@@ -58,7 +58,7 @@ export const Footer = () => {
         </div>
         <div>
           <span>{text.doing.footer.settings.commonTasks.message}</span>
-          LEARN x_____CODE x_____AdivLY x
+          LEARN x_____CODE x_____APPLY x
           <button>{text.doing.footer.settings.commonTasks.addNew}</button>
         </div>
         <div>

src/doing/Quote.jsx

@@ -19,7 +19,7 @@ export const Quote = () => {
             maxLength: 70,
           }
         })
-        if (store.language.current === "spanish") await translateQuote(response.data.content)
+        if (store.configs.language.current === "spanish") await translateQuote(response.data.content)
         else setQuote(response.data.content)
         setAuthor(response.data.author)
       }

src/done/Done.jsx

@@ -4,7 +4,7 @@ import './Done.css'
 
 export const Done = () => {
   const store = Store()
-  const text = store.language.current === "english" ? store.language.text().english : store.language.text().spanish
+  const text = store.configs.language.current === "english" ? store.configs.language.text().english : store.configs.language.text().spanish
   const [input, setInput] = useState("")
   const [showModal, setShowModal] = useState("hide")
   const [showFooter, setShowFooter] = useState("")

src/store/language.js

@@ -146,9 +146,12 @@ export const text = {
 }
 
 export const setCurrent = (set, language) => set(state => ({
-  language: {
-    ...state.language,
-    current: language
+  configs: {
+    ...state.configs,
+    language: {
+      ...state.configs.language,
+      current: language
+    }
   }
-}), false, 'language/setCurrent')
+}), false, 'configs/language/setCurrent')
 

src/store/store.js

@@ -56,16 +56,23 @@ const tasksSlice = (set, get) => ({
   resetWorkedHoursHistory: () => resetWorkedHoursHistory(set)
 })
 
-const languageSlice = (set) => ({
-  current: localStorage.getItem("currentLanguage") || "english",
-  setCurrent: (language) => setCurrent(set, language),
-  text: () => text
+const configurationOptionsSlice = (set) => ({
+  language: {
+    current: localStorage.getItem("currentLanguage") || "english",
+    setCurrent: (language) => setCurrent(set, language),
+    text: () => text
+  },
+  commonTasks: {
+    // currents: [],
+    // add: ()=>(),
+    // remove: ()=>() 
+  }
 })
 
 export const Store = create(devtools((set, get) => ({
   daily: todoDailySlice(set, get),
   weekly: todoWeeklySlice(set, get),
   monthly: todoMonthlySlice(set, get),
   tasks: tasksSlice(set, get),
-  language: languageSlice(set)
+  configs: configurationOptionsSlice(set)
 })))

src/todo/Todos.jsx

@@ -3,10 +3,10 @@ import { Todo } from './Todo.jsx'
 
 export const Todos = () => {
   const store = Store()
-  const title = store.language.current === "english"
+  const title = store.configs.language.current === "english"
     ? ["Daily Goals", "Weekly Goals", "Monthly Goals"]
     : ["Objetivos Diarios", "Objetivos Semanales", "Objetivos Mensuales"]
-  const text = store.language.current === "english" ? store.language.text().english : store.language.text().spanish
+  const text = store.configs.language.current === "english" ? store.configs.language.text().english : store.configs.language.text().spanish
   return (
     <div className='Todos'>
       <h1>{text.todo.title}</h1>