[FE] FIX: updateLocalStorageDisplayStyleToggle 생성 & 적용 #1649

innovationacademy-kr · Dec 19, 2024 · 15bba7a · 15bba7a
1 parent 4301c42
commit 15bba7a
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 2 deletions.
diff --git a/frontend/src/Cabinet/components/Card/DisplayStyleCard/DisplayStyleCard.tsx b/frontend/src/Cabinet/components/Card/DisplayStyleCard/DisplayStyleCard.tsx
@@ -33,13 +33,19 @@ const toggleList: IToggleItemSeparated[] = [
   },
 ];
 
+export const updateLocalStorageDisplayStyleToggle = (
+  toggleType: DisplayStyleToggleType
+) => {
+  localStorage.setItem("display-style-toggle", toggleType);
+};
+
 const DisplayStyleCard = () => {
   const [toggleType, setToggleType] = useRecoilState(displayStyleState);
 
   const handleButtonClick = (key: DisplayStyleToggleType) => {
     if (toggleType === key) return;
     setToggleType(key);
-    localStorage.setItem("display-style-toggle", key);
+    updateLocalStorageDisplayStyleToggle(key);
   };
 
   return (

diff --git a/frontend/src/Cabinet/components/Common/DarkModeToggleSwitch.tsx b/frontend/src/Cabinet/components/Common/DarkModeToggleSwitch.tsx
@@ -2,6 +2,7 @@ import { useCallback, useEffect, useState } from "react";
 import { useRecoilState } from "recoil";
 import styled from "styled-components";
 import { displayStyleState } from "@/Cabinet/recoil/atoms";
+import { updateLocalStorageDisplayStyleToggle } from "@/Cabinet/components/Card/DisplayStyleCard/DisplayStyleCard";
 import { getInitialDisplayStyle } from "@/Cabinet/components/Card/DisplayStyleCard/DisplayStyleCard.container";
 import {
   getDisplayStyleFromLocalStorage,
@@ -69,7 +70,7 @@ const DarkModeToggleSwitch = ({ id }: { id: string }) => {
           : DisplayStyleToggleType.LIGHT;
     }
 
-    localStorage.setItem("display-style-toggle", newToggleType);
+    updateLocalStorageDisplayStyleToggle(newToggleType);
     setDisplayStyleToggle(newToggleType);
   }, [displayStyleType]);