feat: add theme toggle to admin sidebars and update form list to use full-row navigation links

This commit is contained in:
2026-07-03 17:55:33 +07:00 Unverified
parent 8c7c183d14
commit f5544e328d
4 changed files with 28 additions and 19 deletions
+5 -3
View File
@@ -1,6 +1,6 @@
"use client";
import React, { useState, useTransition, useRef, useCallback, useEffect } from "react";
import React, { useState, useRef, useCallback, useEffect } from "react";
import { useRouter, usePathname } from "next/navigation";
import Link from "next/link";
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card";
@@ -33,10 +33,11 @@ import {
SidebarHeader,
SidebarFooter,
} from "@/components/ui/sidebar";
import { Plus, Trash, ArrowUp, ArrowDown, Loader2, Save, Image as ImageIcon, X, Check, LayoutDashboard, ClipboardList, ArrowLeft, Webhook } from "lucide-react";
import { Plus, Trash, ArrowUp, ArrowDown, Loader2, Image as ImageIcon, X, Check, LayoutDashboard, ClipboardList, ArrowLeft, Webhook } from "lucide-react";
import Image from 'next/image';
import { RichTextEditor } from "@/components/rich-text-editor";
import { FormattedText } from "@/components/formatted-text";
import { ThemeToggle } from "@/components/theme-toggle";
interface Question {
id: string;
@@ -613,10 +614,11 @@ export function AdminSidebar({ formId }: { formId: string }) {
return (
<Sidebar variant="sidebar" collapsible="icon">
<SidebarHeader className="border-b border-border py-4 px-4 flex items-center justify-between">
<SidebarHeader className="border-b border-border py-4 px-4 flex flex-row items-center justify-between">
<span className="font-bold tracking-wider text-primary text-sm uppercase">
Form Admin
</span>
<ThemeToggle />
</SidebarHeader>
<SidebarContent>
+1 -1
View File
@@ -19,7 +19,7 @@ export default async function AdminFormLayout(
return (
<SidebarProvider>
<div className="flex w-full bg-background text-foreground dark">
<div className="flex w-full bg-background text-foreground">
<AdminSidebar formId={params.id} />
<div className="flex-1 overflow-hidden">
<div className="md:hidden p-2">
+19 -14
View File
@@ -67,22 +67,27 @@ export default async function AdminFormsPage() {
</TableRow>
) : (
formsList.map((form) => (
<TableRow key={form.id}>
<TableCell className="font-medium">{form.title}</TableCell>
<TableCell>
{form.isOpen ? (
<Badge variant="default">Open</Badge>
) : (
<Badge variant="secondary">Closed</Badge>
)}
<TableRow key={form.id} className="group hover:bg-muted/50 transition-colors">
<TableCell className="p-0 align-middle">
<Link href={`/admin/form/${form.id}`} className="flex items-center p-3 font-medium h-full w-full">
{form.title}
</Link>
</TableCell>
<TableCell>
{form.createdAt ? new Date(form.createdAt).toLocaleDateString() : 'N/A'}
<TableCell className="p-0 align-middle">
<Link href={`/admin/form/${form.id}`} className="flex items-center p-3 h-full w-full">
{form.isOpen ? (
<Badge variant="default">Open</Badge>
) : (
<Badge variant="secondary">Closed</Badge>
)}
</Link>
</TableCell>
<TableCell className="text-right space-x-2">
<Button variant="outline" asChild size="sm">
<Link href={`/admin/form/${form.id}`}>Edit</Link>
</Button>
<TableCell className="p-0 align-middle">
<Link href={`/admin/form/${form.id}`} className="flex items-center p-3 h-full w-full">
{form.createdAt ? new Date(form.createdAt).toLocaleDateString() : 'N/A'}
</Link>
</TableCell>
<TableCell className="text-right space-x-2 p-3">
<Button variant="outline" asChild size="sm">
<Link href={`/admin/form/${form.id}/result`}>Results</Link>
</Button>