Merge branch 'develop' into Bytsa/2244-info-about-provider-when-press…

…ing-the-f5-button-when-editing-information-about-the-provider-the-page-does-not-return-to-its-previous-state # Conflicts: # src/app/shell/personal-cabinet/provider/create-provider/create-provider.component.html
ita-social-projects · Oct 11, 2023 · 797067b · 797067b
2 parents 30ecb18 + 9a20cf5
commit 797067b
Show file tree

Hide file tree

Showing 23 changed files with 436 additions and 351 deletions.
diff --git a/src/app/shared/constants/regex-constants.ts b/src/app/shared/constants/regex-constants.ts
@@ -6,7 +6,7 @@
 export const TEXT_REGEX: RegExp = /^\S[А-Яа-яЇїІіЄєЁёҐґ'’`\s-]*$/;
 
 // Regex for lastName, firstName, middleName, fullName
-export const NAME_REGEX: RegExp = /^[А-Яа-яЇїІіЄєЁёҐґ'’`\s-]*[А-Яа-яЇїІіЄєЁёҐґ]$/;
+export const NAME_REGEX: RegExp = /^[А-Яа-яЇїІіЄєЁёҐґ'’`-]*[А-Яа-яЇїІіЄєЁёҐґ]$/;
 
 // Regex for email
 export const EMAIL_REGEX: RegExp = /^[\w.-]+@([\w.-]+\.)+[\w.-]{2,6}$/;

diff --git a/src/app/shared/enum/enumUA/localization.ts b/src/app/shared/enum/enumUA/localization.ts
@@ -0,0 +1,4 @@
+export enum Localization {
+  uk,
+  en
+}
diff --git a/src/app/shared/pipes/translate-cases.pipe.ts b/src/app/shared/pipes/translate-cases.pipe.ts
@@ -17,7 +17,7 @@ export class TranslateCasesPipe implements PipeTransform {
 
   transform(count: number, enumTranslate: any): string {
     const countLastStr = count?.toString().slice(-1);
-    let countNum = count?.toString();
+    let countNum = count?.toString() || '0';
 
     if (count === 0 || (count >= 11 && count <= 14)) {
       this.translateKey = enumTranslate[2];

diff --git a/src/app/shared/store/meta-data.actions.ts b/src/app/shared/store/meta-data.actions.ts
@@ -8,7 +8,7 @@ export class GetDirections {
 
 export class GetSocialGroup {
   static readonly type = '[meta-data] Get get social groups';
-  constructor() {}
+  constructor(public locale?: string) {}
 }
 
 export class GetInstitutionStatuses {
@@ -37,7 +37,7 @@ export class GetFeaturesList {
 
 export class GetAllInstitutions {
   static readonly type = '[meta-data] Get All Institutions';
-  constructor(public filterNonGovernment: boolean) {}
+  constructor(public filterNonGovernment: boolean, public locale?: string) {}
 }
 
 export class GetAllInstitutionsHierarchy {

diff --git a/src/app/shared/store/meta-data.state.ts b/src/app/shared/store/meta-data.state.ts
@@ -2,6 +2,7 @@ import { Injectable } from '@angular/core';
 import { Action, Selector, State, StateContext } from '@ngxs/store';
 import { Observable } from 'rxjs';
 import { tap } from 'rxjs/operators';
+import { Util } from 'shared/utils/utils';
 
 import { Constants, EMPTY_RESULT } from '../constants/constants';
 import { AchievementType } from '../models/achievement.model';
@@ -175,10 +176,10 @@ export class MetaDataState {
   }
 
   @Action(GetSocialGroup)
-  getSocialGroup({ patchState }: StateContext<MetaDataStateModel>, {}: GetSocialGroup): Observable<DataItem[]> {
+  getSocialGroup({ patchState }: StateContext<MetaDataStateModel>, { locale }: GetSocialGroup): Observable<DataItem[]> {
     patchState({ isLoading: true });
     return this.childrenService
-      .getSocialGroup({ uk: 0, en: 1 }[localStorage.getItem('ui-culture') || 'uk'])
+      .getSocialGroup(Util.getCurrentLocalization(locale))
       .pipe(tap((socialGroups: DataItem[]) => patchState({ socialGroups, isLoading: false })));
   }
 

diff --git a/src/app/shared/styles/cabinet.scss b/src/app/shared/styles/cabinet.scss
@@ -1,22 +1,25 @@
 .container {
   background: #ffffff;
-  box-shadow: 0px 6px 16px rgba(0, 0, 0, 0.08);
+  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.08);
   margin-bottom: 20px;
   padding: 1.5rem 1.5rem 0 1.5rem;
   border-radius: 5px;
 
   .nav {
     border-bottom: none;
+
     a {
       font-size: 13px;
       opacity: 1;
-      min-width: 0px !important;
+      min-width: 0 !important;
       height: inherit !important;
-      padding: 0 24px 8px 24px !important;
+      padding: 4px 24px 4px 24px !important;
     }
+
     a:first-child {
-      padding: 0 24px 8px 0px !important;
+      padding: 4px 12px 4px 12px !important;
     }
+
     .active {
       color: #3849f9;
       border-bottom: 2px solid #3849f9;
@@ -27,12 +30,13 @@
     margin-top: 40px;
   }
 }
-.title,
-.nav a {
+
+.title, .nav a {
   font-weight: 700;
   font-family: 'Innerspace';
   color: #444444;
 }
+
 .title {
   font-size: 18px;
   line-height: inherit;

diff --git a/src/app/shared/utils/utils.ts b/src/app/shared/utils/utils.ts
@@ -1,3 +1,4 @@
+import { Localization } from 'shared/enum/enumUA/localization';
 import { BaseAdmin } from 'shared/models/admin.model';
 import { AreaAdmin } from 'shared/models/areaAdmin.model';
 import { CodeMessageErrors } from '../enum/enumUA/errors';
@@ -19,6 +20,20 @@ import { EmailConfirmationStatuses } from './../enum/statuses';
  * Utility class that providers methods for shared data manipulations
  */
 export class Util {
+  /**
+   * This method returns current localization as a number for backend requests
+   * <br>
+   * Locale string can be passed as param or by default it is taken from local storage,
+   * but it is required to provide locale if calling from a language change event
+   * because storage gives the previous locale
+   * <br>
+   * Ukrainian locale is 0 and English is 1
+   * @param locale Locale string (uk, en)
+   */
+  public static getCurrentLocalization(locale: string = localStorage.getItem('ui-culture') || 'uk'): number {
+    return Localization[locale];
+  }
+
   /**
    * This method returns child age
    * @param child Child
@@ -66,9 +81,7 @@ export class Util {
   }
 
   public static getTodayBirthDate(): Date {
-    const today = new Date();
-
-    return today;
+    return new Date();
   }
 
   /**

diff --git a/src/app/shell/admin-tools/data/admins/create-admin/create-admin.component.html b/src/app/shell/admin-tools/data/admins/create-admin/create-admin.component.html
@@ -12,65 +12,59 @@ <h3 class="wrapper-title">{{ formTitle | translate | uppercase }}</h3>
       <mat-form-field>
         <input matInput class="step-input" type="text" formControlName="lastName" autocomplete="none" appTrimValue />
       </mat-form-field>
-      <app-validation-hint
-        [validationFormControl]="adminFormGroup.get('lastName')"
-        [minCharacters]="validationConstants.INPUT_LENGTH_1"
-        [maxCharacters]="validationConstants.INPUT_LENGTH_60">
+      <app-validation-hint [validationFormControl]="adminFormGroup.get('lastName')"
+                           [minCharacters]="validationConstants.INPUT_LENGTH_1"
+                           [maxCharacters]="validationConstants.INPUT_LENGTH_60">
       </app-validation-hint>
 
       <label class="step-label">{{ 'FORMS.LABELS.FIRST_NAME' | translate }}<span class="step-required">*</span></label>
       <mat-form-field>
         <input matInput class="step-input" type="text" formControlName="firstName" autocomplete="none" appTrimValue />
       </mat-form-field>
-      <app-validation-hint
-        [validationFormControl]="adminFormGroup.get('firstName')"
-        [minCharacters]="validationConstants.INPUT_LENGTH_1"
-        [maxCharacters]="validationConstants.INPUT_LENGTH_60">
+      <app-validation-hint [validationFormControl]="adminFormGroup.get('firstName')"
+                           [minCharacters]="validationConstants.INPUT_LENGTH_1"
+                           [maxCharacters]="validationConstants.INPUT_LENGTH_60">
       </app-validation-hint>
 
       <label class="step-label">{{ 'FORMS.LABELS.MIDDLE_NAME' | translate }}</label>
       <mat-form-field>
         <input matInput class="step-input" type="text" formControlName="middleName" autocomplete="none" appTrimValue />
       </mat-form-field>
-      <app-validation-hint
-        [validationFormControl]="adminFormGroup.get('middleName')"
-        [minCharacters]="validationConstants.INPUT_LENGTH_1"
-        [maxCharacters]="validationConstants.INPUT_LENGTH_60">
+      <app-validation-hint [validationFormControl]="adminFormGroup.get('middleName')"
+                           [minCharacters]="validationConstants.INPUT_LENGTH_1"
+                           [maxCharacters]="validationConstants.INPUT_LENGTH_60">
       </app-validation-hint>
 
       <label class="step-label"> {{ 'FORMS.LABELS.PHONE' | translate }} <span class="step-required">*</span></label>
       <mat-form-field>
         <div fxLayout="row" fxLayoutAlign="start">
           <span class="step-text">{{ phonePrefix }}</span>
-          <input
-            matInput
-            class="step-input"
-            type="tel"
-            formControlName="phoneNumber"
-            appDigitOnly
-            maxlength="{{ validationConstants.PHONE_LENGTH }}"
-            appTrimValue
-            ui-number-mask
-            ui-hide-group-sep />
+          <input matInput
+                 class="step-input"
+                 type="tel"
+                 formControlName="phoneNumber"
+                 appDigitOnly
+                 maxlength="{{ validationConstants.PHONE_LENGTH }}"
+                 appTrimValue
+                 ui-number-mask
+                 ui-hide-group-sep />
         </div>
       </mat-form-field>
-      <app-validation-hint
-        [validationFormControl]="adminFormGroup.get('phoneNumber')"
-        [minCharacters]="validationConstants.PHONE_LENGTH"
-        [isPhoneNumber]="true">
+      <app-validation-hint [validationFormControl]="adminFormGroup.get('phoneNumber')"
+                           [minCharacters]="validationConstants.PHONE_LENGTH"
+                           [isPhoneNumber]="true">
       </app-validation-hint>
 
-      <label class="step-label"
-      >{{ 'FORMS.LABELS.SUBORDINATION' | translate }}<span class="step-required">*</span></label
-      >
+      <label class="step-label">
+        {{ 'FORMS.LABELS.SUBORDINATION' | translate }}<span class="step-required">*</span>
+      </label>
       <mat-form-field floatLabel="never" appearance="none">
-        <mat-select
-          [compareWith]="compareInstitutions"
-          disableOptionCentering
-          panelClass="dropdown-panel"
-          class="step-input"
-          formControlName="institution"
-          placeholder="{{ 'FORMS.PLACEHOLDERS.SELECT_SUBORDINATION' | translate }}">
+        <mat-select [compareWith]="compareInstitutions"
+                    disableOptionCentering
+                    panelClass="dropdown-panel"
+                    class="step-input"
+                    formControlName="institution"
+                    placeholder="{{ 'FORMS.PLACEHOLDERS.SELECT_SUBORDINATION' | translate }}">
           <mat-option *ngFor="let institution of institutions$ | async" [value]="institution" class="dropdown-option">
             {{ institution.title }}
           </mat-option>
@@ -80,13 +74,12 @@ <h3 class="wrapper-title">{{ formTitle | translate | uppercase }}</h3>
       <ng-container *ngIf="isRegionAdmin || isAreaAdmin">
         <label class="step-label">{{ 'FORMS.LABELS.REGION' | translate }}<span class="step-required">*</span></label>
         <mat-form-field floatLabel="never" appearance="none">
-          <mat-select
-            [compareWith]="compareCodeficators"
-            disableOptionCentering
-            panelClass="dropdown-panel"
-            class="step-input"
-            [formControl]="regionFormControl"
-            placeholder="{{ 'FORMS.PLACEHOLDERS.SELECT_REGION' | translate }}">
+          <mat-select [compareWith]="compareCodeficators"
+                      disableOptionCentering
+                      panelClass="dropdown-panel"
+                      class="step-input"
+                      [formControl]="regionFormControl"
+                      placeholder="{{ 'FORMS.PLACEHOLDERS.SELECT_REGION' | translate }}">
             <mat-option *ngFor="let region of regions$ | async"
                         [value]="region" class="dropdown-option">
               {{ region.fullName }}
@@ -99,13 +92,12 @@ <h3 class="wrapper-title">{{ formTitle | translate | uppercase }}</h3>
         <label class="step-label">{{ 'FORMS.PLACEHOLDERS.SELECT_TERRITORIAL_COMMUNITY' | translate }}<span
           class="step-required">*</span></label>
         <mat-form-field floatLabel="never" appearance="none">
-          <mat-select
-            [compareWith]="compareCodeficators"
-            disableOptionCentering
-            panelClass="dropdown-panel"
-            class="step-input"
-            [formControl]="territorialCommunityFormControl"
-            placeholder="{{ 'FORMS.PLACEHOLDERS.SELECT_TERRITORIAL_COMMUNITY' | translate }}">
+          <mat-select [compareWith]="compareCodeficators"
+                      disableOptionCentering
+                      panelClass="dropdown-panel"
+                      class="step-input"
+                      [formControl]="territorialCommunityFormControl"
+                      placeholder="{{ 'FORMS.PLACEHOLDERS.SELECT_TERRITORIAL_COMMUNITY' | translate }}">
             <mat-option *ngFor="let codeficator of codeficatorSearch$ | async"
                         [value]="codeficator" class="dropdown-option">
               {{ codeficator.territorialCommunity }}
@@ -116,28 +108,31 @@ <h3 class="wrapper-title">{{ formTitle | translate | uppercase }}</h3>
       </ng-container>
       <label class="step-label"> {{ 'FORMS.LABELS.EMAIL' | translate }} <span class="step-required">*</span></label>
       <mat-form-field appearance="none">
-        <input
-          matInput
-          class="step-input"
-          type="email"
-          formControlName="email"
-          appTrimValue
-          [placeholder]="mailFormPlaceholder" />
+        <input matInput
+               class="step-input"
+               type="email"
+               formControlName="email"
+               appTrimValue
+               [placeholder]="mailFormPlaceholder" />
       </mat-form-field>
       <app-validation-hint [validationFormControl]="adminFormGroup.get('email')"></app-validation-hint>
     </form>
 
     <div fxLayout="column" fxLayoutAlign="start start" class="wrapper-check-box step">
       <label class="checkbox-label">
         {{ 'AGREEMENTS.I_AGREE_FOR_ADMIN' | translate }}
-        <a class="link" [routerLink]="'/info/rules'" target="_blank"> {{ 'AGREEMENTS.PLATFORM_RULES' | translate }}</a>
-        {{ 'AGREEMENTS.PERSONAL_DATA_USE' | translate }}</label
-      >
+        <a class="link" [routerLink]="'/info/rules'" target="_blank">
+          {{ 'AGREEMENTS.PLATFORM_RULES' | translate }}
+        </a>
+        {{ 'AGREEMENTS.PERSONAL_DATA_USE' | translate }}
+      </label>
     </div>
 
     <div fxLayout="row" fxLayoutAlign="center center" class="footer">
-      <button mat-raised-button class="btn btn-cancel" (click)="onCancel()">{{ 'BUTTONS.CANCEL' | translate }}</button>
-      <button [disabled]="!adminFormGroup.valid"
+      <button mat-raised-button class="btn btn-cancel" (click)="onCancel()">
+        {{ 'BUTTONS.CANCEL' | translate }}
+      </button>
+      <button [disabled]="!adminFormGroup.dirty || adminFormGroup.invalid"
               class="btn" mat-button type="submit"
               (click)="onSubmit()">
         {{ 'BUTTONS.SAVE' | translate }}

diff --git a/...tools/data/directions-wrapper/directions/create-direction/create-direction.component.html b/...tools/data/directions-wrapper/directions/create-direction/create-direction.component.html
@@ -1,13 +1,17 @@
 <div class="create-form" *ngIf="!(isLoading$ | async)">
   <div class="wrapper">
     <div class="create-form-header" fxLayout="column" fxLayoutAlign="center center">
-      <h3 class="wrapper-title">{{ editMode ? 'РЕДАГУВАТИ' : 'ДОДАТИ' }} НАПРЯМОК</h3>
+      <h3 class="wrapper-title">{{ editMode
+                                   ? 'РЕДАГУВАТИ'
+                                   : 'ДОДАТИ' }} НАПРЯМОК</h3>
     </div>
 
     <ng-container *ngIf="!editMode || (editMode && (direction$ | async))">
       <form [formGroup]="directionFormGroup" fxLayout="column" fxLayoutAlign="center space-between" class="step">
-        <label class="step-label"
-          >{{ editMode ? 'Редагувати назву напрямку' : 'Назва нового напрямку' }}
+        <label class="step-label">
+          {{ editMode
+             ? 'Редагувати назву напрямку'
+             : 'Назва нового напрямку' }}
           <span *ngIf="!editMode" class="step-required">*</span>
         </label>
 
@@ -17,8 +21,15 @@ <h3 class="wrapper-title">{{ editMode ? 'РЕДАГУВАТИ' : 'ДОДАТИ'
         <app-validation-hint [validationFormControl]="directionFormGroup.get('title')"></app-validation-hint>
 
         <div fxLayout="row" fxLayoutAlign="center center" class="footer">
-          <button mat-raised-button class="btn btn-cancel" (click)="onCancel()">Скасувати</button>
-          <button [disabled]="directionFormGroup.invalid || isDispatching" class="btn" (click)="onSubmit()" mat-raised-button>Зберегти</button>
+          <button mat-raised-button class="btn btn-cancel" (click)="onCancel()">
+            {{ 'BUTTONS.CANCEL' | translate }}
+          </button>
+          <button class="btn"
+                  [disabled]="!directionFormGroup.dirty || directionFormGroup.invalid || isDispatching"
+                  (click)="onSubmit()"
+                  mat-raised-button>
+            {{ 'BUTTONS.SAVE' | translate }}
+          </button>
         </div>
       </form>
     </ng-container>