refactor(ui): clean code

ui/src/components/workflow/Node.tsx

@@ -35,7 +35,7 @@ const Node = ({ data }: NodeProps) => {
 
     updateNode(
       produce(data, (draft) => {
-        draft.name = e.target.innerText;
+        draft.name = newName;
       })
     );
   };
@@ -66,8 +66,10 @@ const Node = ({ data }: NodeProps) => {
             </Show>
           </div>
         );
+
       case WorkflowNodeType.Apply:
         return <div className="text-muted-foreground truncate">{data.config?.domain as string}</div>;
+
       case WorkflowNodeType.Deploy: {
         const provider = deployProvidersMap.get(data.config?.providerType as string);
         return (
@@ -77,6 +79,7 @@ const Node = ({ data }: NodeProps) => {
           </div>
         );
       }
+
       case WorkflowNodeType.Notify: {
         const channelLabel = notifyChannelsMap.get(data.config?.channel as string);
         return (

ui/src/components/workflow/node/ApplyNodeForm.tsx

@@ -14,7 +14,7 @@ import MultipleInput from "@/components/core/MultipleInput";
 import { ACCESS_USAGES, accessProvidersMap } from "@/domain/provider";
 import { type WorkflowNode, type WorkflowNodeConfig } from "@/domain/workflow";
 import { useAntdForm, useZustandShallowSelector } from "@/hooks";
-import { useContactStore } from "@/stores/contact";
+import { useContactEmailsStore } from "@/stores/contact";
 import { useWorkflowStore } from "@/stores/workflow";
 import { validDomainName, validIPv4Address, validIPv6Address } from "@/utils/validators";
 import { usePanel } from "../PanelProvider";
@@ -38,7 +38,7 @@ const initFormModel = (): WorkflowNodeConfig => {
 const ApplyNodeForm = ({ data }: ApplyNodeFormProps) => {
   const { t } = useTranslation();
 
-  const { addEmail } = useContactStore();
+  const { addEmail } = useContactEmailsStore(useZustandShallowSelector("addEmail"));
   const { updateNode } = useWorkflowStore(useZustandShallowSelector(["updateNode"]));
   const { hidePanel } = usePanel();
 
@@ -277,7 +277,7 @@ const FormFieldEmailSelect = ({
   value?: string;
   onChange?: (value: string) => void;
 }) => {
-  const { emails, fetchEmails } = useContactStore();
+  const { emails, fetchEmails } = useContactEmailsStore();
   const emailsToOptions = useCallback(() => emails.map((email) => ({ label: email, value: email })), [emails]);
   useEffect(() => {
     fetchEmails();

ui/src/components/workflow/node/NotifyNodeForm.tsx

@@ -10,7 +10,7 @@ import { z } from "zod";
 import { notifyChannelsMap } from "@/domain/settings";
 import { type WorkflowNode, type WorkflowNodeConfig } from "@/domain/workflow";
 import { useAntdForm, useZustandShallowSelector } from "@/hooks";
-import { useNotifyChannelStore } from "@/stores/notify";
+import { useNotifyChannelsStore } from "@/stores/notify";
 import { useWorkflowStore } from "@/stores/workflow";
 import { usePanel } from "../PanelProvider";
 
@@ -28,14 +28,18 @@ const initFormModel = (): WorkflowNodeConfig => {
 const NotifyNodeForm = ({ data }: NotifyNodeFormProps) => {
   const { t } = useTranslation();
 
-  const { updateNode } = useWorkflowStore(useZustandShallowSelector(["updateNode"]));
-  const { hidePanel } = usePanel();
-
-  const { channels, loadedAtOnce: channelsLoadedAtOnce, fetchChannels } = useNotifyChannelStore();
+  const {
+    channels,
+    loadedAtOnce: channelsLoadedAtOnce,
+    fetchChannels,
+  } = useNotifyChannelsStore(useZustandShallowSelector(["channels", "loadedAtOnce", "fetchChannels"]));
   useEffect(() => {
     fetchChannels();
   }, [fetchChannels]);
 
+  const { updateNode } = useWorkflowStore(useZustandShallowSelector(["updateNode"]));
+  const { hidePanel } = usePanel();
+
   const formSchema = z.object({
     subject: z
       .string({ message: t("workflow_node.notify.form.subject.placeholder") })