diff --git a/rsconcept/frontend/src/features/ai/components/badge-shared-template.tsx b/rsconcept/frontend/src/features/ai/components/badge-shared-template.tsx new file mode 100644 index 00000000..d6da3bdb --- /dev/null +++ b/rsconcept/frontend/src/features/ai/components/badge-shared-template.tsx @@ -0,0 +1,18 @@ +import { globalIDs } from '@/utils/constants'; + +import { IconSharedTemplate } from './icon-shared-template'; + +interface BadgeSharedTemplateProps { + value: boolean; +} + +/** + * Displays location icon with a full text tooltip. + */ +export function BadgeSharedTemplate({ value }: BadgeSharedTemplateProps) { + return ( +
+ +
+ ); +} diff --git a/rsconcept/frontend/src/features/ai/components/icon-shared-template.tsx b/rsconcept/frontend/src/features/ai/components/icon-shared-template.tsx new file mode 100644 index 00000000..02206b6c --- /dev/null +++ b/rsconcept/frontend/src/features/ai/components/icon-shared-template.tsx @@ -0,0 +1,10 @@ +import { type DomIconProps, IconPrivate, IconPublic } from '@/components/icons'; + +/** Icon for shared template flag. */ +export function IconSharedTemplate({ value, size = '1.25rem', className }: DomIconProps) { + if (value) { + return ; + } else { + return ; + } +} diff --git a/rsconcept/frontend/src/features/ai/dialogs/dlg-create-prompt-template.tsx b/rsconcept/frontend/src/features/ai/dialogs/dlg-create-prompt-template.tsx index e85f7c1f..ab883b9d 100644 --- a/rsconcept/frontend/src/features/ai/dialogs/dlg-create-prompt-template.tsx +++ b/rsconcept/frontend/src/features/ai/dialogs/dlg-create-prompt-template.tsx @@ -13,7 +13,7 @@ import { useAvailableTemplatesSuspense } from '../backend/use-available-template import { useCreatePromptTemplate } from '../backend/use-create-prompt-template'; export interface DlgCreatePromptTemplateProps { - onCreate: (data: RO) => void; + onCreate?: (data: RO) => void; } export function DlgCreatePromptTemplate() { diff --git a/rsconcept/frontend/src/features/ai/pages/prompt-templates-page/tab-edit-template.tsx b/rsconcept/frontend/src/features/ai/pages/prompt-templates-page/tab-edit-template.tsx deleted file mode 100644 index 88253409..00000000 --- a/rsconcept/frontend/src/features/ai/pages/prompt-templates-page/tab-edit-template.tsx +++ /dev/null @@ -1,11 +0,0 @@ -import { usePromptTemplateSuspense } from '../../backend/use-prompt-template'; - -interface TabEditTemplateProps { - activeID: number; -} - -export function TabEditTemplate({ activeID }: TabEditTemplateProps) { - const { promptTemplate } = usePromptTemplateSuspense(activeID); - - return
Prompt Editor {promptTemplate.label}
; -} diff --git a/rsconcept/frontend/src/features/ai/pages/prompt-templates-page/tab-edit-template/form-prompt-template.tsx b/rsconcept/frontend/src/features/ai/pages/prompt-templates-page/tab-edit-template/form-prompt-template.tsx new file mode 100644 index 00000000..c4218706 --- /dev/null +++ b/rsconcept/frontend/src/features/ai/pages/prompt-templates-page/tab-edit-template/form-prompt-template.tsx @@ -0,0 +1,90 @@ +'use client'; + +import { useEffect } from 'react'; +import { Controller, useForm } from 'react-hook-form'; +import { zodResolver } from '@hookform/resolvers/zod'; + +import { useAuthSuspense } from '@/features/auth'; + +import { Checkbox, TextArea, TextInput } from '@/components/input'; +import { cn } from '@/components/utils'; + +import { + type IPromptTemplate, + type IUpdatePromptTemplateDTO, + schemaUpdatePromptTemplate +} from '../../../backend/types'; + +interface FormPromptTemplateProps { + promptTemplate: IPromptTemplate; + disabled: boolean; + onSubmit: (data: IUpdatePromptTemplateDTO) => void; + onReset: () => void; + className?: string; +} + +/** Form for editing a prompt template. */ +export function FormPromptTemplate({ + promptTemplate, + disabled, + className, + onSubmit, + onReset: _onReset +}: FormPromptTemplateProps) { + const { user } = useAuthSuspense(); + + const { + control, + handleSubmit, + reset, + register, + formState: { + /* isDirty, */ + /* errors */ + } + } = useForm({ + resolver: zodResolver(schemaUpdatePromptTemplate), + defaultValues: { + owner: promptTemplate.owner, + label: promptTemplate.label, + description: promptTemplate.description, + text: promptTemplate.text, + is_shared: promptTemplate.is_shared + } + }); + + useEffect(() => { + reset({ + owner: promptTemplate.owner, + label: promptTemplate.label, + description: promptTemplate.description, + text: promptTemplate.text, + is_shared: promptTemplate.is_shared + }); + }, [promptTemplate, reset]); + + return ( +
void handleSubmit(onSubmit)(event)}> + +