Skip to content

Commit 7e15609

Browse files
tumms2021389tumms2021389
committed
fix: Error banner and snackbar issues
1 parent 7cdb7cb commit 7e15609

File tree

14 files changed

+176
-72
lines changed

14 files changed

+176
-72
lines changed

‎packages/angular-sdk-components/src/lib/_components/field/currency/currency.component.ts

Lines changed: 14 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -170,15 +170,25 @@ export class CurrencyComponent implements OnInit, OnDestroy {
170170
}
171171

172172
fieldOnChange(event: any) {
173-
this.angularPConnectData.actions?.onChange(this, event);
173+
const oldVal = this.value$ ?? '';
174+
const isValueChanged = Number(event.target.value).toString() !== oldVal.toString();
175+
176+
if (isValueChanged) {
177+
this.angularPConnectData.actions?.onChange(this, event);
178+
}
174179
}
175180

176181
fieldOnBlur(event: any) {
177182
// PConnect wants to use eventHandler for onBlur
178183

179-
const actionsApi = this.pConn$?.getActionsApi();
180-
const propName = (this.pConn$?.getStateProps() as any).value;
181-
handleEvent(actionsApi, 'changeNblur', propName, event?.target?.value);
184+
const oldVal = this.value$ ?? '';
185+
const isValueChanged = Number(event.target.value).toString() !== oldVal.toString();
186+
187+
if (isValueChanged) {
188+
const actionsApi = this.pConn$?.getActionsApi();
189+
const propName = (this.pConn$?.getStateProps() as any).value;
190+
handleEvent(actionsApi, 'changeNblur', propName, event?.target?.value);
191+
}
182192
}
183193

