From dbde4152bdfae6f071224298a292ef21d1934e78 Mon Sep 17 00:00:00 2001 From: Rinat Arsaev <11846445+A77AY@users.noreply.github.com> Date: Mon, 24 Apr 2023 15:27:12 +0400 Subject: [PATCH] TD-576: Fix select search input (#120) --- .gitignore | 3 +- README.md | 31 ++------------ _.env | 2 +- package-lock.json | 38 +++++++++++++---- package.json | 5 ++- src/_appConfig.json | 14 +++++++ src/_authConfig.json | 7 ++++ src/app/config/config.ts | 1 + src/app/dadata/dadata.component.ts | 3 +- .../menu-item/menu-item.component.ts | 3 +- .../user-dropdown/user-dropdown.component.ts | 2 +- src/app/icons/icons.json | 2 +- .../change-roles-table.component.ts | 2 +- .../stat-item/stat-item.component.ts | 2 +- .../base-dialog/base-dialog.component.ts | 3 +- .../category-autocomplete-field.component.ts | 3 +- .../countries-autocomplete-field.component.ts | 3 +- .../currency-autocomplete-field.component.ts | 27 ++++-------- .../max-length-input.component.ts | 2 +- .../payment-institution-field.component.ts | 3 +- .../inputs/shop-field/shop-field.component.ts | 3 +- .../wallet-autocomplete-field.component.ts | 3 +- .../organization-roles.component.ts | 2 +- .../expandable-radio-group.component.ts | 2 +- src/assets/icons/x.svg | 5 +++ .../buttons/button/button.component.ts | 3 +- .../filter-button/filter-button.component.ts | 3 +- .../filter-content.component.ts | 3 +- src/components/filter/filter.component.ts | 3 +- .../multi-select-field.component.ts | 3 +- .../select-search-field.component.html | 4 +- .../select-search-field.component.ts | 3 +- .../selection/selection.component.ts | 3 +- .../indicators/status/status.component.ts | 2 +- .../accordion-item.component.ts | 5 +-- .../layout/accordion/accordion.component.ts | 5 ++- .../layout/dropdown/dropdown.component.ts | 3 +- .../state-nav-item.component.ts | 3 +- .../state-nav/state-nav.component.ts | 2 +- src/utils/coerce/coerce-by-type.ts | 29 ------------- src/utils/coerce/coerce.spec.ts | 41 ------------------- src/utils/coerce/coerce.ts | 22 ---------- src/utils/coerce/index.ts | 2 - src/utils/index.ts | 1 - 44 files changed, 118 insertions(+), 193 deletions(-) create mode 100644 src/_appConfig.json create mode 100644 src/_authConfig.json create mode 100644 src/assets/icons/x.svg delete mode 100644 src/utils/coerce/coerce-by-type.ts delete mode 100644 src/utils/coerce/coerce.spec.ts delete mode 100644 src/utils/coerce/coerce.ts delete mode 100644 src/utils/coerce/index.ts diff --git a/.gitignore b/.gitignore index cb53eaa9..6b206799 100644 --- a/.gitignore +++ b/.gitignore @@ -50,4 +50,5 @@ Thumbs.db # Env and configs .env* -src/*Config*.json \ No newline at end of file +src/*Config*.json +!src/_*Config*.json diff --git a/README.md b/README.md index a22de23d..9920f6fb 100644 --- a/README.md +++ b/README.md @@ -15,34 +15,11 @@ 1. Add environment and configurations: - - `src/appConfig.json`: + - `src/.env` + - `src/appConfig.json` + - `src/authConfig.json` - ```json - { - "apiEndpoint": "https://api.xample.com", - "urlShortenerEndpoint": "https://shrt.example.com", - "checkoutEndpoint": "https://checkout.example.com", - "docsEndpoints": { - "payments": "https://example.com/docs" - }, - "theme": { - "name": "main" - }, - "sentryDsn": "https://public@sentry.example.com/1", - "keycloakEndpoint": "https://auth.example.com" - } - ``` - - - `src/authConfig.json`: - ```json - { - "realm": "external", - "auth-server-url": "https://auth.example.com/auth/", - "ssl-required": "external", - "resource": "koffing", - "public-client": true - } - ``` +You can copy from examples like this one: [`_appConfig.json`](./src/_appConfig.json) 2. Install packages ```sh diff --git a/_.env b/_.env index 8b94457f..a038e707 100644 --- a/_.env +++ b/_.env @@ -1 +1 @@ -PROXY_TARGET="https://sample.vality.dev" +PROXY_TARGET="https://vality.dev" diff --git a/package-lock.json b/package-lock.json index 50760d0d..07d05d99 100644 --- a/package-lock.json +++ b/package-lock.json @@ -42,6 +42,7 @@ "angular-file": "^3.0.1", "angular2-text-mask": "^9.0.0", "apexcharts": "^3.19.2", + "coerce-property": "^15.0.1", "css-element-queries": "1.2.3", "dinero.js": "2.0.0-alpha.8", "humanize-duration": "^3.19.0", @@ -52,7 +53,7 @@ "lodash-es": "4.17.21", "moment": "2.29.4", "ng-apexcharts": "1.7.1", - "ngx-mat-select-search": "4.2.1", + "ngx-mat-select-search": "6.0.0", "rxjs": "7.5.6", "short-uuid": "4.2.0", "tslib": "2.4.0", @@ -7546,6 +7547,19 @@ "node": ">=0.10.0" } }, + "node_modules/coerce-property": { + "version": "15.0.1", + "resolved": "https://registry.npmjs.org/coerce-property/-/coerce-property-15.0.1.tgz", + "integrity": "sha512-BFuCajc/anzod6ExgyfEm2jaAE0OhSHEIBsmFj0bB7rQIrhgBiLPxpo3XWi7AyE5VVlFsLpkgIEGrDIWzJWc1Q==", + "dependencies": { + "tslib": "^2.3.0" + }, + "peerDependencies": { + "@angular/cdk": ">=15.0.0", + "@angular/common": ">=15.0.0", + "@angular/core": ">=15.0.0" + } + }, "node_modules/color-convert": { "version": "1.9.3", "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.3.tgz", @@ -13323,14 +13337,14 @@ } }, "node_modules/ngx-mat-select-search": { - "version": "4.2.1", - "resolved": "https://registry.npmjs.org/ngx-mat-select-search/-/ngx-mat-select-search-4.2.1.tgz", - "integrity": "sha512-bKHpOSIXyqwZw35OB6yi87tcRRV/69mu49PN0M2ZzVbiWBPg/IN58aJnCHUDxDG6CdK0vbGJ/2eCPniZ1nf9KA==", + "version": "6.0.0", + "resolved": "https://registry.npmjs.org/ngx-mat-select-search/-/ngx-mat-select-search-6.0.0.tgz", + "integrity": "sha512-arrWZg2N/Pv3hCE2EV0qj3rqEUKImntmhW8qvo/aYxeN9iWPsseOpokcfMeC9I/SrLrqQFdfyPgHOgB9DqF2Hw==", "dependencies": { "tslib": "^2.4.0" }, "peerDependencies": { - "@angular/material": "^12.0.0 || ^13.0.0 || ^14.0.0" + "@angular/material": "^15.0.0" } }, "node_modules/nice-napi": { @@ -23545,6 +23559,14 @@ "integrity": "sha512-RpAVKQA5T63xEj6/giIbUEtZwJ4UFIc3ZtvEkiaUERylqe8xb5IvqcgOurZLahv93CLKfxcw5YI+DZcUBRyLXA==", "dev": true }, + "coerce-property": { + "version": "15.0.1", + "resolved": "https://registry.npmjs.org/coerce-property/-/coerce-property-15.0.1.tgz", + "integrity": "sha512-BFuCajc/anzod6ExgyfEm2jaAE0OhSHEIBsmFj0bB7rQIrhgBiLPxpo3XWi7AyE5VVlFsLpkgIEGrDIWzJWc1Q==", + "requires": { + "tslib": "^2.3.0" + } + }, "color-convert": { "version": "1.9.3", "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.3.tgz", @@ -27639,9 +27661,9 @@ } }, "ngx-mat-select-search": { - "version": "4.2.1", - "resolved": "https://registry.npmjs.org/ngx-mat-select-search/-/ngx-mat-select-search-4.2.1.tgz", - "integrity": "sha512-bKHpOSIXyqwZw35OB6yi87tcRRV/69mu49PN0M2ZzVbiWBPg/IN58aJnCHUDxDG6CdK0vbGJ/2eCPniZ1nf9KA==", + "version": "6.0.0", + "resolved": "https://registry.npmjs.org/ngx-mat-select-search/-/ngx-mat-select-search-6.0.0.tgz", + "integrity": "sha512-arrWZg2N/Pv3hCE2EV0qj3rqEUKImntmhW8qvo/aYxeN9iWPsseOpokcfMeC9I/SrLrqQFdfyPgHOgB9DqF2Hw==", "requires": { "tslib": "^2.4.0" } diff --git a/package.json b/package.json index 81c07e31..9d4e0bde 100644 --- a/package.json +++ b/package.json @@ -60,6 +60,7 @@ "angular-file": "^3.0.1", "angular2-text-mask": "^9.0.0", "apexcharts": "^3.19.2", + "coerce-property": "^15.0.1", "css-element-queries": "1.2.3", "dinero.js": "2.0.0-alpha.8", "humanize-duration": "^3.19.0", @@ -70,7 +71,7 @@ "lodash-es": "4.17.21", "moment": "2.29.4", "ng-apexcharts": "1.7.1", - "ngx-mat-select-search": "4.2.1", + "ngx-mat-select-search": "6.0.0", "rxjs": "7.5.6", "short-uuid": "4.2.0", "tslib": "2.4.0", @@ -127,4 +128,4 @@ "ts-node": "10.9.1", "typescript": "4.9.5" } -} \ No newline at end of file +} diff --git a/src/_appConfig.json b/src/_appConfig.json new file mode 100644 index 00000000..5ace3e71 --- /dev/null +++ b/src/_appConfig.json @@ -0,0 +1,14 @@ +{ + "keycloakEndpoint": "https://auth.vality.dev", + "theme": { + "name": "eastern" + }, + "sentryDsn": null, + "docsEndpoints": { + "payments": "https://valitydev.github.io/swag-payments" + }, + "apiEndpoint": "http://localhost:8000/__api", + "urlShortenerEndpoint": "https://shrt.vality.dev", + "checkoutEndpoint": "https://checkout.vality.dev", + "currencies": ["RUB", "USD", "EUR"] +} diff --git a/src/_authConfig.json b/src/_authConfig.json new file mode 100644 index 00000000..9fb0fc6a --- /dev/null +++ b/src/_authConfig.json @@ -0,0 +1,7 @@ +{ + "realm": "external", + "auth-server-url": "https://auth.vality.dev/auth/", + "ssl-required": "external", + "resource": "dashboard", + "public-client": true +} diff --git a/src/app/config/config.ts b/src/app/config/config.ts index 73d5ea8f..38857824 100644 --- a/src/app/config/config.ts +++ b/src/app/config/config.ts @@ -12,5 +12,6 @@ export interface Config { }; sentryDsn?: string; keycloakEndpoint: string; + currencies: string[]; } export const BASE_CONFIG = getBaseClass(); diff --git a/src/app/dadata/dadata.component.ts b/src/app/dadata/dadata.component.ts index e9d4b7d6..0bd9fd38 100644 --- a/src/app/dadata/dadata.component.ts +++ b/src/app/dadata/dadata.component.ts @@ -9,13 +9,14 @@ import { FmsUnitQuery, PartyContent, } from '@vality/swag-questionary-aggr-proxy'; +import { coerceBoolean } from 'coerce-property'; import isEmpty from 'lodash-es/isEmpty'; import { interval, Observable } from 'rxjs'; import { debounce, filter, map, switchMap, take } from 'rxjs/operators'; import { ContentByRequestType, DaDataService, ParamsByRequestType, Suggestion } from '@dsh/api/questionary-aggr-proxy'; import { progress, shareReplayUntilDestroyed, takeError } from '@dsh/operators'; -import { coerceBoolean, provideValueAccessor } from '@dsh/utils'; +import { provideValueAccessor } from '@dsh/utils'; import { Type } from './type'; diff --git a/src/app/home/actionbar/components/menu-item/menu-item.component.ts b/src/app/home/actionbar/components/menu-item/menu-item.component.ts index d14fe9ba..9d9e1089 100644 --- a/src/app/home/actionbar/components/menu-item/menu-item.component.ts +++ b/src/app/home/actionbar/components/menu-item/menu-item.component.ts @@ -1,6 +1,5 @@ import { ChangeDetectionStrategy, Component, HostBinding, Input, ViewEncapsulation } from '@angular/core'; - -import { coerceBoolean } from '@dsh/utils'; +import { coerceBoolean } from 'coerce-property'; @Component({ selector: 'dsh-menu-item', diff --git a/src/app/home/actionbar/components/user-dropdown/user-dropdown.component.ts b/src/app/home/actionbar/components/user-dropdown/user-dropdown.component.ts index 16738f1a..65a4c302 100644 --- a/src/app/home/actionbar/components/user-dropdown/user-dropdown.component.ts +++ b/src/app/home/actionbar/components/user-dropdown/user-dropdown.component.ts @@ -1,8 +1,8 @@ import { ChangeDetectionStrategy, Component, Input } from '@angular/core'; +import { coerceBoolean } from 'coerce-property'; import { map } from 'rxjs/operators'; import { ContextOrganizationService } from '@dsh/app/shared/services'; -import { coerceBoolean } from '@dsh/utils'; import { ROTATE } from './utils/rotate-animation'; import { KeycloakService } from '../../../../auth'; diff --git a/src/app/icons/icons.json b/src/app/icons/icons.json index c37cc5bd..8c8a9cbd 100644 --- a/src/app/icons/icons.json +++ b/src/app/icons/icons.json @@ -1 +1 @@ -["apple_pay", "google_pay", "logo", "mastercard", "mir", "samsung_pay", "visa", "yandex_pay"] +["apple_pay", "google_pay", "logo", "mastercard", "mir", "samsung_pay", "visa", "yandex_pay", "x"] diff --git a/src/app/sections/organization-section/organization-details/change-roles-table/change-roles-table.component.ts b/src/app/sections/organization-section/organization-details/change-roles-table/change-roles-table.component.ts index d1116469..4bd9bce8 100644 --- a/src/app/sections/organization-section/organization-details/change-roles-table/change-roles-table.component.ts +++ b/src/app/sections/organization-section/organization-details/change-roles-table/change-roles-table.component.ts @@ -2,6 +2,7 @@ import { ChangeDetectorRef, Component, EventEmitter, Inject, Input, OnInit, Outp import { MatLegacyDialog as MatDialog } from '@angular/material/legacy-dialog'; import { UntilDestroy, untilDestroyed } from '@ngneat/until-destroy'; import { MemberRole, ResourceScopeId, RoleId } from '@vality/swag-organizations'; +import { coerceBoolean } from 'coerce-property'; import isNil from 'lodash-es/isNil'; import { BehaviorSubject, combineLatest, EMPTY, Observable, of } from 'rxjs'; import { first, map, switchMap, tap } from 'rxjs/operators'; @@ -11,7 +12,6 @@ import { DialogConfig, DIALOG_CONFIG } from '@dsh/app/sections/tokens'; import { ShopsDataService } from '@dsh/app/shared'; import { sortRoleIds } from '@dsh/app/shared/components/organization-roles/utils/sort-role-ids'; import { PartialReadonly } from '@dsh/type-utils'; -import { coerceBoolean } from '@dsh/utils'; import { SelectRoleDialogComponent } from './components/select-role-dialog/select-role-dialog.component'; import { SelectRoleDialogResult } from './components/select-role-dialog/types/select-role-dialog-result'; diff --git a/src/app/sections/payment-section/analytics/stat-item/stat-item.component.ts b/src/app/sections/payment-section/analytics/stat-item/stat-item.component.ts index 984df43e..ccd5c7cb 100644 --- a/src/app/sections/payment-section/analytics/stat-item/stat-item.component.ts +++ b/src/app/sections/payment-section/analytics/stat-item/stat-item.component.ts @@ -1,7 +1,7 @@ import { Component, Input, OnChanges, SimpleChanges } from '@angular/core'; +import { coerceBoolean } from 'coerce-property'; import { SpinnerType } from '@dsh/components/indicators'; -import { coerceBoolean } from '@dsh/utils'; import { StatData } from '../utils'; diff --git a/src/app/shared/components/dialog/base-dialog/base-dialog.component.ts b/src/app/shared/components/dialog/base-dialog/base-dialog.component.ts index 0b95a1c7..938fda8d 100644 --- a/src/app/shared/components/dialog/base-dialog/base-dialog.component.ts +++ b/src/app/shared/components/dialog/base-dialog/base-dialog.component.ts @@ -1,6 +1,5 @@ import { Component, EventEmitter, Input, Output } from '@angular/core'; - -import { coerceBoolean } from '@dsh/utils'; +import { coerceBoolean } from 'coerce-property'; // TODO: add unit test for template with new ng-content @Component({ diff --git a/src/app/shared/components/inputs/category-autocomplete-field/category-autocomplete-field.component.ts b/src/app/shared/components/inputs/category-autocomplete-field/category-autocomplete-field.component.ts index 26b417c3..255e7d3e 100644 --- a/src/app/shared/components/inputs/category-autocomplete-field/category-autocomplete-field.component.ts +++ b/src/app/shared/components/inputs/category-autocomplete-field/category-autocomplete-field.component.ts @@ -1,13 +1,14 @@ import { ChangeDetectionStrategy, Component, Input } from '@angular/core'; import { WrappedFormControlSuperclass } from '@s-libs/ng-core'; import { Category } from '@vality/swag-payments'; +import { coerceBoolean } from 'coerce-property'; import { Observable } from 'rxjs'; import { map } from 'rxjs/operators'; import { CategoriesService } from '@dsh/api/payments'; import { Option } from '@dsh/components/form-controls/select-search-field'; import { shareReplayRefCount } from '@dsh/operators'; -import { provideValueAccessor, coerceBoolean } from '@dsh/utils'; +import { provideValueAccessor } from '@dsh/utils'; @Component({ selector: 'dsh-category-autocomplete-field', diff --git a/src/app/shared/components/inputs/country-autocomplete-field/countries-autocomplete-field.component.ts b/src/app/shared/components/inputs/country-autocomplete-field/countries-autocomplete-field.component.ts index 9428c550..e2ad3453 100644 --- a/src/app/shared/components/inputs/country-autocomplete-field/countries-autocomplete-field.component.ts +++ b/src/app/shared/components/inputs/country-autocomplete-field/countries-autocomplete-field.component.ts @@ -1,9 +1,10 @@ import { ChangeDetectionStrategy, Component, Input } from '@angular/core'; import { WrappedFormControlSuperclass } from '@s-libs/ng-core'; +import { coerceBoolean } from 'coerce-property'; import { map } from 'rxjs/operators'; import { CountriesService } from '@dsh/api/payments'; -import { provideValueAccessor, coerceBoolean } from '@dsh/utils'; +import { provideValueAccessor } from '@dsh/utils'; import { CountryId } from './types'; import { countriesToOptions } from './utils'; diff --git a/src/app/shared/components/inputs/currency-autocomplete-field/currency-autocomplete-field.component.ts b/src/app/shared/components/inputs/currency-autocomplete-field/currency-autocomplete-field.component.ts index a6e2f313..45f31a7f 100644 --- a/src/app/shared/components/inputs/currency-autocomplete-field/currency-autocomplete-field.component.ts +++ b/src/app/shared/components/inputs/currency-autocomplete-field/currency-autocomplete-field.component.ts @@ -1,8 +1,11 @@ import { ChangeDetectionStrategy, Component, Input } from '@angular/core'; import { WrappedFormControlSuperclass } from '@s-libs/ng-core'; +import { coerceBoolean } from 'coerce-property'; import { Option } from '@dsh/components/form-controls/radio-group-field'; -import { provideValueAccessor, coerceBoolean } from '@dsh/utils'; +import { provideValueAccessor } from '@dsh/utils'; + +import { ConfigService } from '../../../../config'; @Component({ selector: 'dsh-currency-autocomplete-field', @@ -14,23 +17,11 @@ export class CurrencyAutocompleteFieldComponent extends WrappedFormControlSuperc @Input() label: string; @Input() @coerceBoolean required = false; - options: Option[] = [ - 'RUB', - 'USD', - 'EUR', - 'UAH', - 'KZT', - 'BYN', - 'JPY', - 'INR', - 'AZN', - 'BRL', - 'BDT', - 'TRY', - 'PHP', - 'KRW', - 'PKR', - ] + options: Option[] = this.configService.currencies .sort() .map((currency) => ({ label: currency, value: currency })); + + constructor(private configService: ConfigService) { + super(); + } } diff --git a/src/app/shared/components/inputs/max-length-input/max-length-input.component.ts b/src/app/shared/components/inputs/max-length-input/max-length-input.component.ts index 4e7e2315..cdd1c41b 100644 --- a/src/app/shared/components/inputs/max-length-input/max-length-input.component.ts +++ b/src/app/shared/components/inputs/max-length-input/max-length-input.component.ts @@ -2,6 +2,7 @@ import { ChangeDetectionStrategy, Component, forwardRef, Input, OnChanges } from import { ControlValueAccessor, NG_VALUE_ACCESSOR, Validators } from '@angular/forms'; import { FormControl, ValidatorFn } from '@ngneat/reactive-forms'; import { UntilDestroy, untilDestroyed } from '@ngneat/until-destroy'; +import { coerceBoolean } from 'coerce-property'; import isNil from 'lodash-es/isNil'; import isObject from 'lodash-es/isObject'; import { skip } from 'rxjs/operators'; @@ -9,7 +10,6 @@ import { skip } from 'rxjs/operators'; import { ComponentInputError } from '@dsh/app/shared/services/error/models/component-input-error'; import { ErrorMatcher } from '@dsh/app/shared/utils'; import { ComponentChanges } from '@dsh/type-utils'; -import { coerceBoolean } from '@dsh/utils'; @UntilDestroy() @Component({ selector: 'dsh-max-length-input', diff --git a/src/app/shared/components/inputs/payment-institution-field/payment-institution-field.component.ts b/src/app/shared/components/inputs/payment-institution-field/payment-institution-field.component.ts index eccb3fcd..c7e41f81 100644 --- a/src/app/shared/components/inputs/payment-institution-field/payment-institution-field.component.ts +++ b/src/app/shared/components/inputs/payment-institution-field/payment-institution-field.component.ts @@ -1,12 +1,13 @@ import { ChangeDetectionStrategy, Component, Input } from '@angular/core'; import { WrappedFormControlSuperclass } from '@s-libs/ng-core'; import { PaymentInstitution } from '@vality/swag-payments'; +import { coerceBoolean } from 'coerce-property'; import { Observable } from 'rxjs'; import { map, share } from 'rxjs/operators'; import { PaymentInstitutionsService } from '@dsh/api/payments'; import { Option } from '@dsh/components/form-controls/select-search-field'; -import { provideValueAccessor, coerceBoolean } from '@dsh/utils'; +import { provideValueAccessor } from '@dsh/utils'; @Component({ selector: 'dsh-payment-institution-field', diff --git a/src/app/shared/components/inputs/shop-field/shop-field.component.ts b/src/app/shared/components/inputs/shop-field/shop-field.component.ts index 55a52766..bfb03f46 100644 --- a/src/app/shared/components/inputs/shop-field/shop-field.component.ts +++ b/src/app/shared/components/inputs/shop-field/shop-field.component.ts @@ -1,6 +1,7 @@ import { ChangeDetectionStrategy, Component, Inject, Input, Optional } from '@angular/core'; import { WrappedFormControlSuperclass } from '@s-libs/ng-core'; import { Shop } from '@vality/swag-payments'; +import { coerceBoolean } from 'coerce-property'; import { defer, Observable } from 'rxjs'; import { map } from 'rxjs/operators'; @@ -9,7 +10,7 @@ import { ShopsDataService } from '@dsh/app/shared'; import { shopToOption } from '@dsh/app/shared/components/inputs/shop-field/utils/shops-to-options'; import { Option } from '@dsh/components/form-controls/select-search-field'; import { shareReplayRefCount } from '@dsh/operators'; -import { coerceBoolean, provideValueAccessor } from '@dsh/utils'; +import { provideValueAccessor } from '@dsh/utils'; import { SHOPS } from './shops-token'; diff --git a/src/app/shared/components/inputs/wallet-autocomplete-field/wallet-autocomplete-field.component.ts b/src/app/shared/components/inputs/wallet-autocomplete-field/wallet-autocomplete-field.component.ts index 2d6e2a9b..a56fa771 100644 --- a/src/app/shared/components/inputs/wallet-autocomplete-field/wallet-autocomplete-field.component.ts +++ b/src/app/shared/components/inputs/wallet-autocomplete-field/wallet-autocomplete-field.component.ts @@ -1,9 +1,10 @@ import { ChangeDetectionStrategy, Component, Input } from '@angular/core'; import { WrappedFormControlSuperclass } from '@s-libs/ng-core'; +import { coerceBoolean } from 'coerce-property'; import { map } from 'rxjs/operators'; import { WalletsService } from '@dsh/api/wallet'; -import { coerceBoolean, provideValueAccessor } from '@dsh/utils'; +import { provideValueAccessor } from '@dsh/utils'; import { WalletId } from './types'; import { walletsToOptions } from './utils'; diff --git a/src/app/shared/components/organization-roles/organization-roles.component.ts b/src/app/shared/components/organization-roles/organization-roles.component.ts index 5bcf85f3..43ea83d1 100644 --- a/src/app/shared/components/organization-roles/organization-roles.component.ts +++ b/src/app/shared/components/organization-roles/organization-roles.component.ts @@ -1,8 +1,8 @@ import { ChangeDetectionStrategy, Component, Input } from '@angular/core'; import { MemberRole } from '@vality/swag-organizations'; +import { coerceBoolean } from 'coerce-property'; import { OrganizationsDictionaryService } from '@dsh/api/organizations'; -import { coerceBoolean } from '@dsh/utils'; import { RoleGroup } from './types/role-group'; import { groupRoles } from './utils/group-roles'; diff --git a/src/app/shared/components/radio-buttons/expandable-radio-group/expandable-radio-group.component.ts b/src/app/shared/components/radio-buttons/expandable-radio-group/expandable-radio-group.component.ts index d123bb58..7b03e93b 100644 --- a/src/app/shared/components/radio-buttons/expandable-radio-group/expandable-radio-group.component.ts +++ b/src/app/shared/components/radio-buttons/expandable-radio-group/expandable-radio-group.component.ts @@ -11,10 +11,10 @@ import { TemplateRef, } from '@angular/core'; import { FormControl } from '@ngneat/reactive-forms'; +import { coerceBoolean } from 'coerce-property'; import { isNumber } from '@dsh/app/shared/utils'; import { Dict } from '@dsh/type-utils'; -import { coerceBoolean } from '@dsh/utils'; import { ExpandableRadioGroupItemDirective } from './directives/expandable-radio-group-item/expandable-radio-group-item.directive'; import { ExpandableRadioChoice, isExpandableRadioObjectChoice } from './types/expandable-radio-choice'; diff --git a/src/assets/icons/x.svg b/src/assets/icons/x.svg new file mode 100644 index 00000000..152e81b1 --- /dev/null +++ b/src/assets/icons/x.svg @@ -0,0 +1,5 @@ + + + diff --git a/src/components/buttons/button/button.component.ts b/src/components/buttons/button/button.component.ts index bda2984d..6c6a52fe 100644 --- a/src/components/buttons/button/button.component.ts +++ b/src/components/buttons/button/button.component.ts @@ -10,8 +10,7 @@ import { ViewEncapsulation, } from '@angular/core'; import { mixinDisabled } from '@angular/material/core'; - -import { coerceBoolean } from '@dsh/utils'; +import { coerceBoolean } from 'coerce-property'; import { ColorManager } from './color-manager'; import { FocusManager } from './focus-manager'; diff --git a/src/components/filter/components/filter-button/filter-button.component.ts b/src/components/filter/components/filter-button/filter-button.component.ts index 4c5aeb66..d0a6df57 100644 --- a/src/components/filter/components/filter-button/filter-button.component.ts +++ b/src/components/filter/components/filter-button/filter-button.component.ts @@ -1,6 +1,5 @@ import { ChangeDetectionStrategy, Component, Input } from '@angular/core'; - -import { coerceBoolean } from '@dsh/utils'; +import { coerceBoolean } from 'coerce-property'; @Component({ selector: 'dsh-filter-button', diff --git a/src/components/filter/components/filter-content/filter-content.component.ts b/src/components/filter/components/filter-content/filter-content.component.ts index d6404464..ef1f957a 100644 --- a/src/components/filter/components/filter-content/filter-content.component.ts +++ b/src/components/filter/components/filter-content/filter-content.component.ts @@ -1,6 +1,5 @@ import { ChangeDetectionStrategy, Component, EventEmitter, Input, Output } from '@angular/core'; - -import { coerceBoolean } from '@dsh/utils'; +import { coerceBoolean } from 'coerce-property'; @Component({ selector: 'dsh-filter-content', diff --git a/src/components/filter/filter.component.ts b/src/components/filter/filter.component.ts index 554a8f8f..e3cd7e54 100644 --- a/src/components/filter/filter.component.ts +++ b/src/components/filter/filter.component.ts @@ -2,10 +2,9 @@ import { BreakpointObserver, Breakpoints } from '@angular/cdk/layout'; import { ChangeDetectionStrategy, Component, EventEmitter, Input, Output, TemplateRef } from '@angular/core'; import { MatLegacyDialog as MatDialog } from '@angular/material/legacy-dialog'; import { UntilDestroy, untilDestroyed } from '@ngneat/until-destroy'; +import { coerceBoolean } from 'coerce-property'; import { map, pluck } from 'rxjs/operators'; -import { coerceBoolean } from '@dsh/utils'; - import { FilterDialogComponent } from './components/filter-dialog/filter-dialog.component'; @UntilDestroy() diff --git a/src/components/form-controls/multi-select-field/multi-select-field.component.ts b/src/components/form-controls/multi-select-field/multi-select-field.component.ts index 056c4114..4feb871d 100644 --- a/src/components/form-controls/multi-select-field/multi-select-field.component.ts +++ b/src/components/form-controls/multi-select-field/multi-select-field.component.ts @@ -1,10 +1,11 @@ import { Component, Input, OnChanges } from '@angular/core'; import { UntilDestroy } from '@ngneat/until-destroy'; import { WrappedFormControlSuperclass } from '@s-libs/ng-core'; +import { coerceBoolean } from 'coerce-property'; import isNil from 'lodash-es/isNil'; import { ComponentChanges } from '@dsh/type-utils'; -import { provideValueAccessor, coerceBoolean } from '@dsh/utils'; +import { provideValueAccessor } from '@dsh/utils'; export interface Option { value: T; diff --git a/src/components/form-controls/select-search-field/select-search-field.component.html b/src/components/form-controls/select-search-field/select-search-field.component.html index 40733cf9..b7ec460c 100644 --- a/src/components/form-controls/select-search-field/select-search-field.component.html +++ b/src/components/form-controls/select-search-field/select-search-field.component.html @@ -1,12 +1,14 @@ {{ label }} {{ hint }} - + diff --git a/src/components/form-controls/select-search-field/select-search-field.component.ts b/src/components/form-controls/select-search-field/select-search-field.component.ts index 618156c6..c7bac681 100644 --- a/src/components/form-controls/select-search-field/select-search-field.component.ts +++ b/src/components/form-controls/select-search-field/select-search-field.component.ts @@ -1,11 +1,12 @@ import { OnChanges, ChangeDetectionStrategy, Input, Component } from '@angular/core'; import { FormControl } from '@ngneat/reactive-forms'; import { WrappedFormControlSuperclass } from '@s-libs/ng-core'; +import { coerceBoolean } from 'coerce-property'; import { BehaviorSubject, combineLatest, defer, Observable } from 'rxjs'; import { map } from 'rxjs/operators'; import { ComponentChanges } from '@dsh/type-utils'; -import { getFormValueChanges, provideValueAccessor, coerceBoolean } from '@dsh/utils'; +import { getFormValueChanges, provideValueAccessor } from '@dsh/utils'; import { Option } from './types'; import { filterOptions } from './utils'; diff --git a/src/components/indicators/selection/selection.component.ts b/src/components/indicators/selection/selection.component.ts index 1b12e188..7a2329e7 100644 --- a/src/components/indicators/selection/selection.component.ts +++ b/src/components/indicators/selection/selection.component.ts @@ -1,6 +1,5 @@ import { ChangeDetectionStrategy, Component, Input } from '@angular/core'; - -import { coerceBoolean } from '@dsh/utils'; +import { coerceBoolean } from 'coerce-property'; @Component({ selector: 'dsh-selection', diff --git a/src/components/indicators/status/status.component.ts b/src/components/indicators/status/status.component.ts index a1b61f1e..4cf4a184 100644 --- a/src/components/indicators/status/status.component.ts +++ b/src/components/indicators/status/status.component.ts @@ -1,7 +1,7 @@ import { Component, HostBinding, Input } from '@angular/core'; +import { coerceBoolean } from 'coerce-property'; import { StatusColor } from '../../../app/theme-manager'; -import { coerceBoolean } from '../../../utils'; @Component({ selector: 'dsh-status', diff --git a/src/components/layout/accordion/accordion-item/accordion-item.component.ts b/src/components/layout/accordion/accordion-item/accordion-item.component.ts index ade3348a..5bd606a5 100644 --- a/src/components/layout/accordion/accordion-item/accordion-item.component.ts +++ b/src/components/layout/accordion/accordion-item/accordion-item.component.ts @@ -1,7 +1,6 @@ import { coerceBooleanProperty } from '@angular/cdk/coercion'; import { ChangeDetectionStrategy, Component, ContentChild, EventEmitter, Input, Output } from '@angular/core'; - -import { coerce } from '@dsh/utils'; +import { coerce } from 'coerce-property'; import { EXPAND_ANIMATION } from './expand-animation'; import { LazyPanelContentDirective } from './lazy-panel-content.directive'; @@ -18,7 +17,7 @@ export class AccordionItemComponent { @Output() expandedChange = new EventEmitter(); @Input() - @coerce(coerceBooleanProperty, (v: boolean, self: AccordionItemComponent) => self.expandedChange.emit(v)) + @coerce(coerceBooleanProperty, (v: boolean, self) => self.expandedChange.emit(v)) expanded = false; @ContentChild(AccordionItemContentComponent) diff --git a/src/components/layout/accordion/accordion.component.ts b/src/components/layout/accordion/accordion.component.ts index 36a86acb..d1efb3cb 100644 --- a/src/components/layout/accordion/accordion.component.ts +++ b/src/components/layout/accordion/accordion.component.ts @@ -9,11 +9,12 @@ import { QueryList, ViewContainerRef, } from '@angular/core'; +import { coerce } from 'coerce-property'; import { combineLatest, merge, of } from 'rxjs'; import { delay, distinctUntilChanged, filter, map, startWith, switchMap, take } from 'rxjs/operators'; import { AccordionItemComponent } from './accordion-item'; -import { coerce, smoothChangeTo } from '../../../utils'; +import { smoothChangeTo } from '../../../utils'; const INIT_DELAY_MS = 350; const SCROLL_TO_Y_OFFSET_PX = 80; @@ -26,7 +27,7 @@ const SCROLL_TIME_MS = 500; }) export class AccordionComponent implements AfterViewInit { @Input() - @coerce((v) => v, (v: number, self: AccordionComponent) => self.expandedChange.emit(v)) + @coerce((v) => v, (v: number, self) => self.expandedChange.emit(v)) expanded: number; @Output() expandedChange = new EventEmitter(); diff --git a/src/components/layout/dropdown/dropdown.component.ts b/src/components/layout/dropdown/dropdown.component.ts index 11b1edd0..73290727 100644 --- a/src/components/layout/dropdown/dropdown.component.ts +++ b/src/components/layout/dropdown/dropdown.component.ts @@ -9,11 +9,10 @@ import { TemplateRef, ViewChild, } from '@angular/core'; +import { coerceBoolean } from 'coerce-property'; import { BehaviorSubject, Subject } from 'rxjs'; import { filter, takeUntil } from 'rxjs/operators'; -import { coerceBoolean } from '@dsh/utils'; - import { OPEN_CLOSE_ANIMATION, State } from './open-close-animation'; /** diff --git a/src/components/navigation/state-nav/state-nav-item/state-nav-item.component.ts b/src/components/navigation/state-nav/state-nav-item/state-nav-item.component.ts index 1bc6104b..d9a4ebab 100644 --- a/src/components/navigation/state-nav/state-nav-item/state-nav-item.component.ts +++ b/src/components/navigation/state-nav/state-nav-item/state-nav-item.component.ts @@ -1,8 +1,7 @@ import { Component, ElementRef, Input, Renderer2 } from '@angular/core'; +import { coerceBoolean } from 'coerce-property'; import { Subject } from 'rxjs'; -import { coerceBoolean } from '../../../../utils'; - export enum Color { Success = 'success', Warn = 'warn', diff --git a/src/components/navigation/state-nav/state-nav.component.ts b/src/components/navigation/state-nav/state-nav.component.ts index d20c14d6..d60e433e 100644 --- a/src/components/navigation/state-nav/state-nav.component.ts +++ b/src/components/navigation/state-nav/state-nav.component.ts @@ -8,10 +8,10 @@ import { QueryList, ViewEncapsulation, } from '@angular/core'; +import { coerceBoolean } from 'coerce-property'; import { Subscription } from 'rxjs'; import { StateNavItemComponent } from './state-nav-item'; -import { coerceBoolean } from '../../../utils'; @Component({ selector: 'dsh-state-nav', diff --git a/src/utils/coerce/coerce-by-type.ts b/src/utils/coerce/coerce-by-type.ts deleted file mode 100644 index bfb6a74c..00000000 --- a/src/utils/coerce/coerce-by-type.ts +++ /dev/null @@ -1,29 +0,0 @@ -import { - coerceArray as coerceArrayProperty, - coerceBooleanProperty, - coerceCssPixelValue, - coerceElement as coerceElementProperty, - coerceNumberProperty, -} from '@angular/cdk/coercion'; - -import { coerce } from './coerce'; - -export function coerceBoolean(target, key) { - return coerce(coerceBooleanProperty)(target, key); -} - -export function coerceNumber(target, key) { - return coerce(coerceNumberProperty)(target, key); -} - -export function coerceArray(target, key) { - return coerce(coerceArrayProperty)(target, key); -} - -export function coercePixel(target, key) { - return coerce(coerceCssPixelValue)(target, key); -} - -export function coerceElement(target, key) { - return coerce(coerceElementProperty)(target, key); -} diff --git a/src/utils/coerce/coerce.spec.ts b/src/utils/coerce/coerce.spec.ts deleted file mode 100644 index 9acb5b23..00000000 --- a/src/utils/coerce/coerce.spec.ts +++ /dev/null @@ -1,41 +0,0 @@ -import { coerce } from './coerce'; - -describe('coerce', () => { - class Simple { - @coerce(function (v) { - return this.withDef + v; - }) - testThisBefore = 1; - - @coerce((v) => v + 1) - withDef = 0; - - @coerce((v) => v + 1) - withoutDef; - - @coerce(function (v) { - return this.withDef + v; - }) - testThisAfter = 1; - } - - it("without default init shouldn't call", () => { - const simple = new Simple(); - expect(simple.withoutDef).toBeUndefined(); - }); - - it('with default init should call', () => { - const simple = new Simple(); - expect(simple.withDef).toBe(1); - }); - - it('init order should affects usage this (before)', () => { - const simple = new Simple(); - expect(simple.testThisBefore).toBeNaN(); - }); - - it('init order should affects usage this (after)', () => { - const simple = new Simple(); - expect(simple.testThisAfter).toBe(2); - }); -}); diff --git a/src/utils/coerce/coerce.ts b/src/utils/coerce/coerce.ts deleted file mode 100644 index 19947375..00000000 --- a/src/utils/coerce/coerce.ts +++ /dev/null @@ -1,22 +0,0 @@ -export function coerce( - fn: (value: I, self: T) => O, - afterFn?: (newValue: O, self: T, oldValue: I) => void -): PropertyDecorator { - return function (target: T, key) { - const _key = Symbol(key.toString()); - target[_key] = target[key]; - Object.defineProperty(target, key, { - get() { - return this[_key]; - }, - set: afterFn - ? function (v) { - this[_key] = fn.call(this, v); - afterFn.call(this, this[_key], this, v); - } - : function (v) { - this[_key] = fn.call(this, v, this); - }, - }); - }; -} diff --git a/src/utils/coerce/index.ts b/src/utils/coerce/index.ts deleted file mode 100644 index 992425ac..00000000 --- a/src/utils/coerce/index.ts +++ /dev/null @@ -1,2 +0,0 @@ -export * from './coerce'; -export * from './coerce-by-type'; diff --git a/src/utils/index.ts b/src/utils/index.ts index abdc71e9..830e57ab 100644 --- a/src/utils/index.ts +++ b/src/utils/index.ts @@ -1,4 +1,3 @@ -export * from './coerce'; export * from './get-base-class'; export * from './download'; export * from './smooth-change-to';