dan/itpdp
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

disable syncing once synced

Browse source
This commit is contained in:
Daniel Bulant 2026-05-01 18:40:36 +02:00
parent a1beff806b
commit 5c2d2c8cf0
No known key found for this signature in database
3 changed files with 60 additions and 50 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

64
web/src/components/sync-button.tsx
View file

@ -1,33 +1,41 @@
import { client } from "#/lib/eden";
import { toast } from "sonner";
import { Button } from "./ui/button";
import { useQueryClient } from "@tanstack/react-query";
import { useState } from "react";
import { toast } from "sonner";
import { client } from "#/lib/eden";
import { Button } from "./ui/button";
import { Item, ItemActions, ItemDescription, ItemTitle } from "./ui/item";
export function SyncButton() {
const query = useQueryClient();
return (
<Item className="px-0 justify-between">
<ItemDescription>Sync your data</ItemDescription>
<ItemActions>
<Button
onClick={async () => {
toast.promise(
(async () => {
await client.api.sync.post();
query.invalidateQueries();
})(),
{
loading: "Syncing...",
success: "Synced!",
error: "Sync failed",
},
);
}}
>
Sync
</Button>
</ItemActions>
</Item>
);
const query = useQueryClient();
const [syncing, setSyncing] = useState(false);
return (
<Item className="px-0 justify-between">
<ItemDescription>Sync your data</ItemDescription>
<ItemActions>
<Button
disabled={syncing}
onClick={async () => {
toast.promise(
(async () => {
setSyncing(true);
try {
await client.api.sync.post();
} finally {
setSyncing(false);
query.invalidateQueries();
}
})(),
{
loading: "Syncing...",
success: "Synced!",
error: "Sync failed",
},
);
}}
>
Sync
</Button>
</ItemActions>
</Item>
);
}

26
web/src/hooks/user.ts
View file

@ -1,21 +1,21 @@
import { authClient } from "#/lib/auth-client";
import type { AuthSession } from "#/lib/auth.serverfn";
import { authClient } from "#/lib/auth-client";
import { Route } from "#/routes/__root";
interface UserData {
user: AuthSession["user"] | null;
session: AuthSession["session"] | null;
isLoading: boolean;
user: AuthSession["user"] | null;
session: AuthSession["session"] | null;
isLoading: boolean;
}
export function useUser() {
const routeContext = Route.useRouteContext();
const { data: clientSession, isPending: isClientSessionPending } =
authClient.useSession();
const session = (clientSession?.session ??
routeContext.session?.session ??
null) as AuthSession["session"] | null;
const user = clientSession?.user ?? routeContext.session?.user ?? null;
const isLoading = !routeContext.session && isClientSessionPending;
return { user, session, isLoading } satisfies UserData;
const routeContext = Route.useRouteContext();
const { data: clientSession, isPending: isClientSessionPending } =
authClient.useSession();
const session = (clientSession?.session ??
routeContext.session?.session ??
null) as AuthSession["session"] | null;
const user = clientSession?.user ?? routeContext.session?.user ?? null;
const isLoading = !routeContext.session && isClientSessionPending;
return { user, session, isLoading } as UserData;
}

20
web/src/routes/index.tsx
View file

@ -1,17 +1,19 @@
import { createFileRoute } from "@tanstack/react-router";
import { PartyQr } from "#/components/party-qr";
import { SyncButton } from "#/components/sync-button";
import { MainContent } from "#/components/ui/main-content";
import { UserInfo } from "#/components/user-info";
import { PartyQr } from "#/components/party-qr";
import { createFileRoute } from "@tanstack/react-router";
import { useUser } from "#/hooks/user";
export const Route = createFileRoute("/")({ component: App });
function App() {
return (
<MainContent>
<UserInfo />
<SyncButton />
<PartyQr />
</MainContent>
);
const { user } = useUser();
return (
<MainContent>
<UserInfo />
{!user?.lastSyncAt && <SyncButton />}
{user && <PartyQr />}
</MainContent>
);
}