Skip to content

Commit 1179723

Browse files
xingwanyingxingwanying
authored
Merge pull request #114 from ant-xuexiao/feat/chengyue-bot
feat: index ui
2 parents 4dcdb05 + b3b7b10 commit 1179723

File tree

18 files changed

+291
-87
lines changed

18 files changed

+291
-87
lines changed

‎client/app/factory/list/components/AddBotCard.tsx

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
'use client';
2+
import { Tables } from '@/types/database.types';
3+
import React from 'react';
4+
import { Card, Image, CardBody, CardFooter } from '@nextui-org/react';
5+
import { useRouter } from 'next/navigation';
6+
import { AddBotIcon } from "../../../icon/addboticon";
7+
8+
declare type Bot = Tables<'bots'>;
9+
10+
const BotCard = () => {
11+
const router = useRouter();
12+
13+
return (
14+
<Card
15+
className="border-none w-[316px] h-[400px] bg-[#FFF] rounded-[16px] p-2"
16+
shadow="sm"
17+
isPressable
18+
onPress={() => router.push(`/factory/edit/new`)}
19+
>
20+
<CardBody className="overflow-visible p-0 bg-[#F3F4F6] h-[400px] flex justify-center items-center">
21+
<AddBotIcon className="" />
22+
</CardBody>
23+
</Card>
24+
);
25+
};
26+
27+
export default BotCard;

‎client/app/factory/list/components/BotCard.tsx

