HI-VPN/hi-frontend
4
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

🐛 fix: add hash history support for routing in admin and user applications

Browse Source
This commit is contained in:
web 2025-11-30 01:02:25 -08:00
parent 7fa920f397
commit bfc1773226
3 changed files with 21 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
apps/admin/src/main.tsx
View File

@ -1,4 +1,8 @@
import { createRouter, RouterProvider } from "@tanstack/react-router"; import {
createHashHistory,
createRouter,
RouterProvider,
} from "@tanstack/react-router";
import { import {
TanStackQueryContext, TanStackQueryContext,
TanStackQueryProvider, TanStackQueryProvider,
@ -52,8 +56,10 @@ window.logout = Logout;
// Create a new router instance // Create a new router instance
const TanStackQueryProviderContext = TanStackQueryContext(); const TanStackQueryProviderContext = TanStackQueryContext();
const hashHistory = createHashHistory();
const router = createRouter({ const router = createRouter({
routeTree, routeTree,
history: hashHistory,
context: { context: {
...TanStackQueryProviderContext, ...TanStackQueryProviderContext,
}, },

15
apps/user/src/layout/user-nav.tsx
View File

@ -15,10 +15,10 @@ import {
DropdownMenuTrigger, DropdownMenuTrigger,
} from "@workspace/ui/components/dropdown-menu"; } from "@workspace/ui/components/dropdown-menu";
import { Icon } from "@workspace/ui/composed/icon"; import { Icon } from "@workspace/ui/composed/icon";
import { removeCookie } from "@workspace/ui/lib/cookies";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import { useNavs } from "@/layout/navs"; import { useNavs } from "@/layout/navs";
import { useGlobalStore } from "@/stores/global"; import { useGlobalStore } from "@/stores/global";
import { Logout } from "@/utils/common";
export function UserNav() { export function UserNav() {
const { t } = useTranslation("components"); const { t } = useTranslation("components");
@ -27,9 +27,8 @@ export function UserNav() {
const navs = useNavs(); const navs = useNavs();
const handleLogout = () => { const handleLogout = () => {
removeCookie("Authorization");
setUser(undefined); setUser(undefined);
navigate({ to: "/" }); Logout();
}; };
if (user) { if (user) {
@ -43,13 +42,13 @@ export function UserNav() {
className="object-cover" className="object-cover"
src={user?.auth_methods?.[0]?.auth_identifier ?? ""} src={user?.auth_methods?.[0]?.auth_identifier ?? ""}
/> />
<AvatarFallback className="bg-gradient-to-br from-primary/90 to-primary font-medium text-background"> <AvatarFallback className="bg-linear-to-br from-primary/90 to-primary font-medium text-background">
{user?.auth_methods?.[0]?.auth_identifier {user?.auth_methods?.[0]?.auth_identifier
.toUpperCase() .toUpperCase()
.charAt(0)} .charAt(0)}
</AvatarFallback> </AvatarFallback>
</Avatar> </Avatar>
<span className="max-w-[40px] truncate text-sm sm:max-w-[100px]"> <span className="max-w-10 truncate text-sm sm:max-w-[100px]">
{user?.auth_methods?.[0]?.auth_identifier.split("@")[0]} {user?.auth_methods?.[0]?.auth_identifier.split("@")[0]}
</span> </span>
<Icon <Icon
@ -66,7 +65,7 @@ export function UserNav() {
className="object-cover" className="object-cover"
src={user?.avatar ?? ""} src={user?.avatar ?? ""}
/> />
<AvatarFallback className="bg-gradient-to-br from-primary/90 to-primary text-background"> <AvatarFallback className="bg-linear-to-br from-primary/90 to-primary text-background">
{user?.auth_methods?.[0]?.auth_identifier {user?.auth_methods?.[0]?.auth_identifier
.toUpperCase() .toUpperCase()
.charAt(0)} .charAt(0)}
@ -96,7 +95,7 @@ export function UserNav() {
className="size-4 flex-none text-muted-foreground" className="size-4 flex-none text-muted-foreground"
icon={item.icon as string} icon={item.icon as string}
/> />
<span className="flex-grow truncate">{item.title}</span> <span className="grow truncate">{item.title}</span>
<Icon <Icon
className="size-4 text-muted-foreground opacity-50" className="size-4 text-muted-foreground opacity-50"
icon="lucide:chevron-right" icon="lucide:chevron-right"
@ -111,7 +110,7 @@ export function UserNav() {
onClick={handleLogout} onClick={handleLogout}
> >
<Icon className="size-4 flex-none" icon="uil:exit" /> <Icon className="size-4 flex-none" icon="uil:exit" />
<span className="flex-grow">{t("menu.logout", "Logout")}</span> <span className="grow">{t("menu.logout", "Logout")}</span>
</DropdownMenuItem> </DropdownMenuItem>
</DropdownMenuContent> </DropdownMenuContent>
</DropdownMenu> </DropdownMenu>

8
apps/user/src/main.tsx
View File

@ -1,4 +1,8 @@
import { createRouter, RouterProvider } from "@tanstack/react-router"; import {
createHashHistory,
createRouter,
RouterProvider,
} from "@tanstack/react-router";
import { import {
TanStackQueryContext, TanStackQueryContext,
TanStackQueryProvider, TanStackQueryProvider,
@ -43,8 +47,10 @@ window.logout = Logout;
// Create a new router instance // Create a new router instance
const TanStackQueryProviderContext = TanStackQueryContext(); const TanStackQueryProviderContext = TanStackQueryContext();
const hashHistory = createHashHistory();
const router = createRouter({ const router = createRouter({
routeTree, routeTree,
history: hashHistory,
context: { context: {
...TanStackQueryProviderContext, ...TanStackQueryProviderContext,
}, },