.eslintrc

+{
+  "extends": ["airbnb-base"],
+  "rules": {
+    "prettier/prettier": ["error"]
+  }
+}

Dockerfile

+# Use an official Node.js runtime as a parent image
+FROM node:20-alpine as build
+
+# Set the working directory
+WORKDIR /usr/src/app
+
+# Copy package.json and package-lock.json to the working directory
+COPY package*.json ./
+
+# Install app dependencies
+RUN npm install
+
+# Copy the Angular app files to the working directory
+COPY . .
+
+# Build the Angular app
+ARG BASE_HREF="/v2/"
+RUN npx ng build --configuration=production --base-href=${BASE_HREF}
+
+
+#RUN npm run ng -- build --configuration=dev02
+
+
+# Use a smaller base image for the final image
+FROM nginx:alpine
+
+# Copy the built app from the 'build' stage to the current stage
+COPY --from=build /usr/src/app/dist/graphene-ui/browser /usr/share/nginx/html
+
+# Copy the custom Nginx configuration file
+COPY nginx.conf /etc/nginx/conf.d/default.conf
+
+# Start Nginx
+CMD ["nginx", "-g", "daemon off;"]

README.md

 # GrapheneUi
 
-This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 16.2.9.
+This project builds on Angular and 18 makes use of the new standalone components that were recently introduced to simplify component re-use.   
 
 ## Development server
 
 Run `npm 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 `npm 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`.
@@ -15,6 +14,19 @@ Run `npm run ng generate component component-name` to generate a new component.
 
 Run `npm run ng build` to build the project. The build artifacts will be stored in the `dist/` directory.
 
+## Making Docker and running it for production
+
+Build an image with:
+
+`docker build -t <image name> .`
+
+and run that image with (in this case on port 8080):
+
+`docker run -p 8080:80 <image name>`
+
+access the frontend under:
+`http://localhost:8080/`
+
 ## Running unit tests
 
 Run `npm run ng test` to execute the unit tests via [Karma](https://karma-runner.github.io).
@@ -26,3 +38,18 @@ Run `npm run ng e2e` to execute the end-to-end tests via a platform of your choi
 ## Further help
 
 To get more help on the Angular CLI use `npm run ng help` or go check out the [Angular CLI Overview and Command Reference](https://angular.io/cli) page.
+
+## Running container
+
+build the image
+
+`docker build -t cicd.ai4eu-dev.eu:7444/graphene/anuglar-frontend:latest .`
+
+Push the image
+`docker push cicd.ai4eu-dev.eu:7444/graphene/anuglar-frontend:latest`
+
+Run the image detached mode on port 7659
+`docker run  -d -p 7659:80 cicd.ai4eu-dev.eu:7444/graphene/anuglar-frontend:latest`
+docker run -p 7659:80 cicd.ai4eu-dev.eu:7444/graphene/anuglar-frontend:latest
+
+docker run -p 7659:80 -it cicd.ai4eu-dev.eu:7444/graphene/anuglar-frontend:latest /bin/bash
\ No newline at end of file

angular.json

@@ -12,51 +12,149 @@
       },
       "root": "",
       "sourceRoot": "src",
-      "prefix": "app",
+      "prefix": "gp",
       "architect": {
         "build": {
-          "builder": "@angular-devkit/build-angular:browser",
+          "builder": "@angular-devkit/build-angular:application",
           "options": {
             "outputPath": "dist/graphene-ui",
             "index": "src/index.html",
-            "main": "src/main.ts",
-            "polyfills": [
-              "zone.js"
-            ],
+            "browser": "src/main.ts",
+            "polyfills": ["zone.js"],
             "tsConfig": "tsconfig.app.json",
             "inlineStyleLanguage": "scss",
-            "assets": [
-              "src/favicon.ico",
-              "src/assets"
-            ],
-            "styles": [
-              "src/styles.scss"
-            ],
-            "scripts": []
+            "assets": ["src/favicon.ico", "src/assets", "src/legacy"],
+            "styles": ["src/styles.scss",
+              "./node_modules/quill/dist/quill.core.css",
+              "./node_modules/quill/dist/quill.bubble.css",
+              "./node_modules/quill/dist/quill.snow.css",
+              "src/legacy/css/styles-schedule.css",
+              "src/legacy/css/fonts-opensans.css",
+              "src/legacy/css/fonts-materialIcons.css",
+              "src/legacy/css/angular-material.min.css",
+              "src/legacy/css/material.min.css",
+              "src/legacy/css/fontawesome-all.min.css",
+              "src/legacy/css/design-studio-style.css",
+              "src/legacy/css/design-studio.css",
+              "src/legacy/css/style_modeler.css",
+              "src/legacy/css/ng-tags-input.min.css",
+              "src/legacy/bootstrap-star-rating/css/star-rating.min.css",
+              "src/legacy/css/quill.snow.css",
+              "src/legacy/css/quill.bubble.css",
+              "src/legacy/css/home.css",
+              "src/legacy/css/ui-carosel.css",
+              "src/legacy/css/xeditable.min.css",
+              "src/legacy/design-studio/css/dc.graph.css",
+              "src/legacy/design-studio/css/dc.css",
+              "src/legacy/design-studio/css/jquery-ui.css",
+              "src/legacy/design-studio/css/jqueryui-editable.css",
+              "src/legacy/design-studio/css/graphene-design-studio.css",
+              "src/legacy/design-studio/css/d3-tip/example-styles.css",
+              "src/legacy/css/styles.css",
+              "src/legacy/css/validation.css",
+              "src/legacy/css/jquery.dataTables.min.css",
+              "src/legacy/css/angular-datatables.css"
+              ],
+            "scripts": [
+              "src/legacy/design-studio/js/d3.js",
+              "src/legacy/design-studio/js/crossfilter.js",
+              "src/legacy/design-studio/js/dc.js",
+              "src/legacy/design-studio/js/queue.js",
+              "src/legacy/design-studio/js/promise-polyfill.js",
+              "src/legacy/design-studio/js/classlist-polyfill.js",
+              "src/legacy/design-studio/js/d3-tip/index.js",
+              "src/legacy/design-studio/js/lodash.js",
+              "src/legacy/design-studio/js/yoga-layout.js",
+              "src/legacy/design-studio/js/cola.js",
+              "src/legacy/design-studio/js/dc.graph.js",
+              "src/legacy/design-studio/js/chart.registry.js",
+              "src/legacy/design-studio/js/querystring.js",
+              "src/legacy/resources/d3.js",
+              "src/legacy/resources/material.min.js",
+              "src/legacy/resources/jquery.min.js",
+              "src/legacy/design-studio/js/jquery.js",
+              "src/legacy/design-studio/js/jquery-ui.js",
+              "src/legacy/design-studio/js/jqueryui-editable.js",
+              "src/legacy/resources/jquery.dataTables.js",
+              "src/legacy/resources/angular.min.js",
+              "src/legacy/resources/angular-route.min.js",
+              "src/legacy/resources/angular-animate.min.js",
+              "src/legacy/resources/angular-aria.min.js",
+              "src/legacy/resources/angular-material.min.js",
+              "src/legacy/resources/angular-messages.min.js",
+              "src/legacy/resources/angular-dragdrop.js",
+              "src/legacy/resources/custom_script.js",
+              "src/legacy/resources/angular-base64-upload.js",
+              "src/legacy/resources/bootstrap.min.js",
+              "src/legacy/resources/xeditable.min.js",
+              "src/legacy/resources/json2yaml.js",
+              "src/legacy/resources/angular-datatables.min.js",
+              "src/legacy/resources/angular-toastr.tpls.js",
+              "src/legacy/resources/satellizer.min.js",
+              "src/legacy/resources/angular-material-icons.min.js",
+              "src/legacy/resources/angular-sanitize.js",
+              "src/legacy/resources/imageupload.js",
+              "src/legacy/resources/angular-jwt.js",
+              "src/legacy/bootstrap-star-rating/js/star-rating.min.js",
+              "src/legacy/resources/ui-bootstrap-tpls.min.js",
+              "src/legacy/resources/ngStorage.min.js",
+              "src/legacy/resources/quill.js",
+              "src/legacy/resources/ng-quill.min.js",
+              "src/legacy/resources/rating-stars.min.js",
+              "src/legacy/resources/ui-carousel.js",
+              "src/legacy/design-studio/js/tether.js",
+              "src/legacy/js/ng-file-upload.js",
+              "src/legacy/js/jstz-1.0.4.min.js",
+              "src/legacy/design-studio.module.js",
+              "src/legacy/design-studio.component.js"
+            ]
           },
           "configurations": {
             "production": {
+              "fileReplacements": [
+                {
+                  "replace": "src/environments/environment.ts",
+                  "with": "src/environments/environment.prod.ts"
+                }
+              ],
               "budgets": [
                 {
                   "type": "initial",
-                  "maximumWarning": "500kb",
-                  "maximumError": "1mb"
+                  "maximumWarning": "2mb",
+                  "maximumError": "10mb"
                 },
                 {
                   "type": "anyComponentStyle",
-                  "maximumWarning": "2kb",
-                  "maximumError": "4kb"
+                  "maximumWarning": "1mb",
+                  "maximumError": "5mb"
                 }
               ],
               "outputHashing": "all"
             },
+            "dev02": {
+              "fileReplacements": [
+                {
+                  "replace": "src/environments/environment.ts",
+                  "with": "src/environments/environment.prod.ts"
+                }
+              ],
+              "budgets": [
+                {
+                  "type": "initial",
+                  "maximumWarning": "2mb",
+                  "maximumError": "5mb"
+                },
+                {
+                  "type": "anyComponentStyle",
+                  "maximumWarning": "1mb",
+                  "maximumError": "2mb"
+                }
+              ],
+              "outputHashing": "all"            },
             "development": {
-              "buildOptimizer": false,
               "optimization": false,
-              "vendorChunk": true,
               "extractLicenses": false,
-              "sourceMap": true,
-              "namedChunks": true
+              "sourceMap": true
             }
           },
           "defaultConfiguration": "production"
@@ -65,10 +163,13 @@
           "builder": "@angular-devkit/build-angular:dev-server",
           "configurations": {
             "production": {
-              "browserTarget": "graphene-ui:build:production"
+              "buildTarget": "graphene-ui:build:production"
+            },
+            "dev02": {
+              "buildTarget": "graphene-ui:build:dev02"
             },
             "development": {
-              "browserTarget": "graphene-ui:build:development"
+              "buildTarget": "graphene-ui:build:development"
             }
           },
           "defaultConfiguration": "development"
@@ -76,30 +177,29 @@
         "extract-i18n": {
           "builder": "@angular-devkit/build-angular:extract-i18n",
           "options": {
-            "browserTarget": "graphene-ui:build"
+            "buildTarget": "graphene-ui:build"
           }
         },
         "test": {
           "builder": "@angular-devkit/build-angular:karma",
           "options": {
-            "polyfills": [
-              "zone.js",
-              "zone.js/testing"
-            ],
+            "polyfills": ["zone.js", "zone.js/testing"],
             "tsConfig": "tsconfig.spec.json",
             "inlineStyleLanguage": "scss",
-            "assets": [
-              "src/favicon.ico",
-              "src/assets"
-            ],
-            "styles": [
-              "src/styles.scss"
-            ],
+            "assets": ["src/favicon.ico", "src/assets"],
+            "styles": ["src/styles.scss",
+              "./node_modules/quill/dist/quill.core.css",
+              "./node_modules/quill/dist/quill.bubble.css",
+              "./node_modules/quill/dist/quill.snow.css"
+              ],
             "scripts": [],
             "karmaConfig": "karma.conf.js"
           }
         }
       }
     }
+  },
+  "cli": {
+    "analytics": false
   }
 }

