Release v4.1 (#229)

* refactor: remove custom icon packs * fix: command not work on windows * fix: make open_window command async * feat: improve commands * feat: improve * refactor: column * feat: improve thread column * feat: improve * feat: add stories column * feat: improve * feat: add search column * feat: add reset password * feat: add subscription * refactor: settings * chore: improve commands * fix: crash on production * feat: use tauri store plugin for cache * feat: new icon * chore: update icon for windows * chore: improve some columns * chore: polish code
2024-08-27 19:37:30 +07:00
parent 26ae473521
commit 61ad96ca63
318 changed files with 5564 additions and 8458 deletions
--- a/src/routes/$account/_settings.lazy.tsx
+++ b/src/routes/$account/_settings.lazy.tsx
@@ -0,0 +1,111 @@
+import { cn } from "@/commons";
+import { CurrencyBtc, GearSix, HardDrives, User } from "@phosphor-icons/react";
+import * as ScrollArea from "@radix-ui/react-scroll-area";
+import { Link } from "@tanstack/react-router";
+import { Outlet, createLazyFileRoute } from "@tanstack/react-router";
+
+export const Route = createLazyFileRoute("/$account/_settings")({
+	component: Screen,
+});
+
+function Screen() {
+	const { account } = Route.useParams();
+	const { platform } = Route.useRouteContext();
+
+	return (
+		<div className="flex size-full">
+			<div
+				data-tauri-drag-region
+				className={cn(
+					"w-[250px] shrink-0 flex flex-col gap-1 border-r border-black/10 dark:border-white/10 p-2",
+					platform === "macos" ? "pt-11" : "",
+				)}
+			>
+				<Link to="/$account/general" params={{ account }}>
+					{({ isActive }) => {
+						return (
+							<div
+								className={cn(
+									"h-9 w-full inline-flex items-center gap-1.5 rounded-lg p-2",
+									isActive
+										? "bg-black/10 hover:bg-black/20 dark:bg-white/10 text-neutral-900 dark:text-neutral-100 dark:hover:bg-bg-white/20"
+										: "text-neutral-700 hover:bg-black/10 dark:text-neutral-300 dark:hover:bg-white/10",
+								)}
+							>
+								<GearSix className="size-5 shrink-0" />
+								<p className="text-sm font-medium">General</p>
+							</div>
+						);
+					}}
+				</Link>
+				<Link to="/$account/profile" params={{ account }}>
+					{({ isActive }) => {
+						return (
+							<div
+								className={cn(
+									"h-9 w-full inline-flex items-center gap-1.5 rounded-lg p-2",
+									isActive
+										? "bg-black/10 hover:bg-black/20 dark:bg-white/10 text-neutral-900 dark:text-neutral-100 dark:hover:bg-bg-white/20"
+										: "text-neutral-700 hover:bg-black/10 dark:text-neutral-300 dark:hover:bg-white/10",
+								)}
+							>
+								<User className="size-5 shrink-0" />
+								<p className="text-sm font-medium">Profile</p>
+							</div>
+						);
+					}}
+				</Link>
+				<Link to="/$account/relay" params={{ account }}>
+					{({ isActive }) => {
+						return (
+							<div
+								className={cn(
+									"h-9 w-full inline-flex items-center gap-1.5 rounded-lg p-2",
+									isActive
+										? "bg-black/10 hover:bg-black/20 dark:bg-white/10 text-neutral-900 dark:text-neutral-100 dark:hover:bg-bg-white/20"
+										: "text-neutral-700 hover:bg-black/10 dark:text-neutral-300 dark:hover:bg-white/10",
+								)}
+							>
+								<HardDrives className="size-5 shrink-0" />
+								<p className="text-sm font-medium">Relay</p>
+							</div>
+						);
+					}}
+				</Link>
+				<Link to="/$account/wallet" params={{ account }}>
+					{({ isActive }) => {
+						return (
+							<div
+								className={cn(
+									"h-9 w-full inline-flex items-center gap-1.5 rounded-lg p-2",
+									isActive
+										? "bg-black/10 hover:bg-black/20 dark:bg-white/10 text-neutral-900 dark:text-neutral-100 dark:hover:bg-bg-white/20"
+										: "text-neutral-700 hover:bg-black/10 dark:text-neutral-300 dark:hover:bg-white/10",
+								)}
+							>
+								<CurrencyBtc className="size-5 shrink-0" />
+								<p className="text-sm font-medium">Wallet</p>
+							</div>
+						);
+					}}
+				</Link>
+			</div>
+			<ScrollArea.Root
+				type={"scroll"}
+				scrollHideDelay={300}
+				className="flex-1 overflow-hidden size-full"
+			>
+				<ScrollArea.Viewport className="relative h-full pt-12">
+					<Outlet />
+				</ScrollArea.Viewport>
+				<ScrollArea.Scrollbar
+					className="flex select-none touch-none p-0.5 duration-[160ms] ease-out data-[orientation=vertical]:w-2"
+					orientation="vertical"
+				>
+					<ScrollArea.Thumb className="flex-1 bg-black/10 dark:bg-white/10 rounded-full relative before:content-[''] before:absolute before:top-1/2 before:left-1/2 before:-translate-x-1/2 before:-translate-y-1/2 before:w-full before:h-full before:min-w-[44px] before:min-h-[44px]" />
+				</ScrollArea.Scrollbar>
+				<ScrollArea.Corner className="bg-transparent" />
+			</ScrollArea.Root>
+		</div>
+	);
+}