Skip to content

Commit 4414d17

Browse files
MindulMendulMindulMendul
authored
Merge pull request #42 from SWMTheFirstTake/dev
Dev
2 parents 7af62b3 + e47930f commit 4414d17

34 files changed

+838
-715
lines changed

‎app/chat/page.tsx‎

Lines changed: 9 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -1,29 +1,15 @@
1-
import { ChatSidebar } from '@/components/chat/sidebar/ChatSidebar';
2-
import { SidebarInset } from '@/components/ui/sidebar';
3-
import ChatHeader from '@/components/chat/ChatHeader';
4-
import ChatInputBox from '@/components/chat/area/ChatInputBox';
5-
import ChatArea from '@/components/chat/area/ChatArea';
6-
import ChatContextProvider from '@/components/chat/area/ChatContextProvider';
7-
import ChatSidePanel from '@/components/chat/panel/ChatSidePanel';
1+
import ChatContent from '@/components/chat/ChatContent';
2+
import ChatPanel from '@/components/chat/ChatPanel';
83

94
export default function Chat() {
105
return (
11-
<ChatContextProvider>
12-
<div className="flex min-h-screen w-full relative">
13-
<div className="hidden lg:block">
14-
<ChatSidebar />
15-
</div>
16-
<SidebarInset className="flex flex-col h-[100dvh] lg:transition-all lg:duration-300">
17-
<div className="flex flex-col h-full">
18-
<ChatHeader />
19-
<div className="flex-1 min-h-0">
20-
<ChatArea />
21-
</div>
22-
<ChatInputBox />
23-
</div>
24-
</SidebarInset>
25-
<ChatSidePanel />
6+
<div className="flex">
7+
<div className="flex min-h-screen w-1/2">
8+
<ChatContent />
269
</div>
27-
</ChatContextProvider>
10+
<div className="w-1/2">
11+
<ChatPanel />
12+
</div>
13+
</div>
2814
);
2915
}

‎src/api/chatAPI.ts‎

Lines changed: 4 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -43,7 +43,7 @@ export const getChatRoomsRoomIdMessages = async (roomId: number): Promise<APIRes
4343
};
4444
};
4545

