Merge branch 'rearrange-properties'

locales/de/designer.yml

@@ -2,6 +2,8 @@ BooleanDefaultProperty:
   label: Default
 BorderProperty:
   label: Begrenzung
+DateDefaultProperty:
+  label: Default
 DisabledProperty:
   label: Deaktiviert
   modalTitle: Deaktiviert

locales/en/designer.yml

@@ -2,6 +2,8 @@ BooleanDefaultProperty:
   label: Default
 BorderProperty:
   label: Border
+DateDefaultProperty:
+  label: Default
 DisabledProperty:
   label: Disabled
   modalTitle: Disabled

src/components/adapters/DateFieldAdapter.tsx

@@ -25,7 +25,7 @@ export const DateFieldAdapter = ({ node }: DateFieldAdapterProps) => {
       disabled={evalCodeToBoolean(node.disabled)}
       hidden={evalCodeToBoolean(node.hidden)}
       format={node.format}
-      defaultValue={node.default ? dayjs(node.default, node.format).toISOString() : undefined}
+      defaultValue={node.default ? dayjs(node.default).toISOString() : undefined}
     />
   )
 }

src/components/designer/properties/DateDefaultProperty.tsx

@@ -0,0 +1,28 @@
+import { DateInput } from "@mantine/dates"
+import { Controller } from "react-hook-form"
+import { useSiteTranslation } from "~/hooks/useSiteTranslation"
+import { DateFieldNode } from "~/schemas/structure"
+
+interface DateDefaultPropertyProps {
+  node: DateFieldNode
+}
+export const DateDefaultProperty = ({
+  node,
+}: DateDefaultPropertyProps & { node: DateFieldNode }) => {
+  const { t } = useSiteTranslation()
+  return (
+    <Controller
+      name="default"
+      render={({ field: { value, onChange }, fieldState: { error } }) => (
+        <DateInput
+          label={t("DateDefaultProperty.label")}
+          value={value ? new Date(value) : null}
+          onChange={(newValue) => onChange(newValue?.toISOString() ?? null)}
+          error={error?.message}
+          clearable
+          valueFormat={node.format}
+        />
+      )}
+    />
+  )
+}

src/components/designer/propertyForms/DateFieldPropertiesForm.tsx

@@ -1,6 +1,7 @@
 import { TextInput } from "@mantine/core"
 import { Controller } from "react-hook-form"
 import { DateFieldNode, dateFieldNodeSchema } from "~/schemas/structure"
+import { DateDefaultProperty } from "../properties/DateDefaultProperty"
 import { DisabledProperty } from "../properties/DisabledProperty"
 import { FieldIdProperty } from "../properties/FieldIdProperty"
 import { HiddenProperty } from "../properties/HiddenProperty"
@@ -29,11 +30,6 @@ export const DateFieldPropertiesForm = ({ node }: DateFieldPropertiesFormProps)
         <TextInput label="Format" value={value} onChange={onChange} error={error?.message} />
       )}
     />
-    <Controller
-      name="default"
-      render={({ field: { value, onChange }, fieldState: { error } }) => (
-        <TextInput label="Default value" value={value} onChange={onChange} error={error?.message} />
-      )}
-    />
+    <DateDefaultProperty node={node} />
   </PropertiesForm>
 )

src/schemas/structure.ts

@@ -61,7 +61,6 @@ export const numberFieldNodeSchema = nodeSchema.extend({
 
 export type NumberFieldNode = z.infer<typeof numberFieldNodeSchema>
 
-// TODO: refine default
 export const dateFieldNodeSchema = nodeSchema.extend({
   type: z.literal("DateField"),
   ...fieldProperties,