Skip to content

Commit 0a73ce1

Browse files
authored
Ux changes (#276)
* Feat: Revamp catalog and assistance UX design Signed-off-by: Daishan Peng <[email protected]> --------- Signed-off-by: Daishan Peng <[email protected]>
1 parent bd504c4 commit 0a73ce1

File tree

15 files changed

+667
-493
lines changed

15 files changed

+667
-493
lines changed

.eslintignore

-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
11
node_modules/
22
dist/
3-
build/
43
electron-dist/
54
.next
65
tailwind.config.js

.prettierignore

-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
11
node_modules/
22
dist/
3-
build/
43
electron-dist/
54
.next
65
tailwind.config.js

app/build/layout.tsx

+11-8
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,12 @@
1-
export default function RunLayout({children}: {children: React.ReactNode}) {
2-
return (
3-
<section className="absolute left-0 top-[50px]">
4-
<div className="border-t-1 dark:border-zinc-800" style={{width: `100vw`, height: `calc(100vh - 50px)`}}>
5-
{children}
6-
</div>
7-
</section>
8-
);
1+
export default function RunLayout({ children }: { children: React.ReactNode }) {
2+
return (
3+
<section className="absolute left-0 top-[50px]">
4+
<div
5+
className="border-t-1 dark:border-zinc-800"
6+
style={{ width: `100vw`, height: `calc(100vh - 50px)` }}
7+
>
8+
{children}
9+
</div>
10+
</section>
11+
);
912
}

app/build/page.tsx

+63-27
Original file line numberDiff line numberDiff line change
@@ -1,31 +1,67 @@
1-
"use client";
1+
'use client';
22

3-
import {useContext, useEffect} from "react";
4-
import {AuthContext} from "@/contexts/auth";
5-
import {title, subtitle} from "@/components/primitives";
6-
import Scripts from "@/components/scripts";
7-
import Loading from "@/components/loading";
8-
import { NavContext } from "@/contexts/nav";
9-
import { GoPeople } from "react-icons/go";
10-
import Create from "@/components/scripts/create";
3+
import React, { useContext, useEffect, useState } from 'react';
4+
import { AuthContext } from '@/contexts/auth';
5+
import Scripts from '@/components/scripts';
6+
import Loading from '@/components/loading';
7+
import { NavContext } from '@/contexts/nav';
8+
import { GoPeople } from 'react-icons/go';
9+
import Create from '@/components/scripts/create';
10+
import { Button, Divider, useDisclosure } from '@nextui-org/react';
11+
import { MdOutlineTravelExplore } from 'react-icons/md';
12+
import ExploreModal from '@/components/explore/ExploreModal';
1113

1214
export default function Home() {
13-
const {loading} = useContext(AuthContext);
14-
const {setCurrent} = useContext(NavContext);
15-
useEffect(() => setCurrent('/build'), [])
16-
if (loading) return <Loading/>;
17-
return (
18-
<section className="w-full gap-4 px-20 pt-20">
19-
<div className="flex justify-between">
20-
<h1 className="text-4xl font-bold text-primary-400">
21-
<GoPeople className="inline mb-2 mr-1 text-5xl"/> My Assistants
22-
</h1>
23-
<Create/>
24-
</div>
15+
const { loading } = useContext(AuthContext);
16+
const { setCurrent } = useContext(NavContext);
17+
const { isOpen, onOpen, onClose } = useDisclosure();
18+
const [showFavorites, setShowFavorites] = useState<boolean>(false);
2519

26-
<div className="w-full pt-16 pb-24">
27-
<Scripts/>
28-
</div>
29-
</section>
30-
);
31-
}
20+
useEffect(() => setCurrent('/build'), []);
21+
if (loading) return <Loading />;
22+
return (
23+
<section className="w-full gap-4 px-20 pt-20">
24+
<div className="flex justify-between">
25+
<h1 className="text-4xl font-bold text-primary-400">
26+
<GoPeople className="inline mb-2 mr-1 text-5xl" /> My Assistants
27+
</h1>
28+
<div>
29+
<Create />
30+
<Button
31+
isLoading={loading}
32+
size="md"
33+
startContent={<MdOutlineTravelExplore />}
34+
color="primary"
35+
variant="flat"
36+
className="ml-2"
37+
onPress={() => {
38+
onOpen();
39+
}}
40+
>
41+
Assistant Catalog
42+
</Button>
43+
</div>
44+
</div>
45+
<div className="flex h-5 ml-2 mt-5 items-center space-x-4 text-medium text-zinc-500">
46+
<div
47+
className={`cursor-pointer hover:text-zinc-700 dark:hover:text-zinc-300 ${!showFavorites ? 'font-bold text-zinc-900 dark:text-white' : ''}`}
48+
onClick={() => setShowFavorites(false)}
49+
>
50+
My Assistants
51+
</div>
52+
<Divider orientation="vertical" />
53+
<div
54+
className={`cursor-pointer hover:text-zinc-700 dark:hover:text-zinc-300 ${showFavorites ? 'font-bold text-zinc-900 dark:text-white' : ''}`}
55+
onClick={() => setShowFavorites(true)}
56+
>
57+
Favorites
58+
</div>
59+
</div>
60+
61+
<div className="w-full pt-8 pb-24">
62+
<Scripts showFavorites={showFavorites} />
63+
</div>
64+
<ExploreModal isOpen={isOpen} onOpen={onOpen} onClose={onClose} />
65+
</section>
66+
);
67+
}

app/edit/page.tsx

+4-10
Original file line numberDiff line numberDiff line change
@@ -5,26 +5,20 @@ import { useSearchParams } from 'next/navigation';
55
import Configure from '@/components/edit/configure';
66
import { EditContextProvider } from '@/contexts/edit';
77
import { ChatContextProvider } from '@/contexts/chat';
8-
import New from '@/components/edit/new';
98
import ScriptNav from '@/components/edit/scriptNav';
109
import { NavContext } from '@/contexts/nav';
1110

1211
function EditFile() {
13-
const [file, setFile] = useState<string>(useSearchParams().get('file') || '');
12+
const [file, _setFile] = useState<string>(
13+
useSearchParams().get('file') || ''
14+
);
1415
const [scriptId] = useState<string>(useSearchParams().get('id') || '');
1516
const [collapsed, setCollapsed] = useState(false);
1617

1718
const { setCurrent } = useContext(NavContext);
1819
useEffect(() => setCurrent('/build'), []);
1920

20-
return !file || file === 'new' ? (
21-
<div className="w-full h-full flex items-center justify-center align-center">
22-
<div className="absolute left-2 top-2">
23-
<ScriptNav collapsed={collapsed} setCollapsed={setCollapsed} />
24-
</div>
25-
<New className="w-1/2" setFile={setFile} />
26-
</div>
27-
) : (
21+
return (
2822
<ChatContextProvider
2923
initialScript={file}
3024
initialScriptId={scriptId}

0 commit comments

Comments
 (0)