OPS-239, TD-497: Unify domain obj names, remove deprecated libs and utils (#194)

package-lock.json

@@ -53,7 +53,6 @@
         "short-uuid": "4.1.0",
         "tslib": "2.3.1",
         "utility-types": "3.10.0",
-        "uuid": "3.3.3",
         "yaml": "2.1.3",
         "zone.js": "0.11.4"
       },
@@ -18479,13 +18478,6 @@
         "node": ">= 0.4.0"
       }
     },
-    "node_modules/uuid": {
-      "version": "3.3.3",
-      "license": "MIT",
-      "bin": {
-        "uuid": "bin/uuid"
-      }
-    },
     "node_modules/v8-compile-cache": {
       "version": "2.3.0",
       "license": "MIT"
@@ -31629,9 +31621,6 @@
       "version": "1.0.1",
       "dev": true
     },
-    "uuid": {
-      "version": "3.3.3"
-    },
     "v8-compile-cache": {
       "version": "2.3.0"
     },

package.json

@@ -67,7 +67,6 @@
     "short-uuid": "4.1.0",
     "tslib": "2.3.1",
     "utility-types": "3.10.0",
-    "uuid": "3.3.3",
     "yaml": "2.1.3",
     "zone.js": "0.11.4"
   },

src/app/sections/claim/components/modification-form/utils/create-party-claim-metadata-form-extensions.ts

@@ -2,7 +2,7 @@ import { Claim } from '@vality/domain-proto/claim_management';
 import { Party } from '@vality/domain-proto/domain';
 import uniqBy from 'lodash-es/uniqBy';
 import { of } from 'rxjs';