184194
getErrorMessage() {

‎packages/angular-sdk-components/src/lib/_components/field/decimal/decimal.component.ts

Lines changed: 9 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -160,12 +160,18 @@ export class DecimalComponent implements OnInit, OnDestroy {
160160
}
161161

162162
fieldOnBlur(event: any) {
163-
const actionsApi = this.pConn$?.getActionsApi();
164-
const propName = (this.pConn$?.getStateProps() as any).value;
165163
let value = event?.target?.value;
166164
value = value.replace(/,/g, '');
167165
value = value !== '' ? Number(value) : value;
168-
handleEvent(actionsApi, 'changeNblur', propName, value);
166+
167+
const oldVal = this.value$ ?? '';
168+
const isValueChanged = value.toString() !== oldVal.toString();
169+
170+
if (isValueChanged) {
171+
const actionsApi = this.pConn$?.getActionsApi();
172+
const propName = (this.pConn$?.getStateProps() as any).value;
173+
handleEvent(actionsApi, 'changeNblur', propName, value);
174+
}
169175
}
170176

171177
getErrorMessage() {

‎packages/angular-sdk-components/src/lib/_components/field/email/email.component.ts

Lines changed: 14 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -154,13 +154,23 @@ export class EmailComponent implements OnInit, OnDestroy {
154154
}
155155

156156
fieldOnChange(event: any) {
157-
this.angularPConnectData.actions?.onChange(this, event);
157+
const oldVal = this.value$ ?? '';
158+
const isValueChanged = event.target.value.toString() !== oldVal.toString();
159+
160+
if (isValueChanged) {
161+
this.angularPConnectData.actions?.onChange(this, event);
162+
}
158163
}
159164

160165
fieldOnBlur(event: any) {
161-
const actionsApi = this.pConn$?.getActionsApi();
162-
const propName = (this.pConn$?.getStateProps() as any).value;
163-
handleEvent(actionsApi, 'changeNblur', propName, event?.target?.value);
166+
const oldVal = this.value$ ?? '';
167+
const isValueChanged = event.target.value.toString() !== oldVal.toString();
168+
169+
if (isValueChanged) {
170+
const actionsApi = this.pConn$?.getActionsApi();
171+
const propName = (this.pConn$?.getStateProps() as any).value;
172+
handleEvent(actionsApi, 'changeNblur', propName, event?.target?.value);
173+
}
164174
}
165175

166176
getErrorMessage() {

‎packages/angular-sdk-components/src/lib/_components/field/integer/integer.component.ts

Lines changed: 14 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -157,13 +157,23 @@ export class IntegerComponent implements OnInit, OnDestroy {
157157
}
158158

159159
fieldOnChange(event: any) {
160-
this.angularPConnectData.actions?.onChange(this, event);
160+
const oldVal = this.value$ ?? '';
161+
const isValueChanged = event.target.value.toString() !== oldVal.toString();
162+
163+
if (isValueChanged) {
164+
this.angularPConnectData.actions?.onChange(this, event);
165+
}
161166
}
162167

163168
fieldOnBlur(event: any) {
164-
const actionsApi = this.pConn$?.getActionsApi();
165-
const propName = (this.pConn$?.getStateProps() as any).value;
166-
handleEvent(actionsApi, 'changeNblur', propName, event?.target?.value);
169+
const oldVal = this.value$ ?? '';
170+
const isValueChanged = event.target.value.toString() !== oldVal.toString();
171+
172+
if (isValueChanged) {
173+
const actionsApi = this.pConn$?.getActionsApi();
174+
const propName = (this.pConn$?.getStateProps() as any).value;
175+
handleEvent(actionsApi, 'changeNblur', propName, event?.target?.value);
176+
}
167177
}
168178

169179
getErrorMessage() {

‎packages/angular-sdk-components/src/lib/_components/field/percentage/percentage.component.ts

Lines changed: 14 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -155,13 +155,23 @@ export class PercentageComponent implements OnInit, OnDestroy {
155155
}
156156

157157
fieldOnChange(event: any) {
158-
this.angularPConnectData.actions?.onChange(this, event);
158+
const oldVal = this.value$ ?? '';
159+
const isValueChanged = event.target.value.toString() !== oldVal.toString();
160+
161+
if (isValueChanged) {
162+
this.angularPConnectData.actions?.onChange(this, event);
163+
}
159164
}
160165

161166
fieldOnBlur(event: any) {
162-
const actionsApi = this.pConn$?.getActionsApi();
163-
const propName = (this.pConn$?.getStateProps() as any).value;
164-
handleEvent(actionsApi, 'changeNblur', propName, event?.target?.value);
167+
const oldVal = this.value$ ?? '';
168+
const isValueChanged = event.target.value.toString() !== oldVal.toString();
169+
170+
if (isValueChanged) {
171+
const actionsApi = this.pConn$?.getActionsApi();
172+
const propName = (this.pConn$?.getStateProps() as any).value;
173+
handleEvent(actionsApi, 'changeNblur', propName, event?.target?.value);
174+
}
165175
}
166176

167177
getErrorMessage() {

‎packages/angular-sdk-components/src/lib/_components/field/phone/phone.component.ts

Lines changed: 7 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -159,26 +159,18 @@ export class PhoneComponent implements OnInit, OnDestroy {
159159
}
160160
}
161161

162+
// eslint-disable-next-line @typescript-eslint/no-unused-vars
163+
fieldOnBlur(event: Event) {}
164+
162165
fieldOnChange() {
163166
if (this.formGroup$.controls[this.controlName$].value) {
164-
const actionsApi = this.pConn$?.getActionsApi();
165-
const propName = (this.pConn$?.getStateProps() as any).value;
166167
const value = this.formGroup$.controls[this.controlName$].value;
167-
const eventObj = {
168-
target: {
169-
value
170-
}
171-
};
172168
this.afterBlur = true;
173-
this.angularPConnectData.actions?.onChange(this, eventObj);
174-
handleEvent(actionsApi, 'blur', propName, value);
175-
}
176-
}
177169

178-
fieldOnBlur(event: any) {
179-
const actionsApi = this.pConn$?.getActionsApi();
180-
const propName = (this.pConn$?.getStateProps() as any).value;
181-
handleEvent(actionsApi, 'changeNblur', propName, event?.target?.value);
170+
const actionsApi = this.pConn$.getActionsApi();
171+
const propName = (this.pConn$.getStateProps() as any).value;
172+
handleEvent(actionsApi, 'changeNblur', propName, value);
173+
}
182174
}
183175

184176
getErrorMessage() {

‎packages/angular-sdk-components/src/lib/_components/field/text-area/text-area.component.ts

Lines changed: 8 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -157,9 +157,14 @@ export class TextAreaComponent implements OnInit, OnDestroy {
157157
}
158158

159159
fieldOnChange(event: any) {
160-
const actionsApi = this.pConn$?.getActionsApi();
161-
const propName = (this.pConn$?.getStateProps() as any).value;
162-
handleEvent(actionsApi, 'changeNblur', propName, event?.target?.value);
160+
const oldVal = this.value$ ?? '';
161+
const isValueChanged = event.target.value.toString() !== oldVal.toString();
162+
163+
if (isValueChanged) {
164+
const actionsApi = this.pConn$?.getActionsApi();
165+
const propName = (this.pConn$?.getStateProps() as any).value;
166+
handleEvent(actionsApi, 'changeNblur', propName, event?.target?.value);
167+
}
163168
}
164169

165170
getErrorMessage() {

‎packages/angular-sdk-components/src/lib/_components/field/text-input/text-input.component.ts

Lines changed: 14 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -157,13 +157,23 @@ export class TextInputComponent implements OnInit, OnDestroy {
157157
}
158158

159159
fieldOnChange(event: any) {
160-
this.angularPConnectData.actions?.onChange(this, event);
160+
const oldVal = this.value$ ?? '';
161+
const isValueChanged = event.target.value.toString() !== oldVal.toString();
162+
163+
if (isValueChanged) {
164+
this.angularPConnectData.actions?.onChange(this, event);
165+
}
161166
}
162167

163168
fieldOnBlur(event: any) {
164-
const actionsApi = this.pConn$?.getActionsApi();
165-
const propName = (this.pConn$?.getStateProps() as any).value;
166-
handleEvent(actionsApi, 'changeNblur', propName, event?.target?.value);
169+
const oldVal = this.value$ ?? '';
170+
const isValueChanged = event.target.value.toString() !== oldVal.toString();
171+
172+
if (isValueChanged) {
173+
const actionsApi = this.pConn$?.getActionsApi();
174+
const propName = (this.pConn$?.getStateProps() as any).value;
175+
handleEvent(actionsApi, 'changeNblur', propName, event?.target?.value);
176+
}
167177
}
168178

169179
getErrorMessage() {

‎packages/angular-sdk-components/src/lib/_components/field/url/url.component.ts

Lines changed: 14 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -155,13 +155,23 @@ export class UrlComponent implements OnInit, OnDestroy {
155155
}
156156

157157
fieldOnChange(event: any) {
158-
this.angularPConnectData.actions?.onChange(this, event);
158+
const oldVal = this.value$ ?? '';
159+
const isValueChanged = event.target.value.toString() !== oldVal.toString();
160+
161+
if (isValueChanged) {
162+
this.angularPConnectData.actions?.onChange(this, event);
163+
}
159164
}
160165

161166
fieldOnBlur(event: any) {
162-
const actionsApi = this.pConn$?.getActionsApi();
163-
const propName = (this.pConn$?.getStateProps() as any).value;
164-
handleEvent(actionsApi, 'changeNblur', propName, event?.target?.value);
167+
const oldVal = this.value$ ?? '';
168+
const isValueChanged = event.target.value.toString() !== oldVal.toString();
169+
170+
if (isValueChanged) {
171+
const actionsApi = this.pConn$?.getActionsApi();
172+
const propName = (this.pConn$?.getStateProps() as any).value;
173+
handleEvent(actionsApi, 'changeNblur', propName, event?.target?.value);
174+
}
165175
}
166176

167177
getErrorMessage() {

‎packages/angular-sdk-components/src/lib/_components/infra/Containers/flow-container/flow-container.component.ts

Lines changed: 13 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -119,6 +119,14 @@ export class FlowContainerComponent extends FlowContainerBaseComponent implement
119119
},
120120
'cancelPressed'
121121
);
122+
123+
PCore.getPubSubUtils().subscribe(
124+
'clearBannerMessages',
125+
() => {
126+
this.banners = [];
127+
},
128+
'CLEAR_BANNER_MESSAGES'
129+
);
122130
}
123131

124132
ngOnDestroy() {
@@ -129,6 +137,7 @@ export class FlowContainerComponent extends FlowContainerBaseComponent implement
129137
PCore.getPubSubUtils().unsubscribe(PCore.getConstants().PUB_SUB_EVENTS.EVENT_CANCEL, 'cancelAssignment');
130138

131139
PCore.getPubSubUtils().unsubscribe('cancelPressed', 'cancelPressed');
140+
PCore.getPubSubUtils().unsubscribe('clearBannerMessages', 'CLEAR_BANNER_MESSAGES');
132141
}
133142

134143
handleCancel() {
@@ -152,14 +161,15 @@ export class FlowContainerComponent extends FlowContainerBaseComponent implement
152161
const pConn = this.pConnectOfActiveContainerItem || this.pConn$;
153162
const caseViewModeFromProps = this.angularPConnect.getComponentProp(this, 'caseViewMode');
154163
const caseViewModeFromRedux = pConn.getValue('context_data.caseViewMode', '');
164+
const completeProps = this.angularPConnect.getCurrentCompleteProps(this) as FlowContainerProps;
155165

156166
// ONLY call updateSelf when the component should update
157167
// AND removing the "gate" that was put there since shouldComponentUpdate
158168
// should be the real "gate"
169+
// eslint-disable-next-line sonarjs/no-collapsible-if
159170
if (bUpdateSelf || caseViewModeFromProps !== caseViewModeFromRedux) {
160171
// don't want to redraw the flow container when there are page messages, because
161172
// the redraw causes us to loose the errors on the elements
162-
const completeProps = this.angularPConnect.getCurrentCompleteProps(this) as FlowContainerProps;
163173
if (!completeProps.pageMessages || completeProps.pageMessages.length == 0) {
164174
// with a cancel, need to timeout so todo will update correctly
165175
if (this.bHasCancel) {
@@ -170,10 +180,10 @@ export class FlowContainerComponent extends FlowContainerBaseComponent implement
170180
} else {
171181
this.updateSelf();
172182
}
173-
} else {
174-
this.showPageMessages(completeProps);
175183
}
176184
}
185+
186+
this.showPageMessages(completeProps);
177187
}
178188

179189
showPageMessages(completeProps: FlowContainerProps) {

0 commit comments

Comments
 (0)