app.config.ts

+/*!
+ * @license
+ * Copyright Google LLC All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://angular.dev/license
+ */
+
+import { ApplicationConfig } from '@angular/core';
+import { provideProtractorTestingSupport } from '@angular/platform-browser';
+import { provideRouter } from '@angular/router';
+import { provideHttpClient, withInterceptors } from '@angular/common/http';
+import { provideAnimations } from '@angular/platform-browser/animations';
+import routeConfig from 'src/app/routes';
+import { devAuthInterceptor } from 'src/app/core/interceptors/dev-auth-interceptor.service';
+
+export const appConfig: ApplicationConfig = {
+  providers: [
+    provideProtractorTestingSupport(),
+    provideRouter(routeConfig),
+    provideAnimations(),
+    provideHttpClient(withInterceptors([devAuthInterceptor])),
+  ],
+};

nginx.conf

+server {
+    listen 80;
+    server_name localhost;
+
+    root /usr/share/nginx/html;
+
+    location /v2/ {
+        alias /usr/share/nginx/html/;
+        index index.html;
+        try_files $uri $uri/ /v2/index.html;
+    }
+
+    error_page 404 /v2/index.html;
+}

package.json

@@ -7,34 +7,52 @@
     "build": "ng build",
     "watch": "ng build --watch --configuration development",
     "test": "ng test",
