From b0e6642a38116a730baa6b60d8a1d213756237d4 Mon Sep 17 00:00:00 2001 From: Hrvoje Fekete Date: Wed, 3 Dec 2025 16:23:43 -0800 Subject: [PATCH 1/6] fix: name input rules logic and add xpro validation - add validation/disable button in sub search modal --- .../components/dialogs/mras-search-info.vue | 8 +++++++ app/src/components/new-request/name-input.vue | 23 +++++++++++++++++-- 2 files changed, 29 insertions(+), 2 deletions(-) diff --git a/app/src/components/dialogs/mras-search-info.vue b/app/src/components/dialogs/mras-search-info.vue index 602bd3b5d..86288960a 100644 --- a/app/src/components/dialogs/mras-search-info.vue +++ b/app/src/components/dialogs/mras-search-info.vue @@ -35,6 +35,7 @@
{{ name ? 'Search' : 'Close' }} @@ -50,6 +51,7 @@ import { Component, Vue } from 'vue-property-decorator' import { Action, Getter } from 'pinia-class' import { useStore } from '@/store' import { ActionBindingIF } from '@/interfaces/store-interfaces' +import { MRAS_MIN_LENGTH, MRAS_MAX_LENGTH } from '@/components/new-request/constants' import NameInput from '@/components/new-request/name-input.vue' import { BAD_REQUEST, NOT_FOUND, SERVICE_UNAVAILABLE } from 'http-status-codes' @@ -64,6 +66,7 @@ export default class MrasSearchInfoDialog extends Vue { @Getter(useStore) getMrasSearchResultCode!: number @Getter(useStore) getName!: string @Getter(useStore) getMrasSearchInfoModalVisible!: boolean + @Getter(useStore) isXproFlow!: boolean @Action(useStore) setMrasSearchInfoModalVisible!: ActionBindingIF @Action(useStore) setName!: ActionBindingIF @@ -125,6 +128,11 @@ export default class MrasSearchInfoDialog extends Vue { return this.getErrors } + get isDisabled (): boolean { + return !!this.name && this.isXproFlow && + (!this.name || this.name.length < MRAS_MIN_LENGTH || this.name.length > MRAS_MAX_LENGTH) + } + async handleSubmit (): Promise { this.showModal = false if (this.name) await this.startAnalyzeName(null) diff --git a/app/src/components/new-request/name-input.vue b/app/src/components/new-request/name-input.vue index b661abe99..66e6aaa34 100644 --- a/app/src/components/new-request/name-input.vue +++ b/app/src/components/new-request/name-input.vue @@ -6,7 +6,7 @@ :error-messages="message" autocomplete="chrome-off" :filled="!isReadOnly" - :rules="(searchValue && isMrasSearch) ? mrasRules : defaultRules" + :rules="getRules" :label="label" :class="{ 'read-only-mode': isReadOnly }" :disabled="isReadOnly" @@ -66,6 +66,18 @@ export default class NameInput extends Vue { this.nameInputComponent = this.$refs['nameInputRef'] } + get getRules(): any[] { + if (this.searchValue) { + if (this.isMrasSearch) { + return this.mrasRules + } + if (this.isXproFlow) { + return this.xproRules + } + return this.defaultRules + } + } + /** The array of validation rules for the MRAS corp num. */ get mrasRules (): any[] { return [ @@ -75,6 +87,13 @@ export default class NameInput extends Vue { ] } + get xproRules (): any[] { + return [ + v => (!v || v.length >= MRAS_MIN_LENGTH) || `Must be at least ${MRAS_MIN_LENGTH} characters`, + v => (!v || v.length <= MRAS_MAX_LENGTH) || `Cannot exceed ${MRAS_MAX_LENGTH} characters` + ] + } + /** Local validator when input is a MRAS corp num. */ get isCorpNumValid (): boolean { if (this.isMrasSearch) return this.nameInputComponent?.valid || false @@ -114,7 +133,7 @@ export default class NameInput extends Vue { } if (this.getErrors.includes('max_length')) { - return ['Please enter a shorter name'] + return [`Cannot exceed ${MRAS_MAX_LENGTH} characters`] } const invalidDesignationMsg = checkInvalidDesignation(this.getEntityTypeCd, this.searchValue) From 7e6384926fb11a9c77b9fe383c588050029094ff Mon Sep 17 00:00:00 2001 From: Hrvoje Fekete Date: Wed, 3 Dec 2025 16:28:11 -0800 Subject: [PATCH 2/6] fix: correct defaultRules return order in name input component --- app/src/components/new-request/name-input.vue | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/src/components/new-request/name-input.vue b/app/src/components/new-request/name-input.vue index 66e6aaa34..8bd21e466 100644 --- a/app/src/components/new-request/name-input.vue +++ b/app/src/components/new-request/name-input.vue @@ -74,8 +74,8 @@ export default class NameInput extends Vue { if (this.isXproFlow) { return this.xproRules } - return this.defaultRules } + return this.defaultRules } /** The array of validation rules for the MRAS corp num. */ From 3a98b89bfab893ec015a1ace49bb8425d2478622 Mon Sep 17 00:00:00 2001 From: Hrvoje Fekete Date: Wed, 3 Dec 2025 16:40:16 -0800 Subject: [PATCH 3/6] lint fix --- app/src/components/new-request/name-input.vue | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/src/components/new-request/name-input.vue b/app/src/components/new-request/name-input.vue index 8bd21e466..e4f6228ee 100644 --- a/app/src/components/new-request/name-input.vue +++ b/app/src/components/new-request/name-input.vue @@ -66,7 +66,7 @@ export default class NameInput extends Vue { this.nameInputComponent = this.$refs['nameInputRef'] } - get getRules(): any[] { + get getRules (): any[] { if (this.searchValue) { if (this.isMrasSearch) { return this.mrasRules From c4b26e657003aea470cd97fd4586ac8b9f872504 Mon Sep 17 00:00:00 2001 From: Hrvoje Fekete Date: Thu, 4 Dec 2025 13:32:17 -0800 Subject: [PATCH 4/6] fix: update search button logic and add xpro name validation - Update `isSearchBtnDisabled` logic for button disablement - Add `isValidXproName` getter for XPRO name length validation --- app/src/components/new-request/search.vue | 16 ++++++++++++++-- 1 file changed, 14 insertions(+), 2 deletions(-) diff --git a/app/src/components/new-request/search.vue b/app/src/components/new-request/search.vue index ed7e8930f..b0bf2556f 100644 --- a/app/src/components/new-request/search.vue +++ b/app/src/components/new-request/search.vue @@ -365,7 +365,7 @@ id="search-name-btn" class="px-9" :class="{ 'mobile-btn' : isMobile }" - :disabled="!corpNumValid" + :disabled="isSearchBtnDisabled" @click="handleSubmit(true)" > = MRAS_MIN_LENGTH && name.length <= MRAS_MAX_LENGTH + } + + get isSearchBtnDisabled (): boolean { + return (this.getHasNoCorpNum && !this.isValidXproName) || (!this.getHasNoCorpNum && !this.corpNumValid) + } + /** * If user is authenticated, create draft business and redirect to Dashboard. * If restoration/reinstatement selected, go to business dashboard. From 6095b9d9f576b7e5c70a13baf41779f2e6e13ace Mon Sep 17 00:00:00 2001 From: Hrvoje Fekete Date: Thu, 4 Dec 2025 13:45:13 -0800 Subject: [PATCH 5/6] chore: bump version to 5.8.6 and remove unused import in search component --- app/package.json | 2 +- app/src/components/new-request/search.vue | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/app/package.json b/app/package.json index f6ca427f5..9b1f9076d 100644 --- a/app/package.json +++ b/app/package.json @@ -1,6 +1,6 @@ { "name": "name-request", - "version": "5.8.5", + "version": "5.8.6", "private": true, "appName": "Name Request UI", "sbcName": "SBC Common Components", diff --git a/app/src/components/new-request/search.vue b/app/src/components/new-request/search.vue index b0bf2556f..6d8dffb48 100644 --- a/app/src/components/new-request/search.vue +++ b/app/src/components/new-request/search.vue @@ -426,7 +426,7 @@ import { Action, Getter } from 'pinia-class' import { useStore } from '@/store' import { MRAS_MIN_LENGTH, MRAS_MAX_LENGTH } from '@/components/new-request/constants' -import { getName } from '@/store/getters' + /** * This is the component that displays the new NR menus and flows. */ From ac43cb08b29998e1885d2a49379c309a230694bb Mon Sep 17 00:00:00 2001 From: Hrvoje Fekete Date: Thu, 4 Dec 2025 14:49:51 -0800 Subject: [PATCH 6/6] fix: adjust max length validation for XPRO name flow - Use dynamic max length based on `isXproFlow` condition. --- app/src/components/new-request/name-input.vue | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/app/src/components/new-request/name-input.vue b/app/src/components/new-request/name-input.vue index e4f6228ee..aa9760b3f 100644 --- a/app/src/components/new-request/name-input.vue +++ b/app/src/components/new-request/name-input.vue @@ -133,7 +133,12 @@ export default class NameInput extends Vue { } if (this.getErrors.includes('max_length')) { - return [`Cannot exceed ${MRAS_MAX_LENGTH} characters`] + let maxCharacters = DFLT_MAX_LENGTH + if (this.isXproFlow) { + maxCharacters = MRAS_MAX_LENGTH + } + + return [`Cannot exceed ${maxCharacters} characters`] } const invalidDesignationMsg = checkInvalidDesignation(this.getEntityTypeCd, this.searchValue)