Fix eslint missing packages (#7)

MatthijsSmets · web-flow · commit 0da3ef53d839 · 2025-09-11T13:17:51.000+02:00
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
diff --git a/src/main/frontend/angular.json b/src/main/frontend/angular.json
@@ -5,7 +5,11 @@
   "projects": {
     "angular-demo-project": {
       "projectType": "application",
-      "schematics": {},
+      "schematics": {
+        "@schematics/angular:component": {
+          "style": "scss"
+        }
+      },
       "root": "",
       "sourceRoot": "src",
       "prefix": "app",
@@ -28,7 +32,7 @@
               }
             ],
             "styles": [
-              "src/styles.css"
+              "src/styles.scss"
             ]
           },
           "configurations": {
@@ -86,7 +90,7 @@
               }
             ],
             "styles": [
-              "src/styles.css"
+              "src/styles.scss"
             ]
           }
         },
diff --git a/src/main/frontend/package.json b/src/main/frontend/package.json
@@ -26,13 +26,18 @@
   },
   "devDependencies": {
     "@angular-eslint/builder": "20.2.0",
+    "@angular-eslint/eslint-plugin": "20.2.0",
+    "@angular-eslint/eslint-plugin-template": "20.2.0",
+    "@angular-eslint/template-parser": "20.2.0",
     "@angular/build": "^20.2.1",
     "@angular/cli": "^20.2.1",
     "@angular/compiler-cli": "^20.2.1",
     "@cypress/schematic": "4.1.2",
     "@eslint/eslintrc": "^3.3.0",
     "@eslint/js": "^9.33.0",
     "@types/jasmine": "~5.1.0",
+    "@typescript-eslint/eslint-plugin": "8.40.0",
+    "@typescript-eslint/parser": "8.40.0",
     "angular-eslint": "20.2.0",
     "eslint": "^9.33.0",
     "eslint-config-prettier": "^10.1.1",
diff --git a/src/main/frontend/src/app/app.config.ts b/src/main/frontend/src/app/app.config.ts
@@ -7,8 +7,8 @@ import { provideHttpClient, withFetch } from '@angular/common/http';
 export const appConfig: ApplicationConfig = {
   providers: [
     provideBrowserGlobalErrorListeners(),
-    provideZoneChangeDetection({eventCoalescing: true}),
+    provideZoneChangeDetection({ eventCoalescing: true }),
     provideRouter(routes),
     provideHttpClient(withFetch()),
-  ]
+  ],
 };
diff --git a/src/main/frontend/src/app/app.html b/src/main/frontend/src/app/app.html
@@ -1 +1 @@
-<h1 data-test="backend-response">{{ backendResponse || "Something went wrong" }}</h1>
+<h1 data-test="backend-response">{{ backendResponse || 'Something went wrong' }}</h1>
diff --git a/src/main/frontend/src/app/app.scss b/src/main/frontend/src/app/app.scss
diff --git a/src/main/frontend/src/app/app.ts b/src/main/frontend/src/app/app.ts
@@ -5,17 +5,16 @@ import { TestResponse, TestService } from './services/test.service';
   selector: 'app-root',
   imports: [],
   templateUrl: './app.html',
-  styleUrl: './app.css'
+  styleUrl: './app.scss',
 })
 export class App implements OnInit {
-  private readonly testService: TestService = inject(TestService);
-
   protected backendResponse?: string;
 
+  private readonly testService: TestService = inject(TestService);
+
   ngOnInit(): void {
     this.testService.getHelloWorld().subscribe((response: TestResponse) => {
       this.backendResponse = response.data;
-    })
+    });
   }
-
 }
diff --git a/src/main/frontend/src/app/pages/.gitkeep b/src/main/frontend/src/app/pages/.gitkeep
diff --git a/src/main/frontend/src/app/services/test.service.ts b/src/main/frontend/src/app/services/test.service.ts
@@ -2,15 +2,14 @@ import { inject, Injectable } from '@angular/core';
 import { HttpClient } from '@angular/common/http';
 import { Observable } from 'rxjs';
 
-export interface TestResponse {
+export type TestResponse = {
   data: string;
-}
+};
 
 @Injectable({
-  providedIn: 'root'
+  providedIn: 'root',
 })
 export class TestService {
-
   private readonly http: HttpClient = inject(HttpClient);
 
   getHelloWorld(): Observable<TestResponse> {
diff --git a/src/main/frontend/src/index.html b/src/main/frontend/src/index.html
@@ -1,13 +1,13 @@
 <!doctype html>
 <html lang="en">
-<head>
-  <meta charset="utf-8">
-  <title>AngularDemoProject</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>
+  <head>
+    <meta charset="utf-8" />
+    <title>AngularDemoProject</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>
diff --git a/src/main/frontend/src/main.ts b/src/main/frontend/src/main.ts
@@ -2,5 +2,8 @@ import { bootstrapApplication } from '@angular/platform-browser';
 import { App } from './app/app';
 import { appConfig } from './app/app.config';
 
+function main(): void {
+  bootstrapApplication(App, appConfig).catch((error) => console.error(error));
+}
 
-bootstrapApplication(App, appConfig).catch((err) => console.error(err));
+main();
diff --git a/src/main/frontend/src/styles.scss b/src/main/frontend/src/styles.scss

Original file line number	Diff line number	Diff line change
`@@ -5,7 +5,11 @@`
`5`	`5`	`"projects": {`
`6`	`6`	`"angular-demo-project": {`
`7`	`7`	`"projectType": "application",`
`8`		`- "schematics": {},`
	`8`	`+ "schematics": {`
	`9`	`+ "@schematics/angular:component": {`
	`10`	`+ "style": "scss"`
	`11`	`+ }`
	`12`	`+ },`
`9`	`13`	`"root": "",`
`10`	`14`	`"sourceRoot": "src",`
`11`	`15`	`"prefix": "app",`
`@@ -28,7 +32,7 @@`
`28`	`32`	`}`
`29`	`33`	`],`
`30`	`34`	`"styles": [`
`31`		`- "src/styles.css"`
	`35`	`+ "src/styles.scss"`
`32`	`36`	`]`
`33`	`37`	`},`
`34`	`38`	`"configurations": {`
`@@ -86,7 +90,7 @@`
`86`	`90`	`}`
`87`	`91`	`],`
`88`	`92`	`"styles": [`
`89`		`- "src/styles.css"`
	`93`	`+ "src/styles.scss"`
`90`	`94`	`]`
`91`	`95`	`}`
`92`	`96`	`},`
Original file line number	Diff line number	Diff line change
`@@ -1 +1 @@`
`1`		`-<h1 data-test="backend-response">{{ backendResponse \|\| "Something went wrong" }}</h1>`
	`1`	`+<h1 data-test="backend-response">{{ backendResponse \|\| 'Something went wrong' }}</h1>`