-    "test-headless": "ng test --no-watch --no-progress --browsers=ChromeHeadless"
+    "test-headless": "ng test --no-watch --no-progress --browsers=ChromeHeadless",
+    "lint": "eslint .",
+    "format": "prettier --write ."
   },
   "private": true,
   "dependencies": {
-    "@angular/animations": "^16.2.0",
-    "@angular/common": "^16.2.0",
-    "@angular/compiler": "^16.2.0",
-    "@angular/core": "^16.2.0",
-    "@angular/forms": "^16.2.0",
-    "@angular/platform-browser": "^16.2.0",
-    "@angular/platform-browser-dynamic": "^16.2.0",
-    "@angular/router": "^16.2.0",
-    "rxjs": "~7.8.0",
-    "tslib": "^2.3.0",
-    "zone.js": "~0.13.0"
+    "@angular/animations": "^18.0.2",
+    "@angular/cdk": "^17.0.0",
+    "@angular/common": "^18.0.2",
+    "@angular/compiler": "^18.0.2",
+    "@angular/core": "^18.0.2",
+    "@angular/forms": "^18.2.13",
+    "@angular/material": "^17.3.10",
+    "@angular/platform-browser": "^18.0.2",
+    "@angular/platform-browser-dynamic": "^18.0.2",
+    "@angular/router": "^18.2.13",
+    "@angular/upgrade": "^18.2.13",
+    "jwt-decode": "^4.0.0",
+    "ngx-quill": "^26.0.10",
+    "quill": "^2.0.3",
+    "rxjs": "~7.8.1",
+    "tslib": "^2.8.1",
+    "zone.js": "^0.14.10"
   },
   "devDependencies": {
-    "@angular-devkit/build-angular": "^16.2.9",
-    "@angular/cli": "^16.2.9",
-    "@angular/compiler-cli": "^16.2.0",
-    "@types/jasmine": "~4.3.0",
-    "jasmine-core": "~4.6.0",
+    "@angular-devkit/build-angular": "^18.2.12",
+    "@angular/cli": "^18.2.12",
+    "@angular/compiler-cli": "^18.2.13",
+    "@types/jasmine": "~5.1.2",
+    "eslint": "^8.57.1",
+    "eslint-config-airbnb-base": "^15.0.0",
+    "eslint-config-prettier": "^9.1.0",
+    "eslint-plugin-angular": "^4.1.0",
+    "eslint-plugin-html": "^7.1.0",
+    "eslint-plugin-import": "^2.31.0",
+    "eslint-plugin-jsdoc": "^46.10.1",
+    "eslint-plugin-jsx-a11y": "^6.10.2",
+    "eslint-plugin-prettier": "^5.2.3",
+    "jasmine-core": "~5.1.1",
     "karma": "~6.4.0",
     "karma-chrome-launcher": "~3.2.0",
-    "karma-coverage": "~2.2.0",
+    "karma-coverage": "~2.2.1",
     "karma-jasmine": "~5.1.0",
     "karma-jasmine-html-reporter": "~2.1.0",
-    "puppeteer": "^21.5.0",
-    "typescript": "~5.1.3"
+    "prettier": "3.1.0",
+    "puppeteer": "^21.11.0",
+    "typescript": "~5.4.5"
   }
 }

