17468 Refactored search.vue + implemented xpro aml flow #674

severinbeauvais · 2023-09-07T21:17:58Z

This is incomplete code! What I have in mind is merging to this to a feature branch where several of us can rebuild the flows using the new architecture. And we can compare these flows to what's currently in Dev.

Description of changes:
- app version = 5.1.0
- implemented sub-components for search.vue blocks
- refactored search.vue to separate flows using sub-components (STILL WIP)
- fixed tab title size on small screens
- added search variables to store
- created search-mixin.ts for common getters, setters, etc.
- misc cleanup

By submitting this pull request, I confirm that you can use, modify, copy, and redistribute this contribution, under the terms of the namerequest license (Apache 2.0).

JazzarKarim · 2023-09-12T16:20:23Z

Sev, I'll stop doing any work in this UI after merging my latest small PR.

severinbeauvais · 2023-09-12T23:15:12Z

src/components/dialogs/mras-search-info.vue

-          id="name-input-component"
-          :is-mras-search="!isNameSearch"
-        />
+        <NameInput :is-mras-search="!isNameSearch" />


id is already set in the component.

severinbeauvais · 2023-09-12T23:17:00Z

src/components/tabs.vue

@@ -89,7 +89,6 @@ export default class Tabs extends Mixins(CommonMixin) {

 .mobile-font {
  font-size: $px-14;
-  max-width: 120px;


Fix for tab title:

severinbeauvais · 2023-09-12T23:18:21Z

src/interfaces/new-request-interface.ts

+    companyType: CompanyTypes
+    jurisdiction: any
+    request: RequestActionsI
+  }


I struggled for a while with reactivity on variables in the search mixin and the components sometimes not seeing the changes. Ultimately, it looks like there can only be 1 watcher or reactive statement for them. So, I moved the variables to the store instead, and now reactivity works as expected: everyone can see all changes,

severinbeauvais · 2023-09-12T23:24:22Z

src/views/landing.vue

@@ -16,6 +16,12 @@
            </keep-alive>
          </transition>
        </div>
+
+        <!-- FOR DEBUGGING -->


Once again, I'll delete this and the block below before my final commit.

severinbeauvais · 2023-09-13T15:59:50Z

src/components/new-request/search.vue

I'm doing some more cleanup in here before we merge this PR (to make it easier for several people to work in here at the same time).

JazzarKarim

I get now the direction you want to push the code towards. The code already looks much better and easier to work in / understand.

severinbeauvais · 2023-09-13T16:38:54Z

src/components/new-request/search-components/corp-number-checkbox.vue

@@ -0,0 +1,52 @@
+<template>
+  <div id="corp-number-checkbox">


Note: this component is NOT a v-col like the others.

severinbeauvais · 2023-09-13T16:42:33Z

src/components/new-request/search-components/entity-type.vue

+<template>
+  <v-col id="entity-type" :cols="cols" :md="md">
+    <v-text-field
+      v-if="isConversion && isBenBusiness"


~~This logic should be moved to the parent.~~

Correction -- this logic belongs here as it's a special case for BEN conversions. Otherwise the code block below is used. This is probably a temporary situation (only some alterations are supported atm).

severinbeauvais · 2023-09-13T16:48:03Z

src/components/new-request/search-components/numbered-company-bullets.vue

@@ -0,0 +1,54 @@
+<template>
+  <v-col id="numbered-company-bullets" :cols="cols" :md="md">
+    <template v-if="isConversion && !isAlterOnline(getConversionType)">


Here's another special case, where this component always displays but, depending on the conditionals, some code block or another is displayed.

My point is that logic on whether to display a component belongs in the parent, but within a component there can be some special cases.

severinbeauvais · 2023-09-13T16:53:01Z

src/components/new-request/search.vue

OK, big changes here.

most code blocks are now sub-components

there is a search-mixin that contains common imports and getters, etc

some components still contain some logic that is specific to them only

some of the common search variables are now in the store (for reactivity)

all flows are now separate!

there is a bit of common code at the top of the template (request action menu) and also at the bottom (buttons)

logic for displaying components should be in here, not in the sub-component (except for some special cases)

- implemented sub-components for search.vue blocks - refactored search.vue to separate flows using sub-components (STILL WIP) - fixed tab title size on small screens - added search variables to store - created search-mixin.ts for common getters, setters, etc. - misc cleanup

severinbeauvais · 2023-09-13T17:30:25Z

There's no point in creating a temp URL for this as we're all going to run it locally shortly :)

