31894 and 32573 Updated par value validation and display by severinbeauvais · Pull Request #843 · bcgov/business-create-ui

severinbeauvais · 2026-03-02T19:26:24Z

Issue #: bcgov/entity#31894 and bcgov/entity#32573

Description of changes:

Commit 1:

app version = 5.16.32
used default header (same as edit UI)
updated share classes styling to match Edit UI
created function to format par values
updated par value rules
created function to count significant digits
added/updated unit tests

Commit 2:

implemented Copilot suggestions

Commit 3:

added "ul" tags around list items
moved FormatCurrency to own util file
refactored FormatCurrency
added unit tests for FormatCurrency

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

- used default header (same as edit UI) - updated share classes styling to match Edit UI - created function to format par values - updated par value rules - created function to count significant digits - added/updated unit tests

Copilot

Pull request overview

Updates share structure par value validation and display to align with the Edit UI, including introducing a significant-digits-based validation rule and formatting/par-value display changes.

Changes:

Add SignificantDigits utility + unit tests and wire it into par value validation.
Update Share Structure validation messaging/tests for the new par value rules.
Update List Share Class table header/styling and add par value formatting for display.

Reviewed changes

Copilot reviewed 7 out of 9 changed files in this pull request and generated 4 comments.

Show a summary per file

File	Description
tests/unit/SignificantDigits.spec.ts	Adds unit coverage for the new significant digits utility.
tests/unit/ShareStructure.spec.ts	Updates par value validation tests to match new significant-digit rule/message.
src/utils/index.ts	Re-exports `SignificantDigits` from the utils barrel.
src/utils/SignificantDigits.ts	Introduces significant digits counting helper.
src/components/common/ShareStructure.vue	Replaces decimal-place rules with significant-digits validation for par value.
src/components/common/ListShareClass.vue	Updates share class/series table header/styling and formats displayed par values.
package.json	Bumps app version to 5.16.32.
package-lock.json	Updates lockfile version metadata (and adds a license field entry).
.gitignore	Ignores Copilot instruction/agent files under `.github`.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

src/components/common/ListShareClass.vue

Copilot · 2026-03-02T19:31:07Z

src/components/common/ListShareClass.vue

+              <li>
+                <span class="ml-n1">{{ seriesItem.name }}</span>
+              </li>


The template renders an <li> directly inside a <td> without a surrounding <ul>/<ol>, which is invalid HTML and can cause inconsistent styling / screen-reader output. Replace the <li> with a non-list element (eg, /<div>) or wrap the series rows in a proper list container if list semantics are intended.

Suggested change

<li>

{{ seriesItem.name }}

</li>

{{ seriesItem.name }}

I copied this from Edit UI. It displays just the bullet properly in all modern browsers.

Invalid HTML though...

But if it works it works and worth keeping consistent between UIs, on one hand

Yeah, I'll just fix in both UIs.

src/components/common/ShareStructure.vue

tests/unit/ShareStructure.spec.ts

severinbeauvais · 2026-03-02T20:01:01Z

src/components/common/ListShareClass.vue

-              </th>
-            </tr>
-          </thead>
-        </template>


I deleted this code in favour of using the default header -- same as in Edit UI.

severinbeauvais · 2026-03-02T20:05:29Z

src/components/common/ListShareClass.vue

              {{ row.item.name }}
            </td>
-            <td class="share-series-value">
+            <td class="share-series-value text-right">


Similar alignment as in Edit UI:

severinbeauvais · 2026-03-02T20:05:52Z

src/components/common/ListShareClass.vue

-              <span>{{ seriesItem.name }}</span>
+              <li>
+                <span class="ml-n1">{{ seriesItem.name }}</span>
+              </li>


Similar indent and bullet as in Edit UI:

severinbeauvais · 2026-03-02T20:06:53Z

src/components/common/ListShareClass.vue