src/app/app-routing.module.ts

-import { NgModule } from '@angular/core';
-import { RouterModule, Routes } from '@angular/router';
-
-const routes: Routes = [
-  {
-    path: '',
-    loadChildren: () => import('./features/home/home.module').then(m => m.HomeModule)
-  },
-  {
-    path: 'catalog',
-    loadChildren: () => import('./features/catalog/catalog.module').then(m => m.CatalogModule)
-  }
-];
-
-@NgModule({
-  imports: [RouterModule.forRoot(routes)],
-  exports: [RouterModule]
-})
-export class AppRoutingModule { }

src/app/app.component.html

-<app-header title='Graphene Header'></app-header>
-
-<button type="button" routerLink="/catalog">Catalogs</button>
-<button type="button" routerLink="">Home</button>
-
-<router-outlet></router-outlet>
\ No newline at end of file
+<router-outlet></router-outlet>

src/app/app.component.ts

 import { Component } from '@angular/core';
+import { Router, RouterModule } from '@angular/router';
+import { UpgradeModule } from '@angular/upgrade/static';
 
 @Component({
   selector: 'app-root',
   templateUrl: './app.component.html',
-  styleUrls: ['./app.component.scss']
+  standalone: true,
+  imports: [RouterModule, UpgradeModule],
+  styleUrls: ['./app.component.scss'],
 })
 export class AppComponent {
   title = 'graphene-ui';
+
+  constructor(
+    private router: Router,
+    private upgrade: UpgradeModule,
+  ) {}
+
+  ngOnInit(): void {
+    this.checkRememberMeAndRedirect();
+  }
+
+  checkRememberMeAndRedirect() {
+    const userDetails = localStorage.getItem('userDetails');
+
+    if (userDetails) {
+      // User details are available, redirect to the dashboard
+      this.router.navigate(['/dashboard']);
+    }
+  }
 }

