feature/IO-3255-simplified-parts-management - Add Shop / Vendor Configuration

client/src/components/parts-shop-info/parts-shop-info-email-presets.component.jsx

@@ -0,0 +1,70 @@
+import { Button, Card, Divider, Form, Input, Select, Space } from "antd";
+import { DeleteOutlined, PlusOutlined } from "@ant-design/icons";
+import { useTranslation } from "react-i18next";
+
+const { Option } = Select;
+
+export default function PartsShopInfoEmailPresets({ form }) {
+  const { t } = useTranslation();
+
+  const emailTypes = [
+    { value: "parts_order", label: t("bodyshop.labels.parts_order") },
+    { value: "parts_receipt", label: t("bodyshop.labels.parts_receipt") },
+    { value: "parts_notification", label: t("bodyshop.labels.parts_notification") }
+  ];
+
+  return (
+    <Card title={t("bodyshop.labels.preset_to_emails")}>
+      <Form.List name="email_presets">
+        {(fields, { add, remove }) => (
+          <>
+            {fields.map(({ key, name, ...restField }) => (
+              <Space key={key} style={{ display: "flex", marginBottom: 8 }} align="baseline">
+                <Form.Item
+                  {...restField}
+                  name={[name, "email_type"]}
+                  label={t("bodyshop.labels.email_type")}
+                  rules={[{ required: true, message: t("bodyshop.errors.email_type_required") }]}
+                >
+                  <Select placeholder={t("bodyshop.placeholders.select_email_type")}>
+                    {emailTypes.map((type) => (
+                      <Option key={type.value} value={type.value}>
+                        {type.label}
+                      </Option>
+                    ))}
+                  </Select>
+                </Form.Item>
+                <Form.Item
+                  {...restField}
+                  name={[name, "to_emails"]}
+                  label={t("bodyshop.labels.to_emails")}
+                  rules={[
+                    { required: true, message: t("bodyshop.errors.to_emails_required") },
+                    { type: "email", message: t("bodyshop.errors.invalid_email") }
+                  ]}
+                >
+                  <Input placeholder={t("bodyshop.placeholders.to_emails")} />
+                </Form.Item>
+                <Form.Item
+                  {...restField}
+                  name={[name, "cc_emails"]}
+                  label={t("bodyshop.labels.cc_emails")}
+                  rules={[{ type: "email", message: t("bodyshop.errors.invalid_email") }]}
+                >
+                  <Input placeholder={t("bodyshop.placeholders.cc_emails")} />
+                </Form.Item>
+                <Button type="text" danger icon={<DeleteOutlined />} onClick={() => remove(name)} />
+              </Space>
+            ))}
+            <Divider />
+            <Form.Item>
+              <Button type="dashed" onClick={() => add()} block icon={<PlusOutlined />}>
+                {t("bodyshop.actions.add_email_preset")}
+              </Button>
+            </Form.Item>
+          </>
+        )}
+      </Form.List>
+    </Card>
+  );
+}