-  }
-
-  td:not(:first-child){
-    color: $gray6;


Gray6 is not a colour we should be using.

I updated some colours here to match Edit UI:

severinbeauvais · 2026-03-02T20:07:47Z

.gitignore

+
+# Copilot custom instructions
+/**/.github/copilot-instructions.md
+/**/.github/agents/


In case you configure some AI tools in your VS Code 😉

Since you're both curious: https://code.visualstudio.com/docs/copilot/overview

meawong

LGTM!

loneil · 2026-03-02T23:03:19Z

src/components/common/ListShareClass.vue

+  /** Returns a formatted par value. */
+  formatParValue (item: any): string {
+    /** Returns a number formatted with a minimum of two decimal places. */
+    function formatWithMinTwoDecimals (value: number): string {


Any need on toLocaleString for the par value formatted? The max shares above uses it in the template so I think would show 1,000,000 and then par value would show 1000000 if I'm understanding.
Not sure if realistic use case...

Adding grouping (commas) wasn't a requirement but I didn't like some of my examples anyways so I'm rewriting this.

I've completed my refactoring.

- moved FormatCurrency to own util file - refactored FormatCurrency - added unit tests for FormatCurrency

severinbeauvais · 2026-03-03T18:13:43Z

/gcbrun

bcregistry-sre · 2026-03-03T18:18:24Z

Temporary Url for review: https://business-create-dev--pr-843-x5xyygqw.web.app

SB says, try this:

IA in preview site: https://business-create-dev--pr-843-x5xyygqw.web.app/incorporation-share-structure?id=T298MILVXK
IA in Dev: https://dev.create.business.bcregistry.gov.bc.ca/incorporation-share-structure?id=T298MILVXK
Alteration in Edit UI: https://dev.edit.business.bcregistry.gov.bc.ca/BC0888261/alteration?businessid=BC0888261

severinbeauvais · 2026-03-03T18:22:52Z

tests/unit/ListShareClass.spec.ts

      vuetify,
      propsData: { shareClasses }
    })
+    await flushPromises()


This was an attempt to fix the broken unit tests in this test suite.

The root cause was actually that our CI environment doesn't support maximumFractionDigits: 100.

The current change is always a good idea and is consistent with other unit tests so I'm leaving it.

loneil

Looks good, would want QA to put it through it's paces when deployed trying all sorts of options, and saving/completing the filing too, so that the DB field (not just he filing json field) for par value is verified for these conditions

severinbeauvais · 2026-03-03T18:38:44Z

Looks good, would want QA to put it through it's paces when deployed trying all sorts of options, and saving/completing the filing too, so that the DB field (not just he filing json field) for par value is verified for these conditions

I filed my test IA. The new business is: https://dev.business-dashboard.bcregistry.gov.bc.ca/BC0888490

Also, the tickets have the UX Assurance label on them already :)

- app version = 5.16.32

467180f

- used default header (same as edit UI) - updated share classes styling to match Edit UI - created function to format par values - updated par value rules - created function to count significant digits - added/updated unit tests

severinbeauvais self-assigned this Mar 2, 2026

Copilot AI review requested due to automatic review settings March 2, 2026 19:26

Copilot started reviewing on behalf of severinbeauvais March 2, 2026 19:26 View session

Copilot AI reviewed Mar 2, 2026

View reviewed changes

- implemented Copilot suggestions

4ba7143

severinbeauvais requested review from loneil and meawong March 2, 2026 19:59

severinbeauvais commented Mar 2, 2026

View reviewed changes

severinbeauvais changed the title ~~31894 Updated par value validation and display~~ 31894 and 32573 Updated par value validation and display Mar 2, 2026

meawong approved these changes Mar 2, 2026

View reviewed changes

loneil reviewed Mar 2, 2026

View reviewed changes

Severin Beauvais added 3 commits March 3, 2026 09:53

- added "ul" tags around list items

9f9a8d5

- moved FormatCurrency to own util file - refactored FormatCurrency - added unit tests for FormatCurrency

wip

41bbd5b

- adjusted maximumFractionDigits so results in Node === results locally

8c670ac

bcgov deleted a comment from bcregistry-sre Mar 3, 2026

severinbeauvais commented Mar 3, 2026

View reviewed changes

loneil approved these changes Mar 3, 2026

View reviewed changes

severinbeauvais merged commit 69269e9 into bcgov:main Mar 3, 2026
8 checks passed

Conversation

severinbeauvais commented Mar 2, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Reviewed changes

Uh oh!

Uh oh!

Copilot AI Mar 2, 2026

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

meawong left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

severinbeauvais commented Mar 3, 2026

Uh oh!

bcregistry-sre commented Mar 3, 2026 • edited by severinbeauvais Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Choose a reason for hiding this comment

Uh oh!

loneil left a comment

Choose a reason for hiding this comment

Uh oh!

severinbeauvais commented Mar 3, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

5 participants

severinbeauvais commented Mar 2, 2026 •

edited

Loading

bcregistry-sre commented Mar 3, 2026 •

edited by severinbeauvais

Loading

severinbeauvais commented Mar 3, 2026 •

edited

Loading