src/app/app.module.ts

-import { NgModule } from '@angular/core';
-import { BrowserModule } from '@angular/platform-browser';
-import { HTTP_INTERCEPTORS } from '@angular/common/http';
-
-
-import { AppRoutingModule } from './app-routing.module';
-import { AppComponent } from './app.component';
-import { HeaderComponent } from './shared/components/header/header.component';
-import { HttpInterceptorService } from './shared/interceptors/http-interceptor.service';
-
-@NgModule({
-  declarations: [
-    AppComponent,
-    HeaderComponent
-  ],
-  imports: [
-    BrowserModule,
-    AppRoutingModule
-  ],
-  providers: [{ provide: HTTP_INTERCEPTORS, useClass: HttpInterceptorService, multi: true },],
-  bootstrap: [AppComponent]
-})
-export class AppModule { }

src/app/config/api-config.ts

-import { environment } from "src/environment/environment";
-
-export const apiConfig = {
-    
-    apiBaseUrl: environment.baseURL,
-    // eslint-disable-next-line max-len
-    token: '',
-    catalog:{
-        getCatalog:{
-            'api-url': environment.backendURL + 'catalog',
-        }
-    }
-}
\ No newline at end of file

src/app/core/config/api-config.ts

+import { environment } from 'src/environments/environment';
+
+export const apiConfig = {
+  apiBackendURL: environment.apiBackendURL,
+  // eslint-disable-next-line max-len
+  authorization: '/api/auth/jwtToken',
+  publicCatalogs: '/api/catalogs/public',
+  forgetPasswordURL: '/api/users/forgetPassword',
+  signUpURL: '/api/users/register',
+  urlSolutions: '/api/solutions',
+  urlPublicPortalSolutions: '/portal/solutions/public',
+  urlPortalSolutions: '/api/portal/solutions',
+  urlPublicCatalogs: '/api/catalogs/public',
+  getPublicSolutionPicture: (publicSolutionId: string) =>
+    `/api/solutions/${publicSolutionId}/picture`,
+  urlGetSolutionDetails: (solutionId: string, revisionId: string) =>
+    `/api/solutions/${solutionId}/${revisionId}`,
+  urlGetCatalogsOfSolution: (solutionId: string) =>
+    `/api/catalog/solution/${solutionId}`,
+  urlGetModelAuthors: (solutionId: string, revisionId: string) =>
+    `/api/solution/${solutionId}/revision/${revisionId}/authors`,
+  urlGetComment: (solutionId: string, revisionId: string) =>
+    `/api/thread/${solutionId}/${revisionId}/comments`,
+  urlGetArtifacts: (solutionId: string, revisionId: string) =>
+    `/api/solutions/${solutionId}/revisions/${revisionId}`,
+  urlGetModelSignature: (solutionId: string, versionId: string) =>
+    `/api/getProtoFile?solutionId=${solutionId}&version=${versionId}`,
+  urlGetSolutionDocuments: (
+    solutionId: string,
+    revisionId: string,
+    selectedCatalogId: string,
+  ) =>
+    `/api/solution/${solutionId}/revision/${revisionId}/${selectedCatalogId}/document`,
+  urlGetLicenseFile: (solutionId: string, versionId: string) =>
+    `/api/getLicenseFile?solutionId=${solutionId}&version=${versionId}`,
+  urlGetSolutionDescription: (revisionId: string, selectedCatalogId: string) =>
+    `/api/solution/revision/${revisionId}/${selectedCatalogId}/description`,
+  urlDescription: '/api/solution/revision',
+  urlGetSolutionRatings: '/api/solutions/ratings/',
+  urlPreferredTag: '/api/preferredTags',
+  urlCreateFavorite: '/api/solution/createFavorite',
+  urlDeleteFavorite: '/api/solution/deleteFavorite',
+  urlPrivateCatalogsList: '/api/catalogs',
+  urlModelTypes: '/api/filter/modeltype',
+  urlToolkitTypes: '/api/filter/toolkitType',
+  urlSearchSolutions: '/api/searchSolutionBykeyword',
+  urlFavoriteSolution: '/api/solution/getFavoriteSolutions',
+  urlUserAccountDetails: '/api/users/userAccountDetails',
+  getRelatedMySolutions: '/api/getRelatedMySolutions',
+  urlUpdateViewCount: '/api/solution/updateViewCount',
+  urlUploadLicenseProfile: '/api/license/upload',
+  urlAvgRating: '/api/solution/avgRating/',
+  urlGetRating: '/api/solution/getRating/',
+  urlCreateRating: '/api/solution/createRating',
+  urlThread: '/api/thread',
+  urlComment: '/api/comments',
+  urlGetActiveUsers: '/api/users/activeUserDetails',
+  urlShareWithTeam: '/api/solution/userAccess',
+  urlAddToCatalog: '/api/webBasedOnBoarding/addToCatalog',
+  urlMessagingStatus: '/api/webBasedOnBoarding/messagingStatus',
+  urlUserSolutions: '/api/user/solutions',
+  urlSearchSolutionsByName: '/api/onboardingDocker/dockerSearchSolutions',
+  urlAllCatalogsList: '/api/catalogs',
+  urlCreateTags: '/api/tags/create',
+  urlDeleteTag: '/api/dropTag',
+  urlAddTag: '/api/addTag',
+  urlGetAllTag: '/api/tags',
+  urlPublishSolution: '/api/publish',
+  urlSearchPublishRequest: '/api/publish/request/search/revision',
+  withdrawPublishRequestUrl: '/api/publish/request/withdraw/',
+  urlCatalogPath: '/api/catalog',
+  urlSiteConfig: '/api/admin/config',
+  //design studio urls
+  urlDesignStudioBase: '/dsce/dsce/',
+  urlDesignStudioCatalog: 'solution/getSolutions',
+  urlDesignStudioTypeInfo: 'artifact/fetchJsonTOSCA',
+  urlDesignStudioCreate: 'solution/createNewCompositeSolution',
+  urlDesignStudioAddNode: 'solution/addNode',
+  urlDesignStudioAddLink: 'solution/addLink',
+  urlDesignStudioSave: 'solution/saveCompositeSolution',
+  urlDesignStudioValidate: 'solution/validateCompositeSolution',
+  urlDesignStudioSetProbe: 'solution/setProbeIndicator',
+  urlDesignStudioRead: 'solution/readCompositeSolutionGraph',
+  urlDesignStudioCatFormat: 'graphene',
+  urlDesignStudioSolution: '',
+  urlDesignStudioDeleteNode: 'solution/deleteNode',
+  urlDesignStudioDeleteLink: 'solution/deleteLink',
+  urlDesignStudioCloseCompositeSolution: 'solution/closeCompositeSolution ',
+  urlDesignStudioModifyNode: 'solution/modifyNode',
+  urlDesignStudioModifyLink: 'solution/modifyLink',
+  urlDesignStudioDeleteCompositeSolution: 'solution/deleteCompositeSolution',
+  urlDesignStudioClearCompositeSolution: 'solution/clearCompositeSolution',
+  urlDesignStudioGetCompositeSolutions: 'solution/getCompositeSolutions',
+  urlDesignStudioProtobuf: 'artifact/fetchProtoBufJSON',
+  urlDesignStudioGetMatchingModels: 'solution/getMatchingModels',
+  urlDesignStudioVersion: 'admin/getVersion',
+};

