From 394ae810951a7b9b3c331aca4ebd29964c2d64af Mon Sep 17 00:00:00 2001 From: Sean Boult <996134+Hacksore@users.noreply.github.com> Date: Thu, 23 Nov 2023 10:08:05 -0600 Subject: [PATCH] Switch to radix --- apps/desktop/package.json | 3 +- apps/desktop/src/App.tsx | 18 +- apps/desktop/src/components/nav-bar.tsx | 10 +- apps/desktop/src/components/ui/button.tsx | 27 - apps/desktop/src/components/ui/slider.tsx | 12 - apps/desktop/src/main.tsx | 6 +- apps/desktop/src/styles.css | 1 + apps/desktop/src/views/channel.tsx | 2 +- apps/desktop/src/views/error.tsx | 4 +- apps/desktop/src/views/main.tsx | 4 +- apps/desktop/src/views/settings.tsx | 5 +- pnpm-lock.yaml | 1386 +++++++++++++++++++-- 12 files changed, 1335 insertions(+), 143 deletions(-) delete mode 100644 apps/desktop/src/components/ui/button.tsx delete mode 100644 apps/desktop/src/components/ui/slider.tsx diff --git a/apps/desktop/package.json b/apps/desktop/package.json index f75998c3..3cafa56e 100644 --- a/apps/desktop/package.json +++ b/apps/desktop/package.json @@ -15,6 +15,7 @@ }, "dependencies": { "@icons-pack/react-simple-icons": "^9.1.0", + "@radix-ui/themes": "^2.0.1", "@tanstack/react-router": "0.0.1-beta.204", "@tauri-apps/api": "^1.5.0", "@uidotdev/usehooks": "^2.4.1", @@ -30,13 +31,13 @@ "zustand": "^4.4.5" }, "devDependencies": { - "eslint-config-custom": "*", "@tauri-apps/cli": "^1.5.0", "@types/react": "^18.2.15", "@types/react-dom": "^18.2.7", "@types/uuid": "^9.0.6", "@vitejs/plugin-react": "^4.0.3", "autoprefixer": "^10.4.16", + "eslint-config-custom": "*", "postcss": "^8.4.31", "tailwindcss": "^3.3.5", "typescript": "^5.0.2", diff --git a/apps/desktop/src/App.tsx b/apps/desktop/src/App.tsx index de56e41b..9a271de9 100644 --- a/apps/desktop/src/App.tsx +++ b/apps/desktop/src/App.tsx @@ -1,10 +1,10 @@ import { useSocket } from "./rpc/manager"; import { Routes, Route } from "react-router-dom"; -import { Main } from "./views/main"; -import { Channel } from "./views/channel"; +import { MainView } from "./views/main"; +import { ChannelView } from "./views/channel"; -import { Settings } from "./views/settings"; -import { Error } from "./views/error"; +import { SettingsView } from "./views/settings"; +import { ErrorView } from "./views/error"; import { NavBar } from "./components/nav-bar"; import { useClickthrough } from "./use-clickthrough"; import { useDisableContextMenu } from "./use-disable-context-menu"; @@ -18,13 +18,13 @@ function App() { const { clickthrough } = useClickthrough(); return ( -
+
- - - - + + + +
); diff --git a/apps/desktop/src/components/nav-bar.tsx b/apps/desktop/src/components/nav-bar.tsx index 1d58a68d..aa5379f6 100644 --- a/apps/desktop/src/components/nav-bar.tsx +++ b/apps/desktop/src/components/nav-bar.tsx @@ -3,7 +3,7 @@ import { Settings, Pin } from "lucide-react"; import { invoke } from "@tauri-apps/api"; import overlayedConfig from "../config"; -import { Button } from "./ui/button"; +import { Button } from "@radix-ui/themes"; import { useAppStore } from "../store"; export const NavBar = ({ clickthrough }: { clickthrough: boolean }) => { @@ -29,7 +29,7 @@ export const NavBar = ({ clickthrough }: { clickthrough: boolean }) => { )}
- - + +
diff --git a/apps/desktop/src/components/ui/button.tsx b/apps/desktop/src/components/ui/button.tsx deleted file mode 100644 index 061a88c8..00000000 --- a/apps/desktop/src/components/ui/button.tsx +++ /dev/null @@ -1,27 +0,0 @@ -import { cva, type VariantProps } from "class-variance-authority"; - -const button = cva("rounded-md disabled:opacity-50 disabled:pointer-events-none", { - variants: { - intent: { - primary: ["bg-blue-500", "text-white", "border-transparent", "hover:bg-blue-600"], - danger: ["bg-red-500", "text-white", "border-transparent", "hover:bg-red-600"], - secondary: ["text-white", "hover:text-blue-500"], - }, - size: { - small: ["text-sm", "py-1", "px-2"], - medium: ["text-base", "py-2", "px-4"], - large: ["text-lg", "py-4", "px-4"], - }, - }, - compoundVariants: [{ intent: "primary", size: "medium", class: "uppercase" }], - defaultVariants: { - intent: "primary", - size: "medium", - }, -}); - -export interface ButtonProps extends React.ButtonHTMLAttributes, VariantProps {} - -export const Button: React.FC = ({ className, intent, size, ...props }) => ( -