feat: Changes the Gitlab constants to user settings (#1249 and #1297)

- Converts hardcoded GitLab configuration into user settings.
  Uses browser LocalStorage to save settins across different user sessions.
- Refactors and consolidates interfaces to backend
- Updates tests to use mocks for the new constant getter functions

---------
Co-authored-by: Neble <marcusnj123@gmail.com>
Co-authored-by: Prasad Talasila <prasadtalasila@users.noreply.github.com>
Co-authored-by: Marcus Jensen <79929209+Microchesst@users.noreply.github.com>

Author: 3 people

client/jest.config.json

@@ -29,5 +29,6 @@
   "moduleNameMapper": {
     "^test/(.*)$": "<rootDir>/test/$1",
     "\\.(css|less|scss)$": "<rootDir>/test/__mocks__/styleMock.ts"
-  }
+  },
+  "maxWorkers": 3
 }

client/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@into-cps-association/dtaas-web",
-  "version": "0.8.4",
+  "version": "0.9.0",
   "description": "Web client for Digital Twin as a Service (DTaaS)",
   "main": "index.tsx",
   "author": "prasadtalasila <prasad.talasila@gmail.com> (http://prasad.talasila.in/)",

client/playwright.config.ts

@@ -25,6 +25,7 @@ export default defineConfig({
   retries: process.env.CI ? 0 : 1, // Disable retries on Github actions for now as setup always fails
   timeout: process.env.CI ? 1000 : 60 * 1000,
   globalTimeout: 10 * 60 * 1000,
+  workers: 3,
   testDir: './test/e2e/tests',
   testMatch: /.*\.test\.ts/,
   reporter: [
@@ -51,7 +52,7 @@ export default defineConfig({
   use: {
     baseURL: BASE_URI,
     screenshot: 'only-on-failure',
-    trace: 'on-first-retry', // Wil not record trace on Github actions because of no retries
+    trace: 'on-first-retry', // Will not record trace on Github actions because of no retries
     headless: true,
   },
   projects: [
@@ -81,4 +82,5 @@ export default defineConfig({
   ],
   globalSetup: 'test/e2e/setup/global.setup.ts',
   globalTeardown: 'test/e2e/setup/global-teardown.ts',
+  reportSlowTests: null,
 });

client/src/model/backend/gitlab/ARCHITECTURE.md renamed to client/src/model/backend/ARCHITECTURE.md

@@ -32,7 +32,7 @@ the backends are connected to key objects:
   await this.backend.api.createRepositoryFile(
       projectToUse,
       `${filePath}/${file.name}`,
-      'main',
+      getBranchName(),
       file.content,
       commitMessage,
   );
@@ -45,7 +45,7 @@ the backends are connected to key objects:
 The Instance is responsible for linking the DTaaS application to the selected backend.
 This entails keeping track of logs, project ids and keeping associated backend API
 instances for further operations as described below. The interface is described in
-`./UtilInterfaces.ts` with a concrete implementation being `./instance.ts`. It is
+`./backendInterfaces.ts` with a concrete implementation being `./instance.ts`. It is
 either created on an instance basis or passed from instance to instance when
 creating other instances. These then use the enriched project information to
 execute API commands, as demonstrated above. Detailed Logs are kept for any
@@ -55,7 +55,7 @@ Digital Twin executions, describing the success and job processing.
 
 The Backend communicates directly with the backend server for pipeline execution,
 log retrieval, and or file management. The interface is described in
-`./UtilInterfaces.ts` with a concrete implementation being `./backend.ts`. It is
+`./backendInterfaces.ts` with a concrete implementation being `./backend.ts`. It is
 created before the Instance to be injected and may be initialized there. After
 this, it may be called through the Instance  directly (e.g.
 `myInstance.api.cancelPipeline(...)`). It may contain a client field from a
@@ -179,8 +179,12 @@ to provide the desired backend implementation.
 
 ## Data Flow
 
-The below class diagram shows how a backend (Gitlab) is used.
-![Class diagram over ./Preview/Util](./classDiagramOfPreviewUtil.png)
+The basic data flow consists of a bidirectional relationship between the backend
+and the application. The files can be created, deleted and triggered
+from the UI changing the state of the storage backend's files and running its pipelines
+on the execution backend, if they are seperated.
+Statuses on pipelines are intermittently retrieved and showcased to the user
+who also has the option to stop execution, as well as reading execution logs received.
 
 ## Extension Points
 

client/src/model/backend/gitlab/IMPLEMENTATION.md renamed to client/src/model/backend/IMPLEMENTATION.md

@@ -15,7 +15,8 @@ and `BackendAPI` interfaces..
 
 This class implements the Backend interface. Its primary responsibility is to
 create the backend API instance, and to obtain the private and common project IDs
-from the username and the group name defined in [constants.ts](./constants.ts).
+from the username and the group name defined in [constants.ts](./constants.ts)
+as well as in the settings.
 After this, it keeps track of execution log entries and gives high-level access
 to pipeline information and execution, job traces and ids for further processing
 by the Backend API, which has to be Gitlab. It is only dependent on its backend
@@ -91,7 +92,7 @@ Example:
 Please follow [config guide](../docs/admin/client/config.md) for setting up the
 configuration. You may also wish to change certain constants, like
 `COMMON_LIBRARY_PROJECT_NAME` and `DT_DIRECTORY` in the [constants](./constants.ts)
-file.
+file or in the settings tab.
 
 <!--
 Maybe something about setting up the folder structure.

client/src/model/backend/gitlab/backend.ts

@@ -7,12 +7,13 @@ import { Gitlab } from '@gitbeaker/rest';
 import {
   BackendAPI,
   ProjectId,
-  Pipeline,
   RepositoryFile,
   RepositoryTreeItem,
   ProjectSummary,
   JobSummary,
-} from './UtilityInterfaces';
+} from 'model/backend/interfaces/backendInterfaces';
+import { Pipeline } from '../interfaces/execution';
+import { getBranchName } from './digitalTwinConfig/settingsUtility';
 
 export class GitlabAPI implements BackendAPI {
   public client: InstanceType<typeof Gitlab>;
@@ -112,7 +113,7 @@ export class GitlabAPI implements BackendAPI {
   public async listRepositoryFiles(
     projectId: ProjectId,
     path = '',
-    ref = 'main',
+    ref = getBranchName(),
     recursive = false,
   ): Promise<RepositoryTreeItem[]> {
     const items = await this.client.Repositories.allRepositoryTrees(projectId, {

client/src/model/backend/gitlab/classDiagramOfPreviewUtil.png

@@ -0,0 +1,29 @@
+import { FileType } from 'model/backend/interfaces/sharedInterfaces';
+
+// Default project settings
+export const GROUP_NAME = 'DTaaS';
+export const DT_DIRECTORY = 'digital_twins';
+export const COMMON_LIBRARY_PROJECT_NAME = 'common';
+export const RUNNER_TAG = 'linux';
+export const BRANCH_NAME = 'master';
+
+// Pipeline execution settings
+export const MAX_EXECUTION_TIME = 10 * 60 * 1000;
+export const PIPELINE_POLL_INTERVAL = 5 * 1000;
+
+// Maps tabs to project folders (based on asset types)
+export enum AssetTypes {
+  'Functions' = 'functions',
+  'Models' = 'models',
+  'Tools' = 'tools',
+  'Data' = 'data',
+  'Digital Twins' = 'digital_twins',
+  'Digital Twin' = 'digital_twin',
+}
+
+// Default initial files for new digital twins
+export const defaultFiles = [
+  { name: 'description.md', type: FileType.DESCRIPTION },
+  { name: 'README.md', type: FileType.DESCRIPTION },
+  { name: '.gitlab-ci.yml', type: FileType.CONFIGURATION },
+];

client/src/model/backend/gitlab/constants.ts

@@ -0,0 +1,17 @@
+import store from 'store/store';
+
+/**
+ * Non-hook getters for settings stored in the Redux store.
+ *
+ * - Default values are defined in ./constants.ts
+ * - Hook variants are in util/settingsUseHooks.ts
+ * - Settings can be overridden by the user in the Settings tab
+ */
+export const getGroupName = (): string => store.getState().settings.GROUP_NAME;
+export const getDTDirectory = (): string =>
+  store.getState().settings.DT_DIRECTORY;
+export const getCommonLibraryProjectName = (): string =>
+  store.getState().settings.COMMON_LIBRARY_PROJECT_NAME;
+export const getRunnerTag = (): string => store.getState().settings.RUNNER_TAG;
+export const getBranchName = (): string =>
+  store.getState().settings.BRANCH_NAME;