refactor: move libs

2026-02-12 13:53:03 -05:00 · 2024-05-11 21:27:33 +02:00
parent 4a3c7f23e0
commit 001d35731a
659 changed files with 775 additions and 1573 deletions
--- a/apps/performance/34-default-vs-onpush/src/app/app.component.ts
+++ b/apps/performance/34-default-vs-onpush/src/app/app.component.ts
@@ -0,0 +1,22 @@
+import { Component } from '@angular/core';
+import { randFirstName } from '@ngneat/falso';
+import { PersonListComponent } from './person-list.component';
+import { RandomComponent } from './random.component';
+
+@Component({
+  standalone: true,
+  imports: [PersonListComponent, RandomComponent],
+  selector: 'app-root',
+  template: `
+    <app-random />
+
+    <div class="flex">
+      <app-person-list [names]="girlList" title="Female" />
+      <app-person-list [names]="boyList" title="Male" />
+    </div>
+  `,
+})
+export class AppComponent {
+  girlList = randFirstName({ gender: 'female', length: 10 });
+  boyList = randFirstName({ gender: 'male', length: 10 });
+}
--- a/apps/performance/34-default-vs-onpush/src/app/app.config.ts
+++ b/apps/performance/34-default-vs-onpush/src/app/app.config.ts
@@ -0,0 +1,6 @@
+import { ApplicationConfig } from '@angular/core';
+import { provideAnimations } from '@angular/platform-browser/animations';
+
+export const appConfig: ApplicationConfig = {
+  providers: [provideAnimations()],
+};
--- a/apps/performance/34-default-vs-onpush/src/app/person-list.component.ts
+++ b/apps/performance/34-default-vs-onpush/src/app/person-list.component.ts
@@ -0,0 +1,68 @@
+import { Component, Input } from '@angular/core';
+
+import { CDFlashingDirective } from '@angular-challenges/shared/directives';
+import { CommonModule } from '@angular/common';
+import { FormsModule } from '@angular/forms';
+import { MatChipsModule } from '@angular/material/chips';
+import { MatFormFieldModule } from '@angular/material/form-field';
+import { MatInputModule } from '@angular/material/input';
+import { MatListModule } from '@angular/material/list';
+
+@Component({
+  selector: 'app-person-list',
+  standalone: true,
+  imports: [
+    CommonModule,
+    FormsModule,
+    MatListModule,
+    MatFormFieldModule,
+    MatInputModule,
+    MatChipsModule,
+    CDFlashingDirective,
+  ],
+  template: `
+    <h1 cd-flash class="text-center font-semibold" title="Title">
+      {{ title | titlecase }}
+    </h1>
+
+    <mat-form-field class="w-4/5" cd-flash>
+      <input
+        placeholder="Add one member to the list"
+        matInput
+        type="text"
+        [(ngModel)]="label"
+        (keydown)="handleKey($event)" />
+    </mat-form-field>
+
+    <mat-list class="flex w-full">
+      <div *ngIf="names?.length === 0" class="empty-list-label">Empty list</div>
+      <mat-list-item
+        *ngFor="let name of names"
+        cd-flash
+        class="text-orange-500">
+        <div MatListItemLine class="flex justify-between">
+          <h3 title="Name">
+            {{ name }}
+          </h3>
+        </div>
+      </mat-list-item>
+      <mat-divider *ngIf="names?.length !== 0"></mat-divider>
+    </mat-list>
+  `,
+  host: {
+    class: 'w-full flex flex-col items-center',
+  },
+})
+export class PersonListComponent {
+  @Input() names: string[] = [];
+  @Input() title = '';
+
+  label = '';
+
+  handleKey(event: KeyboardEvent) {
+    if (event.key === 'Enter') {
+      this.names?.unshift(this.label);
+      this.label = '';
+    }
+  }
+}
--- a/apps/performance/34-default-vs-onpush/src/app/random.component.ts
+++ b/apps/performance/34-default-vs-onpush/src/app/random.component.ts
@@ -0,0 +1,12 @@
+import { CDFlashingDirective } from '@angular-challenges/shared/directives';
+import { Component } from '@angular/core';
+
+@Component({
+  selector: 'app-random',
+  standalone: true,
+  template: `
+    <div cd-flash>I do nothing but I'm here</div>
+  `,
+  imports: [CDFlashingDirective],
+})
+export class RandomComponent {}
--- a/apps/performance/34-default-vs-onpush/src/assets/.gitkeep
+++ b/apps/performance/34-default-vs-onpush/src/assets/.gitkeep
--- a/apps/performance/34-default-vs-onpush/src/favicon.ico
+++ b/apps/performance/34-default-vs-onpush/src/favicon.ico
--- a/apps/performance/34-default-vs-onpush/src/index.html
+++ b/apps/performance/34-default-vs-onpush/src/index.html
@@ -0,0 +1,13 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <title>Default OnPush</title>
+    <base href="/" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <link rel="icon" type="image/x-icon" href="favicon.ico" />
+  </head>
+  <body>
+    <app-root></app-root>
+  </body>
+</html>
--- a/apps/performance/34-default-vs-onpush/src/main.ts
+++ b/apps/performance/34-default-vs-onpush/src/main.ts
@@ -0,0 +1,7 @@
+import { bootstrapApplication } from '@angular/platform-browser';
+import { AppComponent } from './app/app.component';
+import { appConfig } from './app/app.config';
+
+bootstrapApplication(AppComponent, appConfig).catch((err) =>
+  console.error(err),
+);
--- a/apps/performance/34-default-vs-onpush/src/styles.scss
+++ b/apps/performance/34-default-vs-onpush/src/styles.scss
@@ -0,0 +1,5 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+/* You can add global styles to this file, and also import other style files */