feat: add theme toggle to admin sidebars and update form list to use full-row navigation links
This commit is contained in:
@@ -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>
|
||||
|
||||
@@ -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
@@ -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>
|
||||
|
||||
Reference in New Issue
Block a user