From 3b16bfe10a5c7d33d400937ab9967b93c8013284 Mon Sep 17 00:00:00 2001 From: ddiu8081 Date: Sun, 12 Mar 2023 00:29:38 +0800 Subject: [PATCH 001/151] feat: v2 ui frame --- src/components/v2/Button.astro | 10 ++++++++++ src/components/v2/ChatConfiguration.astro | 17 +++++++++++++++++ src/components/v2/ConversationSidebarItem.astro | 4 ++++ src/components/v2/Header.astro | 5 +++++ src/components/v2/Main.astro | 14 ++++++++++++++ src/components/v2/Send.astro | 1 + src/components/v2/Settings.astro | 5 +++++ src/components/v2/Sidebar.astro | 12 ++++++++++++ src/layouts/Layout.astro | 8 +------- src/pages/index.astro | 10 +++++++++- src/pages/v2/index.astro | 14 ++++++++++++++ 11 files changed, 92 insertions(+), 8 deletions(-) create mode 100644 src/components/v2/Button.astro create mode 100644 src/components/v2/ChatConfiguration.astro create mode 100644 src/components/v2/ConversationSidebarItem.astro create mode 100644 src/components/v2/Header.astro create mode 100644 src/components/v2/Main.astro create mode 100644 src/components/v2/Send.astro create mode 100644 src/components/v2/Settings.astro create mode 100644 src/components/v2/Sidebar.astro create mode 100644 src/pages/v2/index.astro diff --git a/src/components/v2/Button.astro b/src/components/v2/Button.astro new file mode 100644 index 000000000..8543c103b --- /dev/null +++ b/src/components/v2/Button.astro @@ -0,0 +1,10 @@ +--- +interface Props { + name: string; +} + +const props = Astro.props +--- + + { props.name } + \ No newline at end of file diff --git a/src/components/v2/ChatConfiguration.astro b/src/components/v2/ChatConfiguration.astro new file mode 100644 index 000000000..d2c76a86c --- /dev/null +++ b/src/components/v2/ChatConfiguration.astro @@ -0,0 +1,17 @@ +--- +import Button from './Button.astro' +--- + +
+
+
System Role
+ +
+
+
Temperature
+
+
+
+ +
+
\ No newline at end of file diff --git a/src/components/v2/ConversationSidebarItem.astro b/src/components/v2/ConversationSidebarItem.astro new file mode 100644 index 000000000..11ec29c4e --- /dev/null +++ b/src/components/v2/ConversationSidebarItem.astro @@ -0,0 +1,4 @@ +
+
+
Chat Name
+
\ No newline at end of file diff --git a/src/components/v2/Header.astro b/src/components/v2/Header.astro new file mode 100644 index 000000000..ccbb41bb3 --- /dev/null +++ b/src/components/v2/Header.astro @@ -0,0 +1,5 @@ +
+
+
ChatGPT Demo
+
+
diff --git a/src/components/v2/Main.astro b/src/components/v2/Main.astro new file mode 100644 index 000000000..7aa51cecb --- /dev/null +++ b/src/components/v2/Main.astro @@ -0,0 +1,14 @@ +--- +import Header from './Header.astro' +import ChatConfiguration from './ChatConfiguration.astro'; +import Send from './Send.astro' +--- + +
+
+
+ +
+ +
+
\ No newline at end of file diff --git a/src/components/v2/Send.astro b/src/components/v2/Send.astro new file mode 100644 index 000000000..1338fcf79 --- /dev/null +++ b/src/components/v2/Send.astro @@ -0,0 +1 @@ +
\ No newline at end of file diff --git a/src/components/v2/Settings.astro b/src/components/v2/Settings.astro new file mode 100644 index 000000000..a9ffb8336 --- /dev/null +++ b/src/components/v2/Settings.astro @@ -0,0 +1,5 @@ + \ No newline at end of file diff --git a/src/components/v2/Sidebar.astro b/src/components/v2/Sidebar.astro new file mode 100644 index 000000000..802a22812 --- /dev/null +++ b/src/components/v2/Sidebar.astro @@ -0,0 +1,12 @@ +--- +import ConversationSidebarItem from './ConversationSidebarItem.astro' +--- + + \ No newline at end of file diff --git a/src/layouts/Layout.astro b/src/layouts/Layout.astro index 3555e00cb..8c87929b7 100644 --- a/src/layouts/Layout.astro +++ b/src/layouts/Layout.astro @@ -38,18 +38,12 @@ const { title } = Astro.props; } html.dark { - --c-bg: #212129; + --c-bg: #212121; --c-fg: #ddddf0; --c-scroll: #333333; --c-scroll-hover: #555555; } - main { - max-width: 70ch; - margin: 0 auto; - padding: 6rem 2rem 4rem; - } - ::-webkit-scrollbar { width: 6px; height: 6px; diff --git a/src/pages/index.astro b/src/pages/index.astro index 2113e0270..3752ce175 100644 --- a/src/pages/index.astro +++ b/src/pages/index.astro @@ -10,7 +10,7 @@ import 'highlight.js/styles/atom-one-dark.css' --- -
+
@@ -38,3 +38,11 @@ async function checkCurrentAuth() { checkCurrentAuth() + + diff --git a/src/pages/v2/index.astro b/src/pages/v2/index.astro new file mode 100644 index 000000000..35c088326 --- /dev/null +++ b/src/pages/v2/index.astro @@ -0,0 +1,14 @@ +--- +import Layout from '@/layouts/Layout.astro' +import Main from '@/components/v2/Main.astro' +import Sidebar from '@/components/v2/Sidebar.astro'; +import Settings from '@/components/v2/Settings.astro'; +--- + + +
+ +
+ +
+ \ No newline at end of file From 7e6ecad283d6688dc8c4564f8b9fd987bd0fd477 Mon Sep 17 00:00:00 2001 From: ddiu8081 Date: Wed, 15 Mar 2023 03:03:32 +0800 Subject: [PATCH 002/151] chore: add `alpinejs`, `nanostores` --- astro.config.mjs | 7 ++--- package.json | 5 ++++ pnpm-lock.yaml | 67 ++++++++++++++++++++++++++++++++++++++++++++++++ 3 files changed, 76 insertions(+), 3 deletions(-) diff --git a/astro.config.mjs b/astro.config.mjs index 45053ef14..b19ab764f 100644 --- a/astro.config.mjs +++ b/astro.config.mjs @@ -1,11 +1,11 @@ import { defineConfig } from 'astro/config' import unocss from 'unocss/astro' import solidJs from '@astrojs/solid-js' +import alpinejs from '@astrojs/alpinejs' import vercelDisableBlocks from './plugins/vercelDisableBlocks' - import node from '@astrojs/node' import vercel from '@astrojs/vercel/edge' -import netlify from "@astrojs/netlify/edge-functions"; +import netlify from '@astrojs/netlify/edge-functions' const envAdapter = () => { if (process.env.OUTPUT == 'vercel') { @@ -23,7 +23,8 @@ const envAdapter = () => { export default defineConfig({ integrations: [ unocss(), - solidJs() + solidJs(), + alpinejs(), ], output: 'server', adapter: envAdapter(), diff --git a/package.json b/package.json index 2474c31dd..ca2dc3615 100644 --- a/package.json +++ b/package.json @@ -12,11 +12,15 @@ "astro": "astro" }, "dependencies": { + "@astrojs/alpinejs": "^0.2.1", "@astrojs/netlify": "2.0.0", "@astrojs/node": "^5.0.4", "@astrojs/solid-js": "^2.0.2", "@astrojs/vercel": "^3.1.3", + "@nanostores/solid": "^0.3.2", + "@types/alpinejs": "^3.0.0", "@unocss/reset": "^0.50.1", + "alpinejs": "^3.0.0", "astro": "^2.0.15", "eventsource-parser": "^0.1.0", "highlight.js": "^11.7.0", @@ -25,6 +29,7 @@ "markdown-it": "^13.0.1", "markdown-it-highlightjs": "^4.0.1", "markdown-it-katex": "^2.0.3", + "nanostores": "^0.7.4", "solid-js": "1.6.12", "solidjs-use": "^1.2.0", "undici": "^5.20.0" diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 2dc70226f..74b8cc667 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -1,16 +1,20 @@ lockfileVersion: 5.4 specifiers: + '@astrojs/alpinejs': ^0.2.1 '@astrojs/netlify': 2.0.0 '@astrojs/node': ^5.0.4 '@astrojs/solid-js': ^2.0.2 '@astrojs/vercel': ^3.1.3 '@iconify-json/carbon': ^1.1.16 + '@nanostores/solid': ^0.3.2 + '@types/alpinejs': ^3.0.0 '@types/markdown-it': ^12.2.3 '@unocss/preset-attributify': ^0.50.1 '@unocss/preset-icons': ^0.50.4 '@unocss/preset-typography': ^0.50.3 '@unocss/reset': ^0.50.1 + alpinejs: ^3.0.0 astro: ^2.0.15 eventsource-parser: ^0.1.0 highlight.js: ^11.7.0 @@ -19,6 +23,7 @@ specifiers: markdown-it: ^13.0.1 markdown-it-highlightjs: ^4.0.1 markdown-it-katex: ^2.0.3 + nanostores: ^0.7.4 punycode: ^2.3.0 solid-js: 1.6.12 solidjs-use: ^1.2.0 @@ -26,11 +31,15 @@ specifiers: unocss: ^0.50.1 dependencies: + '@astrojs/alpinejs': 0.2.1_4gnj3u2eydpfn7uqni2faidxoa '@astrojs/netlify': 2.0.0_astro@2.1.2 '@astrojs/node': 5.1.0_astro@2.1.2 '@astrojs/solid-js': 2.1.0_lbokc6jb22vuw6gh6lx7sc6b6a '@astrojs/vercel': 3.2.0_astro@2.1.2+react@18.2.0 + '@nanostores/solid': 0.3.2_mjx2sbwkkjho6i5tlo3iadoqvq + '@types/alpinejs': 3.7.1 '@unocss/reset': 0.50.4 + alpinejs: 3.12.0 astro: 2.1.2 eventsource-parser: 0.1.0 highlight.js: 11.7.0 @@ -39,6 +48,7 @@ dependencies: markdown-it: 13.0.1 markdown-it-highlightjs: 4.0.1 markdown-it-katex: 2.0.3 + nanostores: 0.7.4 solid-js: 1.6.12 solidjs-use: 1.2.0 undici: 5.20.0 @@ -76,6 +86,16 @@ packages: resolution: {integrity: sha512-vy9fM3pIxZmX07dL+VX1aZe7ynZ+YyB0jY+jE6r3hOK6GNY2t6W8rzpFC4tgpbXUYABkFQwgJq2XYXlxbXAI0g==} dev: true + /@astrojs/alpinejs/0.2.1_4gnj3u2eydpfn7uqni2faidxoa: + resolution: {integrity: sha512-lIwCw2XUB/3HAstWpqGvUnSH4BnFwXxkSxq+jpkPw0U1mMw4JP4RauGUbD1F2acZXun7T68alJydAF1dLLCv4A==} + peerDependencies: + '@types/alpinejs': ^3.0.0 + alpinejs: ^3.0.0 + dependencies: + '@types/alpinejs': 3.7.1 + alpinejs: 3.12.0 + dev: false + /@astrojs/compiler/0.31.4: resolution: {integrity: sha512-6bBFeDTtPOn4jZaiD3p0f05MEGQL9pw2Zbfj546oFETNmjJFWO3nzHz6/m+P53calknCvyVzZ5YhoBLIvzn5iw==} dev: false @@ -729,6 +749,16 @@ packages: - supports-color dev: false + /@nanostores/solid/0.3.2_mjx2sbwkkjho6i5tlo3iadoqvq: + resolution: {integrity: sha512-OH4m81Bls8NCH2ANzqEujPvzzzLlunm0e6Vpqy9mMgBYzOcqxWr3SrZgIVA7KhMsjftINwcpMN7/FKo2MQa1aQ==} + peerDependencies: + nanostores: ^0.7.0 + solid-js: '>=1.4.0' + dependencies: + nanostores: 0.7.4 + solid-js: 1.6.12 + dev: false + /@nodelib/fs.scandir/2.1.5: resolution: {integrity: sha512-vq24Bq3ym5HEQm2NKCr3yXDwjc7vTsEThRDnkp2DK9p1uqLR+DHurm/NOTo0KG7HYHU7eppKZj3MyqYuMBf62g==} engines: {node: '>= 8'} @@ -795,6 +825,12 @@ packages: resolution: {integrity: sha512-ZmIThxUeX+D40ck0bviDEhta2WSpJd2AQYFF+rjO8zQmgySifeeiEc0Kn/Sp1BMHbLMcLboPYdOnT+6E1E9OLg==} dev: false + /@types/alpinejs/3.7.1: + resolution: {integrity: sha512-gzwyuHXH/meGQQhurMGWlZgMQxe18lMOoSPd7X6CvGoDelHte9EsU7SpTIoRu8yYir0tbHDeaSMdX9LeQz/QtA==} + dependencies: + '@vue/reactivity': 3.2.47 + dev: false + /@types/babel__core/7.20.0: resolution: {integrity: sha512-+n8dL/9GWblDO0iU6eZAwEIJVr5DWigtle+Q6HLOrh/pdbXOhOtqzq8VPPE2zvNJzSKY4vH/z3iT3tn0A3ypiQ==} dependencies: @@ -1112,6 +1148,26 @@ packages: resolution: {integrity: sha512-ukOMWnCg1tCvT7WnDfsUKQOFDQGsyR5tNgRpwmqi+5/vzU3ghdDXzvIM4IOPdSb3OeSsBNvmSL8nxIVOqi2WXA==} dev: false + /@vue/reactivity/3.1.5: + resolution: {integrity: sha512-1tdfLmNjWG6t/CsPldh+foumYFo3cpyCHgBYQ34ylaMsJ+SNHQ1kApMIa8jN+i593zQuaw3AdWH0nJTARzCFhg==} + dependencies: + '@vue/shared': 3.1.5 + dev: false + + /@vue/reactivity/3.2.47: + resolution: {integrity: sha512-7khqQ/75oyyg+N/e+iwV6lpy1f5wq759NdlS1fpAhFXa8VeAIKGgk2E/C4VF59lx5b+Ezs5fpp/5WsRYXQiKxQ==} + dependencies: + '@vue/shared': 3.2.47 + dev: false + + /@vue/shared/3.1.5: + resolution: {integrity: sha512-oJ4F3TnvpXaQwZJNF3ZK+kLPHKarDmJjJ6jyzVNDKH9md1dptjC7lWR//jrGuLdek/U6iltWxqAnYOu8gCiOvA==} + dev: false + + /@vue/shared/3.2.47: + resolution: {integrity: sha512-BHGyyGN3Q97EZx0taMQ+OLNuZcW3d37ZEVmEAyeoA9ERdGvm9Irc/0Fua8SNyOtV1w6BS4q25wbMzJujO9HIfQ==} + dev: false + /abbrev/1.1.1: resolution: {integrity: sha512-nne9/IiQ/hzIhY6pdDnbBtz7DjPTKrY00P/zvPSm5pOFkl6xuGrGnXn/VtTNNfNtAfZ9/1RtehkszU9qcTii0Q==} dev: false @@ -1131,6 +1187,12 @@ packages: - supports-color dev: false + /alpinejs/3.12.0: + resolution: {integrity: sha512-YENcRBA9dlwR8PsZNFMTHbmdlTNwd1BkCeivPvOzzCKHas6AfwNRsDK9UEFmE5dXTMEZjnnpCTxV8vkdpWiOCw==} + dependencies: + '@vue/reactivity': 3.1.5 + dev: false + /ansi-align/3.0.1: resolution: {integrity: sha512-IOfwwBF5iczOjp/WeY4YxyjqAFMQoZufdQWDd19SEExbVLNXqvpzSJ/M7Za4/sCPmQ0+GRquoA7bGcINcxew6w==} dependencies: @@ -3111,6 +3173,11 @@ packages: engines: {node: ^10 || ^12 || ^13.7 || ^14 || >=15.0.1} hasBin: true + /nanostores/0.7.4: + resolution: {integrity: sha512-MBeUVt7NBcXqh7AGT+KSr3O0X/995CZsvcP2QEMP+PXFwb07qv3Vjyq+EX0yS8f12Vv3Tn2g/BvK/OZoMhJlOQ==} + engines: {node: ^14.0.0 || ^16.0.0 || >=18.0.0} + dev: false + /nlcst-to-string/3.1.1: resolution: {integrity: sha512-63mVyqaqt0cmn2VcI2aH6kxe1rLAmSROqHMA0i4qqg1tidkfExgpb0FGMikMCn86mw5dFtBtEANfmSSK7TjNHw==} dependencies: From bc914b48f1ee31bcd2a421875592f2fa44189291 Mon Sep 17 00:00:00 2001 From: ddiu8081 Date: Wed, 15 Mar 2023 21:48:19 +0800 Subject: [PATCH 003/151] chore: add store for ui --- src/components/v2/Header.astro | 11 ++++++++++- src/components/v2/Settings.astro | 2 +- src/components/v2/Sidebar.astro | 2 +- src/strores/ui.ts | 10 ++++++++++ 4 files changed, 22 insertions(+), 3 deletions(-) create mode 100644 src/strores/ui.ts diff --git a/src/components/v2/Header.astro b/src/components/v2/Header.astro index ccbb41bb3..b733a50dd 100644 --- a/src/components/v2/Header.astro +++ b/src/components/v2/Header.astro @@ -1,5 +1,14 @@
-
+
ChatGPT Demo
+ + diff --git a/src/components/v2/Settings.astro b/src/components/v2/Settings.astro index a9ffb8336..e10da519e 100644 --- a/src/components/v2/Settings.astro +++ b/src/components/v2/Settings.astro @@ -1,4 +1,4 @@ -
\ No newline at end of file diff --git a/src/components/v2/Send.astro b/src/components/v2/Send.astro deleted file mode 100644 index 1338fcf79..000000000 --- a/src/components/v2/Send.astro +++ /dev/null @@ -1 +0,0 @@ -
\ No newline at end of file diff --git a/src/components/v2/Send.tsx b/src/components/v2/Send.tsx new file mode 100644 index 000000000..74471871f --- /dev/null +++ b/src/components/v2/Send.tsx @@ -0,0 +1,21 @@ +import { Show } from 'solid-js' +import { useStore } from '@nanostores/solid' +import { inputPrompt } from '@/strores/ui' + +const EmptyState = () => ( +
+
Enter Something...
+
+
+) + +export default () => { + const $inputPrompt = useStore(inputPrompt) + return ( + <> + + + + + ) +} diff --git a/src/strores/ui.ts b/src/strores/ui.ts index 34b2e84fc..fa9fae8ef 100644 --- a/src/strores/ui.ts +++ b/src/strores/ui.ts @@ -1,10 +1,5 @@ -import { atom, action } from 'nanostores' +import { atom } from 'nanostores' export const sidebar = atom(false) -export const toggleSidebar = action(sidebar, 'toggleSidebar', store => { - store.set(!store.get()) -}) -// export function addUser(user: User) { -// users.set([...users.get(), user]); -// } \ No newline at end of file +export const inputPrompt = atom('') From bd24e81840d0a51e5eb362138036fccb08700992 Mon Sep 17 00:00:00 2001 From: ddiu8081 Date: Thu, 16 Mar 2023 14:50:57 +0800 Subject: [PATCH 006/151] fix(ui): set site height to `100svh` --- src/pages/v2/index.astro | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/pages/v2/index.astro b/src/pages/v2/index.astro index 7ee2ea366..9f2798e83 100644 --- a/src/pages/v2/index.astro +++ b/src/pages/v2/index.astro @@ -7,10 +7,10 @@ import ModelsLayer from '@/components/v2/ModelsLayer' --- -
+
- \ No newline at end of file + From 1515c53db8abc777b6b5d1569b50a6a4283df514 Mon Sep 17 00:00:00 2001 From: ddiu8081 Date: Thu, 16 Mar 2023 20:47:36 +0800 Subject: [PATCH 007/151] feat(ui): use unocss to detect dark mode --- src/components/v2/Button.astro | 2 +- src/components/v2/ChatConfiguration.astro | 4 +-- .../v2/ConversationSidebarItem.astro | 2 +- src/components/v2/Header.astro | 2 +- src/components/v2/Model.tsx | 2 +- src/components/v2/Send.tsx | 2 +- src/components/v2/Settings.astro | 4 +-- src/components/v2/Sidebar.astro | 4 +-- src/layouts/Layout.astro | 32 ++----------------- unocss.config.ts | 7 ++-- 10 files changed, 19 insertions(+), 42 deletions(-) diff --git a/src/components/v2/Button.astro b/src/components/v2/Button.astro index 5c4bf7da2..81e36c38a 100644 --- a/src/components/v2/Button.astro +++ b/src/components/v2/Button.astro @@ -14,7 +14,7 @@ const props = Astro.props class:list={[ 'inline-flex items-center gap-1 rounded-md cursor-pointer', (props.icon && !props.text) ? 'p-2' : 'px-2 py-1', - (!props.type || props.type === 'normal') && 'border hover:bg-darker', + (!props.type || props.type === 'normal') && 'border border-base hover:bg-darker', props.class ?? '', ]} > diff --git a/src/components/v2/ChatConfiguration.astro b/src/components/v2/ChatConfiguration.astro index 4cd48da2b..6605cb911 100644 --- a/src/components/v2/ChatConfiguration.astro +++ b/src/components/v2/ChatConfiguration.astro @@ -2,10 +2,10 @@ import Button from './Button.astro' --- -
+
System Role
- +
Temperature
diff --git a/src/components/v2/ConversationSidebarItem.astro b/src/components/v2/ConversationSidebarItem.astro index 11ec29c4e..f4510f471 100644 --- a/src/components/v2/ConversationSidebarItem.astro +++ b/src/components/v2/ConversationSidebarItem.astro @@ -1,4 +1,4 @@ -
+
Chat Name
\ No newline at end of file diff --git a/src/components/v2/Header.astro b/src/components/v2/Header.astro index 679def371..164287a2b 100644 --- a/src/components/v2/Header.astro +++ b/src/components/v2/Header.astro @@ -1,7 +1,7 @@ --- import Button from './Button.astro' --- -
+
-
\ No newline at end of file +
diff --git a/src/components/v2/ConversationSidebarItem.astro b/src/components/v2/ConversationSidebarItem.astro index f4510f471..117bffa7f 100644 --- a/src/components/v2/ConversationSidebarItem.astro +++ b/src/components/v2/ConversationSidebarItem.astro @@ -1,4 +1,4 @@
Chat Name
-
\ No newline at end of file +
diff --git a/src/components/v2/Main.astro b/src/components/v2/Main.astro index dac3667c3..a1f0cdd5a 100644 --- a/src/components/v2/Main.astro +++ b/src/components/v2/Main.astro @@ -1,6 +1,5 @@ --- import Header from './Header.astro' -import ChatConfiguration from './ChatConfiguration.astro'; import Send from './Send' import SingleChat from './chat/SingleChat' @@ -15,4 +14,4 @@ import SingleChat from './chat/SingleChat'
- \ No newline at end of file + diff --git a/src/components/v2/Modal.tsx b/src/components/v2/Modal.tsx index 80bc5e0a1..d6aa866ee 100644 --- a/src/components/v2/Modal.tsx +++ b/src/components/v2/Modal.tsx @@ -1,6 +1,6 @@ +import { useStore } from '@nanostores/solid' import type { JSXElement } from 'solid-js' import type { WritableAtom } from 'nanostores' -import { useStore } from '@nanostores/solid' interface Props { bindValue: WritableAtom @@ -26,10 +26,10 @@ export default (props: Props) => { }[props.direction]) return ( -
+
props.bindValue.set(false)} />
diff --git a/src/components/v2/ModalsLayer.tsx b/src/components/v2/ModalsLayer.tsx index ec3e33328..9ee173637 100644 --- a/src/components/v2/ModalsLayer.tsx +++ b/src/components/v2/ModalsLayer.tsx @@ -7,6 +7,9 @@ export default () => {
+ {/* +
+ */} ) } diff --git a/src/components/v2/Send.tsx b/src/components/v2/Send.tsx index 17f2a0730..6a91b8235 100644 --- a/src/components/v2/Send.tsx +++ b/src/components/v2/Send.tsx @@ -1,4 +1,4 @@ -import { createSignal, Show } from 'solid-js' +import { Show, createSignal } from 'solid-js' import { useStore } from '@nanostores/solid' import { inputPrompt } from '@/strores/ui' import { prompt } from '@/strores/prompt' @@ -8,13 +8,12 @@ export default () => { const $inputPrompt = useStore(inputPrompt) const [focusState, setFocusState] = createSignal(false) const isEditing = () => $inputPrompt() || focusState() - + const classTest = () => { - if (isEditing()) { + if (isEditing()) return 'h-40' - } else { + else return 'h-14' - } } const EmptyState = () => ( @@ -23,7 +22,7 @@ export default () => {
) - + const EditState = () => ( <> + />
Settings
- \ No newline at end of file + diff --git a/src/components/v2/Sidebar.astro b/src/components/v2/Sidebar.astro index ea10e2b4a..91eef31bc 100644 --- a/src/components/v2/Sidebar.astro +++ b/src/components/v2/Sidebar.astro @@ -11,4 +11,4 @@ import ConversationSidebarItem from './ConversationSidebarItem.astro' ))}
- \ No newline at end of file + diff --git a/src/components/v2/instance/SingleChatInstance.tsx b/src/components/v2/instance/SingleChatInstance.tsx index 7dfaa3df4..025e99381 100644 --- a/src/components/v2/instance/SingleChatInstance.tsx +++ b/src/components/v2/instance/SingleChatInstance.tsx @@ -1,19 +1,19 @@ -import { Accessor, createSignal } from 'solid-js' -import type { WritableAtom } from 'nanostores' +import { createSignal } from 'solid-js' import { useStore } from '@nanostores/solid' import { prompt, response } from '@/strores/prompt' import { generateSignature } from '@/utils/auth' +import type { WritableAtom } from 'nanostores' -const fetchResponse = async (prompt: string, controller: AbortController, responseAtom: WritableAtom) => { +const fetchResponse = async(prompt: string, controller: AbortController, responseAtom: WritableAtom) => { try { const timestamp = Date.now() const response = await fetch('http://localhost:3000/api/generate', { method: 'POST', body: JSON.stringify({ - messages: { + messages: [{ role: 'user', content: 'prompt', - }, + }], time: timestamp, pass: '123', sign: await generateSignature({ @@ -23,13 +23,13 @@ const fetchResponse = async (prompt: string, controller: AbortController, respon }), signal: controller.signal, }) - if (!response.ok) { + if (!response.ok) throw new Error(response.statusText) - } + const data = response.body - if (!data) { + if (!data) throw new Error('No data') - } + const reader = data.getReader() const decoder = new TextDecoder('utf-8') let done = false @@ -37,19 +37,17 @@ const fetchResponse = async (prompt: string, controller: AbortController, respon while (!done) { const { value, done: readerDone } = await reader.read() if (value) { - let char = decoder.decode(value) - if (char === '\n' && responseAtom.get().endsWith('\n')) { + const char = decoder.decode(value) + if (char === '\n' && responseAtom.get().endsWith('\n')) continue - } - if (char) { + + if (char) responseAtom.set(responseAtom.get() + char) - } } done = readerDone } } catch (e) { console.error(e) - return } } @@ -58,7 +56,7 @@ export default () => { const [controller, setController] = createSignal(null) setController(new AbortController()) - // fetchResponse($prompt(), controller(), response) + fetchResponse($prompt(), controller(), response) return null } diff --git a/src/layouts/Layout.astro b/src/layouts/Layout.astro index 32355f50a..6a1559a93 100644 --- a/src/layouts/Layout.astro +++ b/src/layouts/Layout.astro @@ -25,47 +25,7 @@ const { title } = Astro.props; : null } - + - - From 449b127810f439214173ed5d66528ee07d508305 Mon Sep 17 00:00:00 2001 From: ddiu8081 Date: Sat, 18 Mar 2023 20:56:08 +0800 Subject: [PATCH 013/151] chore: rename dir to stores --- src/components/v2/ModalsLayer.tsx | 2 +- src/components/v2/Send.tsx | 4 ++-- src/components/v2/chat/SingleChat.tsx | 2 +- src/components/v2/instance/SingleChatInstance.tsx | 2 +- src/stores/chat.ts | 3 +++ src/{strores => stores}/prompt.ts | 0 src/{strores => stores}/ui.ts | 0 7 files changed, 8 insertions(+), 5 deletions(-) create mode 100644 src/stores/chat.ts rename src/{strores => stores}/prompt.ts (100%) rename src/{strores => stores}/ui.ts (100%) diff --git a/src/components/v2/ModalsLayer.tsx b/src/components/v2/ModalsLayer.tsx index 9ee173637..0d52ebec0 100644 --- a/src/components/v2/ModalsLayer.tsx +++ b/src/components/v2/ModalsLayer.tsx @@ -1,4 +1,4 @@ -import { sidebar } from '@/strores/ui' +import { sidebar } from '@/stores/ui' import Modal from './Modal' export default () => { diff --git a/src/components/v2/Send.tsx b/src/components/v2/Send.tsx index 6a91b8235..75b78ec21 100644 --- a/src/components/v2/Send.tsx +++ b/src/components/v2/Send.tsx @@ -1,7 +1,7 @@ import { Show, createSignal } from 'solid-js' import { useStore } from '@nanostores/solid' -import { inputPrompt } from '@/strores/ui' -import { prompt } from '@/strores/prompt' +import { inputPrompt } from '@/stores/ui' +import { prompt } from '@/stores/prompt' export default () => { let inputRef: HTMLTextAreaElement diff --git a/src/components/v2/chat/SingleChat.tsx b/src/components/v2/chat/SingleChat.tsx index 4decad882..e97ca81b0 100644 --- a/src/components/v2/chat/SingleChat.tsx +++ b/src/components/v2/chat/SingleChat.tsx @@ -1,5 +1,5 @@ import { useStore } from '@nanostores/solid' -import { prompt, response } from '@/strores/prompt' +import { prompt, response } from '@/stores/prompt' import SingleChatInstance from '../instance/SingleChatInstance' export default () => { diff --git a/src/components/v2/instance/SingleChatInstance.tsx b/src/components/v2/instance/SingleChatInstance.tsx index 025e99381..79c45997f 100644 --- a/src/components/v2/instance/SingleChatInstance.tsx +++ b/src/components/v2/instance/SingleChatInstance.tsx @@ -1,6 +1,6 @@ import { createSignal } from 'solid-js' import { useStore } from '@nanostores/solid' -import { prompt, response } from '@/strores/prompt' +import { prompt, response } from '@/stores/prompt' import { generateSignature } from '@/utils/auth' import type { WritableAtom } from 'nanostores' diff --git a/src/stores/chat.ts b/src/stores/chat.ts new file mode 100644 index 000000000..5ac4c70e3 --- /dev/null +++ b/src/stores/chat.ts @@ -0,0 +1,3 @@ +import { atom } from 'nanostores' + +export const chat = atom('') diff --git a/src/strores/prompt.ts b/src/stores/prompt.ts similarity index 100% rename from src/strores/prompt.ts rename to src/stores/prompt.ts diff --git a/src/strores/ui.ts b/src/stores/ui.ts similarity index 100% rename from src/strores/ui.ts rename to src/stores/ui.ts From bd2e771b0aaf41cb1105d9defaadba68a18dea51 Mon Sep 17 00:00:00 2001 From: ddiu8081 Date: Sat, 18 Mar 2023 22:34:56 +0800 Subject: [PATCH 014/151] feat: conversations sidebar --- src/components/v2/ConversationSidebar.tsx | 26 +++++++++++++++++ src/components/v2/ConversationSidebarAdd.tsx | 23 +++++++++++++++ .../v2/ConversationSidebarItem.astro | 4 --- src/components/v2/ConversationSidebarItem.tsx | 29 +++++++++++++++++++ src/components/v2/Header.astro | 12 ++++++-- src/components/v2/Main.astro | 4 +-- src/components/v2/ModalsLayer.tsx | 21 ++++++++++---- src/components/v2/Send.tsx | 2 +- src/components/v2/Settings.astro | 5 ---- src/components/v2/SettingsSidebar.tsx | 10 +++++++ src/components/v2/Sidebar.astro | 14 --------- src/components/v2/Sidebar.tsx | 26 +++++++++++++++++ src/components/v2/chat/Chat.tsx | 14 +++++++++ src/components/v2/instance/ChatInstance.tsx | 0 .../v2/instance/SingleChatInstance.tsx | 2 +- src/pages/v2/index.astro | 13 ++++++--- src/stores/chat.ts | 20 ++++++++++++- src/stores/ui.ts | 3 +- src/types.ts | 2 ++ unocss.config.ts | 4 +++ 20 files changed, 193 insertions(+), 41 deletions(-) create mode 100644 src/components/v2/ConversationSidebar.tsx create mode 100644 src/components/v2/ConversationSidebarAdd.tsx delete mode 100644 src/components/v2/ConversationSidebarItem.astro create mode 100644 src/components/v2/ConversationSidebarItem.tsx delete mode 100644 src/components/v2/Settings.astro create mode 100644 src/components/v2/SettingsSidebar.tsx delete mode 100644 src/components/v2/Sidebar.astro create mode 100644 src/components/v2/Sidebar.tsx create mode 100644 src/components/v2/chat/Chat.tsx create mode 100644 src/components/v2/instance/ChatInstance.tsx diff --git a/src/components/v2/ConversationSidebar.tsx b/src/components/v2/ConversationSidebar.tsx new file mode 100644 index 000000000..3e80ebd2b --- /dev/null +++ b/src/components/v2/ConversationSidebar.tsx @@ -0,0 +1,26 @@ +import { For } from 'solid-js' +import { useStore } from '@nanostores/solid' +import { chatList, currentChatId } from '@/stores/chat' +import ConversationSidebarItem from './ConversationSidebarItem' +import ConversationSidebarAdd from './ConversationSidebarAdd' + +export default () => { + const $chatList = useStore(chatList) + const $currentChatId = useStore(currentChatId) + + return ( + <> +
+ Conversations [{ $currentChatId() }] +
+
+ + {item => ( + + )} + + +
+ + ) +} diff --git a/src/components/v2/ConversationSidebarAdd.tsx b/src/components/v2/ConversationSidebarAdd.tsx new file mode 100644 index 000000000..9a7b3779a --- /dev/null +++ b/src/components/v2/ConversationSidebarAdd.tsx @@ -0,0 +1,23 @@ +import { chatList } from '@/stores/chat' + +export default () => { + const handleAdd = () => { + chatList.set([...chatList.get(), { + id: `id_${Date.now()}`, + type: 'single', + name: 'Test New', + avatar: '', + messages: [], + }]) + } + + return ( +
+
+
Add
+
+ ) +} diff --git a/src/components/v2/ConversationSidebarItem.astro b/src/components/v2/ConversationSidebarItem.astro deleted file mode 100644 index 117bffa7f..000000000 --- a/src/components/v2/ConversationSidebarItem.astro +++ /dev/null @@ -1,4 +0,0 @@ -
-
-
Chat Name
-
diff --git a/src/components/v2/ConversationSidebarItem.tsx b/src/components/v2/ConversationSidebarItem.tsx new file mode 100644 index 000000000..ae85e285e --- /dev/null +++ b/src/components/v2/ConversationSidebarItem.tsx @@ -0,0 +1,29 @@ +import { useStore } from '@nanostores/solid' +import { currentChatId } from '@/stores/chat' +import type { ChatInstance } from '@/stores/chat' + +interface Props { + instance: ChatInstance +} + +export default ({ instance }: Props) => { + const $currentChatId = useStore(currentChatId) + + const handleClick = () => { + currentChatId.set(instance.id) + } + const highlightClass = () => $currentChatId() === instance.id ? 'border-l-emerald-500' : 'border-l-transparent' + + return ( +
+
+
{ instance.name }
+
+ ) +} diff --git a/src/components/v2/Header.astro b/src/components/v2/Header.astro index 797dddc20..6714b3dd9 100644 --- a/src/components/v2/Header.astro +++ b/src/components/v2/Header.astro @@ -19,10 +19,18 @@ import Button from './Button.astro' diff --git a/src/components/v2/Main.astro b/src/components/v2/Main.astro index a1f0cdd5a..2ac56d14a 100644 --- a/src/components/v2/Main.astro +++ b/src/components/v2/Main.astro @@ -2,7 +2,7 @@ import Header from './Header.astro' import Send from './Send' -import SingleChat from './chat/SingleChat' +import Chat from './chat/Chat' ---
@@ -10,7 +10,7 @@ import SingleChat from './chat/SingleChat'
- +
diff --git a/src/components/v2/ModalsLayer.tsx b/src/components/v2/ModalsLayer.tsx index 0d52ebec0..f3966bd7a 100644 --- a/src/components/v2/ModalsLayer.tsx +++ b/src/components/v2/ModalsLayer.tsx @@ -1,15 +1,24 @@ -import { sidebar } from '@/stores/ui' +import { + showConversationSidebar, + showSettingsSidebar, +} from '@/stores/ui' +import ConversationSidebar from '@/components/v2/ConversationSidebar' +import SettingsSidebar from '@/components/v2/SettingsSidebar' import Modal from './Modal' export default () => { return ( <> - -
+ +
+ +
+ + +
+ +
- {/* -
- */} ) } diff --git a/src/components/v2/Send.tsx b/src/components/v2/Send.tsx index 75b78ec21..9cc66e79a 100644 --- a/src/components/v2/Send.tsx +++ b/src/components/v2/Send.tsx @@ -17,7 +17,7 @@ export default () => { } const EmptyState = () => ( -
{ setFocusState(true) }} class="px-6 h-full flex flex-row items-center gap-2 transition-colors cursor-pointer hover:bg-darker"> +
{ setFocusState(true) }} class="px-6 h-full flex flex-row items-center gap-2 hv-base">
Enter Something...
diff --git a/src/components/v2/Settings.astro b/src/components/v2/Settings.astro deleted file mode 100644 index a5934ee6a..000000000 --- a/src/components/v2/Settings.astro +++ /dev/null @@ -1,5 +0,0 @@ - diff --git a/src/components/v2/SettingsSidebar.tsx b/src/components/v2/SettingsSidebar.tsx new file mode 100644 index 000000000..84dd54fad --- /dev/null +++ b/src/components/v2/SettingsSidebar.tsx @@ -0,0 +1,10 @@ +export default () => { + return ( + <> +
+ Settings +
+ {/*
*/} + + ) +} diff --git a/src/components/v2/Sidebar.astro b/src/components/v2/Sidebar.astro deleted file mode 100644 index 91eef31bc..000000000 --- a/src/components/v2/Sidebar.astro +++ /dev/null @@ -1,14 +0,0 @@ ---- -import ConversationSidebarItem from './ConversationSidebarItem.astro' ---- - - diff --git a/src/components/v2/Sidebar.tsx b/src/components/v2/Sidebar.tsx new file mode 100644 index 000000000..45e60703f --- /dev/null +++ b/src/components/v2/Sidebar.tsx @@ -0,0 +1,26 @@ +import type { JSXElement } from 'solid-js' + +interface Props { + direction: 'left' | 'right' + class?: string + children: JSXElement +} + +export default (props: Props) => { + const containerBaseClass = { + left: 'w-[300px] h-screen border-r', + right: 'w-[300px] h-screen border-l', + }[props.direction] + + return ( + + ) +} diff --git a/src/components/v2/chat/Chat.tsx b/src/components/v2/chat/Chat.tsx new file mode 100644 index 000000000..7fc02518e --- /dev/null +++ b/src/components/v2/chat/Chat.tsx @@ -0,0 +1,14 @@ +import { useStore } from '@nanostores/solid' +import { currentChat } from '@/stores/chat' + +import SingleChat from '../chat/SingleChat' + +export default () => { + const $currentChat = useStore(currentChat) + const chatType = () => $currentChat()?.type + return ( + <> + { chatType() === 'single' && } + + ) +} diff --git a/src/components/v2/instance/ChatInstance.tsx b/src/components/v2/instance/ChatInstance.tsx new file mode 100644 index 000000000..e69de29bb diff --git a/src/components/v2/instance/SingleChatInstance.tsx b/src/components/v2/instance/SingleChatInstance.tsx index 79c45997f..9463598d5 100644 --- a/src/components/v2/instance/SingleChatInstance.tsx +++ b/src/components/v2/instance/SingleChatInstance.tsx @@ -56,7 +56,7 @@ export default () => { const [controller, setController] = createSignal(null) setController(new AbortController()) - fetchResponse($prompt(), controller(), response) + // fetchResponse($prompt(), controller(), response) return null } diff --git a/src/pages/v2/index.astro b/src/pages/v2/index.astro index 725d9d68f..7e1677e68 100644 --- a/src/pages/v2/index.astro +++ b/src/pages/v2/index.astro @@ -1,16 +1,21 @@ --- import Layout from '@/layouts/Layout.astro' import Main from '@/components/v2/Main.astro' -import Sidebar from '@/components/v2/Sidebar.astro' -import Settings from '@/components/v2/Settings.astro' +import ConversationSidebar from '@/components/v2/ConversationSidebar' +import Settings from '@/components/v2/SettingsSidebar' import ModalsLayer from '@/components/v2/ModalsLayer' +import Sidebar from '@/components/v2/Sidebar' ---
- +
- +
diff --git a/src/stores/chat.ts b/src/stores/chat.ts index 5ac4c70e3..ae1bc1237 100644 --- a/src/stores/chat.ts +++ b/src/stores/chat.ts @@ -1,3 +1,21 @@ import { atom } from 'nanostores' +import type { ChatMessage, ChatType } from '@/types' -export const chat = atom('') +export interface ChatInstance { + id: string + type: ChatType + name: string + avatar: string + messages: ChatMessage[] +} + +export const chatList = atom([ + { + id: 'test', + type: 'single', + name: 'Test', + avatar: '', + messages: [], + }, +]) +export const currentChatId = atom('test') diff --git a/src/stores/ui.ts b/src/stores/ui.ts index fa9fae8ef..8dcbb5632 100644 --- a/src/stores/ui.ts +++ b/src/stores/ui.ts @@ -1,5 +1,6 @@ import { atom } from 'nanostores' -export const sidebar = atom(false) +export const showConversationSidebar = atom(false) +export const showSettingsSidebar = atom(false) export const inputPrompt = atom('') diff --git a/src/types.ts b/src/types.ts index 0d3d63e72..06ed8333f 100644 --- a/src/types.ts +++ b/src/types.ts @@ -7,3 +7,5 @@ export interface ErrorMessage { code: string message: string } + +export type ChatType = 'single' | 'continuous' | 'image' diff --git a/unocss.config.ts b/unocss.config.ts index 0ce0183da..9435047a6 100644 --- a/unocss.config.ts +++ b/unocss.config.ts @@ -28,8 +28,12 @@ export default defineConfig({ 'bg-base': 'bg-light-100 dark:bg-dark-400', 'bg-darker-100': 'bg-light-400 dark:bg-dark-300', 'bg-darker': 'bg-light-600 dark:bg-dark-200', + // 'bg-accent': 'bg-violet/50', 'border-base': 'border-light-900 dark:border-dark-100', 'placeholder-base': 'placeholder:op-50 dark:placeholder:op-30', + 'hv-base': 'transition-colors cursor-pointer hover:bg-light-600 hover:dark:bg-dark-200', + 'border-b-base': 'border-b-light-900 dark:border-b-dark-100', + 'fg-base': 'text-dark dark:text-light', 'fc': 'flex justify-center', 'fi': 'flex items-center', From 0b696d5c1f27bfd1ae56d2872d3c2b8bad2c9c3c Mon Sep 17 00:00:00 2001 From: ddiu8081 Date: Sat, 18 Mar 2023 23:28:24 +0800 Subject: [PATCH 015/151] refactor: chatList manage logics --- src/components/v2/ConversationSidebar.tsx | 7 ++-- src/components/v2/ConversationSidebarAdd.tsx | 14 ++++--- src/components/v2/ConversationSidebarItem.tsx | 34 +++++++++++----- src/components/v2/Main.astro | 2 +- src/components/v2/Send.tsx | 2 +- src/components/v2/chat/Chat.tsx | 12 ++++-- src/stores/chat.ts | 39 +++++++++++++++++-- unocss.config.ts | 4 +- 8 files changed, 84 insertions(+), 30 deletions(-) diff --git a/src/components/v2/ConversationSidebar.tsx b/src/components/v2/ConversationSidebar.tsx index 3e80ebd2b..02fc2d7d3 100644 --- a/src/components/v2/ConversationSidebar.tsx +++ b/src/components/v2/ConversationSidebar.tsx @@ -1,17 +1,16 @@ import { For } from 'solid-js' import { useStore } from '@nanostores/solid' -import { chatList, currentChatId } from '@/stores/chat' +import { chatListWithoutMessages } from '@/stores/chat' import ConversationSidebarItem from './ConversationSidebarItem' import ConversationSidebarAdd from './ConversationSidebarAdd' export default () => { - const $chatList = useStore(chatList) - const $currentChatId = useStore(currentChatId) + const $chatList = useStore(chatListWithoutMessages) return ( <>
- Conversations [{ $currentChatId() }] + Conversations
diff --git a/src/components/v2/ConversationSidebarAdd.tsx b/src/components/v2/ConversationSidebarAdd.tsx index 9a7b3779a..838c62807 100644 --- a/src/components/v2/ConversationSidebarAdd.tsx +++ b/src/components/v2/ConversationSidebarAdd.tsx @@ -1,23 +1,25 @@ -import { chatList } from '@/stores/chat' +import { addChat } from '@/stores/chat' export default () => { const handleAdd = () => { - chatList.set([...chatList.get(), { + addChat({ id: `id_${Date.now()}`, type: 'single', name: 'Test New', avatar: '', messages: [], - }]) + }) } return (
-
-
Add
+
+
+
+
New Chat
) } diff --git a/src/components/v2/ConversationSidebarItem.tsx b/src/components/v2/ConversationSidebarItem.tsx index ae85e285e..ae0c0b139 100644 --- a/src/components/v2/ConversationSidebarItem.tsx +++ b/src/components/v2/ConversationSidebarItem.tsx @@ -1,29 +1,45 @@ -import { useStore } from '@nanostores/solid' -import { currentChatId } from '@/stores/chat' +import { currentChatId, deleteChatById } from '@/stores/chat' import type { ChatInstance } from '@/stores/chat' interface Props { - instance: ChatInstance + instance: ChatInstance & { + current: boolean + } } export default ({ instance }: Props) => { - const $currentChatId = useStore(currentChatId) - const handleClick = () => { currentChatId.set(instance.id) } - const highlightClass = () => $currentChatId() === instance.id ? 'border-l-emerald-500' : 'border-l-transparent' + const handleDelete = (chatId: string) => { + deleteChatById(chatId) + } + const handleEdit = (chatId: string) => {} return (
-
{ instance.name }
+
{ instance.name }
+