diff --git a/crm/public/videos/changeDealStatus.mov b/crm/public/videos/changeDealStatus.mov new file mode 100644 index 00000000..eccdfecc Binary files /dev/null and b/crm/public/videos/changeDealStatus.mov differ diff --git a/crm/public/videos/convertToDeal.mov b/crm/public/videos/convertToDeal.mov new file mode 100644 index 00000000..9da4b454 Binary files /dev/null and b/crm/public/videos/convertToDeal.mov differ diff --git a/frappe-ui b/frappe-ui index b6efd25b..3423aa5b 160000 --- a/frappe-ui +++ b/frappe-ui @@ -1 +1 @@ -Subproject commit b6efd25b2122c2c1f3beeea1702788c5e6e5555f +Subproject commit 3423aa5b5c38d3a1b143ae8ab08cbde7360f9a7c diff --git a/frontend/components.d.ts b/frontend/components.d.ts index 8143cc0e..f09d0554 100644 --- a/frontend/components.d.ts +++ b/frontend/components.d.ts @@ -192,7 +192,6 @@ declare module 'vue' { SidePanelLayout: typeof import('./src/components/SidePanelLayout.vue')['default'] SidePanelLayoutEditor: typeof import('./src/components/SidePanelLayoutEditor.vue')['default'] SidePanelModal: typeof import('./src/components/Modals/SidePanelModal.vue')['default'] - SignupBanner: typeof import('./src/components/SignupBanner.vue')['default'] SLASection: typeof import('./src/components/SLASection.vue')['default'] SmileIcon: typeof import('./src/components/Icons/SmileIcon.vue')['default'] SortBy: typeof import('./src/components/SortBy.vue')['default'] diff --git a/frontend/package.json b/frontend/package.json index 09917c40..697c0504 100644 --- a/frontend/package.json +++ b/frontend/package.json @@ -11,7 +11,7 @@ "dependencies": { "@twilio/voice-sdk": "^2.10.2", "@vueuse/integrations": "^10.3.0", - "frappe-ui": "^0.1.119", + "frappe-ui": "^0.1.120", "gemoji": "^8.1.0", "lodash": "^4.17.21", "mime": "^4.0.1", diff --git a/frontend/src/components/Layouts/AppSidebar.vue b/frontend/src/components/Layouts/AppSidebar.vue index 7da30eb2..f0df5e57 100644 --- a/frontend/src/components/Layouts/AppSidebar.vue +++ b/frontend/src/components/Layouts/AppSidebar.vue @@ -72,14 +72,24 @@
- - - +
+ + + +
+
@@ -148,7 +163,6 @@ import HelpIcon from '@/components/Icons/HelpIcon.vue' import SidebarLink from '@/components/SidebarLink.vue' import Notifications from '@/components/Notifications.vue' import Settings from '@/components/Settings/Settings.vue' -import SignupBanner from '@/components/SignupBanner.vue' import { viewsStore } from '@/stores/views' import { unreadNotificationsCount, @@ -157,12 +171,14 @@ import { import { showSettings, activeSettingsPage } from '@/composables/settings' import { FeatherIcon, call } from 'frappe-ui' import { + SignupBanner, TrialBanner, HelpModal, GettingStartedBanner, useOnboarding, showHelpModal, minimize, + IntermediateStepModal, } from 'frappe-ui/frappe' import { capture } from '@/telemetry' import router from '@/router' @@ -175,6 +191,7 @@ const { toggle: toggleNotificationPanel } = notificationsStore() const isSidebarCollapsed = useStorage('isSidebarCollapsed', false) const isFCSite = ref(window.is_fc_site) +const isDemoSite = ref(window.is_demo_site) const links = [ { @@ -284,19 +301,21 @@ function getIcon(routeName, icon) { // onboarding const { isOnboardingStepsCompleted, setUp } = useOnboarding('frappecrm') -const firstLead = ref('') -const firstDeal = ref('') - async function getFirstLead() { - if (firstLead.value) return firstLead.value + let firstLead = localStorage.getItem('firstLead') + if (firstLead) return firstLead return await call('crm.api.onboarding.get_first_lead') } async function getFirstDeal() { - if (firstDeal.value) return firstDeal.value + let firstDeal = localStorage.getItem('firstDeal') + if (firstDeal) return firstDeal return await call('crm.api.onboarding.get_first_deal') } +const showIntermediateModal = ref(false) +const currentStep = ref({}) + const steps = reactive([ { name: 'create_first_lead', @@ -327,13 +346,23 @@ const steps = reactive([ onClick: async () => { minimize.value = true - let lead = await getFirstLead() + currentStep.value = { + title: __('Convert lead to deal'), + buttonLabel: __('Convert'), + videoURL: '/assets/crm/videos/convertToDeal.mov', + onClick: async () => { + showIntermediateModal.value = false + currentStep.value = {} - if (lead) { - router.push({ name: 'Lead', params: { leadId: lead } }) - } else { - router.push({ name: 'Leads' }) + let lead = await getFirstLead() + if (lead) { + router.push({ name: 'Lead', params: { leadId: lead } }) + } else { + router.push({ name: 'Leads' }) + } + }, } + showIntermediateModal.value = true }, }, { @@ -423,17 +452,28 @@ const steps = reactive([ completed: false, onClick: async () => { minimize.value = true - let deal = await getFirstDeal() - if (deal) { - router.push({ - name: 'Deal', - params: { dealId: deal }, - hash: '#activity', - }) - } else { - router.push({ name: 'Leads' }) + currentStep.value = { + title: __('Change deal status'), + buttonLabel: __('Change'), + videoURL: '/assets/crm/videos/changeDealStatus.mov', + onClick: async () => { + showIntermediateModal.value = false + currentStep.value = {} + + let deal = await getFirstDeal() + if (deal) { + router.push({ + name: 'Deal', + params: { dealId: deal }, + hash: '#activity', + }) + } else { + router.push({ name: 'Leads' }) + } + }, } + showIntermediateModal.value = true }, }, ]) diff --git a/frontend/src/components/Modals/LeadModal.vue b/frontend/src/components/Modals/LeadModal.vue index 2d5de02d..95e0add2 100644 --- a/frontend/src/components/Modals/LeadModal.vue +++ b/frontend/src/components/Modals/LeadModal.vue @@ -168,7 +168,9 @@ function createNewLead() { isLeadCreating.value = false show.value = false router.push({ name: 'Lead', params: { leadId: data.name } }) - updateOnboardingStep('create_first_lead') + updateOnboardingStep('create_first_lead', true, false, () => { + localStorage.setItem('firstLead', data.name) + }) }, onError(err) { isLeadCreating.value = false diff --git a/frontend/src/components/SignupBanner.vue b/frontend/src/components/SignupBanner.vue deleted file mode 100644 index 1faed676..00000000 --- a/frontend/src/components/SignupBanner.vue +++ /dev/null @@ -1,41 +0,0 @@ - - diff --git a/frontend/src/pages/Lead.vue b/frontend/src/pages/Lead.vue index a7a1e3d6..22041c7a 100644 --- a/frontend/src/pages/Lead.vue +++ b/frontend/src/pages/Lead.vue @@ -657,7 +657,9 @@ async function convertToDeal() { existingOrganizationChecked.value = false existingContact.value = '' existingOrganization.value = '' - updateOnboardingStep('convert_lead_to_deal') + updateOnboardingStep('convert_lead_to_deal', true, false, () => { + localStorage.setItem('firstDeal', _deal) + }) capture('convert_lead_to_deal') router.push({ name: 'Deal', params: { dealId: _deal } }) } diff --git a/package.json b/package.json index d04c0994..70ac19de 100644 --- a/package.json +++ b/package.json @@ -1,9 +1,13 @@ { - "private": true, - "workspaces": ["frontend", "frappe-ui"], - "scripts": { - "postinstall": "cd frontend && yarn install", - "dev": "cd frontend && yarn dev", - "build": "cd frontend && yarn build" - } -} \ No newline at end of file + "private": true, + "workspaces": ["frontend", "frappe-ui"], + "scripts": { + "postinstall": "cd frontend && yarn install", + "dev": "cd frontend && yarn dev", + "build": "cd frontend && yarn build", + "disable-workspaces": "sed -i '' 's/\"workspaces\"/\"aworkspaces\"/g' package.json", + "enable-workspaces": "sed -i '' 's/\"aworkspaces\"/\"workspaces\"/g' package.json && rm -rf node_modules ./frontend/node_modules/ frappe-ui/node_modules/ && yarn install", + "upgrade-frappeui": "cd frontend && yarn add frappe-ui@latest && cd ..", + "disable-workspaces-and-upgrade-frappeui": "yarn disable-workspaces && yarn upgrade-frappeui" + } +} diff --git a/yarn.lock b/yarn.lock index 6964a282..536a849c 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2542,10 +2542,10 @@ fraction.js@^4.3.7: resolved "https://registry.yarnpkg.com/fraction.js/-/fraction.js-4.3.7.tgz#06ca0085157e42fda7f9e726e79fefc4068840f7" integrity sha512-ZsDfxO51wGAXREY55a7la9LScWpwv9RxIrYABrlvOFBlH/ShPnrtsXeuUIfXKKOVicNxQ+o8JTbJvjS4M89yew== -frappe-ui@^0.1.119: - version "0.1.119" - resolved "https://registry.yarnpkg.com/frappe-ui/-/frappe-ui-0.1.119.tgz#e41ff3a7ea3ff21008587564c3cefcea86e8d244" - integrity sha512-qgJE3I+N+AxwTsJuTU8O1zDfSePxI8oKm+Cn6RmHTOp6SwdiRvgEu/btKXityAY6nZf6A7OAgqUI4cVHXsr7mQ== +frappe-ui@^0.1.120: + version "0.1.120" + resolved "https://registry.yarnpkg.com/frappe-ui/-/frappe-ui-0.1.120.tgz#0ccbc626bc44ef62b0b253f2b759bb9deca1c6fd" + integrity sha512-vwXo5Jgu5HInvA0hXpP44ItIYqK4USx0flNeT80Ffygg3uBPE7ZV9B3cWVd3RRjxWtrZvSDG0XTmXq7uuE4e9g== dependencies: "@headlessui/vue" "^1.7.14" "@popperjs/core" "^2.11.2"