fix: import 재확인, 오류 재수정 (#50)

## 📝작업 내용

> 작업 중 충돌이 생긴 것 같아 이전 작업 (import 확인, 오류 수정) 다시 진행했습니다.

Author: hyunjinch

frontend/src/components/SidebarLeft.css

@@ -92,17 +92,17 @@ button:focus {
   flex-direction: column;
 
   background: #e9ede2;
-  width: 100%;
-  transition: width 0.45s ease, padding 0.45s ease, opacity 0.35s ease;
 }
 
 /* 열린 상태 */
 .sidebarLeft.open {
+  width: 360px;
   padding: 30px;
 }
 
 /* 닫힌 상태 */
 .sidebarLeft.closed {
+  width: 120px;
   padding: 30px;
 }
 

frontend/src/components/SidebarLeft.jsx

@@ -11,8 +11,7 @@ import CalendarIcon from "../assets/CalendarIcon";
 import ListIcon from "../assets/ListIcon";
 import CalendarIconSelected from "../assets/CalendarIconSelected";
 import ListIconSelected from "../assets/ListIconSelected";
-import ListDot from "../assets/listDot";
-//import profileImage from "../assets/profile.jpg";
+import ListDot from "../assets/ListDot";
 
 /* 
   좌측 사이드바
@@ -21,12 +20,12 @@ import ListDot from "../assets/listDot";
 
 */
 
-const SidebarLeft = ({ events = [], isOpen = false, onToggle }) => {
+const SidebarLeft = ({ events = [] }) => {
   const navigate = useNavigate();
   const location = useLocation();
 
   // 사이드바 상태
-  //const [isOpen, setIsOpen] = useState(false);
+  const [isOpen, setIsOpen] = useState(false);
 
   // 페이지 상태
   const isHomePage = location.pathname === "/home";
@@ -166,7 +165,7 @@ const SidebarLeft = ({ events = [], isOpen = false, onToggle }) => {
           onMouseEnter={() => !isOpen && setIsLogoHovered(true)}
           onMouseLeave={() => setIsLogoHovered(false)}
         >
-          <button className="sidebarButton" onClick={() => onToggle?.(!isOpen)}>
+          <button className="sidebarButton" onClick={() => setIsOpen(!isOpen)}>
             {isOpen ? <CloseButton /> : <OpenButton />}
           </button>
           <LogoIcon className="logoIcon" />
@@ -179,10 +178,8 @@ const SidebarLeft = ({ events = [], isOpen = false, onToggle }) => {
               <NewButton />
             </div>
           ) : (
-            <div className="buttonIconClosed">
-              <div className={isCreatePage ? "newButtonRotated" : ""}>
-                <NewButtonClosed />
-              </div>
+            <div className={`buttonIconClosed ${isCreatePage ? "Rotated" : ""}`}>
+              <NewButtonClosed />
             </div>
           )}
           {isOpen && <div className="buttonText">새로운 약속 만들기</div>}
@@ -203,21 +200,29 @@ const SidebarLeft = ({ events = [], isOpen = false, onToggle }) => {
         {/* 약속 달력 */}
         <div className="calendar">
           <div className="calendarHeader">
-            <button className="moveMonth" onClick={() => moveMonth(-1)}>{"<"}</button>
+            <button className="moveMonth" onClick={() => moveMonth(-1)}>
+              {"<"}
+            </button>
             <span>{currentMonth + 1}월</span>
-            <button className="moveMonth" onClick={() => moveMonth(1)}>{">"}</button>
-            <button className="todayButton" onClick={handleGoToday}>오늘</button>
+            <button className="moveMonth" onClick={() => moveMonth(1)}>
+              {">"}
+            </button>
+            <button className="todayButton" onClick={handleGoToday}>
+              오늘
+            </button>
           </div>
 
           {/* 요일 */}
           <div className="calendarGrid daysofWeek">
             {daysOfWeek.map((day, index) => {
-            <div
-              key={day}
-              className={`dayName ${index === 0 ? "sunday" : ""} ${index === 6 ? "saturday" : ""}`}
-            >
-              {day}
-            </div>
+              <div
+                key={day}
+                className={`dayName ${index === 0 ? "sunday" : ""} ${
+                  index === 6 ? "saturday" : ""
+                }`}
+              >
+                {day}
+              </div>;
             })}
           </div>
 
@@ -234,8 +239,7 @@ const SidebarLeft = ({ events = [], isOpen = false, onToggle }) => {
                   key={a.id}
                   className={`appointmentItem`}
                   onClick={() =>
-                    a.invite_link &&
-                    navigate(`/result/${a.invite_link}`)
+                    a.invite_link && navigate(`/result/${a.invite_link}`)
                   }
                 >
                   <ListDot />
@@ -247,9 +251,7 @@ const SidebarLeft = ({ events = [], isOpen = false, onToggle }) => {
         </div>
 
         {/* 프로필 */}
-        <div className="profile">
-          {/* <img src={profileImage} alt="profileImage" /> */}
-        </div>
+        <div className="profile" />
       </div>
     </>
   );