Merge pull request #6677 from frappe/mergify/bp/master/pr-6676

fix(partner-onboarding): Add optimistic updates for better perf and ux (backport #6676)

Author: prathameshkurunkar7

dashboard/src/onboarding/modal/PartnerRegistration.vue

@@ -1,10 +1,11 @@
 <script setup lang="ts">
-import { createResource, FormControl } from 'frappe-ui'
+import { createResource, FormControl, Tooltip } from 'frappe-ui'
 import { computed, inject, onMounted, ref, useTemplateRef, watch } from 'vue'
 import EmailInput from '@/components/EmailInput.vue'
 import PhoneInput from '@/components/PhoneInput.vue'
 import PostRegistrationMessage from '@/onboarding/modal/PostRegistrationMessage.vue'
 import { usePartnerOnboarding } from '@/onboarding/usePartnerOnboarding'
+import LucideInfo from '~icons/lucide/info'
 
 const emit = defineEmits(['registered'])
 
@@ -101,9 +102,14 @@ const handleSubmit = async () => {
 
 	try {
 		await onboarding.save()
-		await onboarding.loadMRRStatus()
 		registered.value = true
 		emit('registered')
+		// Fetch MRR in the background (fire-and-forget). It isn't shown on the
+		// success screen, and the query can be slow against a large Invoice table,
+		// so it must not block registration. We still trigger it here because the
+		// modal can be opened from the partner-onboarding page itself — in which
+		// case "Continue" doesn't re-navigate and the page's load() won't re-run.
+		void onboarding.loadMRRStatus()
 	} catch (error: any) {
 		// Backend validation (e.g. the Phone field) wraps values in <strong>
 		// tags via frappe.bold(); strip them so they don't render as literal
@@ -148,16 +154,25 @@ function stripHtmlTags(value: string) {
 			{{ errors.company_name }}
 		</p>
 
-		<FormControl
-			v-model="onboarding.form.registered_country"
-			label="Registered country"
-			type="select"
-			size="sm"
-			variant="outline"
-			placeholder="Select"
-			:options="countryOptions"
-			:class="{ 'has-error': errors.country }"
-		/>
+		<div class="flex flex-col gap-1.5">
+			<div class="flex items-end gap-1">
+				<label class="block text-xs text-ink-gray-5">Registered country</label>
+				<Tooltip
+					text="You'll be listed as a partner in this country, subject to approval and verification."
+				>
+					<LucideInfo class="h-3 w-3 text-ink-gray-5" />
+				</Tooltip>
+			</div>
+			<FormControl
+				v-model="onboarding.form.registered_country"
+				type="select"
+				size="sm"
+				variant="outline"
+				placeholder="Select"
+				:options="countryOptions"
+				:class="{ 'has-error': errors.country }"
+			/>
+		</div>
 		<p v-if="errors.country" class="-mt-2 text-sm text-ink-red-4">
 			{{ errors.country }}
 		</p>

dashboard/src/onboarding/usePartnerOnboarding.ts

@@ -259,10 +259,13 @@ const savePartnerOnboarding = createResource({
 	onSuccess: (nextDoc: PartnerOnboardingDoc) => {
 		const wasRegistered = Boolean(doc.value?.name)
 		applyDoc(nextDoc, activeTeam.value)
-		// First registration creates the record — reload the team so the
-		// sidebar surfaces the "Partnership" item (see NavList.vue / Sidebar.vue).
-		if (!wasRegistered && nextDoc?.name) {
-			void activeTeam.value?.reload?.()
+		// First registration only needs the sidebar to surface the "Partnership"
+		// item (see NavList.vue / Sidebar.vue). The backend doesn't mutate the
+		// Team here — the sole delta is the computed `has_partner_onboarding`
+		// flag — so set it optimistically instead of triggering a heavy full
+		// Team reload (balance, billing, subscriptions, ...).
+		if (!wasRegistered && nextDoc?.name && activeTeam.value?.doc) {
+			activeTeam.value.doc.has_partner_onboarding = true
 		}
 	},
 })
@@ -335,8 +338,9 @@ export function usePartnerOnboarding(team?: TeamResource) {
 			resetMRRStatus()
 			return nextDoc
 		}
-		await loadCertificateStatus()
-		await loadMRRStatus()
+		// Certificate and MRR status are independent — fetch them concurrently so
+		// the partner-onboarding page renders without waiting on a serial chain.
+		await Promise.all([loadCertificateStatus(), loadMRRStatus()])
 		return nextDoc
 	}