Skip to content

Commit 3258a19

Browse files
RaoHaiRaoHai
authored
Merge pull request #108 from ant-xuexiao/feat_tailwind
style: add tailwind restrictions to prevent style conflicts
2 parents d91b18f + f969fb9 commit 3258a19

File tree

13 files changed

+251
-154
lines changed

13 files changed

+251
-154
lines changed

‎client/.env.example

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,2 +1,2 @@
11
SELF_PATH=/client/
2-
NEXT_PUBLIC_API_URL=http://localhost:3000/api
2+
NEXT_PUBLIC_API_DOMAIN=http://localhost:8000

‎client/app/layout.tsx

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,8 +4,10 @@ import { UserProvider } from '@auth0/nextjs-auth0/client';
44
import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
55
import { NextUIProvider } from '@nextui-org/react';
66
import { Navbar } from '@/components/Navbar';
7+
import { Assistant } from 'petercat-lui';
78

89
const queryClient = new QueryClient();
10+
const ASSISTANT_API_HOST = process.env.NEXT_PUBLIC_ASSISTANT_API_HOST;
911

1012
export default function RootLayout({
1113
children,
@@ -26,6 +28,7 @@ export default function RootLayout({
2628
</head>
2729

2830
<UserProvider>
31+
<Assistant host={ASSISTANT_API_HOST} />
2932
<QueryClientProvider client={queryClient}>
3033
<body className="bg-[url('/images/bg.svg')] bg-top bg-no-repeat">
3134
<NextUIProvider>

‎client/app/page.tsx

Lines changed: 0 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -2,16 +2,12 @@
22
import { Tables } from '@/types/database.types';
33
import React from 'react';
44
import { isEmpty, map } from 'lodash';
5-
import { Spinner } from '@nextui-org/react';
65
import BotCard from '@/components/BotCard';
76
import { useBotList } from '@/app/hooks/useBot';
87
import FullPageSkeleton from '@/components/FullPageSkeleton';
9-
import { Assistant } from 'petercat-lui';
108

119
declare type Bot = Tables<'bots'>;
1210

13-
const ASSISTANT_API_HOST = process.env.NEXT_PUBLIC_ASSISTANT_API_HOST;
14-
1511
export default function Home() {
1612
const { data: bots, isLoading, error } = useBotList();
1713
if (isLoading) {
@@ -23,8 +19,6 @@ export default function Home() {
2319

2420
return (
2521
<div>
26-
<Assistant host={ASSISTANT_API_HOST} />
27-
2822
<div className="container mx-auto max-w-[1024px]">
2923
<div className="mt-8">
3024
<div className="text-center text-purple-500 text-base font-semibold font-['PingFang SC']">

‎client/package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,7 @@
2828
"axios": "^1.6.7",
2929
"concurrently": "^8.2.2",
3030
"dayjs": "^1.11.10",
31-
"petercat-lui": "^0.0.4",
31+
"petercat-lui": "^0.0.8",
3232
"eslint": "8.46.0",
3333
"eslint-config-next": "13.4.12",
3434
"framer-motion": "^10.16.15",

‎client/yarn.lock

Lines changed: 10 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -8002,10 +8002,10 @@ path-type@^4.0.0:
80028002
resolved "https://registry.npmjs.org/path-type/-/path-type-4.0.0.tgz#84ed01c0a7ba380afe09d90a8c180dcd9d03043b"
80038003
integrity sha512-gDKb8aZMDeD/tZWs9P6+q0J9Mwkdl6xMV8TjnGP3qJVJ06bdMgkbBlLU8IdfOsIsFz2BW1rNVT3XuNEl8zPAvw==
80048004

8005-
petercat-lui@^0.0.4:
8006-
version "0.0.4"
8007-
resolved "https://registry.npmjs.org/petercat-lui/-/petercat-lui-0.0.4.tgz#b98d4369681d822a7199c18529002c608a1af46a"
8008-
integrity sha512-rQyz24tIgFWZKAsipKM1NACFvfqE3iN4BEy2FoAob+K3DP/TTiAxNgDOkGKP1q/woKpN66KTyLX7uwlAGrjpvA==
8005+
petercat-lui@^0.0.8:
8006+
version "0.0.8"
8007+
resolved "https://registry.npmjs.org/petercat-lui/-/petercat-lui-0.0.8.tgz#e6f2e9240910ba41897db59141fb23d9504757d6"
8008+
integrity sha512-IsuAVJsRUVkUaA7xiwPi4oZNvyQtBpgOMDwAIvaKOzWs2EssT3BJHRm9rJ/uLq1PDNHtFBUsQRAZcFVHh/UVVw==
80098009
dependencies:
80108010
"@ant-design/icons" "^5.3.5"
80118011
"@ant-design/pro-chat" "1.12.1-beta.1"
@@ -8017,6 +8017,7 @@ petercat-lui@^0.0.4:
80178017
lodash "^4.17.21"
80188018
react-json-view "^1.21.3"
80198019
tailwindcss "^3.4.1"
8020+
tailwindcss-scoped-preflight "^3.2.6"
80208021

80218022
picocolors@^1.0.0:
80228023
version "1.0.0"
@@ -9382,6 +9383,11 @@ tailwind-variants@^0.1.20:
93829383
dependencies:
93839384
tailwind-merge "^1.14.0"
93849385

9386+
tailwindcss-scoped-preflight@^3.2.6:
9387+
version "3.2.6"
9388+
resolved "https://registry.npmjs.org/tailwindcss-scoped-preflight/-/tailwindcss-scoped-preflight-3.2.6.tgz#db1f2654d8694b8615e113c86c27d6dcb5e37b3a"
9389+
integrity sha512-Q0mE+77258D5kIfMOAJ8iOFEUFoeGMqaWG/n8H9deBFwN7E9zB+qmxTmcF6JfmrEkwx6vfBZN7JSneBGYJn4Kg==
9390+
93859391
tailwindcss@3.3.3:
93869392
version "3.3.3"
93879393
resolved "https://registry.npmjs.org/tailwindcss/-/tailwindcss-3.3.3.tgz#90da807393a2859189e48e9e7000e6880a736daf"

‎lui/package.json

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "petercat-lui",
3-
"version": "0.0.4",
3+
"version": "0.0.8",
44
"description": "A react library developed with dumi",
55
"module": "dist/index.js",
66
"types": "dist/index.d.ts",
@@ -56,18 +56,20 @@
5656
"@ant-design/pro-chat": "1.12.1-beta.1",
5757
"@ant-design/pro-editor": "^1.1.1",
5858
"@babel/runtime": "^7.18.0",
59-
"antd": "^5.15.3",
6059
"antd-style": "^3.6.1",
60+
"antd": "^5.15.3",
6161
"dotenv": "^16.4.5",
6262
"lodash": "^4.17.21",
6363
"react-json-view": "^1.21.3",
64-
"tailwindcss": "^3.4.1"
64+
"tailwindcss": "^3.4.1",
65+
"tailwindcss-scoped-preflight": "^3.2.6"
6566
},
6667
"devDependencies": {
6768
"@commitlint/cli": "^17.1.2",
6869
"@commitlint/config-conventional": "^17.1.0",
6970
"@types/react": "^18.0.0",
7071
"@types/react-dom": "^18.0.0",
72+
"@types/lodash": "^4.14.202",
7173
"@umijs/lint": "^4.0.0",
7274
"@umijs/plugins": "^4.1.5",
7375
"dumi": "^2.2.13",

‎lui/src/Assistant/index.tsx

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -42,7 +42,7 @@ const Assistant = (props: AssistantProps) => {
4242
e.preventDefault(); // Prevent text selection
4343
};
4444
return (
45-
<>
45+
<div className="petercat-lui">
4646
{chatVisible ? (
4747
<div
4848
className="fixed right-0 top-0 h-full flex flex-row z-[999] overflow-hidden text-left text-black bg-gradient-to-r from-f2e9ed via-e9eefb to-f0eeea shadow-[0px_0px_1px_#919eab3d]"
@@ -58,12 +58,13 @@ const Assistant = (props: AssistantProps) => {
5858
</div>
5959
</div>
6060
) : (
61-
<div
62-
className="fixed bottom-[120px] right-2.5 w-14 h-8 mr-[-32px] flex items-center justify-center rounded-full border border-[#ececee] shadow-[0_3.2px_12px_#00000014,_0_5px_25px_#0000000a] bg-white cursor-pointer transition-all duration-300 ease-in-out hover:shadow-lg active:cursor-grabbing"
61+
<div
62+
className="fixed bottom-[120px] right-0 w-14 h-8 flex items-center justify-center rounded-full border border-[#ececee] shadow-[0_3.2px_12px_#00000014,_0_5px_25px_#0000000a] bg-white cursor-pointer transition-all duration-300 ease-in-out hover:shadow-lg active:cursor-grabbing"
6363
onMouseDown={startDrag}
6464
onClick={toggleDrawer}
6565
style={{
6666
bottom: `${position.bottom}px`,
67+
marginRight: '-18px',
6768
zIndex: 9999,
6869
}}
6970
>
@@ -76,7 +77,7 @@ const Assistant = (props: AssistantProps) => {
7677
/>
7778
</div>
7879
)}
79-
</>
80+
</div>
8081
);
8182
};
8283

‎lui/src/Chat/index.tsx

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -37,7 +37,8 @@ const Chat: FC<ChatProps> = memo(({ helloMessage, host, drawerWidth }) => {
3737
? `calc(${drawerWidth}px - 90px)`
3838
: '100%';
3939
return (
40-
<div
40+
<div className="petercat-lui">
41+
<div
4142
className="h-full w-full"
4243
style={{ backgroundColor: globalToken.chatBoxBackgroundColor }}
4344
>
@@ -167,6 +168,8 @@ const Chat: FC<ChatProps> = memo(({ helloMessage, host, drawerWidth }) => {
167168
}}
168169
/>
169170
</div>
171+
</div>
172+
170173
);
171174
});
172175

‎lui/src/StopBtn/index.tsx

Lines changed: 13 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -14,17 +14,19 @@ const StopBtn: FC<StopBtnProps> = ({ text, visible, action }) => {
1414
return null;
1515
}
1616
return (
17-
<ProChatProvider>
18-
<div
19-
className="h-8 w-18 flex flex-row justify-center items-center text-sm px-3 rounded-lg bg-gray-300 text-gray-800 cursor-pointer m-auto"
20-
onClick={() => action?.()}
21-
>
22-
<Space>
23-
<PauseCircleFilled />
24-
<span>{text ?? '停止'}</span>
25-
</Space>
26-
</div>
27-
</ProChatProvider>
17+
<div className="petercat-lui">
18+
<ProChatProvider>
19+
<div
20+
className="h-8 w-18 flex flex-row justify-center items-center text-sm px-3 rounded-lg bg-gray-300 text-gray-800 cursor-pointer m-auto"
21+
onClick={() => action?.()}
22+
>
23+
<Space>
24+
<PauseCircleFilled />
25+
<span>{text ?? '停止'}</span>
26+
</Space>
27+
</div>
28+
</ProChatProvider>
29+
</div>
2830
);
2931
};
3032

‎lui/src/ThoughtChain/index.tsx

Lines changed: 42 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -87,46 +87,48 @@ const ThoughtChain: React.FC<ThoughtChainProps> = (params) => {
8787
}, []);
8888

8989
return (
90-
<Collapse
91-
size="small"
92-
items={items}
93-
activeKey={activeKey}
94-
onChange={onChange}
95-
style={{ maxWidth: '100%' }}
96-
expandIcon={(panelProps) => {
97-
if (panelProps.isActive) {
98-
return <UnorderedListOutlined className="text-gray-900 text-xs" />;
99-
}
100-
switch (status) {
101-
case Status.success:
102-
return (
103-
<CheckCircleOutlined
104-
className={`text-xs ${getColorClass(status!)}`}
105-
/>
106-
);
107-
case Status.loading:
108-
return (
109-
<LoadingOutlined
110-
className={`text-xs ${getColorClass(status!)}`}
111-
/>
112-
);
113-
case Status.failed:
114-
return (
115-
<CloseCircleOutlined
116-
className={`text-xs ${getColorClass(status!)}`}
117-
/>
118-
);
119-
case Status.end:
120-
return (
121-
<ExclamationCircleOutlined
122-
className={`text-xs ${getColorClass(status!)}`}
123-
/>
124-
);
125-
default:
126-
return '';
127-
}
128-
}}
129-
/>
90+
<div className="petercat-lui">
91+
<Collapse
92+
size="small"
93+
items={items}
94+
activeKey={activeKey}
95+
onChange={onChange}
96+
style={{ maxWidth: '100%' }}
97+
expandIcon={(panelProps) => {
98+
if (panelProps.isActive) {
99+
return <UnorderedListOutlined className="text-gray-900 text-xs" />;
100+
}
101+
switch (status) {
102+
case Status.success:
103+
return (
104+
<CheckCircleOutlined
105+
className={`text-xs ${getColorClass(status!)}`}
106+
/>
107+
);
108+
case Status.loading:
109+
return (
110+
<LoadingOutlined
111+
className={`text-xs ${getColorClass(status!)}`}
112+
/>
113+
);
114+
case Status.failed:
115+
return (
116+
<CloseCircleOutlined
117+
className={`text-xs ${getColorClass(status!)}`}
118+
/>
119+
);
120+
case Status.end:
121+
return (
122+
<ExclamationCircleOutlined
123+
className={`text-xs ${getColorClass(status!)}`}
124+
/>
125+
);
126+
default:
127+
return '';
128+
}
129+
}}
130+
/>
131+
</div>
130132
);
131133
};
132134

‎lui/src/services/ChatController.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ export async function streamChat(
88
messages: IPrompt[],
99
host = 'http://127.0.0.1:8000',
1010
): Promise<Response> {
11-
return fetch(`${host}/api/chat/builder`, {
11+
return fetch(`${host}/api/chat/qa`, {
1212
method: 'POST',
1313
headers: {
1414
'Content-Type': 'application/json',

‎lui/tailwind.config.js

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,17 @@
1+
2+
import {
3+
scopedPreflightStyles,
4+
isolateInsideOfContainer,
5+
} from 'tailwindcss-scoped-preflight';
6+
17
module.exports = {
28
content: [
39
'./src/**/*.{js,ts,jsx,tsx,mdx}',
410
],
11+
plugins: [
12+
scopedPreflightStyles({
13+
isolationStrategy: isolateInsideOfContainer('.petercat-lui'),
14+
}),
15+
],
516
}
17+

0 commit comments

Comments
 (0)