Fe

FE/error/src/axiosConfig.js

@@ -1,80 +1,6 @@
 import axios from "axios";
-import { useNavigate } from "react-router-dom";
 
 // Axios 기본 설정
 axios.defaults.baseURL = import.meta.env.VITE_ERROR_API;
 axios.defaults.headers.common["Content-Type"] = "application/json";
 axios.defaults.withCredentials = true;
-
-let isRefreshing = false;
-let refreshSubscribers = [];
-
-const onRefreshed = (token) => {
-  refreshSubscribers.map((cb) => cb(token));
-};
-
-const addRefreshSubscriber = (cb) => {
-  refreshSubscribers.push(cb);
-};
-
-axios.interceptors.request.use(
-  (config) => {
-    const token = localStorage.getItem("slackToken");
-    if (token) {
-      config.headers["Authorization"] = `Bearer ${token}`;
-    }
-    return config;
-  },
-  (error) => {
-    return Promise.reject(error);
-  }
-);
-
-axios.interceptors.response.use(
-  (response) => {
-    return response;
-  },
-  async (error) => {
-    const originalRequest = error.config;
-    if (error.response.status === 401 && !originalRequest._retry) {
-      if (isRefreshing) {
-        return new Promise((resolve) => {
-          addRefreshSubscriber((token) => {
-            originalRequest.headers["Authorization"] = "Bearer " + token;
-            resolve(axios(originalRequest));
-          });
-        });
-      }
-
-      originalRequest._retry = true;
-      isRefreshing = true;
-
-      const refreshToken = localStorage.getItem("refreshToken");
-
-      return new Promise((resolve, reject) => {
-        axios
-          .post("/auth/reissue", { refreshToken: refreshToken })
-          .then(({ data }) => {
-            const newToken = data.data.accessToken;
-            localStorage.setItem("slackToken", newToken);
-            axios.defaults.headers.common["Authorization"] =
-              "Bearer " + newToken;
-            originalRequest.headers["Authorization"] = "Bearer " + newToken;
-            onRefreshed(newToken);
-            resolve(axios(originalRequest));
-          })
-          .catch((err) => {
-            reject(err);
-            useNavigate().push("/login");
-          })
-          .finally(() => {
-            isRefreshing = false;
-            refreshSubscribers = [];
-          });
-      });
-    }
-    return Promise.reject(error);
-  }
-);
-
-export default axios;

FE/error/src/components/DeleteEvent.jsx