-import uuid from 'uuid';
+import * as short from 'short-uuid';
 
 import {
     isTypeWithAliases,
@@ -35,7 +35,7 @@ function createClaimOptions(
 }
 
 function generate() {
-    return of(uuid());
+    return of(short().uuid());
 }
 
 export function createPartyClaimMetadataFormExtensions(

src/app/sections/deposits/search-filters/search-filters.component.html

@@ -79,7 +79,7 @@
                         type="text"
                     />
                 </mat-form-field>
-                <cc-merchant-searcher formControlName="partyId" fxFlex></cc-merchant-searcher>
+                <cc-merchant-field formControlName="partyId" fxFlex></cc-merchant-field>
             </div>
         </form>
     </mat-card-content>

src/app/sections/deposits/search-filters/search-filters.module.ts

@@ -13,8 +13,7 @@ import { MatLegacyFormFieldModule as MatFormFieldModule } from '@angular/materia
 import { MatLegacyInputModule as MatInputModule } from '@angular/material/legacy-input';
 import { MatLegacySelectModule as MatSelectModule } from '@angular/material/legacy-select';
 
-import { MerchantSearcherModule } from '@cc/app/shared/components/merchant-searcher';
-
+import { MerchantFieldModule } from '../../../shared/components/merchant-field';
 import { SearchFiltersComponent } from './search-filters.component';
 
 @NgModule({
@@ -32,7 +31,7 @@ import { SearchFiltersComponent } from './search-filters.component';
         FlexLayoutModule,
         MatSelectModule,
         MatCardModule,
-        MerchantSearcherModule,
+        MerchantFieldModule,
     ],
     declarations: [SearchFiltersComponent],
     exports: [SearchFiltersComponent],

src/app/sections/deposits/search-filters/services/search-filters/search-filters.service.ts

@@ -18,7 +18,7 @@ export class SearchFiltersService {
         depositId: '',
         identityId: '',
         walletId: '',
-        partyId: '',
+        partyId: null,
     });
 
     searchParamsChanges$ = this.form.valueChanges.pipe(

src/app/sections/domain/domain-info/domain-group/domain-group.component.ts

@@ -7,6 +7,7 @@ import { UntilDestroy } from '@ngneat/until-destroy';
 import { Reference, DomainObject } from '@vality/domain-proto/domain';
 import isEqual from 'lodash-es/isEqual';
 import sortBy from 'lodash-es/sortBy';
+import startCase from 'lodash-es/startCase';
 import { combineLatest, Observable, ReplaySubject, defer } from 'rxjs';
 import { map, switchMap, startWith, shareReplay, withLatestFrom, filter } from 'rxjs/operators';
 
@@ -73,7 +74,7 @@ export class DomainGroupComponent implements OnInit, AfterViewInit {
         shareReplay({ refCount: true, bufferSize: 1 })
     );
     options$ = this.fields$.pipe(
-        map((fields) => fields.map(({ type }) => ({ label: type, value: type })))
+        map((fields) => fields.map(({ type }) => ({ label: startCase(String(type)), value: type })))
     );
     isLoading$ = this.domainStoreService.isLoading$;
 

src/app/sections/domain/utils.ts

@@ -1,9 +1,9 @@
-import * as uuid from 'uuid/v4';
+import * as short from 'short-uuid';
 
 import { MonacoFile } from '@cc/components/monaco-editor';
 
 export const toMonacoFile = (content: string): MonacoFile => ({
-    uri: `${uuid()}.json`,
+    uri: `${short().uuid()}.json`,
     language: 'json',
     content,
 });

src/app/shared/components/merchant-field/merchant-field.component.ts

@@ -1,10 +1,19 @@
-import { Component, Input, OnInit } from '@angular/core';
+import { Component, Input, AfterViewInit } from '@angular/core';
 import { MatLegacySnackBar as MatSnackBar } from '@angular/material/legacy-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 } from 'rxjs/operators';
+import {
+    catchError,
+    debounceTime,
+    filter,
+    map,
+    switchMap,
+    first,
+    takeUntil,
+    startWith,
+} from 'rxjs/operators';
 
 import { DeanonimusService } from '@cc/app/api/deanonimus';
 import { Option } from '@cc/components/select-search-field';
@@ -19,7 +28,7 @@ import { progressTo } from '@cc/utils/operators';
 })
 export class MerchantFieldComponent
     extends ValidatedFormControlSuperclass<PartyID>
-    implements OnInit
+    implements AfterViewInit
 {
     @Input() label: string;
     @Input() @coerceBoolean required: boolean;
@@ -32,10 +41,15 @@ export class MerchantFieldComponent
         super();
     }
 
-    ngOnInit() {
+    ngAfterViewInit() {
         merge(
             this.searchChange$,
-            this.control.valueChanges.pipe(filter(Boolean), first(), takeUntil(this.searchChange$))
+            this.control.valueChanges.pipe(
+                startWith(this.control.value),
+                filter(Boolean),
+                first(),
+                takeUntil(this.searchChange$)
+            )
         )
             .pipe(
                 filter(Boolean),
@@ -44,7 +58,6 @@ export class MerchantFieldComponent
                 untilDestroyed(this)
             )
             .subscribe((options) => this.options$.next(options));
-        super.ngOnInit();
     }
 
     private searchOptions(str: string): Observable<Option<PartyID>[]> {

src/app/shared/components/merchant-searcher/index.ts

@@ -1 +0,0 @@
-export * from './merchant-searcher.module';

src/app/shared/components/merchant-searcher/merchant-searcher.component.html

@@ -1,18 +0,0 @@
-<mat-form-field fxFlex>
-    <input
-        [formControl]="searchControl"
-        [matAutocomplete]="auto"
-        matInput
-        placeholder="Merchant"
-        type="text"
-    />
-    <mat-autocomplete
-        #auto="matAutocomplete"
-        autoActiveFirstOption
-        (optionSelected)="optionSelectedHandler($event)"
-    >
-        <mat-option *ngFor="let party of parties$ | async" [value]="party">
-            {{ party.email }}
-        </mat-option>
-    </mat-autocomplete>
-</mat-form-field>

src/app/shared/components/merchant-searcher/merchant-searcher.component.scss

@@ -1,3 +0,0 @@
-::ng-deep .mat-autocomplete-panel {
-    min-width: 350px !important;
-}

src/app/shared/components/merchant-searcher/merchant-searcher.component.ts

@@ -1,78 +0,0 @@
-import { FocusMonitor } from '@angular/cdk/a11y';
-import { Platform } from '@angular/cdk/platform';
-import { AutofillMonitor } from '@angular/cdk/text-field';
-import { Component, ElementRef, OnInit, Optional, Self } from '@angular/core';
-import { UntypedFormControl, FormGroupDirective, NgControl, NgForm } from '@angular/forms';
-import { ErrorStateMatcher } from '@angular/material/core';
-import { MatLegacyAutocompleteSelectedEvent as MatAutocompleteSelectedEvent } from '@angular/material/legacy-autocomplete';
-import { debounceTime, take } from 'rxjs/operators';
-
-import { CustomFormControl } from '@cc/components/utils';
-
-import { FetchPartiesService } from '../../services';
-
-@Component({
-    selector: 'cc-merchant-searcher',
-    templateUrl: 'merchant-searcher.component.html',
-    styleUrls: ['merchant-searcher.component.scss'],
-    providers: [FetchPartiesService],
-})
-export class MerchantSearcherComponent extends CustomFormControl implements OnInit {
-    searchControl = new UntypedFormControl();
-    parties$ = this.fetchMarchantsService.parties$;
-
-    constructor(
-        private fetchMarchantsService: FetchPartiesService,
-        focusMonitor: FocusMonitor,
-        elementRef: ElementRef<HTMLElement>,
-        @Optional() @Self() public ngControl: NgControl,
-        platform: Platform,
-        autofillMonitor: AutofillMonitor,
-        defaultErrorStateMatcher: ErrorStateMatcher,
-        @Optional() parentForm: NgForm,
-        @Optional() parentFormGroup: FormGroupDirective
-    ) {
-        super(
-            focusMonitor,
-            elementRef,
-            platform,
-            ngControl,
-            autofillMonitor,
-            defaultErrorStateMatcher,
-            parentForm,
-            parentFormGroup
-        );
-        this.searchControl.valueChanges.pipe(debounceTime(400)).subscribe((v) => {
-            if (v === '') {
-                this.formControl.patchValue(v);
-            } else {
-                this.fetchMarchantsService.searchParties(v);
-            }
-        });
-
-        this.parties$.pipe(take(1)).subscribe((parties) => {
-            const { value } = this.formControl;
-            if (value && value !== '') {
-                const party = parties?.find((p) => p.id === this.formControl.value);
-                if (party) {
-                    this.searchControl.patchValue(party.email);
-                }
-            }
-        });
-    }
-
-    optionSelectedHandler(e: MatAutocompleteSelectedEvent) {
-        const { value } = e.option;
-        this.formControl.patchValue(value.id);
-        this.searchControl.patchValue(value.email);
-    }
-
-    ngOnInit() {
-        super.ngAfterViewInit();
-        const { value } = this.formControl;
-        if (value && value !== '') {
-            this.searchControl.patchValue(value);
-            this.fetchMarchantsService.searchParties(value);
-        }
-    }
-}

src/app/shared/components/merchant-searcher/merchant-searcher.module.ts

@@ -1,15 +0,0 @@
-import { CommonModule } from '@angular/common';
-import { NgModule } from '@angular/core';
-import { FlexModule } from '@angular/flex-layout';
-import { ReactiveFormsModule } from '@angular/forms';
-import { MatLegacyAutocompleteModule as MatAutocompleteModule } from '@angular/material/legacy-autocomplete';
-import { MatLegacyInputModule as MatInputModule } from '@angular/material/legacy-input';
-
-import { MerchantSearcherComponent } from './merchant-searcher.component';
-
-@NgModule({
-    declarations: [MerchantSearcherComponent],
-    imports: [CommonModule, FlexModule, MatInputModule, MatAutocompleteModule, ReactiveFormsModule],
-    exports: [MerchantSearcherComponent],
-})
-export class MerchantSearcherModule {}

src/app/shared/components/party-modification-creator/party-modification-target/fill-in-unit-id/fill-in-unit-id.component.ts

@@ -1,6 +1,6 @@
 import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
 import { UntypedFormBuilder, UntypedFormGroup } from '@angular/forms';
-import * as uuid from 'uuid/v4';
+import * as short from 'short-uuid';
 
 @Component({
     selector: 'cc-fill-in-unit-id',
@@ -25,6 +25,6 @@ export class FillInUnitIdComponent implements OnInit {
     }
 
     generate() {
-        this.form.patchValue({ unitID: uuid() });
+        this.form.patchValue({ unitID: short().uuid() });
     }
 }

src/app/shared/components/party-modification-forms/contract/adjustment-modification-unit/adjustment-modification-unit.component.ts

@@ -2,7 +2,7 @@ import { Component, Input, OnInit } from '@angular/core';
 import { UntypedFormBuilder, UntypedFormGroup, Validators } from '@angular/forms';
 import { ContractAdjustmentModificationUnit } from '@vality/domain-proto/payment_processing';
 import get from 'lodash-es/get';
-import * as uuid from 'uuid/v4';
+import * as short from 'short-uuid';
 
 @Component({
     selector: 'cc-adjustment-modification-unit',
@@ -28,6 +28,6 @@ export class AdjustmentModificationUnitComponent implements OnInit {
     }
 
     generate() {
-        this.form.patchValue({ adjustment_id: uuid() });
+        this.form.patchValue({ adjustment_id: short().uuid() });
     }
 }

src/app/shared/components/party-modification-forms/contract/payout-tool-modification-unit/payout-tool-modification-unit.component.ts

@@ -2,7 +2,7 @@ import { Component, Input, OnInit } from '@angular/core';
 import { UntypedFormBuilder, UntypedFormGroup, Validators } from '@angular/forms';
 import { PayoutToolModificationUnit } from '@vality/domain-proto/payment_processing';
 import get from 'lodash-es/get';
-import * as uuid from 'uuid/v4';
+import * as short from 'short-uuid';
 
 @Component({
     selector: 'cc-contract-payout-tool-modification-unit',
@@ -28,6 +28,6 @@ export class PayoutToolModificationUnitComponent implements OnInit {
     }
 
     generate() {
-        this.form.patchValue({ payout_tool_id: uuid() });
+        this.form.patchValue({ payout_tool_id: short().uuid() });
     }
 }

src/app/shared/components/payments-search-filters/payments-main-search-filters/payments-main-search-filters.module.ts

@@ -13,7 +13,6 @@ import { MatLegacyInputModule as MatInputModule } from '@angular/material/legacy
 import { MatLegacySelectModule as MatSelectModule } from '@angular/material/legacy-select';
 
 import { MerchantFieldModule } from '../../merchant-field';
-import { MerchantSearcherModule } from '../../merchant-searcher';
 import { PaymentsMainSearchFiltersComponent } from './payments-main-search-filters.component';
 
 @NgModule({
@@ -30,7 +29,6 @@ import { PaymentsMainSearchFiltersComponent } from './payments-main-search-filte
         MatDividerModule,
         FlexLayoutModule,
         MatSelectModule,
-        MerchantSearcherModule,
         MerchantFieldModule,
     ],
     declarations: [PaymentsMainSearchFiltersComponent],

src/components/utils/custom-form-control.ts

@@ -1,264 +0,0 @@
-import { FocusMonitor } from '@angular/cdk/a11y';
-import { coerceBooleanProperty } from '@angular/cdk/coercion';
-import { Platform } from '@angular/cdk/platform';
-import { AutofillMonitor } from '@angular/cdk/text-field';
-import {
-    AfterViewInit,
-    Directive,
-    DoCheck,
-    ElementRef,
-    HostBinding,
-    HostListener,
-    Input,
-    OnChanges,
-    OnDestroy,
-    Optional,
-    Self,
-} from '@angular/core';
-import {
-    ControlValueAccessor,
-    UntypedFormControl,
-    FormGroupDirective,
-    NgControl,
-    NgForm,
-} from '@angular/forms';
-import { ErrorStateMatcher } from '@angular/material/core';
-import { MatLegacyAutocompleteOrigin as MatAutocompleteOrigin } from '@angular/material/legacy-autocomplete';
-import { MatLegacyFormFieldControl as MatFormFieldControl } from '@angular/material/legacy-form-field';
-import { Subject } from 'rxjs';
-import * as uuid from 'uuid';
-
-import { INPUT_MIXIN_BASE } from './input-base';
-
-// eslint-disable-next-line @angular-eslint/directive-selector
-@Directive({ selector: 'cc-custom-form-control' })
-/* eslint-disable @angular-eslint/no-conflicting-lifecycle */
-// eslint-disable-next-line @angular-eslint/directive-class-suffix
-export class CustomFormControl<I = any, P = I>
-    extends INPUT_MIXIN_BASE
-    implements
-        AfterViewInit,
-        ControlValueAccessor,
-        MatFormFieldControl<I>,
-        OnDestroy,
-        DoCheck,
-        OnChanges
-{
-    /** The aria-describedby attribute on the input for improved a11y. */
-    @HostBinding('attr.aria-describedby') _ariaDescribedby: string;
-
-    @Input()
-    placeholder: string;
-
-    controlType = 'text';
-    autofilled = false;
-    formControl = new UntypedFormControl();
-    autocompleteOrigin: MatAutocompleteOrigin;
-    monitorsRegistered = false;
-
-    protected _disabled = false;
-    @Input()
-    get disabled(): boolean {
-        if (this.ngControl && this.ngControl.disabled !== null) {
-            return this.ngControl.disabled;
-        }
-        return this._disabled;
-    }
-    set disabled(value: boolean) {
-        this._disabled = coerceBooleanProperty(value);
-
-        // Browsers may not fire the blur event if the input is disabled too quickly.
-        // Reset from here to ensure that the element doesn't become stuck.
-        if (this.focused) {
-            this.focused = false;
-            this.stateChanges.next();
-        }
-    }
-
-    protected _id: string;
-    @HostBinding('attr.id')
-    @Input()
-    get id(): string {
-        return this._id;
-    }
-    set id(value: string) {
-        this._id = value || `custom-input-${uuid()}`;
-    }
-
-    protected _required = false;
-    @Input()
-    get required(): boolean {
-        return this._required;
-    }
-    set required(value: boolean) {
-        this._required = coerceBooleanProperty(value);
-    }
-
-    protected type = 'text';
-
-    @Input()
-    get value() {
-        return this.formControl.value;
-    }
-    set value(value: I) {
-        this.formControl.setValue(value);
-        this.stateChanges.next();
-    }
-
-    get publicValue() {
-        return this.toPublicValue(this.value);
-    }
-    set publicValue(value: P) {
-        this.value = this.toInternalValue(value);
-    }
-
-    get details() {
-        return this.getDetails(this.publicValue);
-    }
-
-    @HostBinding('class.floating')
-    get shouldLabelFloat(): boolean {
-        return this.focused || !this.empty;
-    }
-
-    // eslint-disable-next-line @typescript-eslint/member-ordering
-    inputRef = new ElementRef<HTMLInputElement>(null);
-
-    get empty(): boolean {
-        return !this.formControl.value;
-    }
-
-    private _focused = false;
-    get focused(): boolean {
-        return this._focused;
-    }
-    set focused(value: boolean) {
-        this._focused = value;
-        this.stateChanges.next();
-    }
-
-    constructor(
-        private focusMonitor: FocusMonitor,
-        private elementRef: ElementRef<HTMLElement>,
-        private platform: Platform,
-        @Optional() @Self() public ngControl: NgControl,
-        private autofillMonitor: AutofillMonitor,
-        defaultErrorStateMatcher: ErrorStateMatcher,
-        @Optional() parentForm: NgForm,
-        @Optional() parentFormGroup: FormGroupDirective
-    ) {
-        super(defaultErrorStateMatcher, parentForm, parentFormGroup, ngControl, new Subject());
-        if (this.ngControl !== null) {
-            // Set the value accessor directly
-            // (instead of providing NG_VALUE_ACCESSOR)
-            // to avoid running into a circular import
-            this.ngControl.valueAccessor = this;
-        }
-    }
-
-    ngOnChanges() {
-        this.stateChanges.next();
-    }
-
-    ngDoCheck() {
-        if (
-            this.ngControl &&
-            // TODO: dirty checking is temporary
-            this.ngControl.dirty
-        ) {
-            // We need to re-evaluate this on every change detection cycle, because there are some
-            // error triggers that we can't subscribe to (e.g. parent form submissions). This means
-            // that whatever logic is in here has to be super lean or we risk destroying the performance.
-            this.updateErrorState();
-        }
-    }
-
-    ngAfterViewInit(): void {
-        this.setInputElement();
-    }
-
-    ngOnDestroy() {
-        this.stateChanges.complete();
-
-        if (this.platform.isBrowser) {
-            this.autofillMonitor.stopMonitoring(this.inputRef);
-        }
-    }
-
-    onContainerClick(event: MouseEvent): void {
-        if ((event.target as Element).tagName.toLowerCase() !== 'input') {
-            this.focusMonitor.focusVia(this.inputRef, 'mouse');
-        }
-    }
-
-    @HostListener('focusout')
-    onTouched(): void {
-        this._onTouched();
-    }
-
-    registerOnChange(onChange: (value: P) => void): void {
-        // TODO: иногда передаются public value в toPublicValue и возникают ошибки
-        this.formControl.valueChanges.subscribe((v) => onChange(this.toPublicValue(v)));
-    }
-
-    registerOnTouched(onTouched: () => void): void {
-        this._onTouched = onTouched;
-        this._onTouched();
-    }
-
-    setDescribedByIds(ids: string[]): void {
-        this._ariaDescribedby = ids.join(' ');
-    }
-
-    setDisabledState(shouldDisable: boolean): void {
-        if (shouldDisable) {
-            this.formControl.disable();
-        } else {
-            this.formControl.enable();
-        }
-
-        this.disabled = shouldDisable;
-    }
-
-    setInputElement(
-        input: HTMLInputElement = this.elementRef.nativeElement.querySelector('input')
-    ) {
-        this.inputRef.nativeElement = input;
-        this.registerMonitors();
-    }
-
-    writeValue(value: P): void {
-        this.formControl.setValue(this.toInternalValue(value), { emitEvent: false });
-    }
-
-    protected getDetails(value: P): string {
-        return value as any;
-    }
-
-    protected toInternalValue(value: P): I {
-        return value as any;
-    }
-
-    protected toPublicValue(value: I): P {
-        return value as any;
-    }
-
-    private _onTouched = () => null;
-
-    private registerMonitors() {
-        if (!this.monitorsRegistered && this.inputRef.nativeElement) {
-            this.monitorsRegistered = true;
-            if (this.platform.isBrowser) {
-                this.autofillMonitor.monitor(this.inputRef).subscribe((event) => {
-                    this.autofilled = event.isAutofilled;
-                    this.stateChanges.next();
-                });
-            }
-            this.focusMonitor
-                .monitor(this.elementRef.nativeElement, true)
-                .subscribe((focusOrigin) => {
-                    this.focused = !!focusOrigin;
-                });
-        }
-    }
-}

src/components/utils/index.ts

@@ -1,2 +0,0 @@
-export * from './custom-form-control';
-export * from './radio-button-object';

src/components/utils/input-base.ts

@@ -1,15 +0,0 @@
-import { FormGroupDirective, NgControl, NgForm } from '@angular/forms';
-import { ErrorStateMatcher, mixinErrorState } from '@angular/material/core';
-import { Subject } from 'rxjs';
-
-export class InputBase {
-    constructor(
-        public _defaultErrorStateMatcher: ErrorStateMatcher,
-        public _parentForm: NgForm,
-        public _parentFormGroup: FormGroupDirective,
-        public ngControl: NgControl,
-        public stateChanges: Subject<void>
-    ) {}
-}
-
-export const INPUT_MIXIN_BASE = mixinErrorState(InputBase);

src/components/utils/radio-button-object.ts

@@ -1,4 +0,0 @@
-export interface RadioButtonObject {
-    value: any;
-    title: string;
-}