src/app/core/config/custom-paginator-configuration.ts

+import { MatPaginatorIntl } from '@angular/material/paginator';
+
+export function CustomPaginator() {
+  const customPaginatorIntl = new MatPaginatorIntl();
+
+  customPaginatorIntl.itemsPerPageLabel = 'Showing';
+
+  return customPaginatorIntl;
+}

src/app/core/http-shared/http-shared.service.spec.ts

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

src/app/core/http-shared/http-shared.service.ts

+import { Injectable } from '@angular/core';
+import { Observable } from 'rxjs';
+import { HttpClient, HttpParams } from '@angular/common/http';
+
+@Injectable({
+  providedIn: 'root',
+})
+export class HttpSharedService {
+  constructor(private http: HttpClient) {}
+
+  private _convertQueryParams(queryParams?: any): HttpParams {
+    let params = new HttpParams();
+    if (queryParams) {
+      // Iterate over object keys
+      Object.keys(queryParams).forEach((key) => {
+        // Check if the property is indeed a property of queryParams
+        if (queryParams.hasOwnProperty(key)) {
+          // Add each key to the HttpParams object
+          params = params.set(key, queryParams[key]);
+        }
+      });
+    }
+    return params;
+  }
+
+  get(url: string, queryParams?: any): Observable<any> {
+    let params;
+    if (queryParams) {
+      params = this._convertQueryParams(queryParams);
+    }
+    return this.http.get(url, { params });
+  }
+
+  post(url: string, queryParams?: any, body?: any): Observable<any> {
+    let params;
+    if (queryParams) {
+      params = this._convertQueryParams(queryParams);
+    }
+
+    return this.http.post(url, body, { params });
+  }
+
+  put(url: string, queryParams?: any, body?: any): Observable<any> {
+    let params;
+    if (queryParams) {
+      params = this._convertQueryParams(queryParams);
+    }
+    return this.http.put(url, body, { params });
+  }
+
+  delete(url: string, queryParams?: any): Observable<any> {
+    let params;
+    if (queryParams) {
+      params = this._convertQueryParams(queryParams);
+    }
+    return this.http.delete(url, { params });
+  }
+}

