Skip to content

Commit

Permalink
Merge branch 'main' into GGFE-251-폰트-정리
Browse files Browse the repository at this point in the history
  • Loading branch information
yoouyeon authored Sep 14, 2023
2 parents d2d3a71 + 45ac156 commit e6438b1
Show file tree
Hide file tree
Showing 18 changed files with 181 additions and 155 deletions.
18 changes: 9 additions & 9 deletions components/admin/announcement/AnnounceEdit.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -32,6 +32,15 @@ export default function AnnounceEdit() {
resetHandler();
}, []);

const resetHandler = async () => {
try {
const res = await instance.get('/pingpong/announcement');
setContent(res?.data.content);
} catch (e) {
alert(e);
}
};

if (!user) return null;

const currentUserId = user.intraId;
Expand Down Expand Up @@ -77,15 +86,6 @@ export default function AnnounceEdit() {
}
};

const resetHandler = async () => {
try {
const res = await instance.get('/pingpong/announcement');
setContent(res?.data.content);
} catch (e) {
alert(e);
}
};

return (
<div className={styles.container}>
<div className={styles.announceModal}>
Expand Down
76 changes: 35 additions & 41 deletions components/admin/coin/CoinPolicyHistory.tsx
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
import { useCallback, useEffect, useState } from 'react';
import { useState } from 'react';
import { useQuery } from 'react-query';
import { useSetRecoilState } from 'recoil';
import {
Paper,
Expand All @@ -8,10 +9,7 @@ import {
TableContainer,
TableRow,
} from '@mui/material';
import {
IcoinPolicyHistory,
IcoinPolicyHistoryTable,
} from 'types/admin/adminCoinTypes';
import { IcoinPolicyHistory } from 'types/admin/adminCoinTypes';
import { instanceInManage } from 'utils/axios';
import { dateToStringShort } from 'utils/handleTime';
import { toastState } from 'utils/recoil/toast';
Expand All @@ -34,47 +32,43 @@ const coinPolicyHistoryTableTitle: { [key: string]: string } = {
};

function CoinPolicyHistory() {
const [coinPolicyHistoryData, setCoinPolicyHistoryData] =
useState<IcoinPolicyHistoryTable>({
coinPolicyList: [],
totalPage: 0,
currentPage: 0,
});
const [currentPage, setCurrentPage] = useState<number>(1);
const setSnackBar = useSetRecoilState(toastState);

const getCoinPolicyHistoryHandler = useCallback(async () => {
try {
const res = await instanceInManage.get(
`/coinpolicy?page=${currentPage}&size=5`
);
setCoinPolicyHistoryData({
coinPolicyList: res.data.coinPolicyList.map(
(coinPolicyHistory: IcoinPolicyHistory) => {
const getApi = async (currentPage: number) => {
const res = await instanceInManage.get(
`/coinpolicy?page=${currentPage}&size=5`
);
return res.data;
};

const { data, isError } = useQuery(
['coinPolicyHistory', currentPage],
() => getApi(currentPage),
{
keepPreviousData: true,
select: (data) => ({
coinPolicyList: data.coinPolicyList?.map(
(coinPolicy: IcoinPolicyHistory) => {
return {
...coinPolicyHistory,
createdAt: dateToStringShort(
new Date(coinPolicyHistory.createdAt)
),
...coinPolicy,
createdAt: dateToStringShort(new Date(coinPolicy.createdAt)),
};
}
),
totalPage: res.data.totalPage,
currentPage: currentPage,
});
} catch (e: unknown) {
setSnackBar({
toastName: 'get coinpolicyhistory',
severity: 'error',
message: 'API 요청에 문제가 발생했습니다.',
clicked: true,
});
totalPage: data.totalPage,
}),
}
}, [currentPage]);
);

useEffect(() => {
getCoinPolicyHistoryHandler();
}, [currentPage]);
if (isError) {
setSnackBar({
toastName: 'get coinpolicyhistory',
severity: 'error',
message: 'API 요청에 문제가 발생했습니다.',
clicked: true,
});
}

return (
<>
Expand All @@ -85,8 +79,8 @@ function CoinPolicyHistory() {
table={coinPolicyHistoryTableTitle}
/>
<TableBody className={styles.tableBody}>
{coinPolicyHistoryData.coinPolicyList.length > 0 ? (
coinPolicyHistoryData.coinPolicyList.map(
{data?.coinPolicyList?.length > 0 ? (
data?.coinPolicyList?.map(
(coinPolicyHistory: IcoinPolicyHistory) => (
<TableRow
className={styles.tableRow}
Expand Down Expand Up @@ -117,8 +111,8 @@ function CoinPolicyHistory() {
</TableContainer>
<div className={styles.pageNationContainer}>
<PageNation
curPage={coinPolicyHistoryData.currentPage}
totalPages={coinPolicyHistoryData.totalPage}
curPage={currentPage}
totalPages={data?.totalPage}
pageChangeHandler={(pageNumber: number) => {
setCurrentPage(pageNumber);
}}
Expand Down
8 changes: 8 additions & 0 deletions components/error/Error.tsx
Original file line number Diff line number Diff line change
@@ -1,9 +1,17 @@
import { useEffect } from 'react';
import { useResetRecoilState } from 'recoil';
import useErrorPage from 'hooks/error/useErrorPage';
import styles from 'styles/Error.module.scss';
import ErrorEmoji from '/public/image/error_face.svg';
import { modalState } from 'utils/recoil/modal';

export default function ErrorPage() {
const { error, goHome } = useErrorPage();
const resetModal = useResetRecoilState(modalState);

useEffect(() => {
resetModal();
}, []);

return (
<div className={styles.container}>
Expand Down
52 changes: 31 additions & 21 deletions components/modal/admin/AdminEditCoinPolicy.tsx
Original file line number Diff line number Diff line change
@@ -1,3 +1,5 @@
import { AxiosResponse } from 'axios';
import { useMutation, useQueryClient } from 'react-query';
import { useSetRecoilState } from 'recoil';
import { IcoinPolicy } from 'types/admin/adminCoinTypes';
import { instanceInManage } from 'utils/axios';
Expand All @@ -10,24 +12,35 @@ export default function AdminEditCoinPolicyModal(props: IcoinPolicy) {
const setModal = useSetRecoilState(modalState);
const setSnackBar = useSetRecoilState(toastState);

const editCoinPolicyHandler = async () => {
try {
await instanceInManage.post(`/coinpolicy`, props);
setSnackBar({
toastName: 'edit coinpolicy',
severity: 'success',
message: '새로운 재화 정책이 등록되었습니다.',
clicked: true,
});
} catch (e: unknown) {
setSnackBar({
toastName: 'edit coinpolicy',
severity: 'error',
message: 'API 요청에 문제가 발생했습니다.',
clicked: true,
});
const queryClient = useQueryClient();

const { mutate } = useMutation(
(data: IcoinPolicy): Promise<AxiosResponse> => {
return instanceInManage.post(`/coinpolicy`, data);
}
setModal({ modalName: null });
);

const editCoinPolicyHandler = () => {
mutate(props, {
onSuccess: () => {
setSnackBar({
toastName: 'edit coinpolicy',
severity: 'success',
message: '새로운 재화 정책이 등록되었습니다.',
clicked: true,
});
queryClient.invalidateQueries({ queryKey: 'coinPolicyHistory' });
setModal({ modalName: null });
},
onError: () => {
setSnackBar({
toastName: 'edit coinpolicy',
severity: 'error',
message: 'API 요청에 문제가 발생했습니다.',
clicked: true,
});
},
});
};

return (
Expand Down Expand Up @@ -63,10 +76,7 @@ export default function AdminEditCoinPolicyModal(props: IcoinPolicy) {
</div>
</div>
<div className={styles.buttonWrap}>
<button
className={styles.editBtn}
onClick={() => editCoinPolicyHandler()}
>
<button className={styles.editBtn} onClick={editCoinPolicyHandler}>
등록
</button>
<button
Expand Down
21 changes: 11 additions & 10 deletions components/modal/store/purchase/BuyModal.tsx
Original file line number Diff line number Diff line change
@@ -1,10 +1,11 @@
import { useState } from 'react';
import { useQueryClient } from 'react-query';
import { useSetRecoilState, useResetRecoilState } from 'recoil';
import { PriceTag } from 'types/modalTypes';
import { instance, isAxiosError } from 'utils/axios';
import { errorState } from 'utils/recoil/error';
import { modalState } from 'utils/recoil/modal';
import { updateCoinState } from 'utils/recoil/updateCoin';
import { PURCHASE_ALERT_MESSAGE } from 'constants/store/purchaseAlertMessage';
import {
ModalButtonContainer,
ModalButton,
Expand All @@ -16,8 +17,7 @@ export default function BuyModal({ itemId, product, price }: PriceTag) {
const setModal = useSetRecoilState(modalState);
const resetModal = useResetRecoilState(modalState);
const setError = useSetRecoilState<string>(errorState);
const updateCoin = useSetRecoilState(updateCoinState);

const queryClient = useQueryClient();
const errorCode = ['IT100', 'IT201', 'IT202', 'IT203', 'UR100'] as const;

type errorCodeType = (typeof errorCode)[number];
Expand All @@ -28,20 +28,21 @@ export default function BuyModal({ itemId, product, price }: PriceTag) {
code: errorCodeType;
};

const { COMMON, BUY } = PURCHASE_ALERT_MESSAGE;
const errorMessages: Record<errorCodeType, string> = {
IT100: '해당 아이템이 없습니다 (• ᴖ •。)',
IT201: '지금은 구매할 수 없는 아이템입니다 (• ᴖ •。)',
IT202: 'GG코인이 부족합니다 (• ᴖ •。)',
IT203: '카카오 유저는 상점을 이용할 수 없습니다 (• ᴖ •。)',
UR100: 'USER NOT FOUND',
IT100: COMMON.ITEM_ERROR,
IT201: COMMON.OUTDATED_ERROR,
IT202: COMMON.COIN_ERROR,
IT203: COMMON.KAKAO_USER_ERROR,
UR100: BUY.USER_ERROR,
};

const onPurchase = async () => {
setIsLoading(true);
try {
await instance.post(`/pingpong/items/purchases/${itemId}`, null);
alert(`구매 성공 ¡¡¡( •̀ ᴗ •́ )و!!!`);
updateCoin(true);
alert(BUY.SUCCESS);
queryClient.invalidateQueries('coin');
setIsLoading(false);
} catch (error: unknown) {
setIsLoading(false);
Expand Down
28 changes: 15 additions & 13 deletions components/modal/store/purchase/GiftModal.tsx
Original file line number Diff line number Diff line change
@@ -1,11 +1,12 @@
import { useState } from 'react';
import { useQueryClient } from 'react-query';
import { useSetRecoilState, useResetRecoilState } from 'recoil';
import { GiftRequest } from 'types/itemTypes';
import { PriceTag } from 'types/modalTypes';
import { instance, isAxiosError } from 'utils/axios';
import { errorState } from 'utils/recoil/error';
import { modalState } from 'utils/recoil/modal';
import { updateCoinState } from 'utils/recoil/updateCoin';
import { PURCHASE_ALERT_MESSAGE } from 'constants/store/purchaseAlertMessage';
import {
ModalButtonContainer,
ModalButton,
Expand All @@ -18,11 +19,10 @@ export default function GiftModal({ itemId, product, price }: PriceTag) {
const setModal = useSetRecoilState(modalState);
const resetModal = useResetRecoilState(modalState);
const setError = useSetRecoilState<string>(errorState);
const updateCoin = useSetRecoilState(updateCoinState);
const [giftReqData, setGiftReqData] = useState<GiftRequest>({
ownerId: '',
});

const queryClient = useQueryClient();
const errorCode = [
'IT100',
'IT201',
Expand All @@ -40,25 +40,27 @@ export default function GiftModal({ itemId, product, price }: PriceTag) {
code: errorCodeType;
};

const { COMMON, GIFT } = PURCHASE_ALERT_MESSAGE;

const errorMessages: Record<errorCodeType, string> = {
IT100: '해당 아이템이 없습니다 (• ᴖ •。)',
IT201: '지금은 구매할 수 없는 아이템입니다 (• ᴖ •。)',
IT202: 'GG코인이 부족합니다 (• ᴖ •。)',
IT203: '카카오 유저는 상점을 이용할 수 없습니다 (• ᴖ •。)',
IT204: '카카오 유저에게는 선물할 수 없습니다 (• ᴖ •。)',
UR100: '선물하려는 유저가 없습니다 (• ᴖ •。)',
IT100: COMMON.ITEM_ERROR,
IT201: COMMON.OUTDATED_ERROR,
IT202: COMMON.COIN_ERROR,
IT203: COMMON.KAKAO_USER_ERROR,
IT204: GIFT.KAKAO_RECIPIENT_ERROR,
UR100: GIFT.RECIPIENT_ERROR,
};

const onPurchase = async () => {
if (giftReqData.ownerId === '') {
alert('선물할 유저를 선택해주세요.');
alert(GIFT.EMPTY_RECIPIENT);
return;
}
setIsLoading(true);
try {
await instance.post(`/pingpong/items/gift/${itemId}`, giftReqData);
alert(`${giftReqData.ownerId}님께 선물이 전달되었습니다 (◞ꈍ∇ꈍ)っ■`);
updateCoin(true);
alert(`(◞ꈍ∇ꈍ)っ■ ${giftReqData.ownerId}님께 선물이 전달되었습니다`);
queryClient.invalidateQueries('coin');
setIsLoading(false);
} catch (error: unknown) {
setIsLoading(false);
Expand Down Expand Up @@ -105,7 +107,7 @@ export default function GiftModal({ itemId, product, price }: PriceTag) {
</div>
)}
<div className={styles.warning}>
<p>선물한 아이템은 환불 및 취소가 불가합니다 ⚠</p>
<p>선물은 환불 및 취소가 불가합니다 ⚠</p>
</div>
</div>
<ModalButtonContainer>
Expand Down
1 change: 0 additions & 1 deletion components/mode/modeWraps/StoreModeWrap.tsx
Original file line number Diff line number Diff line change
@@ -1,4 +1,3 @@
import Image from 'next/image';
import { Dispatch, SetStateAction } from 'react';
import { useSetRecoilState } from 'recoil';
import { Modal } from 'types/modalTypes';
Expand Down
2 changes: 1 addition & 1 deletion components/store/InventoryList.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ import { InvetoryItem } from 'components/store/InventoryItem';
import styles from 'styles/store/Inventory.module.scss';

function fetchInventoryData(page: number) {
if (page === null) page = 0;
if (page === null) page = 1;
return instance.get(`/pingpong/items?page=${page}&size=${8}`).then((res) => {
return res.data;
});
Expand Down
20 changes: 20 additions & 0 deletions constants/store/purchaseAlertMessage.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
const SAD_EMOJI = '(。•́︿•̀。)' + ' ';
const HAPPY_EMOJI = '¡¡¡( •̀ ᴗ •́ )و!!!' + ' ';

export const PURCHASE_ALERT_MESSAGE = {
COMMON: {
ITEM_ERROR: SAD_EMOJI + '해당 아이템이 없습니다.',
OUTDATED_ERROR: SAD_EMOJI + '지금은 구매할 수 없는 아이템입니다.',
COIN_ERROR: SAD_EMOJI + 'GG코인이 부족합니다.',
KAKAO_USER_ERROR: SAD_EMOJI + '카카오 유저는 상점을 이용할 수 없습니다.',
},
BUY: {
SUCCESS: HAPPY_EMOJI + '구매 완료',
USER_ERROR: 'USER NOT FOUND',
},
GIFT: {
EMPTY_RECIPIENT: SAD_EMOJI + '선물할 유저를 선택해주세요.',
RECIPIENT_ERROR: SAD_EMOJI + '선물하려는 유저가 없습니다',
KAKAO_RECIPIENT_ERROR: SAD_EMOJI + '카카오 유저에게는 선물할 수 없습니다.',
},
};
Loading

0 comments on commit e6438b1

Please sign in to comment.