Once this is merged, I'll set up a quick meeting to walk you through the changes and how I expect the new code to look.

JazzarKarim · 2023-09-13T17:31:52Z

There's no point in creating a temp URL for this as we're all going to run it locally shortly :)

Once this is merged, I'll set up a quick meeting to walk you through the changes and how I expect the new code to look.

Sounds good!

leodube-aot

LGTM!

ketaki-deodhar

👍

severinbeauvais self-assigned this Sep 7, 2023

severinbeauvais changed the base branch from main to feature-way-of-navigating September 7, 2023 21:18

severinbeauvais force-pushed the 17468 branch 5 times, most recently from d3f4a0f to 0d97c55 Compare September 11, 2023 19:43

severinbeauvais changed the base branch from feature-way-of-navigating to main September 11, 2023 19:43

severinbeauvais force-pushed the 17468 branch from d690058 to fef2f48 Compare September 12, 2023 17:18

severinbeauvais changed the title ~~17468 WIP~~ 17468 Refactored search.vue + implemented xpro aml flow Sep 12, 2023

severinbeauvais force-pushed the 17468 branch 4 times, most recently from 40c2d08 to 09f8a02 Compare September 12, 2023 23:13

severinbeauvais commented Sep 12, 2023

View reviewed changes

severinbeauvais force-pushed the 17468 branch 4 times, most recently from 95f9734 to c06653b Compare September 13, 2023 15:39

severinbeauvais changed the base branch from main to feature-search-refactor September 13, 2023 15:39

severinbeauvais requested review from JazzarKarim, ketaki-deodhar and leodube-aot September 13, 2023 15:41

severinbeauvais commented Sep 13, 2023

View reviewed changes

JazzarKarim approved these changes Sep 13, 2023

View reviewed changes

severinbeauvais force-pushed the 17468 branch from c06653b to 8e8e642 Compare September 13, 2023 16:37

severinbeauvais marked this pull request as ready for review September 13, 2023 16:37

severinbeauvais commented Sep 13, 2023

View reviewed changes

severinbeauvais force-pushed the 17468 branch from 8e8e642 to e3e4715 Compare September 13, 2023 17:23

leodube-aot approved these changes Sep 13, 2023

View reviewed changes

ketaki-deodhar approved these changes Sep 13, 2023

View reviewed changes

- moved button logic from template into getters

664d3b4

severinbeauvais merged commit 4d9fa0e into bcgov:feature-search-refactor Sep 13, 2023
4 of 5 checks passed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

17468 Refactored search.vue + implemented xpro aml flow #674

17468 Refactored search.vue + implemented xpro aml flow #674

severinbeauvais commented Sep 7, 2023 •

edited

Loading

JazzarKarim commented Sep 12, 2023

severinbeauvais Sep 12, 2023

severinbeauvais Sep 12, 2023

severinbeauvais Sep 12, 2023

severinbeauvais Sep 12, 2023

severinbeauvais Sep 13, 2023

JazzarKarim left a comment

severinbeauvais Sep 13, 2023

severinbeauvais Sep 13, 2023 •

edited

Loading

severinbeauvais Sep 13, 2023

severinbeauvais Sep 13, 2023

severinbeauvais commented Sep 13, 2023

JazzarKarim commented Sep 13, 2023

leodube-aot left a comment

ketaki-deodhar left a comment

17468 Refactored search.vue + implemented xpro aml flow #674

17468 Refactored search.vue + implemented xpro aml flow #674

Conversation

severinbeauvais commented Sep 7, 2023 • edited Loading

JazzarKarim commented Sep 12, 2023

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

JazzarKarim left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

severinbeauvais Sep 13, 2023 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

severinbeauvais commented Sep 13, 2023

JazzarKarim commented Sep 13, 2023

leodube-aot left a comment

Choose a reason for hiding this comment

ketaki-deodhar left a comment

Choose a reason for hiding this comment

severinbeauvais commented Sep 7, 2023 •

edited

Loading

severinbeauvais Sep 13, 2023 •

edited

Loading