train

apps/edr-freight-web/backoffice/src/components/ruleEngine/RuleEngineFormDialog.tsx

@@ -5,6 +5,7 @@ import {
   Button,
   TextInput,
   Textarea,
+  MultiSelect,
   Select,
   Switch,
   Stack,
@@ -79,8 +80,12 @@ const buildInitialValues = (
 ): Record<string, unknown> => {
   const values: Record<string, unknown> = {};
   for (const field of fields) {
-    const raw = record?.[field.name];
-    if (raw !== undefined && raw !== null) {
+    const raw = field.getInitialValue && record
+      ? field.getInitialValue(record)
+      : record?.[field.name];
+    if (field.type === "multiselect") {
+      values[field.name] = Array.isArray(raw) ? raw.map(String) : [];
+    } else if (raw !== undefined && raw !== null) {
       if (field.type === "date" && typeof raw === "string") {
         values[field.name] = raw.slice(0, 10);
       } else if (Array.isArray(raw)) {
@@ -197,7 +202,10 @@ const RuleEngineFormDialog = ({
 
     for (const field of visibleFields) {
       const raw = values[field.name];
-      if (field.type === "number") {
+      if (field.type === "multiselect") {
+        // Always the full replacement list — the API syncs the relation to it.
+        payload[field.name] = Array.isArray(raw) ? raw : [];
+      } else if (field.type === "number") {
         if (raw === "" || raw === undefined) continue;
         payload[field.name] = Number(raw);
       } else if (field.type === "boolean") {
@@ -258,6 +266,38 @@ const RuleEngineFormDialog = ({
 
     const label = <FieldLabel label={field.label} required={field.required} />;
 
+    if (field.type === "multiselect") {
+      const options = field.optionsFromValues
+        ? field.optionsFromValues(values)
+        : (field.options ?? []);
+      const selected = Array.isArray(values[field.name])
+        ? (values[field.name] as string[])
+        : [];
+      return (
+        <MultiSelect
+          key={field.name}
+          label={label}
+          description={field.description}
+          placeholder={
+            selectOptionsLoading
+              ? "Loading options..."
+              : (field.placeholder ?? "Select one or more")
+          }
+          value={selected}
+          onChange={(v) => setField(field.name, v)}
+          disabled={selectOptionsLoading}
+          data={options
+            .filter((opt) => opt.value !== "" && opt.value !== RULE_ENGINE_SELECT_NONE)
+            .map((opt) => ({ label: opt.label, value: opt.value }))}
+          searchable
+          clearable
+          size="md"
+          radius="md"
+          styles={inputStyles}
+        />
+      );
+    }
+
     if (field.type === "select") {
       // Dynamic options (e.g. rate unit) resolve from the live form values so
       // the choices track the other fields the admin has picked.