gregor/gregorlohaus.com
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

cv page in pretty good state, markdown/html support added to description

Browse Source
This commit is contained in:
Gregor Lohaus
2025-06-14 03:33:46 +02:00
parent 128269de1f
commit 2c1be1429d
11 changed files with 887 additions and 51 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/app/admin/cv/category/list/page.tsx
View File

@@ -48,7 +48,7 @@ export default function CvPage() {
}
</div>
<div className="flex flex-col w-full">
<CollapsibleCvEntryForm entry={undefined} />
<CollapsibleCvEntryForm entry={undefined} categoryId={cat.id} />
</div>
</div>
</Card.CardContent>

2
src/app/admin/cv/entry/[id]/page.tsx
View File

@@ -7,6 +7,6 @@ export default async function Page({params}:{params: Promise<{id:string}>}) {
console.log(params)
const {id} = await params;
return (
<UpdateCvEntryForm params={{id:id, className: undefined}}/>
<UpdateCvEntryForm id={id} className={undefined} />
)
}

6
src/app/admin/cv/entry/_components/CollapsibleForm.tsx
View File

@@ -6,7 +6,7 @@ import type { CategoryRouterOutputs } from "~/server/routers/cv/category";
import { type Element } from "~/lib/utils";
import UpdateCvEntryForm from "./UpdateForm";
import CreateCvEntryForm from "./CreateForm";
export default function CollapsibleCvEntryForm(params:{entry:Element<Element<CategoryRouterOutputs['list']>['cvEntry']>|EntryRouterOutputs['get']|Element<EntryRouterOutputs['list']>|undefined}) {
export default function CollapsibleCvEntryForm(params:{entry:Element<Element<CategoryRouterOutputs['list']>['cvEntry']>|EntryRouterOutputs['get']|Element<EntryRouterOutputs['list']>|undefined, categoryId: string|undefined}) {
return (
<Collapsible>
<CollapsibleTrigger asChild>
@@ -19,8 +19,8 @@ export default function CollapsibleCvEntryForm(params:{entry:Element<Element<Cat
<CollapsibleContent className="autoAlpha">
{
params.entry ?
<UpdateCvEntryForm params={{ id: params.entry.id, className: "w-full" }} key={params.entry.id} /> :
<CreateCvEntryForm className="w-full"/>
<UpdateCvEntryForm id={params.entry.id} className="w-full" key={params.entry.id} /> :
<CreateCvEntryForm className="w-full" categoryId={params.categoryId ? params.categoryId : undefined}/>
}
</CollapsibleContent>

48
src/app/admin/cv/entry/_components/CreateForm.tsx
View File

@@ -14,17 +14,38 @@ import { Popover, PopoverContent, PopoverTrigger } from "~/components/ui/popover
import { CalendarIcon } from "lucide-react";
import { Calendar } from "~/components/ui/calendar";
import { cn } from "~/lib/utils";
import { useState } from "react"
import { useEffect, useState } from "react"
import { Checkbox } from "~/components/ui/checkbox"
export default function CreateCvEntryForm(params:{className:string|undefined}) {
export default function CreateCvEntryForm(params:{className:string|undefined, categoryId:string|undefined}) {
const categories = trpc.cv.category.list.useQuery()
console.log(params.categoryId)
const [categorySelectPlaceHolder,setCategorySelectPlaceHolder] = useState("Select category")
const [categorySelectDefaultValue,setCategorySelectDefaultValue] = useState("")
useEffect(() => {
console.log('category success effect')
if (categories.data !== undefined) {
setCategorySelectDefaultValue(categories.data[0]?.id? categories.data[0].id : "")
setCategorySelectPlaceHolder(categories.data[0]?.name? categories.data[0].name : "Select category")
}
if (params.categoryId) {
let matching = categories.data?.filter((c) => {
return c.id == params.categoryId
})
if (matching !== undefined && matching.length > 0) {
setCategorySelectDefaultValue(matching[0]?.id ? matching[0].id : categorySelectDefaultValue )
setCategorySelectPlaceHolder(matching[0]?.name ? matching[0].name : categorySelectPlaceHolder)
}
}
},[categories.isSuccess])
const form = useForm<z.infer<typeof insertSchemaForm>>({
resolver: zodResolver(insertSchemaForm),
defaultValues: {
id: crypto.randomUUID(),
title: "",
description: "",
categoryId: ""
categoryId: params.categoryId ? params.categoryId : "",
hideDates: false,
}
})
@@ -67,15 +88,15 @@ export default function CreateCvEntryForm(params:{className:string|undefined}) {
</FormLabel>
{
categories.data ? (
<Select onValueChange={field.onChange} defaultValue={categories.data[0]?.id}>
<Select onValueChange={field.onChange} defaultValue={categorySelectDefaultValue}>
<FormControl>
<SelectTrigger>
<SelectValue placeholder={categories.data[0]?.name ? categories.data[0]?.name : "Select category" } />
<SelectValue placeholder={categorySelectPlaceHolder} />
</SelectTrigger>
</FormControl>
<SelectContent>
{ categories.data?.map((c) => {
return (<SelectItem value={c.id}> {c.name} </SelectItem>)
return (<SelectItem key={c.id} value={c.id}> {c.name} </SelectItem>)
})}
</SelectContent>
</Select>
@@ -194,6 +215,21 @@ export default function CreateCvEntryForm(params:{className:string|undefined}) {
</FormItem>
)}
/>
<FormField
control={form.control}
name="hideDates"
render={({field}) => (
<FormItem>
<FormLabel>Hide dates</FormLabel>
<FormControl>
<Checkbox
checked={field.value ? field.value : false}
onCheckedChange={field.onChange}
/>
</FormControl>
</FormItem>
)}
/>
<Button type="submit"> Create </Button>
<FormMessage className={mutation.status == "success" ? "text-green-500" : "text-red-500"}>
{mutation.error ? mutation.error.message : mutation.status}

23
src/app/admin/cv/entry/_components/UpdateForm.tsx
View File

@@ -16,7 +16,8 @@ import { CalendarIcon, Delete } from "lucide-react";
import { Calendar } from "~/components/ui/calendar";
import { Textarea } from "~/components/ui/textarea";
import { usePathname, useRouter } from "next/navigation";
export default function UpdateCvEntryForm({ params }: { params: { id: string, className: string | undefined } }) {
import { Checkbox } from "~/components/ui/checkbox";
export default function UpdateCvEntryForm(params : { id: string, className: string | undefined }) {
console.log(params)
const id = params.id
const categories = trpc.cv.category.list.useQuery()
@@ -59,7 +60,7 @@ export default function UpdateCvEntryForm({ params }: { params: { id: string, cl
deleteMutation.mutate(id)
}
function onSubmit(values: z.infer<typeof updateRouteSchemaCliennt>) {
let { title, categoryId, description } = values.update;
let { title, categoryId, description, hideDates } = values.update;
updateMutation.mutate({
by: { id: id },
update: {
@@ -67,7 +68,8 @@ export default function UpdateCvEntryForm({ params }: { params: { id: string, cl
toTime: format(values.update.toTime, 'yyyy-MM-dd'),
title: title,
categoryId: categoryId,
description: description
description: description,
hideDates: hideDates
}
})
}
@@ -222,6 +224,21 @@ export default function UpdateCvEntryForm({ params }: { params: { id: string, cl
</FormItem>
)}
/>
<FormField
control={form.control}
name="update.hideDates"
render={({field}) => (
<FormItem>
<FormLabel>Hide dates</FormLabel>
<FormControl>
<Checkbox
checked={field.value ? field.value : false}
onCheckedChange={field.onChange}
/>
</FormControl>
</FormItem>
)}
/>
<Button type="submit"> Update </Button>
<FormMessage className={cn(updateMutation.status == "success" ? "text-green-500" : "text-red-500", "flex flex-row justify-between")}>
{updateMutation.error ? updateMutation.error.message : updateMutation.status}