mirror of
https://github.com/soconnor0919/hristudio.git
synced 2026-03-23 19:27:51 -04:00
fix: update forms pages to use proper page layout
- Remove EntityView wrapper, use standard space-y-6 pattern - Full page width instead of container max-w - Consistent with experiments/participants pages
This commit is contained in:
@@ -180,7 +180,7 @@ export default function FormViewPage({ params }: FormViewPageProps) {
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="container mx-auto max-w-4xl space-y-6 py-6">
|
||||
<div className="space-y-6">
|
||||
<div className="flex items-center justify-between">
|
||||
<div className="flex items-center gap-4">
|
||||
<Button variant="ghost" size="sm" asChild>
|
||||
|
||||
@@ -154,7 +154,7 @@ export default function NewFormPage() {
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="container mx-auto max-w-4xl space-y-6 py-6">
|
||||
<div className="space-y-6">
|
||||
<div className="flex items-center gap-4">
|
||||
<Button variant="ghost" size="sm" asChild>
|
||||
<Link href={`/studies/${studyId}/forms`}>
|
||||
|
||||
@@ -16,16 +16,8 @@ import {
|
||||
Pencil,
|
||||
Trash2,
|
||||
Eye,
|
||||
Copy,
|
||||
CheckCircle,
|
||||
XCircle,
|
||||
Clock,
|
||||
} from "lucide-react";
|
||||
import {
|
||||
EntityView,
|
||||
EntityViewSection,
|
||||
EmptyState,
|
||||
} from "~/components/ui/entity-view";
|
||||
import { useBreadcrumbsEffect } from "~/components/ui/breadcrumb-provider";
|
||||
import { Button } from "~/components/ui/button";
|
||||
import { Badge } from "~/components/ui/badge";
|
||||
@@ -53,24 +45,6 @@ const formTypeColors = {
|
||||
questionnaire: "bg-orange-100 text-orange-700 dark:bg-orange-900/30 dark:text-orange-400",
|
||||
};
|
||||
|
||||
const statusConfig = {
|
||||
active: {
|
||||
label: "Active",
|
||||
variant: "default" as const,
|
||||
icon: CheckCircle,
|
||||
},
|
||||
draft: {
|
||||
label: "Draft",
|
||||
variant: "secondary" as const,
|
||||
icon: Clock,
|
||||
},
|
||||
deprecated: {
|
||||
label: "Deprecated",
|
||||
variant: "destructive" as const,
|
||||
icon: XCircle,
|
||||
},
|
||||
};
|
||||
|
||||
interface StudyFormsPageProps {
|
||||
params: Promise<{
|
||||
id: string;
|
||||
@@ -141,7 +115,7 @@ export default function StudyFormsPage({ params }: StudyFormsPageProps) {
|
||||
const forms = formsData?.forms ?? [];
|
||||
|
||||
return (
|
||||
<EntityView>
|
||||
<div className="space-y-6">
|
||||
<PageHeader
|
||||
title="Forms"
|
||||
description="Manage consent forms, surveys, and questionnaires for this study"
|
||||
@@ -159,23 +133,23 @@ export default function StudyFormsPage({ params }: StudyFormsPageProps) {
|
||||
/>
|
||||
|
||||
{forms.length === 0 && !isLoading ? (
|
||||
<EmptyState
|
||||
icon="FileText"
|
||||
title="No Forms Yet"
|
||||
description="Create consent forms, surveys, or questionnaires to collect data from participants"
|
||||
action={
|
||||
canManage ? (
|
||||
<Button asChild>
|
||||
<Link href={`/studies/${resolvedParams?.id}/forms/new`}>
|
||||
<Plus className="mr-2 h-4 w-4" />
|
||||
Create Your First Form
|
||||
</Link>
|
||||
</Button>
|
||||
) : null
|
||||
}
|
||||
/>
|
||||
<div className="flex flex-col items-center justify-center py-12 text-center">
|
||||
<FileText className="h-12 w-12 text-muted-foreground mb-4" />
|
||||
<h3 className="text-lg font-semibold mb-2">No Forms Yet</h3>
|
||||
<p className="text-muted-foreground mb-4">
|
||||
Create consent forms, surveys, or questionnaires to collect data from participants
|
||||
</p>
|
||||
{canManage && (
|
||||
<Button asChild>
|
||||
<Link href={`/studies/${resolvedParams?.id}/forms/new`}>
|
||||
<Plus className="mr-2 h-4 w-4" />
|
||||
Create Your First Form
|
||||
</Link>
|
||||
</Button>
|
||||
)}
|
||||
</div>
|
||||
) : (
|
||||
<div className="space-y-6">
|
||||
<div className="space-y-4">
|
||||
<div className="flex items-center gap-4">
|
||||
<div className="relative flex-1 max-w-sm">
|
||||
<Search className="absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-muted-foreground" />
|
||||
@@ -277,6 +251,6 @@ export default function StudyFormsPage({ params }: StudyFormsPageProps) {
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</EntityView>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user