chore: update eslint rules and fix related issues (#10)

Author: ashutosh-bisoyi

.eslintrc.json

@@ -4,8 +4,8 @@
     "browser": true,
     "node": true
   },
-  "extends": ["plugin:@angular-eslint/recommended"],
-  "rules": {},
+  "extends": ["plugin:@angular-eslint/recommended", "plugin:prettier/recommended"],
+  "rules": { "prettier/prettier": "error" },
   // Eslint for HTML files
   "overrides": [
     {
@@ -20,7 +20,7 @@
       ],
       "rules": {
         // Custom rules for HTML by Osmosys
-        "max-len": "warn"
+        "max-len": ["warn", { "code": 100 }]
       }
     },
     // Custom rules for TypeScript
@@ -42,6 +42,17 @@
       "rules": {
         // Custom rules for typescript by Osmosys
         "@typescript-eslint/no-explicit-any": "error",
+        "padding-line-between-statements": [
+          "error",
+          { "blankLine": "always", "prev": "*", "next": "function" },
+          { "blankLine": "always", "prev": "function", "next": "*" },
+          { "blankLine": "always", "prev": "*", "next": "if" },
+          { "blankLine": "always", "prev": "if", "next": "*" },
+          { "blankLine": "always", "prev": "*", "next": "for" },
+          { "blankLine": "always", "prev": "for", "next": "*" },
+          { "blankLine": "always", "prev": "*", "next": "while" },
+          { "blankLine": "always", "prev": "while", "next": "*" }
+        ],
         "arrow-body-style": [
           "error",
           "as-needed",
@@ -145,11 +156,10 @@
         "no-empty-function": [
           "error",
           {
-            "allow": ["arrowFunctions", "functions", "methods"]
+            "allow": ["arrowFunctions", "functions", "methods", "constructors"]
           }
         ],
         "no-bitwise": "error",
-        "no-console": "warn",
         "no-new-wrappers": "error",
         "no-debugger": "error",
         "constructor-super": "error",
@@ -159,7 +169,8 @@
         "@typescript-eslint/no-inferrable-types": "error",
         "@typescript-eslint/no-misused-new": "error",
         "@typescript-eslint/no-non-null-assertion": "error",
-        "no-shadow": "error",
+        "no-shadow": "off",
+        "@typescript-eslint/no-shadow": ["error"],
         "dot-notation": [
           "error",
           {
@@ -349,7 +360,8 @@
             "variables": true
           }
         ],
-        "no-useless-constructor": "error",
+        "no-useless-constructor": "off",
+        "@typescript-eslint/no-useless-constructor": "error",
         "semi": ["error", "always"],
         "space-before-function-paren": [
           "error",
@@ -362,7 +374,8 @@
         "require-await": "off",
         "no-return-await": "error",
         "space-infix-ops": "error",
-        "object-curly-spacing": ["error", "always"]
+        "object-curly-spacing": ["error", "always"],
+        "import/prefer-default-export": "off"
       }
     },
     // Configuration for unit and e2e spec files
@@ -373,18 +386,18 @@
       }
     },
     /**
-     * This extra piece of configuration is only necessary if you make use of inline
-     * templates within Component metadata, e.g.:
-     */
+    * This extra piece of configuration is only necessary if you make use of inline
+    * templates within Component metadata, e.g.:
+    */
     {
       "files": ["*.component.ts"],
       "parser": "@typescript-eslint/parser",
       "parserOptions": {
         "ecmaVersion": 2020,
         "sourceType": "module"
       },
-      "plugins": ["@angular-eslint/template"],
+      "plugins": ["@angular-eslint/template", "prettier"],
       "processor": "@angular-eslint/template/extract-inline-html"
     }
   ]
-}
+}

package.json

@@ -7,7 +7,7 @@
     "build": "ng build",
     "watch": "ng build --watch --configuration development",
     "test": "ng test",
