import {
  FileUpload
} from "./chunk-S2Q7PO7I.js";
import {
  Form
} from "./chunk-3QSRE5LS.js";

// src/pages/products/common/components/upload-media-form-item/upload-media-form-item.tsx
import { useCallback } from "react";
import { useTranslation } from "react-i18next";
import { jsx, jsxs } from "react/jsx-runtime";
var SUPPORTED_FORMATS = [
  "image/jpeg",
  "image/png",
  "image/gif",
  "image/webp",
  "image/heic",
  "image/svg+xml"
];
var SUPPORTED_FORMATS_FILE_EXTENSIONS = [
  ".jpeg",
  ".png",
  ".gif",
  ".webp",
  ".heic",
  ".svg"
];
var UploadMediaFormItem = ({
  form,
  append,
  showHint = true
}) => {
  const { t } = useTranslation();
  const hasInvalidFiles = useCallback(
    (fileList) => {
      const invalidFile = fileList.find(
        (f) => !SUPPORTED_FORMATS.includes(f.file.type)
      );
      if (invalidFile) {
        form.setError("media", {
          type: "invalid_file",
          message: t("products.media.invalidFileType", {
            name: invalidFile.file.name,
            types: SUPPORTED_FORMATS_FILE_EXTENSIONS.join(", ")
          })
        });
        return true;
      }
      return false;
    },
    [form, t]
  );
  const onUploaded = useCallback(
    (files) => {
      form.clearErrors("media");
      if (hasInvalidFiles(files)) {
        return;
      }
      files.forEach((f) => append({ ...f, isThumbnail: false }));
    },
    [form, append, hasInvalidFiles]
  );
  return /* @__PURE__ */ jsx(
    Form.Field,
    {
      control: form.control,
      name: "media",
      render: () => {
        return /* @__PURE__ */ jsx(Form.Item, { children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-y-2", children: [
          /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-y-1", children: [
            /* @__PURE__ */ jsx(Form.Label, { optional: true, children: t("products.media.label") }),
            showHint && /* @__PURE__ */ jsx(Form.Hint, { children: t("products.media.editHint") })
          ] }),
          /* @__PURE__ */ jsx(Form.Control, { children: /* @__PURE__ */ jsx(
            FileUpload,
            {
              label: t("products.media.uploadImagesLabel"),
              hint: t("products.media.uploadImagesHint"),
              hasError: !!form.formState.errors.media,
              formats: SUPPORTED_FORMATS,
              onUploaded
            }
          ) }),
          /* @__PURE__ */ jsx(Form.ErrorMessage, {})
        ] }) });
      }
    }
  );
};

export {
  UploadMediaFormItem
};