Lines changed: 21 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,7 @@ import {
1818
ModalBody,
1919
ModalFooter,
2020
Button,
21+
Image,
2122
useDisclosure,
2223
Badge,
2324
} from '@nextui-org/react';
@@ -47,37 +48,31 @@ const BotCard = (props: { bot: Bot }) => {
4748
return (
4849
<>
4950
<Card
50-
className="border-none max-h-[166px]"
51+
className="border-none w-[316px] h-[400px] bg-[#FFF] rounded-[16px] p-2"
5152
shadow="sm"
5253
isPressable
5354
onPress={() => router.push(`/chat/${bot.id}`)}
5455
>
55-
<CardHeader className="justify-between ">
56-
<div className="flex gap-5">
57-
<Badge
58-
content=""
59-
color={bot?.public ? 'success' : 'warning'}
60-
shape="circle"
61-
placement="bottom-right"
62-
>
63-
<Avatar isBordered radius="full" size="md" src={bot.avatar!} />
64-
</Badge>
65-
66-
<div className="flex flex-col gap-1 items-start justify-center">
67-
<h4 className="text-small font-semibold leading-none text-default-600">
68-
{bot.name}
69-
</h4>
70-
71-
{bot?.label && (
72-
<h5 className="text-small tracking-tight text-default-400">
73-
#{bot.label}
74-
</h5>
75-
)}
56+
<CardBody className="overflow-visible p-0 flex-initial">
57+
<Image
58+
shadow="none"
59+
loading="eager"
60+
radius="lg"
61+
width="100%"
62+
alt={bot.name!}
63+
className="rounded-[8px] opacity-100 w-full object-cover h-[268px] w-[300px]"
64+
src={bot.avatar!}
65+
/>
66+
</CardBody>
67+
<CardBody className="flex flex-row justify-between pt-4">
68+
<div className="flex items-end">
69+
<div className="leading-8 h-8 font-semibold text-2xl">
70+
{bot.name}
7671
</div>
7772
</div>
7873
<Dropdown
7974
classNames={{
80-
base: 'before:bg-default-200',
75+
base: 'before:bg-default-200 justify-end',
8176
content: 'min-w-[100px]',
8277
}}
8378
>
@@ -86,7 +81,7 @@ const BotCard = (props: { bot: Bot }) => {
8681
<SettingIcon />
8782
</Button>
8883
</DropdownTrigger>
89-
<DropdownMenu aria-label="Static Actions">
84+
<DropdownMenu aria-label="Static Actions" className='bg-[#efefef] rounded-[6px]'>
9085
<DropdownItem
9186
key="edit"
9287
onClick={() => router.push(`/factory/edit/${bot.id}`)}
@@ -103,16 +98,11 @@ const BotCard = (props: { bot: Bot }) => {
10398
</DropdownItem>
10499
</DropdownMenu>
105100
</Dropdown>
106-
</CardHeader>
107-
<CardBody className="px-3 py-0 text-small text-default-400">
101+
</CardBody>
102+
<CardBody className="py-0 text-small text-default-400">
108103
<p>{bot.description}</p>
109104
</CardBody>
110105
<Divider />
111-
<CardFooter>
112-
<span className="text-default-400 text-[12px]">
113-
Edited {dayjs(bot.updated_at).format('YYYY-MM-DD HH:mm')}
114-
</span>
115-
</CardFooter>
116106
</Card>
117107
<Modal isOpen={isOpen} onOpenChange={onOpenChange}>
118108
<ModalContent>

‎client/app/factory/list/page.tsx

Lines changed: 4 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,8 @@ import React from 'react';
44
import { isEmpty, map } from 'lodash';
55
import { Card, CardBody, Spinner, Image } from '@nextui-org/react';
66
import BotCard from './components/BotCard';
7+
import AddBotCard from './components/AddBotCard';
8+
79
import { useBotList } from '@/app/hooks/useBot';
810
import { useRouter } from 'next/navigation';
911
import FullPageSkeleton from '@/components/FullPageSkeleton';
@@ -23,30 +25,8 @@ export default function List() {
2325
return (
2426
<div className="container mx-auto max-w-[1024px] ">
2527
<div className="mt-8">
26-
<div className="text-left font-semibold font-['PingFang SC'] text-[22px]">
27-
已创建的机器人
28-
</div>
29-
30-
<div className="grid grid-flow-row-dense grid-cols-4 gap-4 my-8">
31-
<Card
32-
className="border-none max-h-[166px]"
33-
shadow="sm"
34-
isPressable
35-
onPress={() => router.push(`/factory/edit/new`)}
36-
>
37-
<div className="flex justify-center items-center h-screen">
38-
<div className="p-8 w-[244px] flex flex-col items-center justify-center">
39-
<img
40-
alt="create new"
41-
className="w-[60px] h-[60px]"
42-
src="/images/create-btn.svg"
43-
/>
44-
<span className="text-center text-default-500">
45-
创建新的机器人
46-
</span>
47-
</div>
48-
</div>
49-
</Card>
28+
<div className="grid grid-flow-row-dense grid-cols-3 gap-4 my-8">
29+
<AddBotCard />
5030
{!isEmpty(bots) &&
5131
map(bots, (bot: Bot) => <BotCard key={bot.id} bot={bot} />)}
5232
</div>

‎client/app/globals.css

Lines changed: 7 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,15 @@
11
@tailwind base;
22
@tailwind components;
33
@tailwind utilities;
4-
4+
html, body {
5+
background-color: #666666;
6+
margin: 0;
7+
padding: 0;
8+
min-height: 100%;
9+
}
510
body {
611
color: #131318;
7-
background: #fff;
12+
background: #F3F4F6;
813
}
914

1015
body input,

‎client/app/icon/addboticon.tsx

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
import React from "react";
2+
export const AddBotIcon = ({
3+
fill = 'currentColor',
4+
filled = false,
5+
size = 'normal',
6+
height = '64px',
7+
width = '64px',
8+
label = '',
9+
...props
10+
}) => (
11+
<svg width="64" height="64" viewBox="0 0 64 64" fill="none" xmlns="http://www.w3.org/2000/svg">
12+
<path d="M6.40039 13.5999C6.40039 9.62345 9.62394 6.3999 13.6004 6.3999H21.6004C25.5768 6.3999 28.8004 9.62345 28.8004 13.5999V21.5999C28.8004 25.5764 25.5768 28.7999 21.6004 28.7999H13.6004C9.62394 28.7999 6.40039 25.5764 6.40039 21.5999V13.5999Z" fill="#E4E4E7"/>
13+
<path d="M6.40039 42.3999C6.40039 38.4235 9.62394 35.1999 13.6004 35.1999H21.6004C25.5768 35.1999 28.8004 38.4235 28.8004 42.3999V50.3999C28.8004 54.3764 25.5768 57.5999 21.6004 57.5999H13.6004C9.62394 57.5999 6.40039 54.3764 6.40039 50.3999V42.3999Z" fill="#E4E4E7"/>
14+
<path d="M35.2004 13.5999C35.2004 9.62345 38.4239 6.3999 42.4004 6.3999H50.4004C54.3768 6.3999 57.6004 9.62345 57.6004 13.5999V21.5999C57.6004 25.5764 54.3768 28.7999 50.4004 28.7999H42.4004C38.4239 28.7999 35.2004 25.5764 35.2004 21.5999V13.5999Z" fill="#E4E4E7"/>
15+
<path d="M48.8004 37.5999C48.8004 36.2744 47.7259 35.1999 46.4004 35.1999C45.0749 35.1999 44.0004 36.2744 44.0004 37.5999V43.9999H37.6004C36.2749 43.9999 35.2004 45.0744 35.2004 46.3999C35.2004 47.7254 36.2749 48.7999 37.6004 48.7999H44.0004V55.1999C44.0004 56.5254 45.0749 57.5999 46.4004 57.5999C47.7259 57.5999 48.8004 56.5254 48.8004 55.1999V48.7999H55.2004C56.5259 48.7999 57.6004 47.7254 57.6004 46.3999C57.6004 45.0744 56.5259 43.9999 55.2004 43.9999H48.8004V37.5999Z" fill="#E4E4E7"/>
16+
</svg>
17+
18+
);
19+
20+

‎client/app/icon/addicon.tsx

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
import React from "react";
2+
export const AddIcon = ({
3+
fill = 'currentColor',
4+
filled = false,
5+
size = 'normal',
6+
height = '16px',
7+
width = '16px',
8+
label = '',
9+
...props
10+
}) => (
11+
<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
12+
<path d="M9.67461 4.2751C9.67461 3.90231 9.3724 3.6001 8.99961 3.6001C8.62682 3.6001 8.32461 3.90231 8.32461 4.2751V8.3251H4.27461C3.90182 8.3251 3.59961 8.62731 3.59961 9.0001C3.59961 9.37289 3.90182 9.6751 4.27461 9.6751L8.32461 9.6751V13.7251C8.32461 14.0979 8.62682 14.4001 8.99961 14.4001C9.3724 14.4001 9.67461 14.0979 9.67461 13.7251V9.6751L13.7246 9.6751C14.0974 9.6751 14.3996 9.37289 14.3996 9.0001C14.3996 8.62731 14.0974 8.3251 13.7246 8.3251H9.67461V4.2751Z" fill="white"/>
13+
</svg>
14+
);
15+
16+

‎client/app/icon/searchicon.tsx

Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
import React from "react";
2+
export const SearchIcon = ({
3+
fill = 'currentColor',
4+
filled = false,
5+
size = 'normal',
6+
height = '16px',
7+
width = '16px',
8+
label = '',
9+
...props
10+
}) => (
11+
<svg
12+
aria-hidden="true"
13+
fill="none"
14+
focusable="false"
15+
height="1em"
16+
role="presentation"
17+
viewBox="0 0 24 24"
18+
width="1em"
19+
{...props}
20+
>
21+
<path
22+
d="M11.5 21C16.7467 21 21 16.7467 21 11.5C21 6.25329 16.7467 2 11.5 2C6.25329 2 2 6.25329 2 11.5C2 16.7467 6.25329 21 11.5 21Z"
23+
stroke="currentColor"
24+
strokeLinecap="round"
25+
strokeLinejoin="round"
26+
strokeWidth="2"
27+
/>
28+
<path
29+
d="M22 22L20 20"
30+
stroke="currentColor"
31+
strokeLinecap="round"
32+
strokeLinejoin="round"
33+
strokeWidth="2"
34+
/>
35+
</svg>
36+
);

‎client/app/icon/shopicon.tsx

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
import React from "react";
2+
export const ShopIcon = ({
3+
fill = 'currentColor',
4+
filled = false,
5+
size = 'normal',
6+
height = '18px',
7+
width = '18px',
8+
label = '',
9+
...props
10+
}) => {
11+
return (
12+
<svg width="19" height="18" viewBox="0 0 19 18" fill="none" xmlns="http://www.w3.org/2000/svg">
13+
<path d="M1.99414 1.0022C1.57993 1.0022 1.24414 1.33798 1.24414 1.7522C1.24414 2.16641 1.57993 2.5022 1.99414 2.5022H3.829L5.0685 7.61517C3.44509 8.02731 2.24414 9.49844 2.24414 11.2501C2.24414 11.6643 2.57993 12.0001 2.99414 12.0001H13.4941C13.9084 12.0001 14.2441 11.6643 14.2441 11.2501C14.2441 10.8358 13.9084 10.5001 13.4941 10.5001H3.87217C4.18105 9.62616 5.01448 9.00006 5.99414 9.00006H12.4941C12.8422 9.00006 13.1445 8.76062 13.2242 8.42184L14.07 4.82721C14.1163 4.63027 14.0811 4.42297 13.9724 4.25235C13.8637 4.08174 13.6906 3.96229 13.4925 3.92112C10.9026 3.38285 8.2297 3.07233 5.49585 3.01124L5.14779 1.5755C5.06624 1.23909 4.76505 1.0022 4.4189 1.0022H1.99414Z" fill="#1F2937"/>
14+
<path d="M5.24414 14.0001C5.24414 14.5523 4.79643 15.0001 4.24414 15.0001C3.69186 15.0001 3.24414 14.5523 3.24414 14.0001C3.24414 13.4478 3.69186 13.0001 4.24414 13.0001C4.79643 13.0001 5.24414 13.4478 5.24414 14.0001Z" fill="#1F2937"/>
15+
<path d="M13.2441 14.0001C13.2441 14.5523 12.7964 15.0001 12.2441 15.0001C11.6919 15.0001 11.2441 14.5523 11.2441 14.0001C11.2441 13.4478 11.6919 13.0001 12.2441 13.0001C12.7964 13.0001 13.2441 13.4478 13.2441 14.0001Z" fill="#1F2937"/>
16+
</svg>
17+
18+
);
19+
};

‎client/app/icon/spaceicon.tsx

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
import React from "react";
2+
export const SpaceIcon = ({
3+
fill = 'currentColor',
4+
filled = false,
5+
size = 'normal',
6+
height = '18px',
7+
width = '18px',
8+
label = '',
9+
...props
10+
}) => {
11+
return (
12+
<svg width="19" height="18" viewBox="0 0 19 18" fill="none" xmlns="http://www.w3.org/2000/svg">
13+
<path d="M3.74414 2C2.91571 2 2.24414 2.67157 2.24414 3.5V5.5C2.24414 6.32843 2.91571 7 3.74414 7H5.74414C6.57257 7 7.24414 6.32843 7.24414 5.5V3.5C7.24414 2.67157 6.57257 2 5.74414 2H3.74414Z" fill="#1F2937"/>
14+
<path d="M3.74414 9C2.91571 9 2.24414 9.67157 2.24414 10.5V12.5C2.24414 13.3284 2.91571 14 3.74414 14H5.74414C6.57257 14 7.24414 13.3284 7.24414 12.5V10.5C7.24414 9.67157 6.57257 9 5.74414 9H3.74414Z" fill="#1F2937"/>
15+
<path d="M9.24414 3.5C9.24414 2.67157 9.91571 2 10.7441 2H12.7441C13.5726 2 14.2441 2.67157 14.2441 3.5V5.5C14.2441 6.32843 13.5726 7 12.7441 7H10.7441C9.91571 7 9.24414 6.32843 9.24414 5.5V3.5Z" fill="#1F2937"/>
16+
<path d="M10.7441 9C9.91571 9 9.24414 9.67157 9.24414 10.5V12.5C9.24414 13.3284 9.91571 14 10.7441 14H12.7441C13.5726 14 14.2441 13.3284 14.2441 12.5V10.5C14.2441 9.67157 13.5726 9 12.7441 9H10.7441Z" fill="#1F2937"/>
17+
</svg>
18+
19+
);
20+
};

‎client/app/layout.tsx

Lines changed: 1 addition & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
11
'use client';
22
import './globals.css';
3-
import { UserProvider } from '@auth0/nextjs-auth0/client';
43
import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
54
import { NextUIProvider } from '@nextui-org/react';
65
import { Navbar } from '@/components/Navbar';
@@ -27,19 +26,16 @@ export default function RootLayout({
2726
<meta property="og:image" content="/images/favicon.ico" />
2827
</head>
2928

30-
<UserProvider>
31-
<Assistant host={ASSISTANT_API_HOST} />
3229
<QueryClientProvider client={queryClient}>
3330
<body className="bg-[url('/images/bg.svg')] bg-top bg-no-repeat">
3431
<NextUIProvider>
35-
<div className="flex flex-col h-[100vh]">
32+
<div className="flex flex-col">
3633
<Navbar></Navbar>
3734
{children}
3835
</div>
3936
</NextUIProvider>
4037
</body>
4138
</QueryClientProvider>
42-
</UserProvider>
4339
</html>
4440
);
4541
}

‎client/app/login/page.tsx

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

‎client/app/logout.tsx

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

‎client/app/page.tsx

Lines changed: 4 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,8 @@ import { Tables } from '@/types/database.types';
33
import React from 'react';
44
import { isEmpty, map } from 'lodash';
55
import BotCard from '@/components/BotCard';
6+
import AddBotCard from '@/components/AddBotCard';
7+
68
import { useBotList } from '@/app/hooks/useBot';
79
import FullPageSkeleton from '@/components/FullPageSkeleton';
810

@@ -21,14 +23,10 @@ export default function Home() {
2123
<div>
2224
<div className="container mx-auto max-w-[1024px]">
2325
<div className="mt-8">
24-
<div className="text-center text-purple-500 text-base font-semibold font-['PingFang SC']">
25-
<div className="uppercase">Bot-market</div>
26-
<div className="m-1 leading-[62px] text-indigo-950 text-[50px]">
27-
人才市场
28-
</div>
29-
</div>
26+
3027

3128
<div className="grid grid-flow-row-dense grid-cols-3 gap-8 my-8">
29+
<AddBotCard />
3230
{!isEmpty(bots) &&
3331
map(bots, (bot: Bot) => <BotCard key={bot.id} bot={bot} />)}
3432
</div>

‎client/components/AddBotCard.tsx

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
'use client';
2+
import { Tables } from '@/types/database.types';
3+
import React from 'react';
4+
import { Card, Image, CardBody, CardFooter } from '@nextui-org/react';
5+
import { useRouter } from 'next/navigation';
6+
import { AddBotIcon } from "../app/icon/addboticon";
7+
8+
declare type Bot = Tables<'bots'>;
9+
10+
const BotCard = () => {
11+
const router = useRouter();
12+
13+
return (
14+
<Card
15+
className="border-none w-[316px] h-[400px] bg-[#FFF] rounded-[16px] p-2"
16+
shadow="sm"
17+
isPressable
18+
onPress={() => router.push(`/chat/add`)}
19+
>
20+
<CardBody className="overflow-visible p-0 bg-[#F3F4F6] h-[400px] flex justify-center items-center">
21+
<AddBotIcon className="" />
22+
23+
</CardBody>
24+
</Card>
25+
);
26+
};
27+
28+
export default BotCard;

0 commit comments

Comments
 (0)