Merge branch 'dev-ds' into dev

src/components/floor-plan/CanvasLayout.jsx

@@ -7,14 +7,11 @@ import { useMessage } from '@/hooks/useMessage'
 import { useSwal } from '@/hooks/useSwal'
 import { usePlan } from '@/hooks/usePlan'
 import { globalLocaleStore } from '@/store/localeAtom'
-import { sessionStore } from '@/store/commonAtom'
 import { SessionContext } from '@/app/SessionProvider'
 
 export default function CanvasLayout() {
   const { session } = useContext(SessionContext)
-  console.log('session >>> ', session)
   const [objectNo, setObjectNo] = useState('test123240822001') // 이후 삭제 필요
-  const sessionState = useRecoilValue(sessionStore)
   const globalLocaleState = useRecoilValue(globalLocaleStore)
 
   const { getMessage } = useMessage()
@@ -22,8 +19,7 @@ export default function CanvasLayout() {
   const { plans, loadCanvasPlanData, handleCurrentPlan, handleAddPlan, handleDeletePlan } = usePlan()
 
   useEffect(() => {
-    console.log('loadCanvasPlanData 실행, sessionState.userId >>> ', sessionState.userId)
-    loadCanvasPlanData(sessionState.userId, objectNo)
+    loadCanvasPlanData(session.userId, objectNo)
   }, [])
 
   return (
@@ -34,7 +30,7 @@ export default function CanvasLayout() {
             <button
               key={`plan-${plan.id}`}
               className={`canvas-page-box ${plan.isCurrent === true ? 'on' : ''}`}
-              onClick={() => handleCurrentPlan(sessionState.userId, plan.id)}
+              onClick={() => handleCurrentPlan(session.userId, plan.id)}
             >
               <span>{plan.name}</span>
               <i
@@ -53,7 +49,7 @@ export default function CanvasLayout() {
           ))}
         </div>
         {plans.length < 10 && (
-          <button className="plane-add" onClick={() => handleAddPlan(sessionState.userId, objectNo)}>
+          <button className="plane-add" onClick={() => handleAddPlan(session.userId, objectNo)}>
             <span></span>
           </button>
         )}

src/hooks/usePlan.js

@@ -1,5 +1,6 @@
 import { useEffect, useState } from 'react'
 import { useRecoilState } from 'recoil'
+import { v4 as uuidv4 } from 'uuid'
 import { canvasState, currentCanvasPlanState, initCanvasPlansState, plansState } from '@/store/canvasAtom'
 import { useAxios } from '@/hooks/useAxios'
 import { useMessage } from '@/hooks/useMessage'
@@ -269,15 +270,16 @@ export function usePlan() {
       : addPlan(userId, objectNo)
   }
   const addPlan = (userId, objectNo, canvasStatus = '') => {
+    const id = uuidv4()
     const newPlan = {
-      id: planNum,
+      id: id,
       name: `Plan ${planNum + 1}`,
       objectNo: objectNo,
       userId: userId,
       canvasStatus: canvasStatus,
     }
     setPlans([...plans, newPlan])
-    handleCurrentPlan(userId, planNum)
+    handleCurrentPlan(userId, id)
     setPlanNum(planNum + 1)
   }