Move STATUS_VARIANT out of the "use client" SessionsTable module
The session detail page (a server component) was importing STATUS_VARIANT from SessionsTable.tsx, a "use client" file. Next.js compiles client modules separately for the server and client bundles, and pulling a plain value (not a component) across that boundary let the two compiler caches drift out of sync in dev, so the same session status could render a different Badge color depending on which page rendered it. Moved the constant into its own plain module that both files import. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01WzyfRyA7h5rs5SCAahLAWd
This commit is contained in:
@@ -7,7 +7,7 @@ import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
|
||||
import { SessionTimelineChart } from "@/components/sessions/SessionTimelineChart";
|
||||
import { SessionTitleEditor } from "@/components/sessions/SessionTitleEditor";
|
||||
import { SessionDescriptionEditor } from "@/components/sessions/SessionDescriptionEditor";
|
||||
import { STATUS_VARIANT } from "@/components/sessions/SessionsTable";
|
||||
import { STATUS_VARIANT } from "@/components/sessions/session-status";
|
||||
import { getSessionDetail, getSessionName } from "@/lib/db/queries/sessions";
|
||||
import { getSessionTimeline } from "@/lib/db/queries/stats";
|
||||
import { Play } from "lucide-react";
|
||||
|
||||
@@ -16,6 +16,7 @@ import {
|
||||
} from "@/components/ui/dialog";
|
||||
import { Play, Trash2 } from "lucide-react";
|
||||
import { toast } from "sonner";
|
||||
import { STATUS_VARIANT } from "@/components/sessions/session-status";
|
||||
|
||||
export interface SessionRow {
|
||||
id: number;
|
||||
@@ -25,12 +26,6 @@ export interface SessionRow {
|
||||
durationMs: number | null;
|
||||
}
|
||||
|
||||
export const STATUS_VARIANT = {
|
||||
active: "default",
|
||||
completed: "secondary",
|
||||
aborted: "destructive",
|
||||
} as const;
|
||||
|
||||
function formatDuration(ms: number | null): string {
|
||||
if (ms === null) return "-";
|
||||
const totalSeconds = Math.round(ms / 1000);
|
||||
|
||||
@@ -0,0 +1,8 @@
|
||||
// Plain data, deliberately kept out of SessionsTable.tsx (a "use client"
|
||||
// module) so server components (e.g. the session detail page) can import it
|
||||
// without pulling a value across the client/server compilation boundary.
|
||||
export const STATUS_VARIANT = {
|
||||
active: "default",
|
||||
completed: "secondary",
|
||||
aborted: "destructive",
|
||||
} as const;
|
||||
Reference in New Issue
Block a user