Merge pull request #831 from shariquerik/onboarding-fixes

crm/templates/emails/crm_invitation.html

@@ -1,4 +1,4 @@
-<h2>You have been invited to join Frappe CRM</h2>
+<p>You have been invited to join Frappe CRM</p>
 <p>
 	<a class="btn btn-primary" href="{{ invite_link }}">Accept Invitation</a>
 </p>

frontend/src/components/Layouts/AppSidebar.vue

@@ -168,6 +168,8 @@ import {
   unreadNotificationsCount,
   notificationsStore,
 } from '@/stores/notifications'
+import { usersStore } from '@/stores/users'
+import { sessionStore } from '@/stores/session'
 import { showSettings, activeSettingsPage } from '@/composables/settings'
 import { FeatherIcon, call } from 'frappe-ui'
 import {
@@ -299,16 +301,18 @@ function getIcon(routeName, icon) {
 }
 
 // onboarding
+const { user } = sessionStore()
+const { users, isManager } = usersStore()
 const { isOnboardingStepsCompleted, setUp } = useOnboarding('frappecrm')
 
 async function getFirstLead() {
-  let firstLead = localStorage.getItem('firstLead')
+  let firstLead = localStorage.getItem('firstLead' + user)
   if (firstLead) return firstLead
   return await call('crm.api.onboarding.get_first_lead')
 }
 
 async function getFirstDeal() {
-  let firstDeal = localStorage.getItem('firstDeal')
+  let firstDeal = localStorage.getItem('firstDeal' + user)
   if (firstDeal) return firstDeal
   return await call('crm.api.onboarding.get_first_deal')
 }
@@ -337,12 +341,14 @@ const steps = reactive([
       showSettings.value = true
       activeSettingsPage.value = 'Invite Members'
     },
+    condition: () => isManager(),
   },
   {
     name: 'convert_lead_to_deal',
     title: __('Convert lead to deal'),
     icon: markRaw(ConvertIcon),
     completed: false,
+    dependsOn: 'create_first_lead',
     onClick: async () => {
       minimize.value = true
 
@@ -410,6 +416,7 @@ const steps = reactive([
     title: __('Add your first comment'),
     icon: markRaw(CommentIcon),
     completed: false,
+    dependsOn: 'create_first_lead',
     onClick: async () => {
       minimize.value = true
       let deal = await getFirstDeal()
@@ -430,6 +437,7 @@ const steps = reactive([
     title: __('Send email'),
     icon: markRaw(EmailIcon),
     completed: false,
+    dependsOn: 'create_first_lead',
     onClick: async () => {
       minimize.value = true
       let deal = await getFirstDeal()
@@ -450,6 +458,7 @@ const steps = reactive([
     title: __('Change deal status'),
     icon: markRaw(StepsIcon),
     completed: false,
+    dependsOn: 'convert_lead_to_deal',
     onClick: async () => {
       minimize.value = true
 
@@ -478,7 +487,18 @@ const steps = reactive([
   },
 ])
 
-onMounted(() => setUp(steps))
+onMounted(async () => {
+  await users.promise
+
+  const filteredSteps = steps.filter((step) => {
+    if (step.condition) {
+      return step.condition()
+    }
+    return true
+  })
+
+  setUp(filteredSteps)
+})
 
 // help center
 const articles = ref([
@@ -517,9 +537,7 @@ const articles = ref([
   {
     title: __('Capturing leads'),
     opened: false,
-    subArticles: [
-      { name: 'web-form', title: __('Web form') },
-    ],
+    subArticles: [{ name: 'web-form', title: __('Web form') }],
   },
   {
     title: __('Views'),

frontend/src/components/Modals/LeadModal.vue

@@ -46,6 +46,7 @@ import EditIcon from '@/components/Icons/EditIcon.vue'
 import FieldLayout from '@/components/FieldLayout/FieldLayout.vue'
 import { usersStore } from '@/stores/users'
 import { statusesStore } from '@/stores/statuses'
+import { sessionStore } from '@/stores/session'
 import { isMobileView } from '@/composables/settings'
 import { capture } from '@/telemetry'
 import { createResource } from 'frappe-ui'
@@ -57,6 +58,7 @@ const props = defineProps({
   defaults: Object,
 })
 
+const { user } = sessionStore()
 const { getUser, isManager } = usersStore()
 const { getLeadStatus, statusOptions } = statusesStore()
 const { updateOnboardingStep } = useOnboarding('frappecrm')
@@ -169,7 +171,7 @@ function createNewLead() {
       show.value = false
       router.push({ name: 'Lead', params: { leadId: data.name } })
       updateOnboardingStep('create_first_lead', true, false, () => {
-        localStorage.setItem('firstLead', data.name)
+        localStorage.setItem('firstLead' + user, data.name)
       })
     },
     onError(err) {

frontend/src/pages/Lead.vue

@@ -352,6 +352,7 @@ import {
 } from '@/utils'
 import { getView } from '@/utils/view'
 import { getSettings } from '@/stores/settings'
+import { sessionStore } from '@/stores/session'
 import { usersStore } from '@/stores/users'
 import { globalStore } from '@/stores/global'
 import { statusesStore } from '@/stores/statuses'
@@ -380,6 +381,7 @@ import { useRouter, useRoute } from 'vue-router'
 import { useActiveTabManager } from '@/composables/useActiveTabManager'
 
 const { brand } = getSettings()
+const { user } = sessionStore()
 const { isManager } = usersStore()
 const { $dialog, $socket, makeCall } = globalStore()
 const { statusOptions, getLeadStatus, getDealStatus } = statusesStore()
@@ -675,7 +677,7 @@ async function convertToDeal() {
     existingContact.value = ''
     existingOrganization.value = ''
     updateOnboardingStep('convert_lead_to_deal', true, false, () => {
-      localStorage.setItem('firstDeal', _deal)
+      localStorage.setItem('firstDeal' + user, _deal)
     })
     capture('convert_lead_to_deal')
     router.push({ name: 'Deal', params: { dealId: _deal } })