fix(dashboard): Auto generate facet value slug on create

packages/dashboard/src/app/routes/_authenticated/_facets/facets_.$facetId.values_.$id.tsx

@@ -1,3 +1,4 @@
+import { SlugInput } from '@/vdb/components/data-input/index.js';
 import { PageBreadcrumb } from '@/vdb/components/layout/generated-breadcrumbs.js';
 import { ErrorPage } from '@/vdb/components/shared/error-page.js';
 import { FormFieldWrapper } from '@/vdb/components/shared/form-field-wrapper.js';
@@ -115,8 +116,8 @@ function FacetValueDetailPage() {
                 </PageActionBarRight>
             </PageActionBar>
             <PageLayout>
-                <PageBlock column="side" blockId="facet-info">
-                    {entity?.facet && (
+                {entity?.facet && (
+                    <PageBlock column="side" blockId="facet-info">
                         <div className="space-y-2">
                             <div className="text-sm font-medium">
                                 <Trans>Facet</Trans>
@@ -124,8 +125,8 @@ function FacetValueDetailPage() {
                             <div className="text-sm text-muted-foreground">{entity?.facet.name}</div>
                             <div className="text-xs text-muted-foreground">{entity?.facet.code}</div>
                         </div>
-                    )}
-                </PageBlock>
+                    </PageBlock>
+                )}
                 <PageBlock column="main" blockId="main-form">
                     <DetailFormGrid>
                         <TranslatableFormFieldWrapper
@@ -138,7 +139,15 @@ function FacetValueDetailPage() {
                             control={form.control}
                             name="code"
                             label={<Trans>Code</Trans>}
-                            render={({ field }) => <Input {...field} />}
+                            render={({ field }) => (
+                                <SlugInput
+                                    fieldName="code"
+                                    watchFieldName="name"
+                                    entityName="FacetValue"
+                                    entityId={entity?.id}
+                                    {...field}
+                                />
+                            )}
                         />
                     </DetailFormGrid>
                 </PageBlock>