Merge branch 'develop' into Oliinyk/PRTemplateFix

ita-social-projects · Jul 17, 2024 · 38f5a5f · 38f5a5f
2 parents 6767e9e + da197a8
commit 38f5a5f
Show file tree

Hide file tree

Showing 196 changed files with 2,882 additions and 1,055 deletions.
diff --git a/.husky/pre-commit b/.husky/pre-commit
@@ -0,0 +1,5 @@
+npx lint-staged
+if [ $? -ne 0 ]; then
+  echo "Lint-staged failed, commit aborted."
+  exit 1
+fi
diff --git a/.lintstagedrc b/.lintstagedrc
@@ -0,0 +1,3 @@
+{
+  "*.{ts,scss,html}": ["yarn lint:fix"]
+}
diff --git a/angular.json b/angular.json
@@ -2,12 +2,7 @@
   "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
   "cli": {
     "analytics": false,
-    "schematicCollections": [
-      "@cypress/schematic",
-      "@angular-eslint/schematics",
-      "@angular-eslint/schematics",
-      "@schematics/angular"
-    ]
+    "schematicCollections": ["@cypress/schematic", "@angular-eslint/schematics", "@angular-eslint/schematics", "@schematics/angular"]
   },
   "version": 1,
   "newProjectRoot": "projects",
@@ -40,10 +35,7 @@
               "src/favicon.ico",
               "src/assets"
             ],
-            "styles": [
-              "./node_modules/leaflet/dist/leaflet.css",
-              "src/styles.scss"
-            ],
+            "styles": ["./node_modules/leaflet/dist/leaflet.css", "src/styles.scss"],
             "scripts": [],
             "vendorChunk": true,
             "extractLicenses": false,
