Skip to content

Commit 5874c68

Browse files
authoredSep 5, 2024
Merge pull request #228 from modern-agile-team/refactor/my-room/#172
bugfix(#172):완
2 parents ca88c2c + 04e1ee0 commit 5874c68

File tree

8 files changed

+34
-54
lines changed

8 files changed

+34
-54
lines changed
 

‎src/app/api/axiosInstance.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import axios from 'axios';
22

33
const instance = axios.create({
44
baseURL: process.env.NEXT_PUBLIC_MODERN_WORLD_BASE_URL,
5-
timeout: 4000,
5+
timeout: 10000,
66
withCredentials: true, //자격 증명(쿠키) 전송
77
headers: {
88
'X-Custom-Header': 'foobar',

‎src/app/api/inventory.ts

+6
Original file line numberDiff line numberDiff line change
@@ -89,9 +89,15 @@ const INVENTORY = {
8989

9090
async getUsersCharacterLocker(
9191
characterNo: number,
92+
status?: boolean,
9293
): Promise<UsersCharacterLockerType> {
9394
const result: AxiosResponse = await instance.get(
9495
`${this.path}/${characterNo}/characters`,
96+
{
97+
params: {
98+
status,
99+
},
100+
},
95101
);
96102
return result.data[0];
97103
},

‎src/components/index-page/NewUserCreateNickname.tsx

+3-7
Original file line numberDiff line numberDiff line change
@@ -16,15 +16,11 @@ export const NewUserCreateNewname = () => {
1616

1717
const getCreateUserApi = async () => {
1818
try {
19-
try {
20-
await USER.createNickname(newUserNickname);
21-
await USER.createCharacter(newUserCharacter);
22-
} catch (err) {
23-
alert('캐릭터 생성 실패');
24-
}
19+
await USER.createNickname(newUserNickname);
20+
await USER.createCharacter(newUserCharacter);
2521
route.push('my-page');
2622
} catch (err) {
27-
alert('닉네임 생성 실패');
23+
alert('회원가입 실패');
2824
}
2925
};
3026
return (

‎src/components/my-room/GetUserCharacter.tsx

+11-32
Original file line numberDiff line numberDiff line change
@@ -2,52 +2,31 @@
22

33
import * as S from './style';
44
import INVENTORY from '@/app/api/inventory';
5-
import { InventoryItemType } from '@/types/inventory';
6-
import { characterSize } from '@/utils/itemSizeConstains';
5+
76
import Image from 'next/image';
87
import { useEffect, useState } from 'react';
98

109
export const GetUserCharacter = ({ userNo }: { userNo: number }) => {
11-
const [character, setCharacter] = useState([]);
1210
const [characterName, setCharacterName] = useState<string>('');
1311

1412
useEffect(() => {
15-
const getUserCharacter = async (userNo: number) => {
16-
const response = await INVENTORY.getInventoryCharacter(userNo);
17-
setCharacter(response);
18-
};
19-
getUserCharacter(userNo);
2013
const getUsersCharacterLocker = async () => {
21-
const response = await INVENTORY.getUsersCharacterLocker(userNo);
22-
setCharacterName(response.character.name);
14+
const response = await INVENTORY.getUsersCharacterLocker(userNo, true);
15+
setCharacterName(response.character.image);
2316
};
2417
getUsersCharacterLocker();
2518
}, []);
2619

27-
const checkCharacter = characterSize.filter(
28-
(e) => e.characterName === characterName,
29-
)[0];
30-
3120
return (
3221
<>
33-
{checkCharacter ? (
34-
<S.CharacterImage
35-
width={checkCharacter.width}
36-
height={checkCharacter.height}>
37-
<Image
38-
alt={'유저의 캐릭터'}
39-
fill
40-
sizes={'(max-width : 200px) 100vw'}
41-
src={
42-
(
43-
character.filter(
44-
(e: InventoryItemType) => e.status,
45-
)[0] as InventoryItemType
46-
)?.character.image || `${process.env.NEXT_PUBLIC_S3}`
47-
}
48-
/>
49-
</S.CharacterImage>
50-
) : null}
22+
<S.CharacterImage width={'20%'} height={'20%'}>
23+
<Image
24+
alt={'유저의 캐릭터'}
25+
fill
26+
sizes={'(max-width : 200px) 100vw'}
27+
src={characterName || `${process.env.NEXT_PUBLIC_S3}`}
28+
/>
29+
</S.CharacterImage>
5130
</>
5231
);
5332
};

‎src/components/my-room/MyRoom.tsx

+3-8
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,7 @@ import { Area7_8_9 } from './Area7_8_9';
66
import useCheckAreaHook from './useCheckAreaHook';
77
import useCheckItemSizeHook from './useCheckItemSizeHook';
88
import Image from 'next/image';
9+
import { IMAGE } from '@/utils/image';
910

1011
export function MyRoom(props: {
1112
width: string;
@@ -19,10 +20,7 @@ export function MyRoom(props: {
1920
<S.FloorAndWall $border="30px 30px 0px 0px">
2021
<Image
2122
alt={'바닥 이미지'}
22-
src={
23-
useCheckAreaHook(11, props.userNo) ||
24-
`${process.env.NEXT_PUBLIC_S3}`
25-
}
23+
src={useCheckAreaHook(11, props.userNo) || IMAGE.default_floor}
2624
fill
2725
sizes="(max-size:1920px) 100vw"
2826
objectFit="cover"
@@ -31,10 +29,7 @@ export function MyRoom(props: {
3129
<S.FloorAndWall $border="0px 0px 30px 30px">
3230
<Image
3331
alt={'벽지 이미지'}
34-
src={
35-
useCheckAreaHook(12, props.userNo) ||
36-
`${process.env.NEXT_PUBLIC_S3}`
37-
}
32+
src={useCheckAreaHook(12, props.userNo) || IMAGE.default_wall}
3833
fill
3934
sizes={'(max-size:1080px) 100vh'}
4035
objectFit="cover"

‎src/components/my-room/style.ts

+1
Original file line numberDiff line numberDiff line change
@@ -46,6 +46,7 @@ export const FloorAndWall = styled.div<StyleType>`
4646
border-radius: ${(props) => props.$border};
4747
position: relative;
4848
overflow: hidden;
49+
z-index: 0;
4950
`;
5051

5152
/**

‎src/utils/image.ts

+2
Original file line numberDiff line numberDiff line change
@@ -31,4 +31,6 @@ export const IMAGE = {
3131
check: `${process.env.NEXT_PUBLIC_S3}/page/check.png`,
3232
handShdow: `${process.env.NEXT_PUBLIC_S3}/page/%EA%B0%80%EC%9C%84%EB%B0%94%EC%9C%84%EB%B3%B4/handShadow.svg`,
3333
null: `${process.env.NEXT_PUBLIC_S3}/items/item/null.jpg`,
34+
default_wall: `${process.env.NEXT_PUBLIC_S3}/items/item/default_wall.svg`,
35+
default_floor: `${process.env.NEXT_PUBLIC_S3}/items/item/default_floor.svg`,
3436
};

‎src/utils/itemSizeConstains.ts

+7-6
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,12 @@
11
export const itemSize = [
22
{ itemNo: 1, width: '30%', height: '30%', top: '-2%' },
3-
{ itemNo: 2, width: '60%', height: '60%', bottom: '19%' },
4-
{ itemNo: 3, width: '30%', height: '30%' },
3+
{ itemNo: 2, width: '30%', height: '30%', bottom: '19%' },
4+
{ itemNo: 3, width: '30%', height: '30%', bottom: '20%' },
55
{ itemNo: 4, width: '30%', height: '30%' },
66
{ itemNo: 5, width: '30%', height: '30%' },
7-
{ itemNo: 6, width: '30%', height: '30%' },
7+
{ itemNo: 6, width: '15%', height: '15%' },
88
{ itemNo: 7, width: '30%', height: '30%' },
9-
{ itemNo: 8, width: '30%', height: '30%', bottom: '1%' },
9+
{ itemNo: 8, width: '30%', height: '30%', bottom: '-3%' },
1010
{ itemNo: 9, width: '30%', height: '30%' },
1111
{ itemNo: 10, width: '30%', height: '30%' },
1212
{ itemNo: 11, width: '30%', height: '30%' },
@@ -18,13 +18,13 @@ export const itemSize = [
1818
{ itemNo: 17, width: '30%', height: '30%' },
1919
{ itemNo: 18, width: '30%', height: '30%' },
2020
{ itemNo: 19, width: '30%', height: '30%' },
21-
{ itemNo: 20, width: '30%', height: '30%', bottom: '3%' },
21+
{ itemNo: 20, width: '30%', height: '30%', bottom: '-3%' },
2222
{ itemNo: 21, width: '30%', height: '30%' },
2323
{ itemNo: 22, width: '30%', height: '30%' },
2424
{ itemNo: 23, width: '30%', height: '30%' },
2525
{ itemNo: 24, width: '30%', height: '30%' },
2626
{ itemNo: 25, width: '30%', height: '30%', top: '-4%' },
27-
{ itemNo: 26, width: '30%', height: '30%' },
27+
{ itemNo: 26, width: '45%', height: '45%', bottom: '30%' },
2828
{ itemNo: 27, width: '50%', height: '50%', bottom: '25%' },
2929
{ itemNo: 28, width: '30%', height: '30%' },
3030
{ itemNo: 29, width: '30%', height: '30%' },
@@ -58,4 +58,5 @@ export const characterSize = [
5858
{ characterName: '안진우똥색고양이', width: '50%', height: '50%' },
5959
{ characterName: '김은우검은고양이', width: '50%', height: '50%' },
6060
{ characterName: '조영은강아지', width: '50%', height: '50%' },
61+
{ characterName: '뽀메', width: '50%', height: '50%' },
6162
];

0 commit comments

Comments
 (0)