Merge pull request #3164 from frappe/main-hotfix

chore(release): hotfix to main

Author: RitvikSardana

desk/package.json

@@ -11,14 +11,14 @@
   "dependencies": {
     "@headlessui/vue": "^1.7.22",
     "@tailwindcss/typography": "^0.5.9",
-    "@tiptap/core": "^2.2.4",
+    "@tiptap/core": "^3.11.0",
     "@twilio/voice-sdk": "^2.15.0",
     "@vee-validate/zod": "^4.8.2",
     "@vitejs/plugin-vue": "^4.2.3",
     "@vueuse/core": "^13.8.0",
     "@vueuse/integrations": "^13.8.0",
     "dayjs": "^1.11.7",
-    "frappe-ui": "0.1.261",
+    "frappe-ui": "0.1.269",
     "gemoji": "^8.1.0",
     "mime": "^3.0.0",
     "pinia": "^2.0.33",
@@ -41,6 +41,6 @@
   },
   "resolutions": {
     "cheerio": "1.0.0-rc.12",
-    "prosemirror-model": "1.25.1"
+    "prosemirror-model": "1.25.4"
   }
 }

desk/public/ticketActivity.png

@@ -440,16 +440,16 @@ onMounted(() => {
 
 function handleSelectAll(e: KeyboardEvent) {
   const active = document.activeElement;
-  const editorDom = editorRef.value?.editor?.view?.dom as
-    | HTMLElement
-    | undefined;
+  const editorContext = editorRef.value?.editor;
+  const editorDom = editorContext?.view?.dom as HTMLElement | undefined;
   const quotedEl = quotedContentRef.value;
   const sel = window.getSelection();
   if (!sel || !editorDom) return;
   if (!editorDom.contains(active) && !(quotedEl && quotedEl.contains(active))) {
     return;
   }
   e.preventDefault();
+  editorContext?.commands.selectAll();
   sel.removeAllRanges();
   const range = document.createRange();
 

desk/public/timers.png

@@ -45,7 +45,7 @@
   </div>
 </template>
 <script setup>
-import { ref } from "vue";
+import { ref, watch } from "vue";
 
 const props = defineProps({
   label: {
@@ -81,6 +81,13 @@ const props = defineProps({
 const hide = ref(props.hideLabel);
 const opened = ref(props.opened);
 
+watch(
+  () => props.opened,
+  (val) => {
+    opened.value = val;
+  }
+);
+
 function toggle() {
   opened.value = !opened.value;
 }

desk/public/videos/commentVideo.mp4

@@ -52,7 +52,29 @@
                   :key="field.name"
                   class="flex flex-col gap-1"
                 >
+                  <div
+                    v-if="field.name === 'domain'"
+                    class="flex flex-col gap-2"
+                  >
+                    <Link
+                      v-model="customState.domain"
+                      :label="field.label"
+                      :placeholder="field.placeholder"
+                      doctype="Email Domain"
+                      :onCreate="handleCreateDomainClick"
+                    />
+                    <div v-if="customState.domain" class="flex gap-2">
+                      <Button
+                        size="sm"
+                        variant="subtle"
+                        theme="gray"
+                        :label="__('Edit Domain')"
+                        @click="handleEditDomainClick"
+                      />
+                    </div>
+                  </div>
                   <FormControl
+                    v-else
                     v-model="state[field.name]"
                     :label="field.label"
                     :name="field.name"
@@ -61,6 +83,41 @@
                   />
                 </div>
               </div>
+              <div
+                v-if="isCustomSelected"
+                class="grid grid-cols-1 md:grid-cols-2 gap-4"
+              >
+                <div class="flex flex-col gap-4">
+                  <div
+                    v-for="field in customIncomingFields"
+                    :key="field.name"
+                    class="flex flex-col gap-1"
+                  >
+                    <FormControl
+                      v-model="customState[field.name]"
+                      :label="field.label"
+                      :name="field.name"
+                      :type="field.type"
+                      :placeholder="field.placeholder"
+                    />
+                  </div>
+                </div>
+                <div class="flex flex-col gap-4">
+                  <div
+                    v-for="field in customOutgoingFields"
+                    :key="field.name"
+                    class="flex flex-col gap-1"
+                  >
+                    <FormControl
+                      v-model="customState[field.name]"
+                      :label="field.label"
+                      :name="field.name"
+                      :type="field.type"
+                      :placeholder="field.placeholder"
+                    />
+                  </div>
+                </div>
+              </div>
               <div class="grid grid-cols-2 gap-4">
                 <div
                   v-for="field in incomingOutgoingFields"
@@ -109,10 +166,13 @@ import { capture } from "@/telemetry";
 import { EmailAccount, EmailService, EmailStep } from "@/types";
 import { call, createResource, toast } from "frappe-ui";
 import { useOnboarding } from "frappe-ui/frappe";
-import { computed, Reactive, reactive, Ref, ref } from "vue";
+import { computed, reactive, Ref, ref, watch } from "vue";
 import CircleAlert from "~icons/lucide/circle-alert";
 import {
-  customProviderFields,
+  customIncomingFields,
+  customOutgoingFields,
+  customProviderTopFields,
+  frappeMailFields,
   incomingOutgoingFields,
   popularProviderFields,
   services,
@@ -125,11 +185,45 @@ interface E {
   (event: "update:step", value: EmailStep): void;
 }
 
+interface EmailAccountBaseState {
+  email_account_name: string;
+  email_id: string;
+  service: string;
+  enable_incoming: boolean;
+  enable_outgoing: boolean;
+  default_incoming: boolean;
+  default_outgoing: boolean;
+}
+
+interface EmailAccountProviderAuthState extends EmailAccountBaseState {
+  password?: string;
+  api_key?: string;
+  api_secret?: string;
+  frappe_mail_site?: string;
+}
+
+type CustomEmailAccountState = {
+  domain?: string;
+  email_server?: string;
+  incoming_port?: string | number;
+  smtp_server?: string;
+  smtp_port?: string | number;
+  use_ssl?: boolean | number;
+  use_starttls?: boolean | number;
+  use_tls?: boolean | number;
+  use_ssl_for_outgoing?: boolean | number;
+  validate_ssl_certificate?: boolean | number;
+  validate_ssl_certificate_for_outgoing?: boolean | number;
+  attachment_limit?: string | number;
+  append_emails_to_sent_folder?: boolean | number;
+  sent_folder_name?: string;
+};
+
 const emit = defineEmits<E>();
 
 const { updateOnboardingStep } = useOnboarding("helpdesk");
 
-const state: Reactive<EmailAccount> = reactive({
+const state = reactive<EmailAccountProviderAuthState>({
   service: "",
   email_account_name: "",
   email_id: "",
@@ -143,23 +237,74 @@ const state: Reactive<EmailAccount> = reactive({
   default_outgoing: false,
 });
 
-const selectedService: Ref<EmailService> = ref(null);
-const fields = computed(() =>
-  selectedService.value.custom ? customProviderFields : popularProviderFields
+const getDefaultCustomState = (): CustomEmailAccountState => ({
+  domain: "",
+  email_server: "",
+  smtp_server: "",
+  incoming_port: "",
+  smtp_port: "",
+  use_ssl: false,
+  use_starttls: false,
+  use_tls: false,
+  use_ssl_for_outgoing: false,
+  validate_ssl_certificate: true,
+  validate_ssl_certificate_for_outgoing: true,
+  attachment_limit: "",
+  append_emails_to_sent_folder: false,
+  sent_folder_name: "",
+});
+
+const customState = reactive<CustomEmailAccountState>(getDefaultCustomState());
+
+function resetCustomState() {
+  Object.assign(customState, getDefaultCustomState());
+}
+
+const selectedService: Ref<EmailService | null> = ref(null);
+const fields = computed(() => {
+  if (!selectedService.value) return [];
+  if (selectedService.value.name === "Frappe Mail") {
+    return frappeMailFields;
+  }
+  if (selectedService.value.custom) {
+    return customProviderTopFields;
+  }
+  return popularProviderFields;
+});
+
+const isCustomSelected = computed(
+  () => selectedService.value?.name === "Custom"
+);
+
+watch(
+  () => customState.domain,
+  async (val) => {
+    if (state.service !== "Custom") return;
+    if (!isCustomSelected.value || !val) return;
+    try {
+      const doc = await call("frappe.client.get", {
+        doctype: "Email Domain",
+        name: val,
+      });
+      syncAccountFieldsFromDomain(doc);
+    } catch (err) {
+      console.warn("Failed to load Email Domain", err);
+    }
+  }
 );
 
 function handleSelect(service: EmailService) {
   selectedService.value = service;
   state.service = service.name;
+  if (service.name !== "Custom") {
+    resetCustomState();
+  }
 }
 
 const addEmailRes = createResource({
   url: "helpdesk.api.settings.email.create_email_account",
-  makeParams: (val: EmailAccount) => {
-    return {
-      ...val,
-    };
-  },
+  makeParams: (val: EmailAccount) => ({ ...val }),
+
   onSuccess: () => {
     toast.success(__("Email account created"));
     emit("update:step", "email-list");
@@ -173,10 +318,94 @@ const addEmailRes = createResource({
 
 const error = ref<string | undefined>();
 function createEmailAccount() {
-  error.value = validateInputs(state, selectedService.value.custom);
+  const validationState = { ...state, ...customState };
+  error.value = validateInputs(validationState, state.service);
   if (error.value) return;
 
-  addEmailRes.submit({ data: state });
+  addEmailRes.submit({ data: buildCreatePayload() });
+}
+
+function buildCreatePayload() {
+  const commonPayload = {
+    email_account_name: state.email_account_name,
+    email_id: state.email_id,
+    service: state.service,
+    enable_incoming: state.enable_incoming,
+    enable_outgoing: state.enable_outgoing,
+    default_incoming: state.default_incoming,
+    default_outgoing: state.default_outgoing,
+  };
+
+  if (state.service === "Frappe Mail") {
+    return {
+      ...commonPayload,
+      frappe_mail_site: state.frappe_mail_site,
+      api_key: state.api_key,
+      api_secret: state.api_secret,
+    };
+  }
+
+  if (state.service === "Custom") {
+    return {
+      ...commonPayload,
+      password: state.password,
+      ...customState,
+    };
+  }
+
+  return {
+    ...commonPayload,
+    password: state.password,
+  };
+}
+
+function syncAccountFieldsFromDomain(payload: Record<string, any>) {
+  customState.email_server = payload.email_server ?? customState.email_server;
+  customState.smtp_server = payload.smtp_server ?? customState.smtp_server;
+  customState.incoming_port =
+    payload.incoming_port ?? customState.incoming_port;
+  customState.smtp_port = payload.smtp_port ?? customState.smtp_port;
+  customState.use_ssl = Boolean(payload.use_ssl ?? customState.use_ssl);
+  customState.use_starttls = Boolean(
+    payload.use_starttls ?? customState.use_starttls
+  );
+  customState.use_tls = Boolean(payload.use_tls ?? customState.use_tls);
+  customState.use_ssl_for_outgoing = Boolean(
+    payload.use_ssl_for_outgoing ?? customState.use_ssl_for_outgoing
+  );
+  customState.validate_ssl_certificate = Boolean(
+    payload.validate_ssl_certificate ?? customState.validate_ssl_certificate
+  );
+  customState.validate_ssl_certificate_for_outgoing = Boolean(
+    payload.validate_ssl_certificate_for_outgoing ??
+      customState.validate_ssl_certificate_for_outgoing
+  );
+  customState.append_emails_to_sent_folder = Boolean(
+    payload.append_emails_to_sent_folder ??
+      customState.append_emails_to_sent_folder
+  );
+  customState.sent_folder_name =
+    payload.sent_folder_name || customState.sent_folder_name;
+  customState.attachment_limit =
+    payload.attachment_limit || customState.attachment_limit;
+}
+
+function handleCreateDomainClick(value: any, close?: () => void) {
+  close?.();
+  window.open(
+    "/desk/email-domain/new-email-domain",
+    "_blank",
+    "noopener,noreferrer"
+  );
+}
+
+function handleEditDomainClick() {
+  if (!customState.domain) return;
+  window.open(
+    `/desk/email-domain/${encodeURIComponent(customState.domain)}`,
+    "_blank",
+    "noopener,noreferrer"
+  );
 }
 </script>