Merge pull request #918 from Moadong/develop-fe

[release] FE v1.1.7

Author: 김준서 Junseo Kim

frontend/src/apis/application/deleteApplication.ts

@@ -1,25 +1,25 @@
-// import API_BASE_URL from '@/constants/api';
-// import { secureFetch } from '../auth/secureFetch';
+import API_BASE_URL from '@/constants/api';
+import { secureFetch } from '../auth/secureFetch';
 
-// const deleteApplication = async (
-//   applicationFormId: string,
-// ) => {
-//   try {
-//     const response = await secureFetch(`${API_BASE_URL}/api/club/application/${applicationFormId}`, {
-//         method: 'DELETE',
-//       },
-//     );
-//     if (!response.ok) {
-//       console.error(`Failed to delete: ${response.statusText}`);
-//       throw new Error((await response.json()).message);
-//     }
+const deleteApplication = async (
+  applicationFormId: string,
+) => {
+  try {
+    const response = await secureFetch(`${API_BASE_URL}/api/club/application/${applicationFormId}`, {
+        method: 'DELETE',
+      },
+    );
+    if (!response.ok) {
+      console.error(`Failed to delete: ${response.statusText}`);
+      throw new Error((await response.json()).message);
+    }
 
-//     const result = await response.json();
-//     return result.data;
-//   } catch (error) {
-//     console.error('Error fetching delete application', error);
-//     throw error;
-//   }
-// };
+    const result = await response.json();
+    return result.data;
+  } catch (error) {
+    console.error('Error fetching delete application', error);
+    throw error;
+  }
+};
 
-// export default deleteApplication;
+export default deleteApplication;

frontend/src/apis/application/getApplication.ts

@@ -1,8 +1,14 @@
 import API_BASE_URL from '@/constants/api';
+import { ApplicationFormData } from '@/types/application';
 
-const getApplication = async (clubId: string, applicationFormId: string) => {
+const getApplication = async (
+  clubId: string,
+  applicationFormId: string,
+): Promise<ApplicationFormData> => {
   try {
-    const response = await fetch(`${API_BASE_URL}/api/club/${clubId}/apply/${applicationFormId}`);
+    const response = await fetch(
+      `${API_BASE_URL}/api/club/${clubId}/apply/${applicationFormId}`,
+    );
     if (!response.ok) {
       let message = response.statusText;
       try {

frontend/src/apis/application/updateApplication.ts

@@ -10,7 +10,7 @@ export const updateApplication = async (
     const response = await secureFetch(
       `${API_BASE_URL}/api/club/application/${applicationFormId}`,
       {
-        method: 'PUT',
+        method: 'PATCH',
         headers: {
           'Content-Type': 'application/json',
         },
@@ -30,4 +30,30 @@ export const updateApplication = async (
   }
 };
 
-export default updateApplication;
+export const updateApplicationStatus = async ( 
+  applicationFormId: string,
+  currentStatus: string,
+) => {
+  const newStatus = currentStatus === 'ACTIVE' ? false : true;
+  try {
+    const response = await secureFetch(
+      `${API_BASE_URL}/api/club/application/${applicationFormId}`,
+      {
+        method: 'PATCH',
+        headers: { 
+          'Content-Type': 'application/json',
+        },
+        body: JSON.stringify({ active: newStatus }),
+      },
+    );
+    if (!response.ok) {
+      throw new Error('지원서 상태 수정에 실패했습니다.');
+    }
+    const result = await response.json();
+    return result.data;
+  } catch (error) {
+    console.error('지원서 상태 수정 중 오류 발생:', error);
+    throw error;
+  }
+};
+

frontend/src/assets/images/icons/ExpandArrow.svg

@@ -29,7 +29,7 @@ const StyledClubLogo = styled.div<{
     background-color: #efefef;
     background-size: cover;
     background-position: center;
-    background-image: ${$imageSrc ? `url(${$imageSrc})` : 'none'};
+    background-image: ${$imageSrc ? `url("${$imageSrc}")` : 'none'};
   `}
 
   @media (max-width: 500px) {

frontend/src/components/ClubLogo/ClubLogo.tsx

@@ -1,5 +1,6 @@
 import styled from 'styled-components';
 import { media } from '@/styles/mediaQuery';
+import { Z_INDEX } from '@/styles/zIndex';
 
 export const Header = styled.header<{ isScrolled: boolean }>`
   position: fixed;
@@ -10,7 +11,7 @@ export const Header = styled.header<{ isScrolled: boolean }>`
   height: 62px;
   padding: 10px 20px;
   background-color: white;
-  z-index: 1000;
+  z-index: ${Z_INDEX.header};
 
   box-shadow: ${({ isScrolled }) =>
     isScrolled ? '0px 2px 12px rgba(0, 0, 0, 0.04)' : 'none'};

frontend/src/components/common/Header/Header.styles.ts

@@ -23,7 +23,7 @@ const Header = () => {
     handleHomeClick,
     handleIntroduceClick,
     handleClubUnionClick,
-    handlePatchNoteClick,
+    handleAdminClick,
   } = useHeaderNavigation();
 
   const navLinks = [
@@ -33,7 +33,8 @@ const Header = () => {
       handler: handleClubUnionClick,
       path: '/club-union',
     },
-    { label: '패치노트', handler: handlePatchNoteClick, path: '/patch-note' },
+    { label: '관리자 페이지', handler: handleAdminClick, path: '/admin' },
+    // { label: '패치노트', handler: handlePatchNoteClick, path: '/patch-note' },
   ];
 
   const closeMenu = () => {

frontend/src/components/common/Header/Header.tsx

@@ -1,9 +1,10 @@
+import { Z_INDEX } from '@/styles/zIndex';
 import styled from 'styled-components';
 
 export const Overlay = styled.div<{ isOpen: boolean }>`
-  position: fixed;
   inset: 0;
-  z-index: 1000;
+  position: fixed;
+  z-index: ${Z_INDEX.overlay};
   background: rgba(0,0,0, ${({ isOpen }) => (isOpen ? 0.45 : 0)});
   display: grid;
   place-items: center;
@@ -12,6 +13,8 @@ export const Overlay = styled.div<{ isOpen: boolean }>`
 `;
 
 export const Container = styled.div<{ isOpen: boolean }>`
+  position: relative;
+  z-index: ${Z_INDEX.modal};
   max-width: 500px;
   width: 100%;
   max-height: 90vh;

frontend/src/components/common/LazyImage/LazyImage.tsx

@@ -1,10 +1,11 @@
+import { Z_INDEX } from '@/styles/zIndex';
 import styled from 'styled-components';
 
 export const ScrollButton = styled.button<{ $isVisible: boolean }>`
   position: fixed;
   bottom: 80px;
   right: 30px;
-  z-index: 1000;
+  z-index: ${Z_INDEX.floatingButton};
   opacity: ${({ $isVisible }) => ($isVisible ? 1 : 0)};
   visibility: ${({ $isVisible }) => ($isVisible ? 'visible' : 'hidden')};
   transition: opacity 0.3s, visibility 0.3s;