Merge pull request #996 from 42organization/main

[test-deploy] 테스트 배포
42organization · Sep 11, 2023 · d28860e · d28860e
2 parents 157c055 + 552cb27
commit d28860e
Show file tree

Hide file tree

Showing 80 changed files with 1,197 additions and 512 deletions.
diff --git a/.stylelintrc.json b/.stylelintrc.json
@@ -31,6 +31,7 @@
         "function-name-case": null,
         "scss/dollar-variable-pattern": null,
         "number-max-precision": null,
+        "scss/no-global-function-names": null,
 
         "order/order": [
             "custom-properties",

diff --git a/components/Layout/Layout.tsx b/components/Layout/Layout.tsx
@@ -52,9 +52,7 @@ export default function AppLayout({ children }: AppLayoutProps) {
     <div className={styles.appContainer}>
       <div
         className={`${styles.background} ${
-          colorMode !== undefined
-            ? styles[colorMode.toLowerCase()]
-            : styles.basic
+          colorMode ? styles[colorMode.toLowerCase()] : styles.basic
         } `}
       >
         <div>

diff --git a/components/Layout/MegaPhone.tsx b/components/Layout/MegaPhone.tsx
@@ -1,4 +1,5 @@
 import { useState, useEffect, useRef } from 'react';
+import { Item } from 'types/itemTypes';
 import useAxiosGet from 'hooks/useAxiosGet';
 import useInterval from 'hooks/useInterval';
 import styles from 'styles/Layout/MegaPhone.module.scss';
@@ -17,50 +18,11 @@ type MegaphoneContainerProps = {
 };
 
 const adminContent: IMegaphoneContent = {
-  megaphoneId: 1,
+  megaphoneId: 0,
   content: '상점에서 아이템을 구매해서 확성기를 등록해보세요!(30자 제한)',
   intraId: '관리자',
 };
 
-const megaphoneContent: IMegaphoneContent = {
-  megaphoneId: 2,
-  content: '확성기 : 오늘 하루 42GG는 내가 접수한다 📢😎',
-  intraId: '절찬 판매 중!',
-};
-
-const profileContent: IMegaphoneContent = {
-  megaphoneId: 3,
-  content: '이미지 변경권 : 잘 지내? 프사 바꿨네...',
-  intraId: '절찬 판매 중!',
-};
-
-const edgeContent: IMegaphoneContent = {
-  megaphoneId: 4,
-  content: 'Edge 뽑기 : 난 "Edge"로 말해',
-  intraId: '절찬 판매 중!',
-};
-
-const backgroundContent: IMegaphoneContent = {
-  megaphoneId: 5,
-  content: '배경 뽑기 : 난 "Background"부터가 달라',
-  intraId: '절찬 판매 중!',
-};
-
-const idContent: IMegaphoneContent = {
-  megaphoneId: 6,
-  content: 'ID 색깔 변경권 : 남들과는 다르게! ID 색깔을 바꿔보세요!',
-  intraId: '절찬 판매 중!',
-};
-
-const defaultContents: MegaphoneList = [
-  adminContent,
-  megaphoneContent,
-  profileContent,
-  edgeContent,
-  backgroundContent,
-  idContent,
-];
-
 export const MegaphoneContainer = ({
   children,
   count,
@@ -99,22 +61,31 @@ export const MegaphoneItem = ({ content, intraId }: IMegaphoneContent) => {
 };
 
 const Megaphone = () => {
-  const [contents, setContents] = useState<MegaphoneList>(defaultContents);
+  const [contents, setContents] = useState<MegaphoneList>([]);
+  const [itemList, setItemList] = useState<Item[]>([]);
 
-  const getMegaphoneHandler = useAxiosGet<any>({
-    url: `/pingpong/megaphones`,
+  const getItemListHandler = useAxiosGet<any>({
+    url: `/pingpong/items/store`,
     setState: (data) => {
-      setContents(data.length > 0 ? data : defaultContents);
+      setItemList(data.itemList);
     },
+    err: 'HB01',
+    type: 'setError',
+  });
+
+  const getMegaphoneHandler = useAxiosGet<any>({
+    url: `/pingpong/megaphones`,
+    setState: setContents,
     err: 'HJ01',
     type: 'setError',
   });
 
   useEffect(() => {
+    getItemListHandler();
     getMegaphoneHandler();
   }, []);
 
-  return (
+  return contents.length > 0 ? (
     <MegaphoneContainer count={contents.length}>
       {contents.map((content, idx) => (
         <MegaphoneItem
@@ -124,6 +95,20 @@ const Megaphone = () => {
         />
       ))}
     </MegaphoneContainer>
+  ) : (
+    <MegaphoneContainer count={itemList.length + 1}>
+      <MegaphoneItem
+        content={adminContent.content}
+        intraId={adminContent.intraId}
+      />
+      {itemList.map((item, idx) => (
+        <MegaphoneItem
+          content={item.itemName + ' : ' + item.mainContent}
+          intraId={'절찬 판매 중!'}
+          key={idx}
+        />
+      ))}
+    </MegaphoneContainer>
   );
 };
 

diff --git a/components/Layout/NotiBar/NotiBar.tsx b/components/Layout/NotiBar/NotiBar.tsx
@@ -1,4 +1,4 @@
-import { useContext } from 'react';
+import { useContext, useState } from 'react';
 import { useSetRecoilState } from 'recoil';
 import { Noti } from 'types/notiTypes';
 import { instance } from 'utils/axios';
@@ -112,17 +112,26 @@ function ReloadNotiButton() {
 function DeleteAllButton() {
   const HeaderState = useContext<HeaderContextState | null>(HeaderContext);
   const setError = useSetRecoilState(errorState);
+  const [isLoading, setIsLoading] = useState(false);
+
   const allNotiDeleteHandler = async () => {
+    setIsLoading(true);
     try {
       await instance.delete(`/pingpong/notifications`);
       alert('알림이 성공적으로 삭제되었습니다.');
       HeaderState?.resetOpenNotiBarState();
     } catch (e) {
       setError('JB05');
+    } finally {
+      setIsLoading(false);
     }
   };
   return (
-    <button className={styles.deleteButton} onClick={allNotiDeleteHandler}>
+    <button
+      className={styles.deleteButton}
+      onClick={allNotiDeleteHandler}
+      disabled={isLoading}
+    >
       전체 삭제
     </button>
   );

diff --git a/components/admin/receipt/ReceiptList.tsx b/components/admin/receipt/ReceiptList.tsx
@@ -8,7 +8,11 @@ import {
   TableContainer,
   TableRow,
 } from '@mui/material';
-import { Ireceipt, IreceiptTable } from 'types/admin/adminReceiptType';
+import {
+  Ireceipt,
+  IreceiptTable,
+  itemStatusType,
+} from 'types/admin/adminReceiptType';
 import { instanceInManage } from 'utils/axios';
 import { dateToStringShort } from 'utils/handleTime';
 import { toastState } from 'utils/recoil/toast';
@@ -26,8 +30,8 @@ const tableTitle: { [key: string]: string } = {
   createdAt: '구매 시간',
   itemName: '아이템 이름',
   itemPrice: '구매 가격',
-  purchaserIntraId: '구매자',
-  ownerIntraId: '수령자',
+  purchaserIntraId: '구매한 사람',
+  ownerIntraId: '받은 사람',
   itemStatusType: '상태',
 };
 
@@ -41,6 +45,14 @@ function ReceiptList() {
   const [intraId, setIntraId] = useState<string>('');
   const setSnackBar = useSetRecoilState(toastState);
 
+  const itemStatus: Record<itemStatusType, string> = {
+    BEFORE: '사용 전',
+    WAITING: '사용 대기',
+    USING: '사용 중',
+    USED: '사용 완료',
+    DELETED: '삭제',
+  };
+
   const initSearch = useCallback((intraId?: string) => {
     setIntraId(intraId || '');
     setCurrentPage(1);
@@ -117,7 +129,12 @@ function ReceiptList() {
                     (columnName: string, index: number) => {
                       return (
                         <TableCell className={styles.tableBodyItem} key={index}>
-                          {receipt[columnName as keyof Ireceipt].toString()}
+                          {columnName === 'itemStatusType'
+                            ? itemStatus[receipt['itemStatusType']]
+                            : columnName === 'ownerIntraId' &&
+                              receipt.purchaserIntraId === receipt.ownerIntraId
+                            ? ''
+                            : receipt[columnName as keyof Ireceipt].toString()}
                         </TableCell>
                       );
                     }

diff --git a/components/admin/store/ItemList.tsx b/components/admin/store/ItemList.tsx
@@ -10,6 +10,7 @@ import {
   TableRow,
 } from '@mui/material';
 import { Item, ItemList } from 'types/itemTypes';
+import { IUpdate } from 'types/modalTypes';
 import { instance } from 'utils/axios';
 import { modalState } from 'utils/recoil/modal';
 import { toastState } from 'utils/recoil/toast';
@@ -33,7 +34,7 @@ const tableTitle: { [key: string]: string } = {
   delete: '삭제',
 };
 
-function ItemList() {
+function ItemList({ update, setUpdate }: IUpdate) {
   const [itemListData, setItemListData] = useState<ItemList>({
     itemList: [],
   });
@@ -58,6 +59,7 @@ function ItemList() {
     setModal({
       modalName: 'ADMIN-ITEM_EDIT',
       item: item,
+      update: { update: update, setUpdate: setUpdate },
     });
   };
 
@@ -80,6 +82,13 @@ function ItemList() {
     getItemListHandler();
   }, []);
 
+  useEffect(() => {
+    if (update) {
+      getItemListHandler();
+      setUpdate(false);
+    }
+  }, [update, getItemListHandler]);
+
   return (
     <TableContainer className={styles.tableContainer} component={Paper}>
       <Table className={styles.table} aria-label='customized table'>

diff --git a/components/admin/store/StoreMain.tsx b/components/admin/store/StoreMain.tsx
@@ -1,17 +1,20 @@
+import { useState } from 'react';
 import ChangeHistory from 'components/admin/store/itemHistory';
 import ItemList from 'components/admin/store/ItemList';
 import styles from 'styles/admin/store/StoreMain.module.scss';
 
 function StoreMain() {
+  const [update, setUpdate] = useState(false);
+
   return (
     <div className={styles.mainContainer}>
       <div className={styles.subContainer}>
         <div className={styles.sectionTitle}>아이템 목록</div>
-        <ItemList />
+        <ItemList update={update} setUpdate={setUpdate} />
       </div>
       <div className={styles.subContainer}>
         <div className={styles.sectionTitle}>변경 이력</div>
-        <ChangeHistory />
+        <ChangeHistory update={update} setUpdate={setUpdate} />
       </div>
     </div>
   );

diff --git a/components/admin/store/itemHistory.tsx b/components/admin/store/itemHistory.tsx
@@ -10,6 +10,7 @@ import {
   TableRow,
 } from '@mui/material';
 import { IitemHistory, IitemHistoryList } from 'types/admin/adminStoreTypes';
+import { IUpdate } from 'types/modalTypes';
 import { instanceInManage } from 'utils/axios';
 import { dateToStringShort } from 'utils/handleTime';
 import { modalState } from 'utils/recoil/modal';
@@ -35,7 +36,7 @@ const tableTitle: { [key: string]: string } = {
   visible: '상점 노출',
 };
 
-function ItemHistory() {
+function ItemHistory({ update, setUpdate }: IUpdate) {
   const [itemHistoryData, setItemHistoryData] = useState<IitemHistoryList>({
     itemHistoryList: [],
     totalPage: 0,
@@ -81,8 +82,11 @@ function ItemHistory() {
   };
 
   useEffect(() => {
-    getItemHistoryListHandler();
-  }, [currentPage]);
+    if (update) {
+      getItemHistoryListHandler();
+      setUpdate(false);
+    }
+  }, [currentPage, update]);
 
   return (
     <>

diff --git a/components/admin/usageHistory/MegaphoneList.tsx b/components/admin/usageHistory/MegaphoneList.tsx
@@ -137,8 +137,15 @@ function MegaphoneList() {
                             <button
                               className={styles.deleteBtn}
                               onClick={() => deleteMegaphone(megaphone)}
+                              disabled={
+                                megaphone.status === '삭제' ||
+                                megaphone.status === '사용 완료'
+                              }
                             >
-                              삭제
+                              {megaphone.status === '삭제' ||
+                              megaphone.status === '사용 완료'
+                                ? 'X'
+                                : '삭제'}
                             </button>
                           ) : (
                             <AdminContent

diff --git a/components/game/GameResultList.tsx b/components/game/GameResultList.tsx
@@ -20,7 +20,8 @@ export default function GameResultList({
   const { data, status, fetchNextPage, isLast, clickedGameItem, pathName } =
     useGameResultList(path);
 
-  const isGamePage = pathName === '/game';
+  const page =
+    pathName === '/' ? 'main' : pathName === '/game' ? 'game' : 'profile';
 
   if (status === 'loading') return <GameResultEmptyItem status={status} />;
 
@@ -39,22 +40,24 @@ export default function GameResultList({
                   <GameResultBigItem
                     key={game.gameId}
                     game={game}
-                    zIndexList={!isGamePage}
+                    zIndexList={page !== 'game'}
                     radioMode={radioMode}
+                    page={page}
                   />
                 ) : (
                   <GameResultSmallItem
                     key={game.gameId}
                     type={type}
                     game={game}
-                    zIndexList={!isGamePage}
+                    zIndexList={page !== 'game'}
                     radioMode={radioMode}
+                    page={page}
                   />
                 );
               })}
             </React.Fragment>
           ))}
-          {isGamePage && !isLast && (
+          {page === 'game' && !isLast && (
             <button
               className={styles['getButton']}
               onClick={() => fetchNextPage()}