From eba2e51541385ea669dfde8a53a74d658acde9a9 Mon Sep 17 00:00:00 2001 From: Rinat Arsaev <11846445+A77AY@users.noreply.github.com> Date: Tue, 19 Sep 2023 15:49:17 +0400 Subject: [PATCH] IMP-81: New select autocomple for terminals, party and others (#256) --- package-lock.json | 25 +---- package.json | 3 +- .../add-routing-rule-dialog.component.html | 17 ++-- .../add-routing-rule-dialog.component.ts | 4 - .../add-routing-rule-dialog.module.ts | 3 + .../add-routing-rule-dialog.service.ts | 4 +- .../routing-ruleset.component.html | 2 +- .../domain-object-field.component.html | 4 +- .../domain-object-field.component.ts | 32 +++--- .../merchant-field.component.html | 6 +- .../merchant-field.component.ts | 65 ++++++------ .../merchant-field/merchant-field.module.ts | 5 +- .../payout-tool-field.component.html | 6 +- .../payout-tool-field.component.ts | 29 ++---- .../payout-tool-field.module.ts | 6 +- .../shared/services/fetch-parties.service.ts | 12 ++- src/components/select-search-field/index.ts | 4 - .../select-search-field.component.html | 59 ----------- .../select-search-field.component.scss | 9 -- .../select-search-field.component.ts | 99 ------------------- .../select-search-field.module.ts | 31 ------ src/components/select-search-field/tokens.ts | 8 -- .../select-search-field/types/index.ts | 1 - .../select-search-field/types/option.ts | 5 - .../utils/filter-options.ts | 14 --- .../select-search-field/utils/index.ts | 1 - .../create-control-providers.ts | 4 + .../provide-validators.ts | 4 + .../provide-value-accessor.ts | 4 + .../utils/get-errors-tree.ts | 1 + .../validated-control-superclass.directive.ts | 3 + ...dated-form-control-superclass.directive.ts | 3 + 32 files changed, 115 insertions(+), 358 deletions(-) delete mode 100644 src/components/select-search-field/index.ts delete mode 100644 src/components/select-search-field/select-search-field.component.html delete mode 100644 src/components/select-search-field/select-search-field.component.scss delete mode 100644 src/components/select-search-field/select-search-field.component.ts delete mode 100644 src/components/select-search-field/select-search-field.module.ts delete mode 100644 src/components/select-search-field/tokens.ts delete mode 100644 src/components/select-search-field/types/index.ts delete mode 100644 src/components/select-search-field/types/option.ts delete mode 100644 src/components/select-search-field/utils/filter-options.ts delete mode 100644 src/components/select-search-field/utils/index.ts diff --git a/package-lock.json b/package-lock.json index ea7476cb..d051a19f 100644 --- a/package-lock.json +++ b/package-lock.json @@ -29,7 +29,7 @@ "@vality/dominant-cache-proto": "2.0.1-99f38c9.0", "@vality/fistful-proto": "2.0.0", "@vality/magista-proto": "2.0.2-e46bba2.0", - "@vality/ng-core": "16.2.1-pr-33-0ae5287.0", + "@vality/ng-core": "16.2.1-pr-33-0e1ce8c.0", "@vality/payout-manager-proto": "2.0.1-b079679.0", "@vality/repairer-proto": "2.0.1-8f7973d.0", "@vality/thrift-ts": "2.4.1-8ad5123.0", @@ -44,7 +44,6 @@ "lodash-es": "4.17.21", "moment": "2.29.4", "monaco-editor": "0.21.2", - "ngx-mat-select-search": "7.0.2", "papaparse": "5.4.1", "rxjs": "7.8.1", "short-uuid": "4.2.2", @@ -6002,9 +6001,9 @@ "integrity": "sha512-2cPVToAJRdt1CFQ6G/C6ngw6hp94Jp7WFtPtNvtlcCSXRYRnppoi3KpK14tBH9SlLeqrpSy0IrIsCnAkj7tFfg==" }, "node_modules/@vality/ng-core": { - "version": "16.2.1-pr-33-0ae5287.0", - "resolved": "https://registry.npmjs.org/@vality/ng-core/-/ng-core-16.2.1-pr-33-0ae5287.0.tgz", - "integrity": "sha512-utA80+v58QMxzgNcLZ1hFRAO5RGcCyDW6/TJl1FZmDhja/P1FInZVWZIonaZJI/a+yf+YsSPboqM+QeQGZ595g==", + "version": "16.2.1-pr-33-0e1ce8c.0", + "resolved": "https://registry.npmjs.org/@vality/ng-core/-/ng-core-16.2.1-pr-33-0e1ce8c.0.tgz", + "integrity": "sha512-nLPX5MtNjyBCeaqIngXjcPcp1tpD9GiLCOoCL0YukJT7wC9MQQg4npQl6SKGRR4rzGOotse71Fmk1EzVJEXP3A==", "dependencies": { "@ng-matero/extensions": "^16.0.0", "@s-libs/js-core": "^16.0.0", @@ -16754,22 +16753,6 @@ "@angular/core": ">=16.0.0-0" } }, - "node_modules/ngx-mat-select-search": { - "version": "7.0.2", - "resolved": "https://registry.npmjs.org/ngx-mat-select-search/-/ngx-mat-select-search-7.0.2.tgz", - "integrity": "sha512-69vy/mWh7pnnR6rw1BWxO8E4HyylUvvBlmhrtWqXIYqfIx3mfvWuNj0tE1v+ERPg8a4vViFpfilRUUvvbrv1cA==", - "dependencies": { - "tslib": "^2.4.0" - }, - "peerDependencies": { - "@angular/material": "^15.0.0 || ^16.0.0" - } - }, - "node_modules/ngx-mat-select-search/node_modules/tslib": { - "version": "2.5.3", - "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.5.3.tgz", - "integrity": "sha512-mSxlJJwl3BMEQCUNnxXBU9jP4JBktcEGhURcPR6VQVlnP0FdDEsIaz0C35dXNGLyRfrATNofF0F5p2KPxQgB+w==" - }, "node_modules/nice-napi": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/nice-napi/-/nice-napi-1.0.2.tgz", diff --git a/package.json b/package.json index 7f213fb0..fe3cb2c6 100644 --- a/package.json +++ b/package.json @@ -37,7 +37,7 @@ "@vality/dominant-cache-proto": "2.0.1-99f38c9.0", "@vality/fistful-proto": "2.0.0", "@vality/magista-proto": "2.0.2-e46bba2.0", - "@vality/ng-core": "16.2.1-pr-33-0ae5287.0", + "@vality/ng-core": "16.2.1-pr-33-0e1ce8c.0", "@vality/payout-manager-proto": "2.0.1-b079679.0", "@vality/repairer-proto": "2.0.1-8f7973d.0", "@vality/thrift-ts": "2.4.1-8ad5123.0", @@ -52,7 +52,6 @@ "lodash-es": "4.17.21", "moment": "2.29.4", "monaco-editor": "0.21.2", - "ngx-mat-select-search": "7.0.2", "papaparse": "5.4.1", "rxjs": "7.8.1", "short-uuid": "4.2.2", diff --git a/src/app/sections/routing-rules/routing-ruleset/add-routing-rule-dialog/add-routing-rule-dialog.component.html b/src/app/sections/routing-rules/routing-ruleset/add-routing-rule-dialog/add-routing-rule-dialog.component.html index d2c23d23..51d98ca7 100644 --- a/src/app/sections/routing-rules/routing-ruleset/add-routing-rule-dialog/add-routing-rule-dialog.component.html +++ b/src/app/sections/routing-rules/routing-ruleset/add-routing-rule-dialog/add-routing-rule-dialog.component.html @@ -95,17 +95,12 @@
- - Terminal - - - {{ terminal.data.name }} - - - +
diff --git a/src/app/sections/routing-rules/routing-ruleset/add-routing-rule-dialog/add-routing-rule-dialog.component.ts b/src/app/sections/routing-rules/routing-ruleset/add-routing-rule-dialog/add-routing-rule-dialog.component.ts index 53a281c5..7bbebdcf 100644 --- a/src/app/sections/routing-rules/routing-ruleset/add-routing-rule-dialog/add-routing-rule-dialog.component.ts +++ b/src/app/sections/routing-rules/routing-ruleset/add-routing-rule-dialog/add-routing-rule-dialog.component.ts @@ -5,8 +5,6 @@ import { domain } from '@vality/domain-proto'; import { Predicate } from '@vality/domain-proto/domain'; import { DialogSuperclass } from '@vality/ng-core'; -import { DomainStoreService } from '@cc/app/api/deprecated-damsel'; - import { AddRoutingRuleDialogService, TerminalType } from './add-routing-rule-dialog.service'; @UntilDestroy() @@ -25,12 +23,10 @@ export class AddRoutingRuleDialogComponent extends DialogSuperclass< terminalType = TerminalType; riskScore = domain.RiskScore; - terminals$ = this.domainStoreService.getObjects('terminal'); constructor( injector: Injector, private addShopRoutingRuleDialogService: AddRoutingRuleDialogService, - private domainStoreService: DomainStoreService, private fb: FormBuilder, ) { super(injector); diff --git a/src/app/sections/routing-rules/routing-ruleset/add-routing-rule-dialog/add-routing-rule-dialog.module.ts b/src/app/sections/routing-rules/routing-ruleset/add-routing-rule-dialog/add-routing-rule-dialog.module.ts index 6d1a2b66..36eba519 100644 --- a/src/app/sections/routing-rules/routing-ruleset/add-routing-rule-dialog/add-routing-rule-dialog.module.ts +++ b/src/app/sections/routing-rules/routing-ruleset/add-routing-rule-dialog/add-routing-rule-dialog.module.ts @@ -15,6 +15,8 @@ import { DialogModule } from '@vality/ng-core'; import { MetadataFormModule } from '@cc/app/shared/components/metadata-form'; +import { DomainObjectFieldComponent } from '../../../../shared'; + import { AddRoutingRuleDialogComponent } from './add-routing-rule-dialog.component'; import { ExpanderComponent } from './expander'; import { PredicateComponent } from './predicate'; @@ -35,6 +37,7 @@ import { PredicateComponent } from './predicate'; MatAutocompleteModule, MetadataFormModule, DialogModule, + DomainObjectFieldComponent, ], declarations: [AddRoutingRuleDialogComponent, PredicateComponent, ExpanderComponent], exports: [AddRoutingRuleDialogComponent], diff --git a/src/app/sections/routing-rules/routing-ruleset/add-routing-rule-dialog/add-routing-rule-dialog.service.ts b/src/app/sections/routing-rules/routing-ruleset/add-routing-rule-dialog/add-routing-rule-dialog.service.ts index e10e5099..281c62e0 100644 --- a/src/app/sections/routing-rules/routing-ruleset/add-routing-rule-dialog/add-routing-rule-dialog.service.ts +++ b/src/app/sections/routing-rules/routing-ruleset/add-routing-rule-dialog/add-routing-rule-dialog.service.ts @@ -4,7 +4,7 @@ import { MatDialogRef } from '@angular/material/dialog'; import { Predicate } from '@vality/domain-proto/domain'; import { DialogResponseStatus } from '@vality/ng-core'; import { of } from 'rxjs'; -import { startWith, switchMap, take } from 'rxjs/operators'; +import { startWith, take, switchMap } from 'rxjs/operators'; import { RoutingRulesService } from '../../services/routing-rules'; @@ -22,7 +22,7 @@ export class AddRoutingRuleDialogService { weight: '', priority: 1000, terminalType: [null, Validators.required], - existentTerminalID: ['', Validators.required], + existentTerminalID: [null, Validators.required], newTerminal: this.fb.group({ name: ['', Validators.required], description: ['', Validators.required], diff --git a/src/app/sections/routing-rules/routing-ruleset/routing-ruleset.component.html b/src/app/sections/routing-rules/routing-ruleset/routing-ruleset.component.html index 5f978086..0e8ccf1d 100644 --- a/src/app/sections/routing-rules/routing-ruleset/routing-ruleset.component.html +++ b/src/app/sections/routing-rules/routing-ruleset/routing-ruleset.component.html @@ -62,7 +62,7 @@ > - + diff --git a/src/app/shared/components/domain-object-field/domain-object-field.component.html b/src/app/shared/components/domain-object-field/domain-object-field.component.html index 2c1e6259..5d938d5e 100644 --- a/src/app/shared/components/domain-object-field/domain-object-field.component.html +++ b/src/app/shared/components/domain-object-field/domain-object-field.component.html @@ -1,6 +1,6 @@ - +> diff --git a/src/app/shared/components/domain-object-field/domain-object-field.component.ts b/src/app/shared/components/domain-object-field/domain-object-field.component.ts index 148c66bb..49ae8e7c 100644 --- a/src/app/shared/components/domain-object-field/domain-object-field.component.ts +++ b/src/app/shared/components/domain-object-field/domain-object-field.component.ts @@ -1,8 +1,14 @@ import { CommonModule } from '@angular/common'; import { Component, Input, OnChanges } from '@angular/core'; -import { FormControl, ReactiveFormsModule } from '@angular/forms'; +import { ReactiveFormsModule } from '@angular/forms'; import { DomainObject } from '@vality/domain-proto/internal/domain'; -import { ComponentChanges } from '@vality/ng-core'; +import { + ComponentChanges, + FormControlSuperclass, + createControlProviders, + SelectFieldModule, + Option, +} from '@vality/ng-core'; import { defer, switchMap, ReplaySubject } from 'rxjs'; import { shareReplay, map } from 'rxjs/operators'; @@ -12,24 +18,22 @@ import { OtherDomainObjects, defaultDomainObjectToOption, } from '@cc/app/shared/services/domain-metadata-form-extensions/utils/domains-objects-to-options'; -import { SelectSearchFieldModule } from '@cc/components/select-search-field'; -import { ValidatedFormControlSuperclass, provideValueAccessor } from '@cc/utils'; + +type DomainObjectID = unknown; @Component({ standalone: true, selector: 'cc-domain-object-field', templateUrl: './domain-object-field.component.html', - providers: [provideValueAccessor(() => DomainObjectFieldComponent)], - imports: [CommonModule, SelectSearchFieldModule, ReactiveFormsModule], + providers: createControlProviders(() => DomainObjectFieldComponent), + imports: [CommonModule, ReactiveFormsModule, SelectFieldModule], }) export class DomainObjectFieldComponent - extends ValidatedFormControlSuperclass + extends FormControlSuperclass implements OnChanges { @Input() name: T; - control = new FormControl(null); - options$ = defer(() => this.name$).pipe( switchMap((name) => this.domainStoreService.getObjects(name)), map((objs) => { @@ -37,9 +41,13 @@ export class DomainObjectFieldComponent this.name in DOMAIN_OBJECTS_TO_OPTIONS ? DOMAIN_OBJECTS_TO_OPTIONS[this.name as keyof OtherDomainObjects] : defaultDomainObjectToOption; - return objs - .map(domainObjectToOption) - .map((o) => ({ ...o, description: `#${String(o.value)}` })); + return objs.map(domainObjectToOption).map( + (o): Option => ({ + label: o.label, + value: o.value, + description: String(o.value), + }), + ); }), shareReplay({ bufferSize: 1, refCount: true }), ); diff --git a/src/app/shared/components/merchant-field/merchant-field.component.html b/src/app/shared/components/merchant-field/merchant-field.component.html index f13b51b9..b31057d0 100644 --- a/src/app/shared/components/merchant-field/merchant-field.component.html +++ b/src/app/shared/components/merchant-field/merchant-field.component.html @@ -1,9 +1,9 @@ - +> diff --git a/src/app/shared/components/merchant-field/merchant-field.component.ts b/src/app/shared/components/merchant-field/merchant-field.component.ts index 00219a6e..bc626092 100644 --- a/src/app/shared/components/merchant-field/merchant-field.component.ts +++ b/src/app/shared/components/merchant-field/merchant-field.component.ts @@ -1,24 +1,17 @@ import { Component, Input, AfterViewInit } from '@angular/core'; -import { MatSnackBar } from '@angular/material/snack-bar'; import { UntilDestroy, untilDestroyed } from '@ngneat/until-destroy'; import { PartyID } from '@vality/domain-proto/domain'; -import { coerceBoolean } from 'coerce-property'; -import { BehaviorSubject, Observable, of, ReplaySubject, Subject, merge } from 'rxjs'; import { - catchError, - debounceTime, - filter, - map, - switchMap, - first, - takeUntil, - startWith, -} from 'rxjs/operators'; + Option, + NotifyLogService, + FormControlSuperclass, + createControlProviders, +} from '@vality/ng-core'; +import { coerceBoolean } from 'coerce-property'; +import { BehaviorSubject, Observable, of, ReplaySubject, Subject } from 'rxjs'; +import { catchError, debounceTime, map, switchMap, tap, startWith } from 'rxjs/operators'; import { DeanonimusService } from '@cc/app/api/deanonimus'; -import { Option } from '@cc/components/select-search-field'; -import { createControlProviders, ValidatedFormControlSuperclass } from '@cc/utils'; -import { progressTo } from '@cc/utils/operators'; @UntilDestroy() @Component({ @@ -27,7 +20,7 @@ import { progressTo } from '@cc/utils/operators'; providers: createControlProviders(() => MerchantFieldComponent), }) export class MerchantFieldComponent - extends ValidatedFormControlSuperclass + extends FormControlSuperclass implements AfterViewInit { @Input() label: string; @@ -35,41 +28,45 @@ export class MerchantFieldComponent options$ = new ReplaySubject[]>(1); searchChange$ = new Subject(); - progress$ = new BehaviorSubject(0); + progress$ = new BehaviorSubject(false); constructor( private deanonimusService: DeanonimusService, - private snackBar: MatSnackBar, + private log: NotifyLogService, ) { super(); } ngAfterViewInit() { - merge( - this.searchChange$, - this.control.valueChanges.pipe( - startWith(this.control.value), - filter(Boolean), - first(), - takeUntil(this.searchChange$), - ), - ) + this.searchChange$ .pipe( - filter(Boolean), + startWith(this.control.value), + tap(() => { + this.options$.next([]); + this.progress$.next(true); + }), debounceTime(600), - switchMap((str) => this.searchOptions(str)), + switchMap((term) => this.searchOptions(term)), untilDestroyed(this), ) - .subscribe((options) => this.options$.next(options)); + .subscribe((options) => { + this.options$.next(options); + this.progress$.next(false); + }); } private searchOptions(str: string): Observable[]> { + if (!str) return of([]); return this.deanonimusService.searchParty(str).pipe( - map((parties) => parties.map((p) => ({ label: p.party.email, value: p.party.id }))), - progressTo(this.progress$), + map((parties) => + parties.map((p) => ({ + label: p.party.email, + value: p.party.id, + description: p.party.id, + })), + ), catchError((err) => { - this.snackBar.open('Search error', 'OK', { duration: 2000 }); - console.error(err); + this.log.error(err, 'Search error'); return of([]); }), ); diff --git a/src/app/shared/components/merchant-field/merchant-field.module.ts b/src/app/shared/components/merchant-field/merchant-field.module.ts index 2a6e2c89..283ce8f8 100644 --- a/src/app/shared/components/merchant-field/merchant-field.module.ts +++ b/src/app/shared/components/merchant-field/merchant-field.module.ts @@ -1,13 +1,12 @@ import { CommonModule } from '@angular/common'; import { NgModule } from '@angular/core'; import { ReactiveFormsModule } from '@angular/forms'; - -import { SelectSearchFieldModule } from '@cc/components/select-search-field'; +import { SelectFieldModule } from '@vality/ng-core'; import { MerchantFieldComponent } from './merchant-field.component'; @NgModule({ - imports: [CommonModule, ReactiveFormsModule, SelectSearchFieldModule], + imports: [CommonModule, ReactiveFormsModule, SelectFieldModule], declarations: [MerchantFieldComponent], exports: [MerchantFieldComponent], }) diff --git a/src/app/shared/components/payout-tool-field/payout-tool-field.component.html b/src/app/shared/components/payout-tool-field/payout-tool-field.component.html index 5b7202ac..fd0953f7 100644 --- a/src/app/shared/components/payout-tool-field/payout-tool-field.component.html +++ b/src/app/shared/components/payout-tool-field/payout-tool-field.component.html @@ -1,9 +1,7 @@ - +> diff --git a/src/app/shared/components/payout-tool-field/payout-tool-field.component.ts b/src/app/shared/components/payout-tool-field/payout-tool-field.component.ts index d415c081..859c9bad 100644 --- a/src/app/shared/components/payout-tool-field/payout-tool-field.component.ts +++ b/src/app/shared/components/payout-tool-field/payout-tool-field.component.ts @@ -1,15 +1,13 @@ -import { ChangeDetectionStrategy, Component, Input, OnInit } from '@angular/core'; -import { FormControl } from '@angular/forms'; +import { Component, Input, OnInit } from '@angular/core'; import { UntilDestroy } from '@ngneat/until-destroy'; import { PayoutTool } from '@vality/domain-proto/domain'; import { PartyID, ShopID } from '@vality/domain-proto/payment_processing'; +import { createControlProviders, FormControlSuperclass, Option } from '@vality/ng-core'; import { coerceBoolean } from 'coerce-property'; -import { BehaviorSubject, combineLatest, defer, Observable, of, Subject, switchMap } from 'rxjs'; -import { map, pluck, shareReplay, startWith } from 'rxjs/operators'; +import { BehaviorSubject, combineLatest, defer, Observable, of, switchMap } from 'rxjs'; +import { map, shareReplay } from 'rxjs/operators'; import { PartyManagementService } from '@cc/app/api/payment-processing'; -import { Option } from '@cc/components/select-search-field'; -import { createControlProviders, ValidatedControlSuperclass } from '@cc/utils/forms'; import { handleError, NotificationErrorService } from '../../services/notification-error'; @@ -17,11 +15,10 @@ import { handleError, NotificationErrorService } from '../../services/notificati @Component({ selector: 'cc-payout-tool-field', templateUrl: 'payout-tool-field.component.html', - changeDetection: ChangeDetectionStrategy.OnPush, providers: createControlProviders(() => PayoutToolFieldComponent), }) export class PayoutToolFieldComponent - extends ValidatedControlSuperclass + extends FormControlSuperclass implements OnInit { @Input() label: string; @@ -33,18 +30,12 @@ export class PayoutToolFieldComponent this.shopId$.next(shopId); } - control = new FormControl() as FormControl; - partyId$ = new BehaviorSubject(null); shopId$ = new BehaviorSubject(null); - - searchChange$ = new Subject(); - options$: Observable[]> = combineLatest([ - this.searchChange$.pipe(map((str) => str?.trim()?.toLowerCase())).pipe(startWith('')), - defer(() => this.payoutTools$), - ]).pipe( - map(([str, payoutTools]) => payoutTools.filter((t) => t.id.includes(str))), - map((payoutTools) => payoutTools.map((t) => ({ label: t.id, value: t.id }))), + options$: Observable[]> = defer(() => this.payoutTools$).pipe( + map((payoutTools) => + payoutTools.map((t) => ({ label: t.id, value: t.id, description: t.id })), + ), shareReplay({ refCount: true, bufferSize: 1 }), ); @@ -57,7 +48,7 @@ export class PayoutToolFieldComponent switchMap(({ contract_id }) => this.partyManagementService.GetContract(partyId, contract_id), ), - pluck('payout_tools'), + map((contract) => contract.payout_tools), ) .pipe( handleError( diff --git a/src/app/shared/components/payout-tool-field/payout-tool-field.module.ts b/src/app/shared/components/payout-tool-field/payout-tool-field.module.ts index 05083102..4acac148 100644 --- a/src/app/shared/components/payout-tool-field/payout-tool-field.module.ts +++ b/src/app/shared/components/payout-tool-field/payout-tool-field.module.ts @@ -4,8 +4,7 @@ import { ReactiveFormsModule } from '@angular/forms'; import { MatAutocompleteModule } from '@angular/material/autocomplete'; import { MatFormFieldModule } from '@angular/material/form-field'; import { MatInputModule } from '@angular/material/input'; - -import { SelectSearchFieldModule } from '@cc/components/select-search-field'; +import { SelectFieldModule } from '@vality/ng-core'; import { PayoutToolFieldComponent } from './payout-tool-field.component'; @@ -16,10 +15,9 @@ import { PayoutToolFieldComponent } from './payout-tool-field.component'; MatAutocompleteModule, MatInputModule, CommonModule, - SelectSearchFieldModule, + SelectFieldModule, ], declarations: [PayoutToolFieldComponent], exports: [PayoutToolFieldComponent], - providers: [], }) export class PayoutToolFieldModule {} diff --git a/src/app/shared/services/fetch-parties.service.ts b/src/app/shared/services/fetch-parties.service.ts index a3509e3e..adc54f2e 100644 --- a/src/app/shared/services/fetch-parties.service.ts +++ b/src/app/shared/services/fetch-parties.service.ts @@ -12,11 +12,13 @@ import { handleError, NotificationErrorService } from './notification-error'; export class FetchPartiesService { parties$: Observable = defer(() => this.searchParties$).pipe( switchMap((text) => - this.deanonimusService.searchParty(text).pipe( - map((hits) => hits.map((hit) => hit.party)), - handleError(this.notificationErrorService.error, null, of([])), - progressTo(this.progress$), - ), + text + ? this.deanonimusService.searchParty(text).pipe( + map((hits) => hits.map((hit) => hit.party)), + handleError(this.notificationErrorService.error, null, of([])), + progressTo(this.progress$), + ) + : of([]), ), shareReplay(1), ); diff --git a/src/components/select-search-field/index.ts b/src/components/select-search-field/index.ts deleted file mode 100644 index 3045ad3a..00000000 --- a/src/components/select-search-field/index.ts +++ /dev/null @@ -1,4 +0,0 @@ -export * from './select-search-field.component'; -export * from './select-search-field.module'; -export * from './types'; -export * from './tokens'; diff --git a/src/components/select-search-field/select-search-field.component.html b/src/components/select-search-field/select-search-field.component.html deleted file mode 100644 index c447b1b2..00000000 --- a/src/components/select-search-field/select-search-field.component.html +++ /dev/null @@ -1,59 +0,0 @@ - - {{ label }} - {{ hint }} - - - - - - - - -
{{ option.label }}
-
- {{ option.description }} -
- - -
{{ cachedOption.label }}
-
- {{ cachedOption.description }} -
- - - - - - - - - - diff --git a/src/components/select-search-field/select-search-field.component.scss b/src/components/select-search-field/select-search-field.component.scss deleted file mode 100644 index 1c4064f2..00000000 --- a/src/components/select-search-field/select-search-field.component.scss +++ /dev/null @@ -1,9 +0,0 @@ -mat-form-field { - width: 100%; -} - -.label { - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; -} diff --git a/src/components/select-search-field/select-search-field.component.ts b/src/components/select-search-field/select-search-field.component.ts deleted file mode 100644 index af7b9d6b..00000000 --- a/src/components/select-search-field/select-search-field.component.ts +++ /dev/null @@ -1,99 +0,0 @@ -import { - Component, - Inject, - Injector, - Input, - OnChanges, - Optional, - Output, - EventEmitter, - OnInit, -} from '@angular/core'; -import { FormControl } from '@angular/forms'; -import { UntilDestroy, untilDestroyed } from '@ngneat/until-destroy'; -import { FormComponentSuperclass } from '@s-libs/ng-core'; -import { ComponentChanges } from '@vality/ng-core'; -import { coerceBoolean } from 'coerce-property'; -import { BehaviorSubject, combineLatest, defer, Observable } from 'rxjs'; -import { distinctUntilChanged, map } from 'rxjs/operators'; - -import { getFormValueChanges, provideValueAccessor } from '@cc/utils/forms'; - -import { SelectSearchFieldOptions, SELECT_SEARCH_FIELD_OPTIONS } from './tokens'; -import { Option } from './types'; -import { filterOptions } from './utils'; - -@UntilDestroy() -@Component({ - selector: 'cc-select-search-field', - templateUrl: 'select-search-field.component.html', - styleUrls: ['select-search-field.component.scss'], - providers: [provideValueAccessor(() => SelectSearchFieldComponent)], -}) -export class SelectSearchFieldComponent - extends FormComponentSuperclass - implements OnInit, OnChanges -{ - @Input() label: string; - @Input() @coerceBoolean required = false; - @Input() @coerceBoolean disabled = false; - @Input() options: Option[]; - @Input() svgIcon: string | null = this.fieldOptions?.svgIcon; - @Input() hint: string | null; - @Input() @coerceBoolean isExternalSearch: boolean | '' = false; - @Input() @coerceBoolean progress: boolean = false; - - @Output() searchChange = new EventEmitter(); - - selectSearchControl = new FormControl(''); - filteredOptions$: Observable[]> = combineLatest([ - getFormValueChanges(this.selectSearchControl), - defer(() => this.options$), - ]).pipe(map(([value, options]) => filterOptions(options, value))); - selected$ = new BehaviorSubject(null); - cachedOption: Option = null; - - private options$ = new BehaviorSubject[]>([]); - - constructor( - injector: Injector, - @Optional() - @Inject(SELECT_SEARCH_FIELD_OPTIONS) - private fieldOptions: SelectSearchFieldOptions, - ) { - super(injector); - } - - ngOnInit(): void { - this.selectSearchControl.valueChanges - .pipe(distinctUntilChanged(), untilDestroyed(this)) - .subscribe((v) => this.searchChange.emit(v)); - } - - handleIncomingValue(value: Value): void { - this.select(value); - } - - ngOnChanges({ options }: ComponentChanges>): void { - if (options) { - this.options$.next(options.currentValue); - this.cacheOption(); - } - } - - clear(event: MouseEvent): void { - this.select(null); - event.stopPropagation(); - } - - select(value: Value): void { - this.selected$.next(value); - this.emitOutgoingValue(value); - this.cacheOption(); - } - - private cacheOption(): void { - const option = this.options?.find((o) => o.value === this.selected$.value); - if (option) this.cachedOption = option; - } -} diff --git a/src/components/select-search-field/select-search-field.module.ts b/src/components/select-search-field/select-search-field.module.ts deleted file mode 100644 index e1174ec6..00000000 --- a/src/components/select-search-field/select-search-field.module.ts +++ /dev/null @@ -1,31 +0,0 @@ -import { CommonModule } from '@angular/common'; -import { NgModule } from '@angular/core'; -import { FlexModule } from '@angular/flex-layout'; -import { ReactiveFormsModule } from '@angular/forms'; -import { MatButtonModule } from '@angular/material/button'; -import { MatFormFieldModule } from '@angular/material/form-field'; -import { MatIconModule } from '@angular/material/icon'; -import { MatInputModule } from '@angular/material/input'; -import { MatProgressBarModule } from '@angular/material/progress-bar'; -import { MatSelectModule } from '@angular/material/select'; -import { NgxMatSelectSearchModule } from 'ngx-mat-select-search'; - -import { SelectSearchFieldComponent } from './select-search-field.component'; - -@NgModule({ - imports: [ - CommonModule, - MatFormFieldModule, - MatInputModule, - ReactiveFormsModule, - MatButtonModule, - MatIconModule, - MatSelectModule, - NgxMatSelectSearchModule, - MatProgressBarModule, - FlexModule, - ], - declarations: [SelectSearchFieldComponent], - exports: [SelectSearchFieldComponent], -}) -export class SelectSearchFieldModule {} diff --git a/src/components/select-search-field/tokens.ts b/src/components/select-search-field/tokens.ts deleted file mode 100644 index b6f7b625..00000000 --- a/src/components/select-search-field/tokens.ts +++ /dev/null @@ -1,8 +0,0 @@ -import { InjectionToken } from '@angular/core'; - -export interface SelectSearchFieldOptions { - svgIcon?: string; -} - -export const SELECT_SEARCH_FIELD_OPTIONS: InjectionToken = - new InjectionToken('SelectSearchFieldOptions'); diff --git a/src/components/select-search-field/types/index.ts b/src/components/select-search-field/types/index.ts deleted file mode 100644 index 4216a007..00000000 --- a/src/components/select-search-field/types/index.ts +++ /dev/null @@ -1 +0,0 @@ -export * from './option'; diff --git a/src/components/select-search-field/types/option.ts b/src/components/select-search-field/types/option.ts deleted file mode 100644 index d02837f3..00000000 --- a/src/components/select-search-field/types/option.ts +++ /dev/null @@ -1,5 +0,0 @@ -export interface Option { - value: T; - label: string; - description?: string; -} diff --git a/src/components/select-search-field/utils/filter-options.ts b/src/components/select-search-field/utils/filter-options.ts deleted file mode 100644 index d19caf2e..00000000 --- a/src/components/select-search-field/utils/filter-options.ts +++ /dev/null @@ -1,14 +0,0 @@ -import { Option } from '../types'; - -const filterPredicate = - (searchStr: string) => - (option: Option) => - option.label.toLowerCase().includes(searchStr) || - (option.description && option.description.toLowerCase().includes(searchStr)) || - (typeof option.value !== 'object' && - String(option.value).toLowerCase().includes(searchStr)); - -export const filterOptions = (options: Option[], controlValue: unknown): Option[] => - controlValue && typeof controlValue === 'string' - ? options?.filter(filterPredicate(controlValue.toLowerCase())) - : options; diff --git a/src/components/select-search-field/utils/index.ts b/src/components/select-search-field/utils/index.ts deleted file mode 100644 index ff7ff02e..00000000 --- a/src/components/select-search-field/utils/index.ts +++ /dev/null @@ -1 +0,0 @@ -export * from './filter-options'; diff --git a/src/utils/forms/validated-control-superclass/create-control-providers.ts b/src/utils/forms/validated-control-superclass/create-control-providers.ts index 26bad551..d5b482ce 100644 --- a/src/utils/forms/validated-control-superclass/create-control-providers.ts +++ b/src/utils/forms/validated-control-superclass/create-control-providers.ts @@ -3,6 +3,10 @@ import { Provider, Type } from '@angular/core'; import { provideValidators } from './provide-validators'; import { provideValueAccessor } from './provide-value-accessor'; +/** + * @deprecated + * @param component + */ export const createControlProviders = (component: () => Type): Provider[] => [ provideValueAccessor(component), provideValidators(component), diff --git a/src/utils/forms/validated-control-superclass/provide-validators.ts b/src/utils/forms/validated-control-superclass/provide-validators.ts index 5bdffe28..996207bd 100644 --- a/src/utils/forms/validated-control-superclass/provide-validators.ts +++ b/src/utils/forms/validated-control-superclass/provide-validators.ts @@ -1,6 +1,10 @@ import { Provider, forwardRef, Type } from '@angular/core'; import { NG_VALIDATORS } from '@angular/forms'; +/** + * @deprecated + * @param component + */ export const provideValidators = (component: () => Type): Provider => ({ provide: NG_VALIDATORS, useExisting: forwardRef(component), diff --git a/src/utils/forms/validated-control-superclass/provide-value-accessor.ts b/src/utils/forms/validated-control-superclass/provide-value-accessor.ts index 56b7d382..f53df3b3 100644 --- a/src/utils/forms/validated-control-superclass/provide-value-accessor.ts +++ b/src/utils/forms/validated-control-superclass/provide-value-accessor.ts @@ -1,6 +1,10 @@ import { Provider, forwardRef, Type } from '@angular/core'; import { NG_VALUE_ACCESSOR } from '@angular/forms'; +/** + * @deprecated + * @param component + */ export const provideValueAccessor = (component: () => Type): Provider => ({ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(component), diff --git a/src/utils/forms/validated-control-superclass/utils/get-errors-tree.ts b/src/utils/forms/validated-control-superclass/utils/get-errors-tree.ts index fafc19ec..3ab4de60 100644 --- a/src/utils/forms/validated-control-superclass/utils/get-errors-tree.ts +++ b/src/utils/forms/validated-control-superclass/utils/get-errors-tree.ts @@ -3,6 +3,7 @@ import { AbstractControl, ValidationErrors } from '@angular/forms'; import { hasControls } from '../../has-controls'; /** + * @deprecated * FormGroup/FormArray don't return internal control errors, * so you need to get internal errors manually */ diff --git a/src/utils/forms/validated-control-superclass/validated-control-superclass.directive.ts b/src/utils/forms/validated-control-superclass/validated-control-superclass.directive.ts index 7d0cb3e4..f3660044 100644 --- a/src/utils/forms/validated-control-superclass/validated-control-superclass.directive.ts +++ b/src/utils/forms/validated-control-superclass/validated-control-superclass.directive.ts @@ -7,6 +7,9 @@ import { getValue } from '../get-value'; import { getErrorsTree } from './utils/get-errors-tree'; +/** + * @deprecated + */ @Directive() export abstract class ValidatedControlSuperclass extends WrappedControlSuperclass diff --git a/src/utils/forms/validated-control-superclass/validated-form-control-superclass.directive.ts b/src/utils/forms/validated-control-superclass/validated-form-control-superclass.directive.ts index f4e3f700..21f50721 100644 --- a/src/utils/forms/validated-control-superclass/validated-form-control-superclass.directive.ts +++ b/src/utils/forms/validated-control-superclass/validated-form-control-superclass.directive.ts @@ -3,6 +3,9 @@ import { ValidationErrors, FormControl } from '@angular/forms'; import { WrappedControlSuperclass } from '@s-libs/ng-core'; import { EMPTY, Observable } from 'rxjs'; +/** + * @deprecated + */ @Directive() export class ValidatedFormControlSuperclass< OuterType,