@@ -144,10 +136,7 @@
         "lint": {
           "builder": "@angular-eslint/builder:lint",
           "options": {
-            "lintFilePatterns": [
-              "src/**/*.ts",
-              "src/**/*.html"
-            ]
+            "lintFilePatterns": ["src/**/*.ts", "src/**/*.html"]
           }
         },
         "cypress-run": {

diff --git a/cypress/fixtures/example.json b/cypress/fixtures/example.json
@@ -1,5 +1,4 @@
 {
-    "name": "Using fixtures to represent data",
-    "email": "hello@cypress.io"
+  "name": "Using fixtures to represent data",
+  "email": "hello@cypress.io"
 }
-
diff --git a/cypress/support/component-index.html b/cypress/support/component-index.html
@@ -1,12 +1,12 @@
-<!DOCTYPE html>
+<!doctype html>
 <html lang="en">
   <head>
-    <meta charset="utf-8">
-    <meta http-equiv="X-UA-Compatible" content="IE=edge">
-    <meta name="viewport" content="width=device-width,initial-scale=1.0">
+    <meta charset="utf-8" />
+    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+    <meta name="viewport" content="width=device-width,initial-scale=1.0" />
     <title>Components App</title>
   </head>
   <body>
     <div data-cy-root></div>
   </body>
-</html>
+</html>
diff --git a/package.json b/package.json
@@ -2,6 +2,7 @@
   "name": "out-of-school",
   "version": "0.0.0",
   "scripts": {
+    "prepare": "husky",
     "ng": "ng",
     "start": "ng serve",
     "build": "ng build",
@@ -67,6 +68,7 @@
     "@types/node": "^18.11.9",
     "@typescript-eslint/eslint-plugin": "7.5.0",
     "@typescript-eslint/parser": "7.5.0",
+    "cypress": "latest",
     "eslint": "^8.57.0",
     "eslint-config-prettier": "^9.1.0",
     "eslint-plugin-import": "^2.29.1",
@@ -75,14 +77,15 @@
     "eslint-plugin-no-null": "^1.0.2",
     "eslint-plugin-prettier": "^5.1.2",
     "eslint-plugin-react": "^7.34.1",
+    "husky": "^9.0.11",
     "jest": "^29.7.0",
     "jest-preset-angular": "^14.0.3",
     "karma-coverage": "~2.2.1",
+    "lint-staged": "^15.2.7",
     "prettier": "^3.2.5",
     "ts-jest": "^29.1.2",
     "ts-node": "~10.9.2",
-    "typescript": "~5.1.3",
-    "cypress": "latest"
+    "typescript": "~5.1.3"
   },
   "main": "index.js",
   "repository": "https://github.com/ita-social-projects/OoS-Frontend.git",

diff --git a/sonar-project.properties b/sonar-project.properties
@@ -1,6 +1,6 @@
 sonar.projectKey=ita-social-projects-oos-frontend
 sonar.organization=ita-social-projects
 sonar.exclusions=**/*.spec.ts
-sonar.coverage.exclusions=**/*.spec.ts,**/*.model.ts
+sonar.coverage.exclusions=**/*.spec.ts,**/*.model.ts,**/*.state.ts,**/*.actions.ts
 sonar.cpd.exclusions=**/*.spec.ts
 sonar.javascript.lcov.reportPaths=./coverage/lcov.info
diff --git a/src/app/app-routing.module.ts b/src/app/app-routing.module.ts
@@ -4,7 +4,7 @@ import { RouterModule, Routes } from '@angular/router';
 const routes: Routes = [{ path: 'data', loadChildren: () => import('./shell/admin-tools/data/data.module').then((m) => m.DataModule) }];
 
 @NgModule({
-  imports: [RouterModule.forRoot(routes, { useHash: true })],
+  imports: [RouterModule.forRoot(routes, { useHash: true, scrollPositionRestoration: 'enabled' })],
   exports: [RouterModule]
 })
 export class AppRoutingModule {}
diff --git a/src/app/footer/footer.component.html b/src/app/footer/footer.component.html
@@ -1,21 +1,24 @@
 <div class="trial-message">
   <span>{{ 'TRIAL_MESSAGE' | translate }}</span>
 </div>
-<div class="footer" fxLayout="row" fxLayoutAlign="flex-start center" fxLayoutGap="3rem" fxLayoutGap.lt-md="1rem">
+<div class="footer" fxLayout="row" fxLayoutAlign="start center" fxLayoutGap="3rem" fxLayoutGap.lt-md="1rem">
   <div fxLayout="row" fxLayoutAlign="flex-start center" fxLayoutGap.gt-sm="3rem" fxLayoutGap.lt-md="1rem" fxFlex="1 1 auto">
     <a target="_blank" rel="noreferrer" href="https://mon.gov.ua/">
       <img class="min-logo" src="assets/images/MES.png" alt="Ministry of Education and Science of Ukraine" />
     </a>
-    <a target="_blank" rel="noreferrer" href="https://mkip.gov.ua/">
+    <a target="_blank" rel="noreferrer" href="https://mkip.gov.ua/" class="mincult">
       <img class="min-logo" src="assets/images/MinCultInfoPolicy.png" alt="Ministry of Culture and Information Policy of Ukraine" />
     </a>
-    <a target="_blank" rel="noreferrer" href="https://mms.gov.ua/">
+    <a target="_blank" rel="noreferrer" href="https://mms.gov.ua/" class="min-molodi-full">
       <img class="min-logo" src="assets/images/MinMolodSport.png" alt="Ministry of Youth and Sports of Ukraine" />
     </a>
   </div>
   <div fxLayout="row" fxLayoutAlign="end center" fxLayoutGap.gt-sm="2rem" fxLayoutGap.lt-md="1rem" fxFlex="1 1 auto">
     <a target="_blank" rel="noreferrer" href="https://www.softserveinc.com/uk-ua/">
       <img class="company-logo" src="assets/images/SoftServeLogo.svg" alt="SoftServe" />
     </a>
+    <a target="_blank" rel="noopener noreferrer" href="https://mms.gov.ua/" class="min-molodi-mobile">
+      <img class="min-logo" src="assets/images/MinMolodSport.png" alt="Ministry of Youth and Sports of Ukraine" />
+    </a>
   </div>
 </div>
diff --git a/src/app/footer/footer.component.scss b/src/app/footer/footer.component.scss
@@ -22,6 +22,14 @@
     height: 41px;
   }
 
