diff --git a/.gitattributes b/.gitattributes index 857b7e2..4fabca3 100644 --- a/.gitattributes +++ b/.gitattributes @@ -1,3 +1,3 @@ *.js linguist-vendored *.tsx linguist-vendored -*.css linguist-vendored \ No newline at end of file +*.scss linguist-vendored \ No newline at end of file diff --git a/README.md b/README.md index fa20458..c1f30f8 100644 --- a/README.md +++ b/README.md @@ -1,5 +1,5 @@

- ChatGPT + ChatGPT

ChatGPT

diff --git a/package.json b/package.json index 21ac65f..d0a2045 100644 --- a/package.json +++ b/package.json @@ -30,18 +30,22 @@ "url": "https://github.com/lencx/ChatGPT" }, "dependencies": { + "@tauri-apps/api": "^1.2.0", + "antd": "^5.0.6", "react": "^18.2.0", "react-dom": "^18.2.0", - "@tauri-apps/api": "^1.2.0" + "react-router-dom": "^6.4.5" }, "devDependencies": { + "@tauri-apps/cli": "^1.2.2", + "@tauri-release/cli": "^0.2.3", "@types/node": "^18.7.10", "@types/react": "^18.0.15", "@types/react-dom": "^18.0.6", "@vitejs/plugin-react": "^3.0.0", - "typescript": "^4.6.4", + "sass": "^1.56.2", + "typescript": "^4.9.4", "vite": "^4.0.0", - "@tauri-apps/cli": "^1.2.2", - "@tauri-release/cli": "^0.2.3" + "vite-tsconfig-paths": "^4.0.2" } } diff --git a/logo.png b/public/logo.png similarity index 100% rename from logo.png rename to public/logo.png diff --git a/src-tauri/src/app/menu.rs b/src-tauri/src/app/menu.rs index c2f0542..a91b17f 100644 --- a/src-tauri/src/app/menu.rs +++ b/src-tauri/src/app/menu.rs @@ -48,6 +48,10 @@ pub fn init(context: &Context) -> Menu { let preferences_menu = Submenu::new( "Preferences", Menu::with_items([ + CustomMenuItem::new("dashboard".to_string(), "Dashboard") + .accelerator("CmdOrCtrl+D") + .into(), + MenuItem::Separator.into(), Submenu::new( "Theme", Menu::new() @@ -165,6 +169,7 @@ pub fn menu_handler(event: WindowMenuEvent) { match menu_id { // Preferences + "dashboard" => app.get_window("main").unwrap().show().unwrap(), "restart" => tauri::api::process::restart(&app.env()), "inject_script" => open(&app, script_path), "go_conf" => utils::open_file(utils::chat_root()), diff --git a/src-tauri/src/main.rs b/src-tauri/src/main.rs index ce3ad3e..d1cab6c 100644 --- a/src-tauri/src/main.rs +++ b/src-tauri/src/main.rs @@ -36,10 +36,15 @@ fn main() { .on_window_event(|event| { // https://github.com/tauri-apps/tauri/discussions/2684 if let tauri::WindowEvent::CloseRequested { api, .. } = event.event() { - // TODO: https://github.com/tauri-apps/tauri/issues/3084 - // event.window().hide().unwrap(); - // https://github.com/tauri-apps/tao/pull/517 - event.window().minimize().unwrap(); + let win = event.window(); + if win.label() == "main" { + win.hide().unwrap(); + } else { + // TODO: https://github.com/tauri-apps/tauri/issues/3084 + // event.window().hide().unwrap(); + // https://github.com/tauri-apps/tao/pull/517 + event.window().minimize().unwrap(); + } api.prevent_close(); } }) diff --git a/src-tauri/tauri.conf.json b/src-tauri/tauri.conf.json index a5076dd..641fb19 100644 --- a/src-tauri/tauri.conf.json +++ b/src-tauri/tauri.conf.json @@ -2,7 +2,7 @@ "build": { "beforeDevCommand": "npm run dev:fe", "beforeBuildCommand": "npm run build:fe", - "devPath": "http://localhost:1420/", + "devPath": "http://localhost:1420", "distDir": "../dist" }, "package": { @@ -68,6 +68,7 @@ { "label": "main", "url": "index.html", + "title": "ChatGPT", "visible": false } ] diff --git a/src/App.css b/src/App.css deleted file mode 100644 index a89ebd1..0000000 --- a/src/App.css +++ /dev/null @@ -1,7 +0,0 @@ -.logo.vite:hover { - filter: drop-shadow(0 0 2em #747bff); -} - -.logo.react:hover { - filter: drop-shadow(0 0 2em #61dafb); -} diff --git a/src/App.tsx b/src/App.tsx deleted file mode 100644 index febc27e..0000000 --- a/src/App.tsx +++ /dev/null @@ -1,11 +0,0 @@ -import "./App.css"; - -function App() { - return ( -
- ChatGPT -
- ); -} - -export default App; diff --git a/src/layout/index.scss b/src/layout/index.scss new file mode 100644 index 0000000..a535f01 --- /dev/null +++ b/src/layout/index.scss @@ -0,0 +1,13 @@ +.chat-logo { + text-align: center; + padding: 5px 0; + + img { + width: 48px; + height: 48px; + } +} + +.chat-container { + padding: 20px; +} \ No newline at end of file diff --git a/src/layout/index.tsx b/src/layout/index.tsx new file mode 100644 index 0000000..d5e4cfa --- /dev/null +++ b/src/layout/index.tsx @@ -0,0 +1,57 @@ +import { FC, useState } from 'react'; +import { + DesktopOutlined, + BulbOutlined +} from '@ant-design/icons'; +import type { MenuProps } from 'antd'; +import { Layout, Menu } from 'antd'; +import './index.scss'; + +const { Content, Footer, Sider } = Layout; + +type MenuItem = Required['items'][number]; + +function getItem( + label: React.ReactNode, + key: React.Key, + icon?: React.ReactNode, + children?: MenuItem[], +): MenuItem { + return { + key, + icon, + children, + label, + } as MenuItem; +} + +const items: MenuItem[] = [ + getItem('General', 'general', ), + getItem('ChatGPT Prompts', 'chatgpt-prompts', ), +]; + +interface ChatLayoutProps { + children: React.ReactNode; +} + +const ChatLayout: FC = ({ children }) => { + const [collapsed, setCollapsed] = useState(false); + + return ( + + setCollapsed(value)}> +
+ + + + + {children} + + + + + ); +}; + +export default ChatLayout; \ No newline at end of file diff --git a/src/main.scss b/src/main.scss new file mode 100644 index 0000000..96312fb --- /dev/null +++ b/src/main.scss @@ -0,0 +1,20 @@ +:root { + font-family: Inter, Avenir, Helvetica, Arial, sans-serif; + font-size: 16px; + line-height: 24px; + font-weight: 400; + + color: #2a2a2a; + background-color: #f6f6f6; + + font-synthesis: none; + text-rendering: optimizeLegibility; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; + -webkit-text-size-adjust: 100%; +} + +html, body { + padding: 0; + margin: 0; +} \ No newline at end of file diff --git a/src/main.tsx b/src/main.tsx index 415b19d..517703b 100644 --- a/src/main.tsx +++ b/src/main.tsx @@ -1,11 +1,16 @@ -import React from "react"; -import ReactDOM from "react-dom/client"; +import { StrictMode, Suspense } from 'react'; +import { BrowserRouter } from 'react-router-dom'; +import ReactDOM from 'react-dom/client'; -import App from "./App"; -import "./style.css"; +import Routes from './routes'; +import './main.scss'; -ReactDOM.createRoot(document.getElementById("root") as HTMLElement).render( - - - +ReactDOM.createRoot(document.getElementById('root') as HTMLElement).render( + + + + + + + ); diff --git a/src/routes.tsx b/src/routes.tsx new file mode 100644 index 0000000..ce1137c --- /dev/null +++ b/src/routes.tsx @@ -0,0 +1,22 @@ +import { useLayoutEffect } from 'react'; +import { useLocation, useRoutes } from 'react-router-dom'; +import type { RouteObject } from 'react-router-dom'; + +import App from '@view/App'; + +const routes: RouteObject[] = [ + { + path: '/', + element: + } +]; + +export default () => { + const location = useLocation(); + const pathname = location.pathname; + useLayoutEffect(() => { + const name = pathname.substring(1).replace(/\//gi, '_'); + document.body.className = `${name ? name : 'main'}_screen` + }, [pathname]); + return useRoutes(routes); +}; \ No newline at end of file diff --git a/src/style.css b/src/style.css deleted file mode 100644 index c0f9e3b..0000000 --- a/src/style.css +++ /dev/null @@ -1,102 +0,0 @@ -:root { - font-family: Inter, Avenir, Helvetica, Arial, sans-serif; - font-size: 16px; - line-height: 24px; - font-weight: 400; - - color: #0f0f0f; - background-color: #f6f6f6; - - font-synthesis: none; - text-rendering: optimizeLegibility; - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; - -webkit-text-size-adjust: 100%; -} - -.container { - margin: 0; - padding-top: 10vh; - display: flex; - flex-direction: column; - justify-content: center; - text-align: center; -} - -.logo { - height: 6em; - padding: 1.5em; - will-change: filter; - transition: 0.75s; -} - -.logo.tauri:hover { - filter: drop-shadow(0 0 2em #24c8db); -} - -.row { - display: flex; - justify-content: center; -} - -a { - font-weight: 500; - color: #646cff; - text-decoration: inherit; -} - -a:hover { - color: #535bf2; -} - -h1 { - text-align: center; -} - -input, -button { - border-radius: 8px; - border: 1px solid transparent; - padding: 0.6em 1.2em; - font-size: 1em; - font-weight: 500; - font-family: inherit; - color: #0f0f0f; - background-color: #ffffff; - transition: border-color 0.25s; - box-shadow: 0 2px 2px rgba(0, 0, 0, 0.2); -} - -button { - cursor: pointer; -} - -button:hover { - border-color: #396cd8; -} - -input, -button { - outline: none; -} - -#greet-input { - margin-right: 5px; -} - -@media (prefers-color-scheme: dark) { - :root { - color: #f6f6f6; - background-color: #2f2f2f; - } - - a:hover { - color: #24c8db; - } - - input, - button { - color: #ffffff; - background-color: #0f0f0f98; - } -} diff --git a/src/view/App.tsx b/src/view/App.tsx new file mode 100644 index 0000000..85dbcf9 --- /dev/null +++ b/src/view/App.tsx @@ -0,0 +1,9 @@ +import Layout from "@layout/index"; + +export default function Dashboard() { + return ( + + Hello + + ) +} \ No newline at end of file diff --git a/tsconfig.json b/tsconfig.json index 3d0a51a..9b493e0 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -14,7 +14,13 @@ "resolveJsonModule": true, "isolatedModules": true, "noEmit": true, - "jsx": "react-jsx" + "jsx": "react-jsx", + "baseUrl": ".", + "paths": { + "@view/*": ["src/view/*"], + "@comps/*": ["src/components/*"], + "@layout/*": ["src/layout/*"], + } }, "include": ["src"], "references": [{ "path": "./tsconfig.node.json" }] diff --git a/vite.config.ts b/vite.config.ts index db75d21..debf8b2 100644 --- a/vite.config.ts +++ b/vite.config.ts @@ -1,9 +1,10 @@ import { defineConfig } from "vite"; import react from "@vitejs/plugin-react"; +import tsconfigPaths from "vite-tsconfig-paths"; // https://vitejs.dev/config/ export default defineConfig({ - plugins: [react()], + plugins: [tsconfigPaths(), react()], // Vite options tailored for Tauri development and only applied in `tauri dev` or `tauri build` // prevent vite from obscuring rust errors