soconnor/hristudio
1
0
Fork 0
mirror of https://github.com/soconnor0919/hristudio.git synced 2025-12-11 22:54:45 -05:00
Code Issues Packages Projects Releases Wiki Activity

Update create new studies page

Browse Source
This commit is contained in:
Sean O'Connor
2024-12-05 13:50:47 -05:00
parent 5a1e318df7
commit a4c8fdc0c3
1 changed files with 62 additions and 41 deletions
Download Patch File Download Diff File Expand all files Collapse all files

103
src/app/dashboard/studies/new/page.tsx
View File

@@ -8,12 +8,11 @@ import { Input } from "~/components/ui/input";
import { Label } from "~/components/ui/label"; import { Label } from "~/components/ui/label";
import { Textarea } from "~/components/ui/textarea"; import { Textarea } from "~/components/ui/textarea";
import { useToast } from "~/hooks/use-toast"; import { useToast } from "~/hooks/use-toast";
import { ArrowLeft } from "lucide-react"; import { ArrowLeft, Settings2Icon } from "lucide-react";
import Link from "next/link"; import Link from "next/link";
import { useActiveStudy } from "~/context/active-study"; import { useActiveStudy } from "~/context/active-study";
import { hasPermission } from "~/lib/permissions-client";
import { PERMISSIONS } from "~/lib/permissions";
import { getApiUrl } from "~/lib/fetch-utils"; import { getApiUrl } from "~/lib/fetch-utils";
export default function NewStudy() { export default function NewStudy() {
const [title, setTitle] = useState(""); const [title, setTitle] = useState("");
const [description, setDescription] = useState(""); const [description, setDescription] = useState("");
@@ -64,53 +63,75 @@ export default function NewStudy() {
return ( return (
<div className="space-y-6"> <div className="space-y-6">
<div className="flex items-center justify-between"> <div className="flex items-center justify-between">
<div>
<h2 className="text-2xl font-bold tracking-tight">Create New Study</h2>
<p className="text-muted-foreground">
Set up a new research study and configure its settings
</p>
</div>
<Button <Button
variant="ghost" variant="outline"
className="gap-2" className="gap-2"
asChild asChild
> >
<Link href="/dashboard/studies"> <Link href="/dashboard">
<ArrowLeft className="h-4 w-4" /> <ArrowLeft className="h-4 w-4" />
Back to Studies Back to Dashboard
</Link> </Link>
</Button> </Button>
</div> </div>
<Card> <div className="flex gap-6">
<CardHeader> <div className="w-48 flex flex-col gap-2">
<CardTitle>Create New Study</CardTitle> <Button
<CardDescription> variant="secondary"
Set up a new research study className="justify-start"
</CardDescription> >
</CardHeader> <Settings2Icon className="mr-2 h-4 w-4" />
<CardContent> Basic Settings
<form onSubmit={handleSubmit} className="space-y-4"> </Button>
<div className="space-y-2"> </div>
<Label htmlFor="title">Study Title</Label>
<Input <div className="flex-1">
id="title" <Card>
value={title} <CardHeader>
onChange={(e) => setTitle(e.target.value)} <CardTitle>Study Details</CardTitle>
placeholder="Enter study title" <CardDescription>
required Configure the basic settings for your new study
/> </CardDescription>
</div> </CardHeader>
<div className="space-y-2"> <CardContent>
<Label htmlFor="description">Description</Label> <form onSubmit={handleSubmit} className="space-y-4">
<Textarea <div className="space-y-2">
id="description" <Label htmlFor="title">Study Title</Label>
value={description} <Input
onChange={(e) => setDescription(e.target.value)} id="title"
placeholder="Enter study description" value={title}
rows={4} onChange={(e) => setTitle(e.target.value)}
/> placeholder="Enter study title"
</div> required
<Button type="submit" disabled={isSubmitting}> />
{isSubmitting ? "Creating..." : "Create Study"} </div>
</Button> <div className="space-y-2">
</form> <Label htmlFor="description">Description</Label>
</CardContent> <Textarea
</Card> id="description"
value={description}
onChange={(e) => setDescription(e.target.value)}
placeholder="Enter study description"
rows={4}
/>
</div>
<div className="flex justify-end">
<Button type="submit" disabled={isSubmitting}>
{isSubmitting ? "Creating..." : "Create Study"}
</Button>
</div>
</form>
</CardContent>
</Card>
</div>
</div>
</div> </div>
); );
} }