Refactor

INTO-CPS-Association · Dec 17, 2024 · 9ddb439 · 9ddb439
1 parent e689979
commit 9ddb439
Show file tree

Hide file tree

Showing 14 changed files with 638 additions and 646 deletions.
diff --git a/client/package.json b/client/package.json
@@ -73,6 +73,7 @@
         "eslint-plugin-jsx-a11y": "^6.8.0",
         "eslint-plugin-react": "^7.33.2",
         "eslint-plugin-react-hooks": "^5.1.0",
+        "http-status-codes": "^2.3.0",
         "jest-fetch-mock": "^3.0.3",
         "katex": "^0.16.11",
         "markdown-it-katex": "^2.0.3",

diff --git a/client/playwright.config.ts b/client/playwright.config.ts
@@ -16,66 +16,67 @@ dotenv.config({ path: './test/.env' });
 const BASE_URI = process.env.REACT_APP_URL ?? 'http://localhost:4000/';
 
 export default defineConfig({
-  webServer: useExtServer
-    ? undefined
-    : {
-        command: 'yarn start',
-      },
-  retries: process.env.CI ? 0 : 1, // Disable retries on Github actions for now as setup always fails
-  timeout: 120 * 1000,
-  globalTimeout: 10 * 60 * 1000,
-  testDir: './test/e2e/tests',
-  testMatch: /.*\.test\.ts/,
-  reporter: [
-    [
-      'html',
-      {
-        outputFile: 'playwright-report/index.html',
-      },
-    ],
-    ['list'],
-    [
-      'junit',
-      {
-        outputFile: 'playwright-report/results.xml',
-      },
-    ],
-    [
-      'json',
-      {
-        outputFile: 'playwright-report/results.json',
-      },
-    ],
-  ], // Codecov handled through Monocart-Reporter https://github.com/cenfun/monocart-reporter
-  use: {
-    baseURL: BASE_URI,
-    trace: 'on-first-retry', // Wil not record trace on Github actions because of no retries
-  },
-  projects: [
-    // Setup project
-    {
-      name: 'setup',
-      testMatch: /.*\.setup\.ts/,
-      use: { browserName: 'chromium' },
+    webServer: useExtServer
+        ? undefined
+        : {
+            command: 'yarn start',
+        },
+    retries: process.env.CI ? 0 : 1, // Disable retries on Github actions for now as setup always fails
+    timeout: 120 * 1000,
+    globalTimeout: 10 * 60 * 1000,
+    testDir: './test/e2e/tests',
+    testMatch: /.*\.test\.ts/,
+    reporter: [
+        [
+            'html',
+            {
+                outputFile: 'playwright-report/index.html',
+            },
+        ],
+        ['list'],
+        [
+            'junit',
+            {
+                outputFile: 'playwright-report/results.xml',
+            },
+        ],
+        [
+            'json',
+            {
+                outputFile: 'playwright-report/results.json',
+            },
+        ],
+    ], // Codecov handled through Monocart-Reporter https://github.com/cenfun/monocart-reporter
+    use: {
+        baseURL: BASE_URI,
+        trace: 'on-first-retry', // Wil not record trace on Github actions because of no retries
+        // headless: false
     },
-    {
-      name: 'chromium',
-      use: {
-        ...devices['Desktop Chrome'],
-        storageState: 'playwright/.auth/user.json',
-      },
-      dependencies: ['setup'],
-    },
-    {
-      name: 'firefox',
-      use: {
-        ...devices['Desktop Firefox'],
-        // Use prepared auth state.
-        storageState: 'playwright/.auth/user.json',
-      },
-      dependencies: ['setup'],
-    },
-  ],
-  globalSetup: 'test/e2e/setup/global.setup.ts',
-  globalTeardown: 'test/e2e/setup/global-teardown.ts',
+    projects: [
+        // Setup project
+        {
+            name: 'setup',
+            testMatch: /.*\.setup\.ts/,
+            use: { browserName: 'chromium' },
+        },
+        {
+            name: 'chromium',
+            use: {
+                ...devices['Desktop Chrome'],
+                storageState: 'playwright/.auth/user.json',
+            },
+            dependencies: ['setup'],
+        },
+        {
+            name: 'firefox',
+            use: {
+                ...devices['Desktop Firefox'],
+                // Use prepared auth state.
+                storageState: 'playwright/.auth/user.json',
+            },
+            dependencies: ['setup'],
+        },
+    ],
+    globalSetup: 'test/e2e/setup/global.setup.ts',
+    globalTeardown: 'test/e2e/setup/global-teardown.ts',
 });
diff --git a/client/src/route/auth/ConfigItems.tsx b/client/src/route/auth/ConfigItems.tsx
@@ -2,84 +2,65 @@ import CheckCircleIcon from '@mui/icons-material/CheckCircle';
 import ErrorOutlineIcon from '@mui/icons-material/ErrorOutline';
 import { Tooltip } from '@mui/material';
 import * as React from 'react';
-import { validationType } from './VerifyConfig';
+import { validationType } from 'util/config';
+import { StatusCodes } from 'http-status-codes';
 
 const ConfigIcon = (toolTipTitle: string, icon: JSX.Element): JSX.Element => (
-  <Tooltip
-    title={toolTipTitle}
-    PopperProps={{ container: document.getElementById('root') }}
-  >
-    {icon}
-  </Tooltip>
+    <Tooltip
+        title={toolTipTitle}
+        PopperProps={{ container: document.getElementById('root') }}
+    >
+        {icon}
+    </Tooltip>
 );
 
 export const getConfigIcon = (
-  validation: validationType,
-  label: string,
+    validation: validationType,
+    label: string,
 ): JSX.Element => {
-  let icon = <ErrorOutlineIcon color="error" data-testid="error-icon" />;
-  let toolTipTitle = `${label} threw the following error: ${validation.error}`;
-  const configHasStatus = validation.status !== undefined;
-  const configHasError = validation.error !== undefined;
-  if (!configHasError) {
-    const statusMessage = configHasStatus
-      ? `${validation.value} responded with status code ${validation.status}.`
-      : '';
-    const validationStatusIsOK =
-      configHasStatus &&
-      ((validation.status! >= 200 && validation.status! <= 299) ||
-        validation.status! === 302);
-    icon =
-      validationStatusIsOK || !configHasStatus ? (
-        <CheckCircleIcon color="success" data-testid="success-icon" />
-      ) : (
-        <ErrorOutlineIcon color="warning" data-testid="warning-icon" />
-      );
-    toolTipTitle =
-      validationStatusIsOK || !configHasStatus
-        ? `${label} field is configured correctly.`
-        : `${label} field may not be configured correctly.`;
-    toolTipTitle += ` ${statusMessage}`;
-  }
-  return ConfigIcon(toolTipTitle, icon);
+    let icon = <ErrorOutlineIcon color="error" data-testid="error-icon" />;
+    let toolTipTitle = `${label} threw the following error: ${validation.error}`;
+    const configHasStatus = validation.status !== undefined;
+    const configHasError = validation.error !== undefined;
+    if (!configHasError) {
+        const statusMessage = configHasStatus
+            ? `${validation.value} responded with status code ${validation.status}.`
+            : '';
+        const validationStatusIsOK =
+            configHasStatus && validation.status! === StatusCodes.OK;
+        icon =
+            validationStatusIsOK || !configHasStatus ? (
+                <CheckCircleIcon color="success" data-testid="success-icon" />
+            ) : (
+                <ErrorOutlineIcon color="warning" data-testid="warning-icon" />
+            );
+        toolTipTitle =
+            validationStatusIsOK || !configHasStatus
+                ? `${label} field is configured correctly.`
+                : `${label} field may not be configured correctly.`;
+        toolTipTitle += ` ${statusMessage}`;
+    }
+    return ConfigIcon(toolTipTitle, icon);
 };
 
 export const ConfigItem: React.FC<{
-  label: string;
-  value: string;
-  validation?: validationType;
+    label: string;
+    value: string;
+    validation?: validationType;
 }> = ({ label, value, validation = { error: 'Validation unavailable' } }) => (
-  <div
-    style={{
-      display: 'flex',
-      alignItems: 'center',
-      gap: '10px',
-      margin: '5px 0',
-    }}
-    className="Config-item"
-  >
-    {getConfigIcon(validation, label)}
-    <div id="config-text">
-      <strong>{label}:</strong> {value}
-    </div>
-  </div>
-);
-ConfigItem.displayName = 'ConfigItem';
-
-export const windowEnvironmentVariables: Record<string, string> = {
-  environment: window.env.REACT_APP_ENVIRONMENT,
-  url: window.env.REACT_APP_URL,
-  url_basename: window.env.REACT_APP_URL_BASENAME,
-  url_dtlink: window.env.REACT_APP_URL_DTLINK,
-  url_liblink: window.env.REACT_APP_URL_LIBLINK,
-  workbenchlink_vncdesktop: window.env.REACT_APP_WORKBENCHLINK_VNCDESKTOP,
-  workbenchlink_vscode: window.env.REACT_APP_WORKBENCHLINK_VSCODE,
-  workbenchlink_jupyterlab: window.env.REACT_APP_WORKBENCHLINK_JUPYTERLAB,
-  workbenchlink_jupyternotebook:
-    window.env.REACT_APP_WORKBENCHLINK_JUPYTERNOTEBOOK,
-  client_id: window.env.REACT_APP_CLIENT_ID,
-  auth_authority: window.env.REACT_APP_AUTH_AUTHORITY,
-  redirect_uri: window.env.REACT_APP_REDIRECT_URI,
-  logout_redirect_uri: window.env.REACT_APP_LOGOUT_REDIRECT_URI,
-  gitlab_scopes: window.env.REACT_APP_GITLAB_SCOPES,
-};
+        <div
+            style={{
+                display: 'flex',
+                alignItems: 'center',
+                gap: '10px',
+                margin: '5px 0',
+            }}
+            className="Config-item"
+        >
+            {getConfigIcon(validation, label)}
+            <div id="config-text">
+                <strong>{label}:</strong> {value}
+            </div>
+        </div>
+    );
+ConfigItem.displayName = 'ConfigItem';