-    "lint": "ng lint",
+    "lint": "ng lint --max-warnings=0",
     "prettier-format": "prettier --ignore-path .gitignore --write \"**/*.+(js|ts|json)\""
   },
   "engines": {

src/app/app.component.ts

@@ -1,5 +1,7 @@
 import { Component, OnInit } from '@angular/core';
+// eslint-disable-next-line import/no-extraneous-dependencies
 import { TranslateService } from '@ngx-translate/core';
+// eslint-disable-next-line import/no-extraneous-dependencies
 import { PrimeNGConfig } from 'primeng/api';
 import LanguageService from './shared/services/language.service';
 import LANGUAGES from './shared/constants/language.constants';
@@ -10,7 +12,11 @@ import LANGUAGES from './shared/constants/language.constants';
 })
 export default class AppComponent implements OnInit {
   // eslint-disable-next-line no-useless-constructor, no-empty-function
-  constructor(private primengConfig: PrimeNGConfig, private translateService: TranslateService, private languageService: LanguageService) { }
+  constructor(
+    private primengConfig: PrimeNGConfig,
+    private translateService: TranslateService,
+    private languageService: LanguageService,
+  ) {}
 
   ngOnInit() {
     this.initializePrimeNgConfigs();

src/app/core/guards/auth-guard/auth.guard.ts

@@ -1,8 +1,5 @@
 import { CanActivateFn } from '@angular/router';
 
-const authGuard: CanActivateFn = (route, state) => {
-  console.log(route, state);
-  return true;
-};
+const authGuard: CanActivateFn = () => true;
 
 export default authGuard;

src/app/core/interceptors/http-config-interceptor/http-config.interceptor.ts

@@ -4,6 +4,7 @@ import { Observable } from 'rxjs';
 
 @Injectable()
 export default class HttpConfigInterceptor implements HttpInterceptor {
+  // eslint-disable-next-line class-methods-use-this
   intercept(request: HttpRequest<unknown>, next: HttpHandler): Observable<HttpEvent<unknown>> {
     return next.handle(request);
   }

src/app/features/landing/components/landing-footer/landing-footer.component.html

@@ -15,7 +15,6 @@ <h4 class="footer-logo">{{ 'COMMON.BRAND_NAME' | translate }}</h4>
 
     <div class="col-12 md:col-10 lg:col-7">
       <div class="grid">
-        <!-- Assuming you have a translation service that provides the translation for a given key -->
         <div class="col-12 md:col-3">
           <h4 class="footer-link-header">{{ 'LANDING_PAGE.FOOTER.COMPANY' | translate }}</h4>
           <a class="footer-link">{{ 'LANDING_PAGE.FOOTER.ABOUT_US' | translate }}</a>

src/app/features/landing/components/landing-footer/landing-footer.component.ts

@@ -11,7 +11,6 @@ import ILanguage from '../../../../shared/models/shared.model';
   styleUrls: ['./landing-footer.component.scss'],
 })
 export default class LandingFooterComponent implements OnInit {
-
   availableLanguages: ILanguage[] | undefined;
 
   selectedLanguage: ILanguage | undefined;
@@ -20,9 +19,8 @@ export default class LandingFooterComponent implements OnInit {
   constructor(
     public layoutService: LayoutService,
     public router: Router,
-    private languageService: LanguageService,
-  // eslint-disable-next-line no-empty-function
-  ) { }
+    private languageService: LanguageService, // eslint-disable-next-line no-empty-function
+  ) {}
 
   ngOnInit() {
     this.initializeData();

src/app/features/landing/components/landing-hero/landing-hero.component.html

@@ -3,10 +3,11 @@
     <div class="col-md-6 flex-grow-1">
       <header class="hero-content">
         <h1 class="hero-content-header">
-          <span class="font-light block">{{ "LANDING_PAGE.HERO.HEADING_FIRST" | translate}}</span>{{ "LANDING_PAGE.HERO.HEADING_SECOND" | translate}}
+          <span class="font-light block">{{ 'LANDING_PAGE.HERO.HEADING_FIRST' | translate }}</span
+          >{{ 'LANDING_PAGE.HERO.HEADING_SECOND' | translate }}
         </h1>
         <p class="hero-content-description">
-          {{ "LANDING_PAGE.HERO.DESCRIPTION" | translate}}
+          {{ 'LANDING_PAGE.HERO.DESCRIPTION' | translate }}
         </p>
         <p-button
           [label]="'LANDING_PAGE.HERO.CTA' | translate"

src/app/features/landing/components/landing-hero/landing-hero.component.ts

@@ -8,7 +8,7 @@ import { Router } from '@angular/router';
 })
 export default class LandingHeroComponent {
   // eslint-disable-next-line no-useless-constructor, no-empty-function
-  constructor(public router: Router) { }
+  constructor(public router: Router) {}
 
   navigateToLogin() {
     this.router.navigate(['/auth/login']);

src/app/features/landing/components/navigation-bar/navigation-bar.component.ts

@@ -8,7 +8,7 @@ import { Router } from '@angular/router';
 })
 export default class NavigationBarComponent {
   // eslint-disable-next-line no-useless-constructor, no-empty-function
-  constructor(private router: Router) { }
+  constructor(private router: Router) {}
 
   navigateToSection(sectionName: string) {
     this.router.navigate(['/'], { fragment: sectionName });

src/app/features/landing/landing.component.ts

@@ -7,5 +7,5 @@ import { Router } from '@angular/router';
 })
 export default class LandingComponent {
   // eslint-disable-next-line no-useless-constructor, no-empty-function
-  constructor(public router: Router) { }
+  constructor(public router: Router) {}
 }

src/app/shared/services/language.service.ts

@@ -20,7 +20,9 @@ export default class LanguageService {
       let defaultLanguage = LANGUAGES.AVAILABLE_LANGUAGES[0];
       const browserLanguage = navigator.language;
       const userLanguageCode = browserLanguage?.split('-')[0];
-      const existingLanguageForUser = LANGUAGES.AVAILABLE_LANGUAGES.find((lang) => lang.code === userLanguageCode);
+      const existingLanguageForUser = LANGUAGES.AVAILABLE_LANGUAGES.find(
+        (lang) => lang.code === userLanguageCode,
+      );
 
       if (existingLanguageForUser) {
         defaultLanguage = existingLanguageForUser;

src/index.html

@@ -1,3 +1,4 @@
+<!-- eslint-disable prettier/prettier -->
 <!doctype html>
 <html lang="en">
   <head>

src/main.ts

@@ -6,4 +6,5 @@ import AppModule from './app/app.module';
 
 platformBrowserDynamic()
   .bootstrapModule(AppModule)
+  // eslint-disable-next-line no-console
   .catch((err) => console.error(err));