+  .min-molodi-mobile {
+    display: none;
+  }
+
+  .min-molodi-full {
+    display: block;
+  }
+
   @media (max-width: 1000px) {
     padding: 1.5rem 3rem;
     flex-direction: column !important;
@@ -61,4 +69,24 @@
       height: 12px;
     }
   }
+
+  @media (max-width: 450px) {
+    .min-molodi-mobile {
+      display: block;
+      margin-right: 105px;
+    }
+
+    & > div {
+      margin-right: 0 !important;
+      justify-content: space-between !important;
+    }
+
+    .min-molodi-full {
+      display: none;
+    }
+
+    .mincult {
+      margin-right: 0 !important;
+    }
+  }
 }
diff --git a/src/app/header/header.component.html b/src/app/header/header.component.html
@@ -4,17 +4,18 @@
       <div class="logo-wrapper" *ngIf="isMobileScreen && !!navigationPaths?.length; then mobileNavTmpl; else logoTmpl"></div>
       <div class="link-wrapper">
         <div *ngIf="!isMobileScreen" class="link-wrapper">
-          <a class="info-link" [routerLink]="'./info/about'">
+          <button mat-flat-button class="info-link" [routerLink]="'./info/about'">
             {{ 'ENUM.NAV_BAR_NAME.ABOUT_PORTAL' | translate | uppercase }}
-          </a>
+          </button>
 
-          <a class="info-link" [routerLink]="'./info/rules'">
+          <button mat-flat-button class="info-link" [routerLink]="'./info/rules'">
             {{ 'ENUM.NAV_BAR_NAME.LAWS_AND_REGULATIONS' | translate | uppercase }}
-          </a>
+          </button>
 
-          <a class="info-link" [routerLink]="'./info/support'">
+          <button mat-flat-button class="info-link" [routerLink]="'./info/support'">
+            <mat-icon>support</mat-icon>
             {{ 'ENUM.NAV_BAR_NAME.SUPPORT' | translate | uppercase }}
-          </a>
+          </button>
 
           <button mat-flat-button class="lang" (click)="lngSelect.open()">
             <mat-icon>language</mat-icon>
@@ -46,7 +47,7 @@ <h2 class="header-descr">{{ headerSubtitle }}</h2>
 <app-progress-bar></app-progress-bar>
 
 <ng-template #mobileNavTmpl>
-  <app-navigation-mobile-bar></app-navigation-mobile-bar>
+  <app-navigation-mobile-bar [ngClass]="'nav-mobile'"></app-navigation-mobile-bar>
 </ng-template>
 
 <ng-template #logoTmpl>
@@ -64,9 +65,9 @@ <h2 class="header-descr">{{ headerSubtitle }}</h2>
     <app-notifications class="menu" *ngIf="(featuresList$ | async)?.release2"></app-notifications>
 
     <button mat-flat-button class="menu" [matMenuTriggerFor]="log">
-      <mat-icon>account_circle</mat-icon>
+      <mat-icon class="account-circle">account_circle</mat-icon>
       {{ userShortName }}
-      <mat-icon>arrow_drop_down</mat-icon>
+      <mat-icon class="arrow-drop-down">arrow_drop_down</mat-icon>
     </button>
   </ng-container>
 
@@ -145,10 +146,15 @@ <h2 class="header-descr">{{ headerSubtitle }}</h2>
   </ng-template>
 
   <ng-template #unregisteredView>
-    <a [routerLink]="['./create-provider', ModeConstants.NEW]">
+    <a [routerLink]="['./create-provider', ModeConstants.NEW]" *ngIf="user.role === Role.provider">
       <button mat-menu-item>
         {{ 'ENUM.NAV_BAR_NAME.PROVIDER_REGISTRATION' | translate }}
       </button>
     </a>
+    <a [routerLink]="['./create-parent', ModeConstants.NEW]" *ngIf="user.role === Role.parent">
+      <button mat-menu-item>
+        {{ 'ENUM.NAV_BAR_NAME.USER_REGISTRATION' | translate }}
+      </button>
+    </a>
   </ng-template>
 </ng-template>
