@zenify-omni/chat-ui-react-js 0.1.0

package/components/custom/viewers/video-player.js

@@ -0,0 +1,241 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useState, useRef, useCallback, useEffect } from "react";
+import { Slider } from "../../ui/slider.js";
+import { Button } from "../button.js";
+import {
+  Play,
+  Pause,
+  Volume2,
+  VolumeX,
+  Maximize,
+  SkipBack,
+  SkipForward
+} from "lucide-react";
+import { cn } from "../../../lib/utils.js";
+import { useTranslation } from "react-i18next";
+const SPEEDS = [0.5, 1, 1.5, 2];
+function formatTime(s) {
+  if (isNaN(s) || !isFinite(s)) return "0:00";
+  const m = Math.floor(s / 60);
+  const sec = Math.floor(s % 60);
+  return `${m}:${sec.toString().padStart(2, "0")}`;
+}
+function VideoPlayer({ file }) {
+  const { t } = useTranslation();
+  const videoRef = useRef(null);
+  const [playing, setPlaying] = useState(false);
+  const [currentTime, setCurrentTime] = useState(0);
+  const [duration, setDuration] = useState(0);
+  const [volume, setVolume] = useState(0.8);
+  const [muted, setMuted] = useState(false);
+  const [speed, setSpeed] = useState(1);
+  const [error, setError] = useState(false);
+  const played = duration > 0 ? currentTime / duration : 0;
+  useEffect(() => {
+    setPlaying(false);
+    setCurrentTime(0);
+    setDuration(0);
+    setError(false);
+  }, [file.url]);
+  const togglePlay = useCallback(() => {
+    const video = videoRef.current;
+    if (!video) return;
+    if (video.paused) {
+      video.play().catch((err) => {
+        if (err?.name !== "AbortError") console.error(err);
+      });
+    } else {
+      video.pause();
+    }
+  }, []);
+  const skip = useCallback((secs) => {
+    const video = videoRef.current;
+    if (!video) return;
+    video.currentTime = Math.max(
+      0,
+      Math.min(video.currentTime + secs, video.duration || 0)
+    );
+  }, []);
+  const handleSeek = useCallback(
+    ([val]) => {
+      const video = videoRef.current;
+      if (!video) return;
+      video.currentTime = val * duration;
+      setCurrentTime(val * duration);
+    },
+    [duration]
+  );
+  const handleVolumeChange = useCallback(([v]) => {
+    setVolume(v);
+    setMuted(v === 0);
+    if (videoRef.current) {
+      videoRef.current.volume = v;
+      videoRef.current.muted = v === 0;
+    }
+  }, []);
+  const handleToggleMute = useCallback(() => {
+    setMuted((prev) => {
+      const next = !prev;
+      if (videoRef.current) videoRef.current.muted = next;
+      return next;
+    });
+  }, []);
+  const handleSpeed = useCallback((s) => {
+    setSpeed(s);
+    if (videoRef.current) videoRef.current.playbackRate = s;
+  }, []);
+  const handleFullscreen = useCallback(() => {
+    videoRef.current?.requestFullscreen();
+  }, []);
+  return /* @__PURE__ */ jsxs("div", { className: "flex min-h-0 flex-1 flex-col bg-black", children: [
+    /* @__PURE__ */ jsxs("div", { className: "relative flex min-h-0 flex-1 items-center justify-center bg-black", children: [
+      error && /* @__PURE__ */ jsx("p", { className: "absolute text-sm text-gray-400", children: t("common:toast.playVideoFailed", {
+        defaultValue: "Kh\xF4ng th\u1EC3 ph\xE1t video n\xE0y"
+      }) }),
+      /* @__PURE__ */ jsx(
+        "video",
+        {
+          ref: videoRef,
+          src: file.url,
+          className: "h-full w-full",
+          referrerPolicy: "no-referrer",
+          preload: "metadata",
+          onLoadedMetadata: () => setDuration(videoRef.current?.duration ?? 0),
+          onTimeUpdate: () => setCurrentTime(videoRef.current?.currentTime ?? 0),
+          onPlay: () => setPlaying(true),
+          onPause: () => setPlaying(false),
+          onEnded: () => setPlaying(false),
+          onError: () => setError(true)
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "flex-shrink-0 bg-foreground px-4 py-3", children: [
+      /* @__PURE__ */ jsx(
+        Slider,
+        {
+          value: [played],
+          min: 0,
+          max: 1,
+          step: 1e-3,
+          onValueChange: handleSeek,
+          className: "mb-3",
+          "aria-label": t("common:label.progressBar", {
+            defaultValue: "Thanh ti\u1EBFn \u0111\u1ED9"
+          })
+        }
+      ),
+      /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1", children: [
+          /* @__PURE__ */ jsx(
+            Button,
+            {
+              variant: "ghost",
+              size: "icon",
+              className: "h-8 w-8 text-white hover:bg-white/20 hover:text-white",
+              onClick: () => skip(-10),
+              "aria-label": t("common:action.rewind10s", {
+                defaultValue: "L\xF9i 10 gi\xE2y"
+              }),
+              children: /* @__PURE__ */ jsx(SkipBack, { className: "h-4 w-4" })
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            Button,
+            {
+              variant: "ghost",
+              size: "icon",
+              className: "h-9 w-9 text-white hover:bg-white/20 hover:text-white",
+              onClick: togglePlay,
+              "aria-label": playing ? t("common:action.pause", { defaultValue: "T\u1EA1m d\u1EEBng" }) : t("common:action.play", { defaultValue: "Ph\xE1t" }),
+              children: playing ? /* @__PURE__ */ jsx(Pause, { className: "h-5 w-5" }) : /* @__PURE__ */ jsx(Play, { className: "h-5 w-5" })
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            Button,
+            {
+              variant: "ghost",
+              size: "icon",
+              className: "h-8 w-8 text-white hover:bg-white/20 hover:text-white",
+              onClick: () => skip(10),
+              "aria-label": t("common:action.forward10s", {
+                defaultValue: "Tua 10 gi\xE2y"
+              }),
+              children: /* @__PURE__ */ jsx(SkipForward, { className: "h-4 w-4" })
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxs("span", { className: "text-xs tabular-nums text-gray-400", children: [
+          formatTime(currentTime),
+          " / ",
+          formatTime(duration)
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "ml-auto flex items-center gap-2", children: [
+          /* @__PURE__ */ jsx("div", { className: "flex items-center gap-1 rounded-md bg-white/10 p-0.5", children: SPEEDS.map((s) => /* @__PURE__ */ jsxs(
+            "button",
+            {
+              onClick: () => handleSpeed(s),
+              className: cn(
+                "rounded px-2 py-0.5 text-xs transition-colors",
+                speed === s ? "bg-white font-semibold text-black" : "text-gray-400 hover:text-white"
+              ),
+              children: [
+                s,
+                "\xD7"
+              ]
+            },
+            s
+          )) }),
+          /* @__PURE__ */ jsx(
+            Button,
+            {
+              variant: "ghost",
+              size: "icon",
+              className: "h-7 w-7 text-white hover:bg-white/20 hover:text-white",
+              onClick: handleToggleMute,
+              "aria-label": muted ? t("common:action.enableSound", {
+                defaultValue: "B\u1EADt \xE2m thanh"
+              }) : t("common:action.mute", { defaultValue: "T\u1EAFt ti\u1EBFng" }),
+              children: muted || volume === 0 ? /* @__PURE__ */ jsx(VolumeX, { className: "h-4 w-4" }) : /* @__PURE__ */ jsx(Volume2, { className: "h-4 w-4" })
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            Slider,
+            {
+              value: [muted ? 0 : volume],
+              min: 0,
+              max: 1,
+              step: 0.01,
+              onValueChange: handleVolumeChange,
+              className: "w-20",
+              "aria-label": t("common:label.volume", {
+                defaultValue: "\xC2m l\u01B0\u1EE3ng"
+              })
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            Button,
+            {
+              variant: "ghost",
+              size: "icon",
+              className: "h-7 w-7 text-white hover:bg-white/20 hover:text-white",
+              onClick: handleFullscreen,
+              "aria-label": t("common:action.fullscreen", {
+                defaultValue: "To\xE0n m\xE0n h\xECnh"
+              }),
+              children: /* @__PURE__ */ jsx(Maximize, { className: "h-4 w-4" })
+            }
+          )
+        ] })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "flex-shrink-0 bg-foreground px-4 py-1.5 text-xs text-gray-500", children: [
+      formatTime(duration),
+      " \xB7 ",
+      file.name?.split(".").pop()?.toUpperCase(),
+      file.size ? ` \xB7 ${(file.size / (1024 * 1024)).toFixed(1)} MB` : ""
+    ] })
+  ] });
+}
+export {
+  VideoPlayer as default
+};

package/components/customers-route/change-owner-modal.js

@@ -0,0 +1,430 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogHeader,
+  DialogTitle,
+  DialogFooter
+} from "../ui/dialog.js";
+import {
+  Form,
+  FormControl,
+  FormField,
+  FormItem,
+  FormMessage
+} from "../ui/form.js";
+import MultipleSelector from "../custom/multiple-selector.js";
+import { Separator } from "../ui/separator.js";
+import { Label } from "../custom/label.js";
+import ButtonClose from "../custom/button-close.js";
+import { Button } from "../custom/button.js";
+import { memo, useCallback, useEffect, useRef } from "react";
+import { z } from "zod";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { useForm, useWatch } from "react-hook-form";
+import InfiniteScrollCombobox from "../custom/infinite-scroll-combobox.js";
+import { searchUser } from "@zenify-omni/chat-js/api/user.js";
+import { useAllFieldUser } from "../../hooks/use-setting-common.js";
+import { AssigneeRoles, CrmType } from "@zenify-omni/chat-js/constants/user.js";
+import { changeOwner, distributeCustomerOwnerShip } from "@zenify-omni/chat-js/api/customer.js";
+import { useMutation } from "@tanstack/react-query";
+import { throwException } from "../../exceptions/throw-exception.js";
+import { toast } from "sonner";
+import { cn } from "../../lib/utils.js";
+import { showWarningToast } from "../ui/sonner.js";
+import { DistributeTypes } from "@zenify-omni/chat-js/constants/distribute.js";
+import { useTranslation } from "react-i18next";
+import i18n from "@zenify-omni/chat-js/lib/i18n/index.js";
+const changeOwnerSchema = z.object({
+  customer_id: z.string().min(1, {
+    get message() {
+      return i18n.t("customer:label.customerIdCannotBeEmpty", {
+        defaultValue: "ID kh\xE1ch h\xE0ng kh\xF4ng \u0111\u01B0\u1EE3c \u0111\u1EC3 tr\u1ED1ng"
+      });
+    }
+  }),
+  agent: z.any().refine((v) => !!v, {
+    get message() {
+      return i18n.t("common:label.agentCannotBeEmpty", {
+        defaultValue: "Chuy\xEAn vi\xEAn kh\xF4ng \u0111\u01B0\u1EE3c \u0111\u1EC3 tr\u1ED1ng"
+      });
+    }
+  })
+});
+const ChangeOwnerForTargetAgent = memo(
+  ({ open, setOpen, onSuccess, currentCustomerId, crmType = CrmType.Lead }) => {
+    const { t } = useTranslation();
+    const formRef = useRef(null);
+    const form = useForm({
+      resolver: zodResolver(changeOwnerSchema),
+      mode: "onChange",
+      defaultValues: {
+        customer_id: currentCustomerId || "",
+        agent: null
+      }
+    });
+    const { mutate, isPending } = useMutation({
+      mutationFn: async (payload) => {
+        const { data, error } = await distributeCustomerOwnerShip(payload);
+        if (error) {
+          throwException({
+            message: error.message || i18n.t("customer:label.allocationFailed", {
+              defaultValue: "Ph\xE2n b\u1ED5 th\u1EA5t b\u1EA1i"
+            })
+          });
+        }
+        return data;
+      },
+      onSuccess: () => {
+        toast.success(
+          i18n.t("customer:toast.transferOwnerSuccess", {
+            defaultValue: "Chuy\u1EC3n ng\u01B0\u1EDDi ph\u1EE5 tr\xE1ch th\xE0nh c\xF4ng"
+          })
+        );
+        handleSuccess();
+      },
+      onError: throwException
+    });
+    const handleSubmit = useCallback(
+      (formData) => {
+        const payload = {
+          customer_ids: [formData.customer_id],
+          distribute_type: DistributeTypes.AGENT,
+          target_assignee_id: formData.agent?.value || null,
+          crm_type: crmType
+        };
+        if (!payload.target_assignee_id) {
+          showWarningToast(
+            i18n.t("customer:message.selectAgentToTransfer", {
+              defaultValue: "Vui l\xF2ng ch\u1ECDn chuy\xEAn vi\xEAn \u0111\u1EC3 chuy\u1EC3n"
+            })
+          );
+          return;
+        }
+        mutate(payload);
+      },
+      [mutate]
+    );
+    const handleCancel = useCallback(() => {
+      form.reset();
+      setOpen?.();
+    }, [form, setOpen]);
+    const handleSuccess = useCallback(() => {
+      form.reset();
+      onSuccess?.();
+      setOpen?.();
+    }, [form, setOpen, onSuccess]);
+    const handleOpenChange = useCallback(
+      (open2) => {
+        if (!open2 && !isPending) {
+          handleCancel();
+        }
+      },
+      [handleCancel, isPending]
+    );
+    return /* @__PURE__ */ jsx(Dialog, { open, onOpenChange: handleOpenChange, children: /* @__PURE__ */ jsx(DialogContent, { className: "max-w-lg", children: /* @__PURE__ */ jsxs(DialogHeader, { children: [
+      /* @__PURE__ */ jsx(DialogTitle, { children: t("common:action.transferAssignee", {
+        defaultValue: "Chuy\u1EC3n ng\u01B0\u1EDDi ph\u1EE5 tr\xE1ch"
+      }) }),
+      /* @__PURE__ */ jsx(DialogDescription, {}),
+      /* @__PURE__ */ jsx(Form, { ...form, children: /* @__PURE__ */ jsxs(
+        "form",
+        {
+          ref: formRef,
+          onSubmit: (e) => {
+            console.log("??submit");
+            form.handleSubmit(handleSubmit)(e);
+          },
+          className: "space-y-4",
+          children: [
+            /* @__PURE__ */ jsx(
+              FormField,
+              {
+                control: form.control,
+                name: "agent",
+                render: ({ field }) => /* @__PURE__ */ jsxs(FormItem, { className: cn("w-full"), children: [
+                  /* @__PURE__ */ jsx(Label, { isRequired: true, children: t("common:label.agent", {
+                    defaultValue: "Chuy\xEAn vi\xEAn"
+                  }) }),
+                  /* @__PURE__ */ jsx(FormControl, { children: /* @__PURE__ */ jsx(
+                    InfiniteScrollCombobox,
+                    {
+                      ...field,
+                      queryKey: "infinite-target-agent",
+                      placeholder: t("common:label.agent", {
+                        defaultValue: "Chuy\xEAn vi\xEAn"
+                      }),
+                      onSearch: (searchText, paginationParams) => searchUser({
+                        searchText,
+                        roles: AssigneeRoles,
+                        ...paginationParams
+                      }),
+                      buildOption: (user) => ({
+                        value: user._id,
+                        label: user.name
+                      })
+                    }
+                  ) }),
+                  /* @__PURE__ */ jsx(FormMessage, {})
+                ] })
+              }
+            ),
+            /* @__PURE__ */ jsxs("div", { className: "mt-4 flex justify-end gap-2", children: [
+              /* @__PURE__ */ jsx(
+                Button,
+                {
+                  type: "button",
+                  variant: "secondary",
+                  onClick: handleCancel,
+                  disabled: isPending,
+                  children: t("common:action.cancel", { defaultValue: "H\u1EE7y" })
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                Button,
+                {
+                  type: "button",
+                  disabled: isPending,
+                  onClick: () => {
+                    console.log("??requestSubmit");
+                    formRef.current.requestSubmit();
+                  },
+                  children: isPending ? t("common:status.processing", {
+                    defaultValue: "\u0110ang x\u1EED l\xFD..."
+                  }) : t("common:action.confirm", {
+                    defaultValue: "X\xE1c nh\u1EADn"
+                  })
+                }
+              )
+            ] })
+          ]
+        }
+      ) })
+    ] }) }) });
+  }
+);
+ChangeOwnerForTargetAgent.displayName = "ChangeOwnerForTargetAgent";
+const formSchema = z.object({
+  crm_type: z.string().optional(),
+  stages: z.any().optional(),
+  old_owner: z.any().refine((v) => v, {
+    get message() {
+      return i18n.t("org:label.thePreviousAssigneeCannotBe", {
+        defaultValue: "Ng\u01B0\u1EDDi ph\u1EE5 tr\xE1ch c\u0169 kh\xF4ng \u0111\u01B0\u1EE3c \u0111\u1EC3 tr\u1ED1ng"
+      });
+    }
+  }),
+  new_owner: z.any().refine((v) => v, {
+    get message() {
+      return i18n.t("org:label.theNewAssigneeCannotBe", {
+        defaultValue: "Ng\u01B0\u1EDDi ph\u1EE5 tr\xE1ch m\u1EDBi kh\xF4ng \u0111\u01B0\u1EE3c \u0111\u1EC3 tr\u1ED1ng"
+      });
+    }
+  })
+});
+function ChangeOwnerModal({ crmType, isOpen, onClose }) {
+  const { t } = useTranslation();
+  const formRef = useRef(null);
+  const form = useForm({
+    resolver: zodResolver(formSchema),
+    mode: "onSubmit",
+    shouldFocusError: false,
+    // <- cái này sẽ ngăn focus khi có lỗi
+    defaultValues: {
+      stages: [],
+      crm_type: crmType
+    }
+  });
+  const leadFieldList = useAllFieldUser(null, "all");
+  const leadStageField = leadFieldList?.find((x) => x.key === "lead_stage");
+  const leadStageOptions = (leadStageField?.data ?? []).filter(
+    (option) => !option.is_deleted
+  );
+  const newOwner = useWatch({
+    control: form.control,
+    name: "new_owner"
+  });
+  const { isPending, mutate: handleChangeOwner } = useMutation({
+    mutationFn: changeOwner,
+    onSuccess: () => {
+      toast.success(
+        i18n.t("customer:toast.transferToAgentSuccess", {
+          label: newOwner?.label,
+          defaultValue: "Chuy\u1EC3n sang chuy\xEAn vi\xEAn {label} th\xE0nh c\xF4ng"
+        })
+      );
+      onClose();
+    },
+    onError: throwException
+  });
+  const onConfirm = (fieldsValue) => {
+    const payload = {
+      crm_type: crmType,
+      new_owner_id: fieldsValue.new_owner.value,
+      old_owner_id: fieldsValue.old_owner.value
+    };
+    if (crmType === CrmType.Lead && fieldsValue.stages.length > 0) {
+      payload.lead_stages = fieldsValue.stages.map((option) => option.value);
+    }
+    handleChangeOwner(payload);
+  };
+  useEffect(() => {
+    form.reset();
+  }, [form, isOpen]);
+  return /* @__PURE__ */ jsx(Dialog, { open: isOpen, onOpenChange: onClose, children: /* @__PURE__ */ jsxs(DialogContent, { className: "h-[400px] overflow-visible sm:max-w-md", children: [
+    /* @__PURE__ */ jsx(DialogHeader, { children: /* @__PURE__ */ jsx(DialogTitle, { children: t("common:action.transferAssignee", {
+      defaultValue: "Chuy\u1EC3n ng\u01B0\u1EDDi ph\u1EE5 tr\xE1ch"
+    }) }) }),
+    /* @__PURE__ */ jsx(
+      DialogDescription,
+      {
+        className: "hidden",
+        "aria-describedby": "create-filter"
+      }
+    ),
+    /* @__PURE__ */ jsx(Form, { ...form, children: /* @__PURE__ */ jsx(
+      "form",
+      {
+        ref: formRef,
+        onSubmit: (e) => {
+          e.stopPropagation();
+          form.handleSubmit(onConfirm)(e);
+        },
+        children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-4", children: [
+          /* @__PURE__ */ jsx(
+            FormField,
+            {
+              control: form.control,
+              name: "new_owner",
+              render: ({ field }) => /* @__PURE__ */ jsxs(FormItem, { className: "space-y-1", children: [
+                /* @__PURE__ */ jsx(Label, { isRequired: true, children: t("customer:field.newOwner", {
+                  defaultValue: "Ng\u01B0\u1EDDi ph\u1EE5 tr\xE1ch m\u1EDBi"
+                }) }),
+                /* @__PURE__ */ jsx(FormControl, { children: /* @__PURE__ */ jsx(
+                  InfiniteScrollCombobox,
+                  {
+                    ...field,
+                    queryKey: "infinite-new-owner",
+                    placeholder: t("common:placeholder.selectAssignee", {
+                      defaultValue: "Ch\u1ECDn ng\u01B0\u1EDDi ph\u1EE5 tr\xE1ch"
+                    }),
+                    onChange: (value) => {
+                      field.onChange(value);
+                      form.setError("new_owner", null);
+                    },
+                    onSearch: (searchText, paginationParams) => searchUser({ searchText, ...paginationParams }),
+                    buildOption: (x) => ({
+                      label: x.name,
+                      value: x._id
+                    })
+                  }
+                ) }),
+                form.formState.errors?.new_owner && /* @__PURE__ */ jsx("span", { className: "text-sm text-[--label-red-foreground]", children: form.formState.errors.new_owner.message })
+              ] })
+            }
+          ),
+          /* @__PURE__ */ jsx(Separator, { className: "h-[2px] bg-[#096C86]" }),
+          /* @__PURE__ */ jsx("p", { className: "text-sm text-[#68737D]", children: crmType === CrmType.Lead ? t("customer:action.filterLeadFile", {
+            defaultValue: "L\u1ECDc t\u1EC7p kh\xE1ch h\xE0ng ti\u1EC1m n\u0103ng"
+          }) : t("customer:action.filterCustomerFile", {
+            defaultValue: "L\u1ECDc t\u1EC7p kh\xE1ch h\xE0ng"
+          }) }),
+          /* @__PURE__ */ jsxs(
+            "div",
+            {
+              className: cn(
+                "grid",
+                crmType === CrmType.Lead && "grid-cols-2 gap-2"
+              ),
+              children: [
+                /* @__PURE__ */ jsx(
+                  FormField,
+                  {
+                    control: form.control,
+                    name: "old_owner",
+                    render: ({ field }) => /* @__PURE__ */ jsxs(FormItem, { className: "space-y-1", children: [
+                      /* @__PURE__ */ jsx(Label, { isRequired: true, children: t("common:label.assignee", {
+                        defaultValue: "Ng\u01B0\u1EDDi ph\u1EE5 tr\xE1ch"
+                      }) }),
+                      /* @__PURE__ */ jsx(FormControl, { children: /* @__PURE__ */ jsx(
+                        InfiniteScrollCombobox,
+                        {
+                          ...field,
+                          queryKey: "infinite-old-owner",
+                          placeholder: t("common:placeholder.selectAssignee", {
+                            defaultValue: "Ch\u1ECDn ng\u01B0\u1EDDi ph\u1EE5 tr\xE1ch"
+                          }),
+                          onChange: (value) => {
+                            field.onChange(value);
+                            form.setError("old_owner", null);
+                          },
+                          onSearch: (searchText, paginationParams) => searchUser({ searchText, ...paginationParams }),
+                          buildOption: (x) => ({
+                            label: x.name,
+                            value: x._id
+                          })
+                        }
+                      ) }),
+                      form.formState.errors?.old_owner && /* @__PURE__ */ jsx("span", { className: "text-sm text-[--label-red-foreground]", children: form.formState.errors.old_owner.message })
+                    ] })
+                  }
+                ),
+                crmType === CrmType.Lead && /* @__PURE__ */ jsx(
+                  FormField,
+                  {
+                    control: form.control,
+                    name: "stages",
+                    render: ({ field }) => /* @__PURE__ */ jsxs(FormItem, { className: "space-y-1", children: [
+                      /* @__PURE__ */ jsx(Label, { children: t("common:label.stage", {
+                        defaultValue: "Giai \u0111o\u1EA1n"
+                      }) }),
+                      /* @__PURE__ */ jsx(FormControl, { children: /* @__PURE__ */ jsx(
+                        MultipleSelector,
+                        {
+                          ...field,
+                          placeholder: t("common:placeholder.selectStage", {
+                            defaultValue: "Ch\u1ECDn giai \u0111o\u1EA1n"
+                          }),
+                          inputProps: { tabIndex: -1 },
+                          options: leadStageOptions.map((option) => ({
+                            label: option.value,
+                            value: option.key
+                          }))
+                        }
+                      ) })
+                    ] })
+                  }
+                )
+              ]
+            }
+          )
+        ] })
+      }
+    ) }),
+    /* @__PURE__ */ jsx(DialogFooter, { children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-end gap-2", children: [
+      /* @__PURE__ */ jsx(
+        ButtonClose,
+        {
+          onClose: () => onClose(),
+          title: t("common:action.close", { defaultValue: "\u0110\xF3ng" })
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          disabled: isPending,
+          loading: isPending,
+          onClick: () => {
+            formRef.current.requestSubmit();
+          },
+          children: t("common:action.transfer", { defaultValue: "Chuy\u1EC3n" })
+        }
+      )
+    ] }) })
+  ] }) });
+}
+export {
+  ChangeOwnerForTargetAgent,
+  ChangeOwnerModal as default
+};