@@ -7,9 +7,15 @@ const DeleteEvent = ({
   onRequestClose,
   handleUpdateDeleteData,
 }) => {
+  const storedToken = localStorage.getItem("slackToken");
+
   const calendarDelete = () => {
     axios
-      .delete("/api/calendar/" + selectID)
+      .delete(`/api/calendar/${selectID}`, {
+        headers: {
+          Authorization: `Bearer ${storedToken}`,
+        },
+      })
       .then(() => {
         handleUpdateDeleteData(selectID);
         handleDelete();

FE/error/src/components/EconoCalendar.jsx

@@ -25,13 +25,10 @@ const EconoCalendar = ({ isLoggedIn, setIsLoggedIn }) => {
 
     const uri = isUserLoggedIn
       ? "/api/calendar/all"
-      : "/api/calendar/public/all";
-    const config = isUserLoggedIn
-      ? { headers: { Authorization: `Bearer ${storedToken}` } }
-      : {};
+      : "/api/calendar/all/public";
 
     axios
-      .get(uri, config)
+      .get(uri, { headers: { Authorization: `Bearer ${storedToken}` } })
       .then((res) => {
         const fetchedEvents = res.data.data.map((event) => ({
           title: event.eventName,
@@ -292,7 +289,7 @@ const CalendarContainer = styled.div`
     background-color: #fff;
     border-color: #cbcbcb;
     color: #595959;
-    margin-right: 0.7rem;
+    margin-right: 1rem;
   }
   .fc-event-title-container {
     height: 1.3rem;
@@ -301,4 +298,7 @@ const CalendarContainer = styled.div`
     font-size: 0.95rem;
     margin-left: 0.3rem;
   }
+  .fc-direction-ltr .fc-toolbar > * > :not(:first-child) {
+    margin-left: 0.5rem;
+  }
 `;

FE/error/src/components/SideBar/ProfileBar.jsx

@@ -1,12 +1,66 @@
 import styled from "styled-components";
+import { useState } from "react";
+import { HiPencil } from "react-icons/hi2";
+import { useNavigate } from "react-router-dom";
 
 const ProfileBar = () => {
-  return <StyledProfileFrame></StyledProfileFrame>;
+  const [isHovered, setIsHovered] = useState(false);
+  const navigate = useNavigate();
+
+  const handleProfileClick = () => {
+    navigate("/profile");
+  };
+
+  return (
+    <StyledProfileFrame>
+      <ProfileImageContainer
+        onMouseEnter={() => setIsHovered(true)}
+        onMouseLeave={() => setIsHovered(false)}
+        onClick={handleProfileClick}
+      >
+        <ProfileImage src="seed0838.png" alt="Profile" />
+        {isHovered && (
+          <EditIconOverlay>
+            <HiPencil />
+          </EditIconOverlay>
+        )}
+      </ProfileImageContainer>
+    </StyledProfileFrame>
+  );
 };
 
 export default ProfileBar;
 
 const StyledProfileFrame = styled.div`
-  width: 20rem;
-  height: 18.4375rem;
+  width: 15.625rem;
+  height: 15rem;
+  align-items: center;
+  display: flex;
+  flex-direction: column;
+  margin-bottom: 0.6rem;
+`;
+
+const ProfileImageContainer = styled.div`
+  position: relative;
+  cursor: pointer;
+`;
+
+const ProfileImage = styled.img`
+  margin-top: 1.25rem;
+  width: 13rem;
+`;
+
+const EditIconOverlay = styled.div`
+  position: absolute;
+  top: 1rem;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  border-radius: 50%;
+  background-color: rgba(0, 0, 0, 0.5);
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  color: white;
+  font-size: 2rem;
 `;

FE/error/src/components/SideBar/individualFilter/IndividualFilter.jsx

@@ -6,7 +6,11 @@ import styled from "styled-components";
 import FilterCreateModal from "../../../utils/filterUtils/FilterCreateModal";
 import FilterList from "../../../utils/filterUtils/FilterList";
 
-const IndividualFilter = ({ filterLists, addNewFilter }) => {
+const IndividualFilter = ({
+  filterLists,
+  addNewFilter,
+  updateDeleteFilter,
+}) => {
   const [individualFilterIsOpen, setindividualFilterIsOpen] = useState(false);
   const [filterListsIsOpen, setFilterListsIsOpen] = useState(true);
   const createIndividualFilter = () => {
@@ -16,6 +20,7 @@ const IndividualFilter = ({ filterLists, addNewFilter }) => {
   const handleArrowDown = () => {
     setFilterListsIsOpen(!filterListsIsOpen);
   };
+
   return (
     <>
       <StyledIndividualFilterFrame>
@@ -60,7 +65,12 @@ const IndividualFilter = ({ filterLists, addNewFilter }) => {
           />
         </StyledDetailIcon>
       </StyledIndividualFilterFrame>
-      {filterListsIsOpen && <FilterList filterLists={filterLists} />}
+      {filterListsIsOpen && (
+        <FilterList
+          filterLists={filterLists}
+          updateDeleteFilter={updateDeleteFilter}
+        />
+      )}
     </>
   );
 };

FE/error/src/components/scheduleCheck/CheckCalendar.jsx

@@ -21,6 +21,7 @@ const CheckCalendar = ({
   handleUpdateDeleteData,
 }) => {
   const [event, setEvent] = useState({});
+  const storedToken = localStorage.getItem("slackToken");
 
   function createDate(title, startDate, endDate, place, info, type, color) {
     const specificEvent = {
@@ -42,17 +43,21 @@ const CheckCalendar = ({
       return;
     }
 
-    axios.get("/api/calendar/" + selectID).then((res) => {
-      createDate(
-        res.data.data.eventName,
-        res.data.data.eventStartDate,
-        res.data.data.eventEndDate,
-        res.data.data.eventPlace,
-        res.data.data.eventInfo,
-        res.data.data.eventType,
-        res.data.data.filterColor
-      );
-    });
+    axios
+      .get("/api/calendar/" + selectID, {
+        headers: { Authorization: `Bearer ${storedToken}` },
+      })
+      .then((res) => {
+        createDate(
+          res.data.data.eventName,
+          res.data.data.eventStartDate,
+          res.data.data.eventEndDate,
+          res.data.data.eventPlace,
+          res.data.data.eventInfo,
+          res.data.data.eventType,
+          res.data.data.filterColor
+        );
+      });
   }, [selectID]);
 
   function date(startDate, endDate) {