diff --git a/src/app/header/header.component.scss b/src/app/header/header.component.scss
@@ -43,15 +43,22 @@
   }
 
   .info-link {
+    display: flex;
     background: none;
     color: white;
+    align-items: center;
     justify-content: flex-end;
     font-size: 0.7rem;
     font-family: 'Innerspace';
     font-weight: bold;
     white-space: nowrap;
     line-height: 24px;
     cursor: pointer;
+    padding: 6px;
+
+    .mat-icon {
+      margin-right: 5px;
+    }
   }
 
   .login {
@@ -94,6 +101,11 @@
   }
 }
 
+.nav-mobile {
+  display: flex;
+  align-items: center;
+}
+
 .lang,
 .menu,
 .login {
@@ -102,52 +114,35 @@
   font-size: 0.7rem !important;
 }
 
-.lang mat-icon {
-  position: relative;
-  top: -1px;
-}
-
-.account-button {
-  font-weight: bold !important;
-  display: block;
-
-  .icon-account {
-    color: white;
+.menu .mat-icon {
+  &.account-circle {
+    margin-right: 5px;
+    padding-left: 5px;
   }
 
-  .account-circle {
-    width: 33px;
-    padding: 0 5px;
-    min-width: 0;
-    height: 33px;
-    background-color: transparent;
-    box-shadow: none;
-    top: -2px;
-    left: 5px;
-
-    ::ng-deep.mat-badge-content {
-      font-size: xx-small;
-      height: 15px;
-      width: 15px;
-      line-height: 15px;
-      top: 0;
-      left: 0 !important;
-      position: absolute;
-      background-color: #f5bc4a;
-    }
+  &.arrow-drop-down {
+    margin-left: 2.5px;
   }
 }
 
+.lang .mat-icon {
+  margin-right: 5px;
+  top: -1px;
+}
+
 ::ng-deep .lang-option {
   width: auto !important;
 }
 
 ::ng-deep .lang-option .mat-select-value {
   color: white !important;
-  width: 25px !important;
   overflow: visible;
   padding-right: 0px !important;
   font-family: 'Innerspace';
+
+  @media (max-width: 750px) {
+    margin-left: 12px !important;
+  }
 }
 
 ::ng-deep .lang-option .mat-select-arrow {

diff --git a/...mponents/confirmation-modal-window/reason-modal-window/reason-modal-window.component.scss b/...mponents/confirmation-modal-window/reason-modal-window/reason-modal-window.component.scss
@@ -13,3 +13,7 @@ form.reject-form {
 .step-label {
   margin-top: 15px;
 }
+
+.btn-cancel {
+  margin-left: 16px !important;
+}
diff --git a/src/app/shared/components/entity-checkbox-dropdown/entity-checkbox-dropdown.component.html b/src/app/shared/components/entity-checkbox-dropdown/entity-checkbox-dropdown.component.html
@@ -8,12 +8,18 @@
     class="dropdown"
     disableOptionCentering
     panelClass="dropdown-panel application-dropdown">
-    <mat-select-trigger>
+    <mat-select-trigger showTooltipIfTruncated>
       <div *ngIf="entityControl.value?.length">
-        <span *ngIf="entityControl.value?.length > 1">
-          {{ entityControl.value?.length | translateCases: declination }} {{ 'SELECTED' | translate }}
-        </span>
-        <span *ngIf="entityControl.value?.length === 1"> {{ entityControl.value[0].title }} </span>
+        <div class="workshops-amount">
+          <span *ngIf="entityControl.value?.length > 1">
+            {{ entityControl.value?.length | translateCases: declination }} {{ 'SELECTED' | translate }}
+          </span>
+        </div>
+        <div class="workshops-amount">
+          <span *ngIf="entityControl.value?.length === 1">
+            {{ entityControl.value[0].title }}
+          </span>
+        </div>
       </div>
     </mat-select-trigger>
     <mat-option class="dropdown-option" *ngFor="let entity of entities" [value]="entity" (click)="setIsUserInteractedToTrue()">