Initial commit

.editorconfig

+# Editor configuration, see https://editorconfig.org
+root = true
+
+[*]
+charset = utf-8
+indent_style = space
+indent_size = 2
+insert_final_newline = true
+trim_trailing_whitespace = true
+
+[*.ts]
+quote_type = single
+
+[*.md]
+max_line_length = off
+trim_trailing_whitespace = false

.gitignore

+# See http://help.github.com/ignore-files/ for more about ignoring files.
+
+# Compiled output
+/dist
+/tmp
+/out-tsc
+/bazel-out
+
+# Node
+/node_modules
+npm-debug.log
+yarn-error.log
+
+# IDEs and editors
+.idea/
+.project
+.classpath
+.c9/
+*.launch
+.settings/
+*.sublime-workspace
+
+# Visual Studio Code
+.vscode/*
+!.vscode/settings.json
+!.vscode/tasks.json
+!.vscode/launch.json
+!.vscode/extensions.json
+.history/*
+
+# Miscellaneous
+/.angular/cache
+.sass-cache/
+/connect.lock
+/coverage
+/libpeerconnection.log
+testem.log
+/typings
+
+# System files
+.DS_Store
+Thumbs.db

.vscode/extensions.json

+{
+  // For more information, visit: https://go.microsoft.com/fwlink/?linkid=827846
+  "recommendations": ["angular.ng-template"]
+}

.vscode/launch.json

+{
+  // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
+  "version": "0.2.0",
+  "configurations": [
+    {
+      "name": "ng serve",
+      "type": "pwa-chrome",
+      "request": "launch",
+      "preLaunchTask": "npm: start",
+      "url": "http://localhost:4200/"
+    },
+    {
+      "name": "ng test",
+      "type": "chrome",
+      "request": "launch",
+      "preLaunchTask": "npm: test",
+      "url": "http://localhost:9876/debug.html"
+    }
+  ]
+}

.vscode/tasks.json

+{
+  // For more information, visit: https://go.microsoft.com/fwlink/?LinkId=733558
+  "version": "2.0.0",
+  "tasks": [
+    {
+      "type": "npm",
+      "script": "start",
+      "isBackground": true,
+      "problemMatcher": {
+        "owner": "typescript",
+        "pattern": "$tsc",
+        "background": {
+          "activeOnStart": true,
+          "beginsPattern": {
+            "regexp": "(.*?)"
+          },
+          "endsPattern": {
+            "regexp": "bundle generation complete"
+          }
+        }
+      }
+    },
+    {
+      "type": "npm",
+      "script": "test",
+      "isBackground": true,
+      "problemMatcher": {
+        "owner": "typescript",
+        "pattern": "$tsc",
+        "background": {
+          "activeOnStart": true,
+          "beginsPattern": {
+            "regexp": "(.*?)"
+          },
+          "endsPattern": {
+            "regexp": "bundle generation complete"
+          }
+        }
+      }
+    }
+  ]
+}

README.md

+# Imagecompressed
+
+This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 15.0.5.
+
+## Development server
+
+Run `ng serve` for a dev server. Navigate to `http://localhost:4200/`. The application will automatically reload if you change any of the source files.
+
+## Code scaffolding
+
+Run `ng generate component component-name` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module`.
+
+## Build
+
+Run `ng build` to build the project. The build artifacts will be stored in the `dist/` directory.
+
+## Running unit tests
+
+Run `ng test` to execute the unit tests via [Karma](https://karma-runner.github.io).
+
+## Running end-to-end tests
+
+Run `ng e2e` to execute the end-to-end tests via a platform of your choice. To use this command, you need to first add a package that implements end-to-end testing capabilities.
+
+## Further help
+
+To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI Overview and Command Reference](https://angular.io/cli) page.

angular.json

+{
+  "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
+  "version": 1,
+  "newProjectRoot": "projects",
+  "projects": {
+    "imagecompressed": {
+      "projectType": "application",
+      "schematics": {
+        "@schematics/angular:component": {
+          "style": "scss"
+        }
+      },
+      "root": "",
+      "sourceRoot": "src",
+      "prefix": "app",
+      "architect": {
+        "build": {
+          "builder": "@angular-devkit/build-angular:browser",
+          "options": {
+            "outputPath": "dist/imagecompressed",
+            "index": "src/index.html",
+            "main": "src/main.ts",
+            "polyfills": [
+              "zone.js"
+            ],
+            "tsConfig": "tsconfig.app.json",
+            "inlineStyleLanguage": "scss",
+            "assets": [
+              "src/favicon.ico",
+              "src/assets"
+            ],
+            "styles": [
+              "node_modules/ng-zorro-antd/src/ng-zorro-antd.min.css",
+              "node_modules/ng-zorro-antd/resizable/style/index.min.css",
+              "node_modules/ng-zorro-antd/code-editor/style/index.min.css",
+              "node_modules/ng-zorro-antd/graph/style/index.min.css",
+              "@angular/material/prebuilt-themes/indigo-pink.css",
+              "node_modules/bootstrap/dist/css/bootstrap.min.css",
+              "src/styles.scss"
+            ],
+            "scripts": []
+          },
+          "configurations": {
+            "production": {
+              "budgets": [
+                {
+                  "type": "initial",
+                  "maximumWarning": "500kb",
+                  "maximumError": "1mb"
+                },
+                {
+                  "type": "anyComponentStyle",
+                  "maximumWarning": "2kb",
+                  "maximumError": "4kb"
+                }
+              ],
+              "outputHashing": "all"
+            },
+            "development": {
+              "buildOptimizer": false,
+              "optimization": false,
+              "vendorChunk": true,
+              "extractLicenses": false,
+              "sourceMap": true,
+              "namedChunks": true
+            }
+          },
+          "defaultConfiguration": "production"
+        },
+        "serve": {
+          "builder": "@angular-devkit/build-angular:dev-server",
+          "configurations": {
+            "production": {
+              "browserTarget": "imagecompressed:build:production"
+            },
+            "development": {
+              "browserTarget": "imagecompressed:build:development"
+            }
+          },
+          "defaultConfiguration": "development"
+        },
+        "extract-i18n": {
+          "builder": "@angular-devkit/build-angular:extract-i18n",
+          "options": {
+            "browserTarget": "imagecompressed:build"
+          }
+        },
+        "test": {
+          "builder": "@angular-devkit/build-angular:karma",
+          "options": {
+            "polyfills": [
+              "zone.js",
+              "zone.js/testing"
+            ],
+            "tsConfig": "tsconfig.spec.json",
+            "inlineStyleLanguage": "scss",
+            "assets": [
+              "src/favicon.ico",
+              "src/assets"
+            ],
+            "styles": [
+              "@angular/material/prebuilt-themes/indigo-pink.css",
+              "src/styles.scss"
+            ],
+            "scripts": []
+          }
+        }
+      }
+    }
+  }
+}

package.json

+{
+  "name": "imagecompressed",
+  "version": "0.0.0",
+  "scripts": {
+    "ng": "ng",
+    "start": "ng serve",
+    "build": "ng build",
+    "watch": "ng build --watch --configuration development",
+    "test": "ng test"
+  },
+  "private": true,
+  "dependencies": {
+    "@angular/animations": "^15.0.0",
+    "@angular/cdk": "^15.2.9",
+    "@angular/common": "^15.0.0",
+    "@angular/compiler": "^15.0.0",
+    "@angular/core": "^15.0.0",
+    "@angular/forms": "^15.0.0",
+    "@angular/material": "^15.2.9",
+    "@angular/platform-browser": "^15.0.0",
+    "@angular/platform-browser-dynamic": "^15.0.0",
+    "@angular/router": "^15.0.0",
+    "@ant-design/icons-angular": "^14.1.0",
+    "bootstrap": "^5.3.2",
+    "ng-zorro-antd": "^13.3.1",
+    "rxjs": "~7.5.0",
+    "tslib": "^2.3.0",
+    "zone.js": "~0.12.0"
+  },
+  "devDependencies": {
+    "@angular-devkit/build-angular": "^15.0.5",
+    "@angular/cli": "~15.0.5",
+    "@angular/compiler-cli": "^15.0.0",
+    "@types/jasmine": "~4.3.0",
+    "jasmine-core": "~4.5.0",
+    "karma": "~6.4.0",
+    "karma-chrome-launcher": "~3.1.0",
+    "karma-coverage": "~2.2.0",
+    "karma-jasmine": "~5.1.0",
+    "karma-jasmine-html-reporter": "~2.0.0",
+    "typescript": "~4.8.2"
+  }
+}

src/app/app-routing.module.ts

+import { NgModule } from '@angular/core';
+import { RouterModule, Routes } from '@angular/router';
+
+const routes: Routes = [];
+
+@NgModule({
+  imports: [RouterModule.forRoot(routes)],
+  exports: [RouterModule]
+})
+export class AppRoutingModule { }

src/app/app.component.html

+<nz-layout class="layout">
+  <nz-sider>
+    <div class="logo">Folder</div>
+    <ul nz-menu nzTheme="dark" nzMode="inline">
+      <li nz-menu-item *ngFor="let folder of folders">
+        <span nz-icon nzType="folder"></span>
+        <span>
+          <div class="text-wrap" (click)="getFolderImage(folder)">{{folder.name}}</div>
+        </span>
+      </li>
+    </ul>
+  </nz-sider>
+  <nz-layout class="right-layout">
+    <nz-header>
+      <div *ngIf="user">
+        <p style="text-align: right; margin-right: 2%;">User logged :  <b>{{user.email}}</b></p>
+      </div>
+    </nz-header>
+    <nz-content>
+      <nz-breadcrumb>
+        <nz-breadcrumb-item>
+          <div class="row mb-3">
+            <div class="col-md-4">
+              
+            </div>
+            <div class="col-md-8">
+              <button nz-button nzType="default" (click)="addFileSetting('1')"  [disabled]="buttonDisabled" style="margin-left: 1%;">Images validées</button>
+              <button nz-button nzType="default" (click)="addFileSetting('0')" [disabled]="buttonDisabled" style="margin-left: 1%;">Images non validées</button>
+              <button nz-button nzType="default" (click)="addFileSetting('-1')" [disabled]="buttonDisabled" style="margin-left: 1%;">Images à revoir</button>
+            </div>
+        </div>
+        </nz-breadcrumb-item>
+      </nz-breadcrumb>
+
+     <div class="inner-content">
+        <div class="container">
+          <div class="row">
+            <div class="col-12 col-md-6 col-xl-4 justify-content-center mb-5" *ngFor="let item of images">
+              <img
+              *ngIf="item.name != 'report\.txt'"
+              nz-image
+              style="cursor: pointer;"
+              width="280px"
+              height="280px"
+              nzSrc="data:image/png;base64,{{item.base64}}"
+              alt=""
+              />
+              <div *ngIf="item.name != 'report\.txt'" style="font-size: small; word-wrap: break-word; width: 80%; margin-top: 2%;">
+                {{item.name}}
+              </div>
+            </div>
+  
+          </div>
+        </div>
+      </div>
+    </nz-content>
+    <nz-footer>INDATACORE ©2024</nz-footer>
+  </nz-layout>
+</nz-layout>
+
+
+<nz-modal
+  [(nzVisible)]="isVisible"
+  nzTitle="Veuillez vous connecter"
+  nzClosable="false"
+  nzMaskClosable="true"
+  [nzFooter]="modalFooter"
+  (nzOnOk)="handleOk()"
+  (nzOnCancel)="handleCancel()"
+  >
+
+  <ng-container *nzModalContent>
+    <form nz-form [formGroup]="validateForm" class="login-form" (ngSubmit)="submitForm()">
+      <nz-form-item class="mb-4">
+        <nz-form-control nzErrorTip="Veuillez insérer votre mail!">
+          <nz-input-group nzPrefixIcon="user">
+            <input type="text" nz-input formControlName="userName" placeholder="Votre email" />
+          </nz-input-group>
+        </nz-form-control>
+      </nz-form-item>
+      <nz-form-item class="mb-4">
+        <nz-form-control nzErrorTip="Veuillez insérer votre mot de passe">
+          <nz-input-group nzPrefixIcon="lock">
+            <input type="password" nz-input formControlName="password" placeholder="Votre password" />
+          </nz-input-group>
+        </nz-form-control>
+      </nz-form-item>
+      <button nz-button class="login-form-button login-form-margin" [nzType]="'primary'">Log in</button>
+    </form>
+  </ng-container>
+
+</nz-modal>
+
+<ng-template #modalFooter>
+
+</ng-template>
\ No newline at end of file

src/app/app.component.scss

+.text-wrap {
+    width: 10em; 
+    overflow: hidden;
+    white-space: nowrap;
+    text-overflow: ellipsis; 
+    font-size: small;
+}
+
+  .trigger {
+    font-size: 18px;
+    line-height: 64px;
+    padding: 0 24px;
+    cursor: pointer;
+    transition: color 0.3s;
+  }
+
+  .trigger:hover {
+    color: #1890ff;
+  }
+
+  .logo {
+    font-size: large;
+    font-weight: 500;
+    height: 32px;
+    color: #fff;
+    margin: 16px;
+  }
+
+  .layout {
+    min-height: 100vh;
+  }
+
+  nz-sider {
+    overflow: auto;
+    height: 100%;
+    position: fixed;
+    left: 0;
+  }
+
+  .right-layout {
+    margin-left: 200px;
+  }
+
+  nz-header {
+    background: #fff;
+    padding: 0;
+  }
+
+  nz-content {
+    margin: 24px 16px 0;
+    overflow: initial;
+  }
+
+  .inner-content {
+    padding: 24px;
+    background: #fff;
+    text-align: center;
+    min-height: 80vh;
+  }
+
+  nz-footer {
+    text-align: center;
+  }
+
+  .login-form {
+    max-width: 100%;
+  }
+
+  .login-form-margin {
+    margin-bottom: 16px;
+  }
+
+  .login-form-forgot {
+    float: right;
+  }
+
+  .login-form-button {
+    width: 100%;
+  }
+  

src/app/app.component.spec.ts

+import { TestBed } from '@angular/core/testing';
+import { RouterTestingModule } from '@angular/router/testing';
+import { AppComponent } from './app.component';
+
+describe('AppComponent', () => {
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      imports: [
+        RouterTestingModule
+      ],
+      declarations: [
+        AppComponent
+      ],
+    }).compileComponents();
+  });
+
+  it('should create the app', () => {
+    const fixture = TestBed.createComponent(AppComponent);
+    const app = fixture.componentInstance;
+    expect(app).toBeTruthy();
+  });
+
+  it(`should have as title 'imagecompressed'`, () => {
+    const fixture = TestBed.createComponent(AppComponent);
+    const app = fixture.componentInstance;
+    expect(app.title).toEqual('imagecompressed');
+  });
+
+  it('should render title', () => {
+    const fixture = TestBed.createComponent(AppComponent);
+    fixture.detectChanges();
+    const compiled = fixture.nativeElement as HTMLElement;
+    expect(compiled.querySelector('.content span')?.textContent).toContain('imagecompressed app is running!');
+  });
+});

src/app/app.component.ts

+import { Component, OnInit } from '@angular/core';
+import { ApiService } from './service/api.service';
+import { NzMessageService } from 'ng-zorro-antd/message';
+import { NzModalService } from 'ng-zorro-antd/modal';
+import { FormControl, FormGroup, NonNullableFormBuilder, Validators } from '@angular/forms';
+
+@Component({
+  selector: 'app-root',
+  templateUrl: './app.component.html',
+  styleUrls: ['./app.component.scss']
+})
+export class AppComponent implements OnInit{
+
+  isCollapsed = false;
+  folders: any = [];
+  images: any = [];
+  image : any;
+  setting : any;
+  buttonDisabled = false ;
+  currentFolder: any;
+  isVisible = false;
+  user : any ;
+
+  validateForm: FormGroup<{
+    userName: FormControl<string>;
+    password: FormControl<string>;
+  }> = this.fb.group({
+    userName: ['', [Validators.required, Validators.email]],
+    password: ['', [Validators.required]],
+  });
+
+  ngOnInit(): void {
+    if(localStorage.getItem("user")){
+      this.getFolder();
+      this.user = JSON.parse(localStorage.getItem("user")!);
+    }else{
+      this.showModal();
+    }
+      
+  }
+
+  constructor(private apiService: ApiService, private message: NzMessageService,
+    private modalService: NzModalService, private fb: NonNullableFormBuilder){
+
+  }
+
+
+  title = 'imagecompressed';
+
+
+  createBasicMessage(message : string, type : string): void {
+    this.message.create(type, message , {
+      nzDuration: 2000
+    });
+  }
+
+
+  getFolder(){
+    this.apiService.getFolders().subscribe((data: any) => {
+      this.folders = data;
+     // console.log(this.folders);
+    })
+  }
+
+  getFolderImage(folder:any){
+    this.currentFolder = folder;
+    this.buttonDisabled = false;
+    this.apiService.getFiles(folder.name).subscribe((data: any) => {
+      this.images = data;
+      this.getSetting();
+     // console.log(this.images)
+    })
+  }
+
+  getSetting(){
+    this.apiService.getFileSetting(this.currentFolder.name).subscribe((data : any) => {
+      this.setting = data ;
+      if(this.currentFolder){
+        this.stateButton();
+      }
+    })
+  }
+
+  stateButton(){
+    for(const [key, value] of Object.entries(this.setting)){
+        if(key == this.user.identifiant){
+          if(this.setting[key].state == "1"|| this.setting[key].state == "0" || this.setting[key].state == "-1"){
+              this.buttonDisabled=true;
+            //  console.log(this.setting.state)
+              this.createBasicMessage("Vous avez vérifié ce dossier avec un statut "+ this.setting[key].state, "info")
+          }
+        }
+    }
+
+  
+  }
+
+  addFileSetting(state : string){
+    if(this.currentFolder){
+      this.apiService.addFileSetting(this.currentFolder.name, state, this.user.identifiant).subscribe((data : any ) => {
+        this.getSetting()
+     })
+    }else{
+      this.createBasicMessage("Veuillez choisir un dossier d'image", "info")
+    }
+
+  }
+
+  submitForm(): void {
+    if (this.validateForm.valid) {
+    //  console.log('submit', this.validateForm.value);
+
+      let data = {
+        email : this.validateForm.value.userName,
+        password : this.validateForm.value.password
+      }
+      this.apiService.loginOrAdd(data).subscribe((user_response : any) => {
+        this.user = user_response;
+        if(this.user.identifiant){
+       //   console.log(this.user)
+          this.isVisible = false;
+          this.createBasicMessage("Authentification réussie", "info");
+          localStorage.setItem("user", JSON.stringify(user_response));
+          this.getFolder()
+        }else{
+          this.createBasicMessage("Veuillez remplir le bon mot de passe", "error")
+        }
+      })
+    } else {
+      this.createBasicMessage("Identifiants invalides", "error")
+      Object.values(this.validateForm.controls).forEach(control => {
+        if (control.invalid) {
+          control.markAsDirty();
+          control.updateValueAndValidity({ onlySelf: true });
+        }
+      });
+    }
+  }
+
+  showModal(): void {
+    this.isVisible = true;
+  }
+
+  handleOk(): void {
+    this.isVisible = false;
+  }
+
+  handleCancel(): void {
+    this.isVisible = true;
+  }
+
+  showConfirm(): void {
+    this.modalService.confirm({
+      nzTitle: 'Confirm',
+      nzContent: 'Bla bla ...',
+      nzOkText: 'OK',
+      nzCancelText: 'Cancel'
+    });
+  }
+  
+
+}

src/app/app.module.ts

+import { NgModule } from '@angular/core';
+import { BrowserModule } from '@angular/platform-browser';
+
+import { AppRoutingModule } from './app-routing.module';
+import { AppComponent } from './app.component';
+import {HttpClientModule} from "@angular/common/http";
+import { BrowserAnimationsModule } from '@angular/platform-browser/animations'
+
+import {MatListModule} from '@angular/material/list';
+import {MatIconModule} from '@angular/material/icon';
+import { CommonModule } from '@angular/common';
+import { FormsModule, ReactiveFormsModule } from '@angular/forms';
+import { RouterModule } from '@angular/router';
+import { NzLayoutModule } from 'ng-zorro-antd/layout';
+import { NzTreeViewModule } from 'ng-zorro-antd/tree-view';
+import { NzBreadCrumbModule } from 'ng-zorro-antd/breadcrumb';
+import { NZ_ICONS, NzIconModule } from 'ng-zorro-antd/icon';
+import { IconDefinition } from '@ant-design/icons-angular';
+import * as AllIcons from '@ant-design/icons-angular/icons';
+import { NzMenuModule } from 'ng-zorro-antd/menu';
+import { NzImageModule } from 'ng-zorro-antd/image';
+import { NzButtonModule } from 'ng-zorro-antd/button';
+import { NzMessageModule } from 'ng-zorro-antd/message';
+import { NzModalModule } from 'ng-zorro-antd/modal';
+import { NzFormModule } from 'ng-zorro-antd/form';
+import { NzInputModule } from 'ng-zorro-antd/input';
+const antDesignIcons = AllIcons as {
+  [key: string]: IconDefinition;
+};
+const icons: IconDefinition[] = Object.keys(antDesignIcons).map(key => antDesignIcons[key])
+
+@NgModule({
+  declarations: [
+    AppComponent
+  ],
+  imports: [
+    BrowserModule,
+    AppRoutingModule,
+    HttpClientModule,
+    BrowserAnimationsModule,
+    MatListModule,
+    MatIconModule,
+    CommonModule,
+    FormsModule,
+    RouterModule,
+    NzLayoutModule,
+    NzTreeViewModule,
+    NzBreadCrumbModule,
+    NzIconModule,
+    NzMenuModule,
+    NzImageModule,
+    NzButtonModule,
+    NzMessageModule,
+    NzModalModule,
+    NzFormModule,
+    NzInputModule,
+    ReactiveFormsModule
+  ],
+  providers: [{ provide: NZ_ICONS, useValue: icons } ],
+  bootstrap: [AppComponent]
+})
+export class AppModule { }

src/app/service/api.service.spec.ts

+import { TestBed } from '@angular/core/testing';
+
+import { ApiService } from './api.service';
+
+describe('ApiService', () => {
+  let service: ApiService;
+
+  beforeEach(() => {
+    TestBed.configureTestingModule({});
+    service = TestBed.inject(ApiService);
+  });
+
+  it('should be created', () => {
+    expect(service).toBeTruthy();
+  });
+});

src/app/service/api.service.ts

+import { HttpClient, HttpHeaders } from '@angular/common/http';
+import { Injectable } from '@angular/core';
+
+@Injectable({
+  providedIn: 'root'
+})
+export class ApiService {
+
+  constructor(private http: HttpClient) { }
+   
+  url = "http://localhost:8080/api";
+
+  getFolders(){
+    const headers = new HttpHeaders().set('Content-Type', 'application/json');
+      return this.http.get(this.url + "/getFolder", {headers:headers})
+  }
+
+  getFoldersImages(folder : string){
+    return this.http.get(this.url + "/getFolder/images?name="+folder)
+  }
+
+  getImages(directory : string){
+    return this.http.get(this.url + "/imageName?directory="+directory)
+  }
+
+  getFiles(directory : string){
+    return this.http.get(this.url + "/files?directory="+directory)
+  }
+
+  addFileSetting(name : string, state : string, identifiant : string){
+    return this.http.get(this.url + "/report?name="+name+"&state="+state+"&identifiant="+identifiant);
+  }
+
+  getFileSetting(directory : string){
+    return this.http.get(this.url + "/getSetting?name="+directory);
+  }
+
+  loginOrAdd(object : any){
+    const body = object;
+    const headers = new HttpHeaders().set('Content-Type', 'application/json');
+    return this.http.post(this.url + "/addUser", body, {headers: headers});
+  }
+}

src/assets/LogoSmallId (1)-svg 1.svg

+<svg width="138" height="37" viewBox="0 0 138 37" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="LogoSmallId (1)-svg 1">
+<path id="Vector" d="M4.92856 0.606528L43.125 0.424561C43.2482 0.424561 43.3714 0.464998 43.4946 0.545872C43.6178 0.586309 43.7411 0.646965 43.8643 0.727839C43.9464 0.808714 44.008 0.909806 44.0491 1.03112C44.0902 1.15243 44.1107 1.27374 44.1107 1.39505L44.0491 8.12784C44.0491 8.24915 44.0286 8.37046 43.9875 8.49177C43.9464 8.61308 43.8848 8.71418 43.8027 8.79505C43.6795 8.87593 43.5562 8.9568 43.433 9.03767C43.3098 9.07811 43.1866 9.09833 43.0634 9.09833H11.3973C11.3562 9.09833 11.2946 9.09833 11.2125 9.09833C11.1303 9.05789 11.0687 9.03767 11.0277 9.03767C10.9455 8.99724 10.8839 8.9568 10.8428 8.91636C10.8018 8.87593 10.7607 8.83549 10.7196 8.79505L4.25088 2.24423C4.12767 2.12292 4.04552 1.96117 4.00445 1.75899C3.96338 1.5568 3.98392 1.37483 4.06606 1.21309C4.1482 1.05134 4.27142 0.909806 4.4357 0.788495C4.59999 0.667183 4.76427 0.606528 4.92856 0.606528Z" fill="black"/>
+<path id="Vector_2" d="M79.4732 13.4049C79.5964 13.4858 79.8018 13.506 80.0893 13.4655C81.8553 13.4251 83.6009 13.3847 85.3259 13.3442C85.408 13.3442 85.4696 13.3442 85.5107 13.3442C85.5518 13.3847 85.5928 13.4049 85.6339 13.4049C85.675 13.4049 85.7161 13.4251 85.7571 13.4655C85.7982 13.506 85.8393 13.5464 85.8803 13.5869L89.8232 17.4082C89.8643 17.489 89.9053 17.5497 89.9464 17.5901C89.9875 17.6306 90.008 17.671 90.008 17.7114C90.0491 17.7923 90.0696 17.853 90.0696 17.8934C90.1107 17.9339 90.1107 17.9945 90.0696 18.0754V34.2705C90.0696 34.3513 90.0696 34.4322 90.0696 34.5131C90.0286 34.594 89.9669 34.6546 89.8848 34.6951C89.8437 34.7355 89.7821 34.7759 89.7 34.8164C89.6179 34.8568 89.5357 34.877 89.4536 34.877H81.9991C81.5884 34.877 81.383 34.6748 81.383 34.2705L81.4446 22.5639C81.4446 22.483 81.4241 22.4022 81.383 22.3213C81.342 22.2808 81.3009 22.2202 81.2598 22.1393C81.2187 22.0989 81.1571 22.0584 81.075 22.018C80.9929 22.018 80.9107 22.018 80.8286 22.018H55.6312C55.5902 22.018 55.5491 22.018 55.508 22.018C55.467 22.0584 55.4259 22.0787 55.3848 22.0787C55.3437 22.1191 55.3027 22.1798 55.2616 22.2606C55.2616 22.3011 55.2616 22.3415 55.2616 22.3819L55.3848 34.4524C55.3848 34.4929 55.3848 34.5535 55.3848 34.6344C55.3437 34.6748 55.3027 34.7153 55.2616 34.7557C55.2205 34.7961 55.1795 34.8164 55.1384 34.8164C55.0562 34.8568 54.9946 34.877 54.9536 34.877H47.3143C47.2321 34.877 47.15 34.8568 47.0678 34.8164C46.9857 34.8164 46.9036 34.7759 46.8214 34.6951C46.7803 34.6546 46.7393 34.594 46.6982 34.5131C46.6982 34.4322 46.6777 34.3513 46.6366 34.2705V0.909806C46.6777 0.869369 46.6982 0.808714 46.6982 0.727839C46.7393 0.687402 46.7803 0.646965 46.8214 0.606528C46.8625 0.566091 46.9036 0.525653 46.9446 0.485216C47.0268 0.485216 47.0884 0.485216 47.1295 0.485216H54.9536C54.9946 0.485216 55.0357 0.485216 55.0768 0.485216C55.1589 0.525653 55.2205 0.566091 55.2616 0.606528C55.3027 0.646965 55.3232 0.687402 55.3232 0.727839C55.3643 0.768276 55.3848 0.808714 55.3848 0.849151L55.2616 12.859C55.2616 13.1825 55.4259 13.3442 55.7545 13.3442H66.1045C66.1455 13.3442 66.2071 13.3442 66.2893 13.3442C66.3303 13.3038 66.3714 13.2836 66.4125 13.2836C66.4946 13.2431 66.5562 13.2027 66.5973 13.1623C66.6384 13.1623 66.6795 13.142 66.7205 13.1016L79.2268 0.727839C79.2679 0.687402 79.3089 0.646965 79.35 0.606528C79.4321 0.566091 79.4937 0.545872 79.5348 0.545872C79.617 0.505435 79.6991 0.485216 79.7812 0.485216C79.8223 0.485216 79.8839 0.464998 79.9661 0.424561L90.8089 0.485216C90.8911 0.485216 90.9527 0.485216 90.9937 0.485216C91.0348 0.485216 91.0759 0.505435 91.117 0.545872C91.158 0.586309 91.1786 0.626746 91.1786 0.667184C91.2196 0.707621 91.2402 0.748058 91.2402 0.788495C91.2812 0.950244 91.2402 1.09177 91.117 1.21309C87.4616 4.77156 83.5598 8.59287 79.4116 12.677C79.3705 12.7579 79.3295 12.8186 79.2884 12.859C79.2884 12.9399 79.2884 13.0207 79.2884 13.1016C79.2884 13.142 79.3089 13.2027 79.35 13.2836C79.3911 13.324 79.4321 13.3645 79.4732 13.4049Z" fill="black"/>
+<path id="Vector_3" d="M101.775 13.3442H126.911C126.952 13.3442 127.013 13.324 127.096 13.2836C127.137 13.2836 127.178 13.2634 127.219 13.2229C127.26 13.1825 127.301 13.1218 127.342 13.041C127.342 13.0005 127.362 12.9399 127.404 12.859V0.909806C127.404 0.869369 127.404 0.808714 127.404 0.727839C127.445 0.687402 127.486 0.646965 127.527 0.606528C127.568 0.566091 127.609 0.525653 127.65 0.485216C127.732 0.485216 127.794 0.464998 127.835 0.424561L135.659 0.485216C135.7 0.485216 135.762 0.485216 135.844 0.485216C135.885 0.525653 135.905 0.545872 135.905 0.545872C135.946 0.586309 135.987 0.626746 136.029 0.667184C136.029 0.707621 136.029 0.748058 136.029 0.788495C135.946 8.39068 135.967 16.5186 136.09 25.1721C136.09 27.9623 135.885 29.8224 135.474 30.7524C134.057 33.8459 131.593 34.877 128.389 34.877C116.766 34.8366 105.081 34.8366 93.3348 34.877C93.2527 34.877 93.1705 34.8568 93.0884 34.8164C93.0062 34.8164 92.9241 34.7759 92.842 34.6951C92.8009 34.6546 92.7598 34.594 92.7187 34.5131C92.6777 34.4322 92.6571 34.3311 92.6571 34.2098L92.7187 26.5065C92.7187 26.4661 92.7187 26.4054 92.7187 26.3246C92.7598 26.2841 92.8009 26.2437 92.842 26.2033C92.883 26.1628 92.9446 26.1224 93.0268 26.0819C93.0679 26.0819 93.1295 26.0819 93.2116 26.0819L126.911 26.2639C127.239 26.2639 127.404 26.1022 127.404 25.7787V22.4426C127.404 22.1191 127.239 21.9573 126.911 21.9573H97.8321C97.7089 21.9573 97.5857 21.9573 97.4625 21.9573C97.3804 21.9169 97.2777 21.8765 97.1545 21.836C97.0723 21.7956 96.9696 21.7552 96.8464 21.7147C96.7643 21.6339 96.6821 21.553 96.6 21.4721L93.2732 18.136C93.1911 18.0552 93.1089 17.9541 93.0268 17.8328C92.9446 17.7114 92.883 17.5901 92.842 17.4688C92.8009 17.3475 92.7598 17.2262 92.7187 17.1049C92.6777 16.9836 92.6571 16.842 92.6571 16.6803L92.7187 1.21309C92.7187 1.13221 92.7393 1.03112 92.7804 0.909806C92.8214 0.828932 92.8625 0.748058 92.9036 0.667184C92.9857 0.586309 93.0884 0.525653 93.2116 0.485216C93.2937 0.485216 93.3759 0.464998 93.458 0.424561H100.604C100.687 0.464998 100.769 0.485216 100.851 0.485216C100.974 0.525653 101.056 0.586309 101.097 0.667184C101.179 0.748058 101.241 0.828932 101.282 0.909806C101.323 1.03112 101.344 1.13221 101.344 1.21309V12.859C101.344 13.1825 101.487 13.3442 101.775 13.3442Z" fill="black"/>
+<path id="Vector_4" d="M9.73392 13.5262L39.1821 13.3442C39.2643 13.3442 39.3464 13.3442 39.4286 13.3442C39.5107 13.3847 39.5928 13.4049 39.675 13.4049C39.7161 13.4453 39.7777 13.4858 39.8598 13.5262C39.942 13.5666 40.0036 13.6273 40.0446 13.7082L43.6795 17.4688C43.8027 17.6306 43.8848 17.8125 43.9259 18.0147C43.967 21.735 44.008 25.5158 44.0491 29.3574C44.0491 29.6 43.9259 29.7819 43.8643 30.0246C43.8643 30.065 43.8437 30.0852 43.8027 30.0852C43.8027 30.1257 43.7821 30.1459 43.7411 30.1459C43.7 30.1459 43.6589 30.1459 43.6178 30.1459C43.5768 30.1459 43.5562 30.1257 43.5562 30.0852L35.6089 22.2606C35.5678 22.2202 35.5268 22.1798 35.4857 22.1393C35.4446 22.0989 35.383 22.0787 35.3009 22.0787C35.2598 22.0382 35.2187 22.018 35.1777 22.018C35.0955 21.9776 35.0339 21.9776 34.9928 22.018H5.42142C5.17499 22.018 4.99017 21.9371 4.86695 21.7754L0.862487 17.8934C0.698201 17.7317 0.616058 17.5295 0.616058 17.2869V5.45899C0.616058 5.41856 0.616058 5.37812 0.616058 5.33768C0.65713 5.29724 0.677666 5.27703 0.677666 5.27703C0.718737 5.23659 0.759808 5.21637 0.80088 5.21637C0.841951 5.21637 0.883023 5.21637 0.924094 5.21637C1.21159 5.37812 1.47856 5.5803 1.72499 5.82293C4.27142 8.41091 6.67409 10.8776 8.93302 13.2229C9.13838 13.4251 9.40534 13.5262 9.73392 13.5262Z" fill="#FF5000"/>
+<path id="Vector_5" d="M39.4286 34.8771H1.72501C1.56072 34.8771 1.41697 34.8568 1.29376 34.8164C1.12947 34.7355 0.985724 34.6344 0.86251 34.5131C0.780367 34.3918 0.698224 34.2705 0.616081 34.1492C0.57501 33.9874 0.554474 33.8257 0.554474 33.6639V27.2344C0.554474 27.0727 0.57501 26.9312 0.616081 26.8098C0.698224 26.6481 0.800902 26.5066 0.924117 26.3852C1.00626 26.3044 1.12947 26.2235 1.29376 26.1426C1.45805 26.1022 1.62233 26.082 1.78662 26.082L33.0214 26.2639C33.1036 26.2639 33.1652 26.2639 33.2063 26.2639C33.2884 26.2639 33.3705 26.2842 33.4527 26.3246C33.5348 26.365 33.5964 26.4055 33.6375 26.4459C33.7197 26.4863 33.7813 26.5268 33.8223 26.5672L40.2295 32.8148C40.4348 32.9765 40.558 33.1787 40.5991 33.4213C40.6402 33.6639 40.6197 33.9066 40.5375 34.1492C40.4143 34.3514 40.25 34.5333 40.0447 34.6951C39.8393 34.8164 39.6339 34.8771 39.4286 34.8771Z" fill="black"/>
+</g>
+</svg>

src/index.html

+<!doctype html>
+<html lang="en">
+<head>
+  <meta charset="utf-8">
+  <title>Imagecompressed</title>
+  <base href="/">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <link rel="icon" type="image/x-icon" href="favicon.ico">
+  <link rel="preconnect" href="https://fonts.gstatic.com">
+  <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500&display=swap" rel="stylesheet">
+  <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
+</head>
+<body class="mat-typography">
+  <app-root></app-root>
+</body>
+</html>

src/main.ts

+import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
+
+import { AppModule } from './app/app.module';
+
+
+platformBrowserDynamic().bootstrapModule(AppModule)
+  .catch(err => console.error(err));

src/styles.scss

+/* You can add global styles to this file, and also import other style files */
+
+html, body { height: 100%; }
+body { margin: 0; font-family: Roboto, "Helvetica Neue", sans-serif; }