46-
export const getChatProduct = async (product: Product): Promise<APIResponse<MessageImage>> => {
46+
export const getChatProduct = async (product: Product): Promise<APIResponse<ClosetCloth>> => {
4747
const response = await requestAPI<APIProduct>(`/api/chat/product/${product.product_id}`, 'GET');
4848
if (response.status === 'fail') {
4949
console.error(new Error(response.message));
@@ -54,13 +54,11 @@ export const getChatProduct = async (product: Product): Promise<APIResponse<Mess
5454
status: response.status,
5555
message: response.message,
5656
data: {
57+
id: product.product_id,
5758
name: response.data.product_name,
58-
content: {
59-
product_id: product.product_id,
60-
content: response.data.comprehensive_description,
61-
},
59+
description: response.data.comprehensive_description,
6260
tags: [...response.data.style_tags, ...response.data.tpo_tags],
63-
src: product.product_url,
61+
url: product.product_url,
6462
},
6563
};
6664
};

‎src/atoms/chatAtoms.ts‎

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -7,11 +7,12 @@ export const currentChatIdAtom = atom<number | null>(null);
77
export const isAIRespondingAtom = atom<'style' | 'trend' | 'color' | 'codi' | ''>('');
88
export const isSidebarOpenAtom = atom<boolean>(false);
99

10-
export const activePanelTypeAtom = atom<'image' | 'wiki' | 'fitting' | null>(null);
11-
export const imageTabsAtom = atom<MessageImage[]>([]);
12-
export const wikiTabsAtom = atom<MessageWiki[]>([]);
13-
export const activeImageTabIdAtom = atom<string | null>(null);
14-
export const activeWikiTabIdAtom = atom<string | null>(null);
10+
export const panelAtom = atom<'chat' | 'closet' | 'fitting'>('closet');
11+
export const codinationsAtom = atom<Codination[]>([]);
12+
export const activeCodinationAtom = atom<Codination | null>(null);
13+
export const closetCodinationAtom = atom<Codination | null>(null);
14+
export const closetAtom = atom<ClosetCloth[]>([]);
15+
export const activeClothAtom = atom<ClosetCloth | null>(null);
1516

1617
export const messagesAtomFamily = atomFamily((chatId: number | null) => atom<Message[]>([]));
1718
export const examplesAtomFamily = atomFamily((chatId: number | null) =>

‎src/components/chat/ChatContent.tsx‎

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
import ChatContentHeader from '@/components/chat/ChatContentHeader';
2+
import ChatInputBox from '@/components/chat/message/ChatInputBox';
3+
import ChatArea from '@/components/chat/message/ChatArea';
4+
5+
export default function ChatContent() {
6+
return (
7+
<>
8+
{/* <div className="hidden lg:block">
9+
<ChatSidebar />
10+
</div> */}
11+
<div className="w-full h-[100dvh] lg:transition-all lg:duration-300">
12+
<div className="flex flex-col w-full h-full">
13+
<ChatContentHeader />
14+
<div className="flex-1 min-h-0">
15+
<ChatArea />
16+
</div>
17+
<ChatInputBox />
18+
</div>
19+
</div>
20+
</>
21+
);
22+
}

‎src/components/chat/ChatContentHeader.tsx‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
export default function ChatContentHeader() {
2+
return (
3+
<header className="flex items-center justify-end px-4 py-6 mx-16 md:mx-auto w-full bg-white">
4+
<div className="w-9 h-9 rounded-full bg-gray-200 flex items-center justify-center text-gray-500 font-bold text-lg">
5+
U
6+
</div>
7+
</header>
8+
);
9+
}

‎src/components/chat/ChatHeader.tsx‎

Lines changed: 0 additions & 48 deletions
This file was deleted.

‎src/components/chat/ChatPanel.tsx‎

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
'use client';
2+
3+
import { panelAtom } from '@/atoms/chatAtoms';
4+
import ChatPanelHeader from '@/components/chat/ChatPanelHeader';
5+
import FittingPanel from '@/components/chat/fitting/FittingPanel';
6+
import { useAtomValue } from 'jotai';
7+
import ClosetPanel from '@/components/chat/closet/ClosetPanel';
8+
9+
export default function ChatPanel() {
10+
const panel = useAtomValue(panelAtom);
11+
return (
12+
<div className={`flex flex-col h-full w-full bg-beige border-l border-navy-200`}>
13+
<ChatPanelHeader />
14+
<div className="h-[calc(100vh-5rem)]">
15+
{panel == 'closet' && <ClosetPanel />}
16+
{panel == 'fitting' && <FittingPanel />}
17+
</div>
18+
</div>
19+
);
20+
}

‎src/components/chat/ChatPanelHeader.tsx‎

Lines changed: 38 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,38 @@
1+
'use client';
2+
3+
import { useAtom, useSetAtom } from 'jotai';
4+
import { activeCodinationAtom, panelAtom } from '@/atoms/chatAtoms';
5+
6+
export default function ChatPanelHeader() {
7+
const [panel, setPanel] = useAtom(panelAtom);
8+
const setActiveCodination = useSetAtom(activeCodinationAtom);
9+
10+
const handleCloset = () => {
11+
setPanel('closet');
12+
setActiveCodination(null);
13+
};
14+
15+
const handleFitting = () => {
16+
setPanel('fitting');
17+
setActiveCodination(null);
18+
};
19+
20+
return (
21+
<header className="h-20 flex items-center justify-between px-4 py-6 mx-16 md:mx-auto w-[calc(100vw-68px)] lg:w-full bg-white">
22+
<div className="flex items-center gap-2">
23+
<button
24+
className={`btn cursor-pointer text-blue text-3xl ${panel == 'closet' && 'font-bold'}`}
25+
onClick={() => handleCloset()}
26+
>
27+
Closet
28+
</button>
29+
<button
30+
className={`btn cursor-pointer text-blue text-3xl ${panel == 'fitting' && 'font-bold'}`}
31+
onClick={() => handleFitting()}
32+
>
33+
Fitting
34+
</button>
35+
</div>
36+
</header>
37+
);
38+
}

0 commit comments

Comments
 (0)