src/app/shared/interceptors/http-interceptor.service.spec.ts → src/app/core/interceptors/dev-auth-interceptor.service.spec.ts

 import { TestBed } from '@angular/core/testing';
 
-import { HttpInterceptorService } from './http-interceptor.service';
+import { DevAuthInterceptor } from './dev-auth-interceptor.service';
 
 describe('HttpInterceptorService', () => {
-  let service: HttpInterceptorService;
+  let service: DevAuthInterceptor;
 
   beforeEach(() => {
     TestBed.configureTestingModule({});
-    service = TestBed.inject(HttpInterceptorService);
+    service = TestBed.inject(DevAuthInterceptor);
   });
 
   it('should be created', () => {

src/app/core/interceptors/dev-auth-interceptor.service.ts

+import { inject } from '@angular/core';
+import {
+  HttpHandlerFn,
+  HttpInterceptorFn,
+  HttpRequest,
+} from '@angular/common/http';
+import { switchMap } from 'rxjs/operators';
+import { environment } from 'src/environments/environment';
+import { JwtTokenService } from '../services/auth/jwt-token.service';
+
+export const devAuthInterceptor: HttpInterceptorFn = (
+  request: HttpRequest<unknown>,
+  next: HttpHandlerFn,
+) => {
+  const jwtTokenService = inject(JwtTokenService);
+
+  return jwtTokenService.getToken().pipe(
+    switchMap((token) => {
+      if (token) {
+        // Ensure token is a non-null string
+        const authReq = request.clone({
+          headers: request.headers.set('Authorization', `Bearer ${token}`),
+        });
+        return next(authReq);
+      }
+      // If no token, forward the original request
+      return next(request.clone());
+    }),
+  );
+};