tsconfig.app.json

+/* To learn more about this file see: https://angular.io/config/tsconfig. */
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "outDir": "./out-tsc/app",
+    "types": []
+  },
+  "files": [
+    "src/main.ts"
+  ],
+  "include": [
+    "src/**/*.d.ts"
+  ]
+}

tsconfig.json

+/* To learn more about this file see: https://angular.io/config/tsconfig. */
+{
+  "compileOnSave": false,
+  "compilerOptions": {
+    "baseUrl": "./",
+    "outDir": "./dist/out-tsc",
+    "forceConsistentCasingInFileNames": true,
+    "strict": true,
+    "noImplicitOverride": true,
+    "noPropertyAccessFromIndexSignature": true,
+    "noImplicitReturns": true,
+    "noFallthroughCasesInSwitch": true,
+    "sourceMap": true,
+    "declaration": false,
+    "downlevelIteration": true,
+    "experimentalDecorators": true,
+    "moduleResolution": "node",
+    "importHelpers": true,
+    "target": "ES2022",
+    "module": "ES2022",
+    "useDefineForClassFields": false,
+    "lib": [
+      "ES2022",
+      "dom"
+    ]
+  },
+  "angularCompilerOptions": {
+    "enableI18nLegacyMessageIdFormat": false,
+    "strictInjectionParameters": true,
+    "strictInputAccessModifiers": true,
+    "strictTemplates": true
+  }
+}

tsconfig.spec.json

+/* To learn more about this file see: https://angular.io/config/tsconfig. */
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "outDir": "./out-tsc/spec",
+    "types": [
+      "jasmine"
+    ]
+  },
+  "include": [
+    "src/**/*.spec.ts",
+    "src/**/*.d.ts"
+  ]
+}