fix(web-terminal): fix #598: Cleanup some small code smells in the we…

…b-terminal plugin (#1023) fix #598: Cleanup some small code smells
janus-idp · Dec 22, 2023 · 3d2bafb · 3d2bafb
1 parent 21c73f4
commit 3d2bafb
Show file tree

Hide file tree

Showing 4 changed files with 41 additions and 54 deletions.
diff --git a/plugins/web-terminal/src/components/NamespacePickerDialog/NamespacePickerDialog.tsx b/plugins/web-terminal/src/components/NamespacePickerDialog/NamespacePickerDialog.tsx
@@ -30,7 +30,7 @@ const useStyles = makeStyles({
 type props = {
   onInit: () => Promise<any>;
   open: boolean;
-  previousNamespace: string;
+  previousNamespace?: string;
   handleClose: () => void;
   onSubmit: (selectedNamesapce: string) => void;
 };

diff --git a/plugins/web-terminal/src/components/TerminalComponent/TerminalComponent.test.tsx b/plugins/web-terminal/src/components/TerminalComponent/TerminalComponent.test.tsx
@@ -7,9 +7,7 @@ import {
   setupRequestMockHandlers,
   TestApiProvider,
 } from '@backstage/test-utils';
-import { lightTheme } from '@backstage/theme';
 
-import { ThemeProvider } from '@material-ui/core';
 import { fireEvent, render, waitFor } from '@testing-library/react';
 import { rest } from 'msw';
 import { setupServer } from 'msw/node';
@@ -70,25 +68,23 @@ describe('TerminalComponent', () => {
       }),
       rest.post(`https://${DOMAIN_URL}/rest`, (req, res, ctx) => {
         const url = req.url.searchParams.get('url');
-        switch (url) {
-          case WORKSPACES_URL:
-            if (
-              req.headers.get('Authorization') ===
-              `Bearer ${NOT_VALID_PERMISSIONS_TOKEN}`
-            ) {
-              return res(
-                ctx.status(403),
-                ctx.json(require('./__fixtures__/invalidToken.json')),
-              );
-            }
+        if (url === WORKSPACES_URL) {
+          if (
+            req.headers.get('Authorization') ===
+            `Bearer ${NOT_VALID_PERMISSIONS_TOKEN}`
+          ) {
             return res(
-              ctx.delay(800),
-              ctx.status(200),
-              ctx.json(require('./__fixtures__/createWorkspace.json')),
+              ctx.status(403),
+              ctx.json(require('./__fixtures__/invalidToken.json')),
             );
-          default:
-            return res(ctx.status(404), ctx.json({}));
+          }
+          return res(
+            ctx.delay(800),
+            ctx.status(200),
+            ctx.json(require('./__fixtures__/createWorkspace.json')),
+          );
         }
+        return res(ctx.status(404), ctx.json({}));
       }),
     );
   });
@@ -97,25 +93,21 @@ describe('TerminalComponent', () => {
   });
   it('should render form for the Web Terminal', async () => {
     const rendered = render(
-      <ThemeProvider theme={lightTheme}>
-        <TestApiProvider apis={[[configApiRef, mockConfig]]}>
-          <EntityProvider entity={entityMock}>
-            <TerminalComponent />
-          </EntityProvider>
-        </TestApiProvider>
-      </ThemeProvider>,
+      <TestApiProvider apis={[[configApiRef, mockConfig]]}>
+        <EntityProvider entity={entityMock}>
+          <TerminalComponent />
+        </EntityProvider>
+      </TestApiProvider>,
     );
     expect(rendered.getByText('Web Terminal')).toBeInTheDocument();
   });
   it('should start loading', async () => {
     const rendered = render(
-      <ThemeProvider theme={lightTheme}>
-        <TestApiProvider apis={[[configApiRef, mockConfig]]}>
-          <EntityProvider entity={entityMock}>
-            <TerminalComponent />
-          </EntityProvider>
-        </TestApiProvider>
-      </ThemeProvider>,
+      <TestApiProvider apis={[[configApiRef, mockConfig]]}>
+        <EntityProvider entity={entityMock}>
+          <TerminalComponent />
+        </EntityProvider>
+      </TestApiProvider>,
     );
     const inputField = rendered
       .getByTestId('token-input')
@@ -134,13 +126,11 @@ describe('TerminalComponent', () => {
 
   it('should render popup on token without valid permissions', async () => {
     const rendered = render(
-      <ThemeProvider theme={lightTheme}>
-        <TestApiProvider apis={[[configApiRef, mockConfig]]}>
-          <EntityProvider entity={entityMock}>
-            <TerminalComponent />
-          </EntityProvider>
-        </TestApiProvider>
-      </ThemeProvider>,
+      <TestApiProvider apis={[[configApiRef, mockConfig]]}>
+        <EntityProvider entity={entityMock}>
+          <TerminalComponent />
+        </EntityProvider>
+      </TestApiProvider>,
     );
     const inputField = rendered
       .getByTestId('token-input')
@@ -171,13 +161,11 @@ describe('TerminalComponent', () => {
       })),
     });
     const rendered = render(
-      <ThemeProvider theme={lightTheme}>
-        <TestApiProvider apis={[[configApiRef, mockConfig]]}>
-          <EntityProvider entity={entityMock}>
-            <TerminalComponent />
-          </EntityProvider>
-        </TestApiProvider>
-      </ThemeProvider>,
+      <TestApiProvider apis={[[configApiRef, mockConfig]]}>
+        <EntityProvider entity={entityMock}>
+          <TerminalComponent />
+        </EntityProvider>
+      </TestApiProvider>,
     );
     const inputField = rendered
       .getByTestId('token-input')

diff --git a/plugins/web-terminal/src/components/TerminalComponent/TerminalComponent.tsx b/plugins/web-terminal/src/components/TerminalComponent/TerminalComponent.tsx
@@ -124,12 +124,12 @@ export const TerminalComponent = () => {
   const setupPodRef = useRef(setupPod);
 
   React.useEffect(() => {
-    if (!token || !cluster) {
+    if (!token || !cluster || !namespace) {
       return;
     }
     const setupPodCurrent = setupPodRef.current;
     setLoading(true);
-    setupPodCurrent(cluster, token, namespace!).then(names => {
+    setupPodCurrent(cluster, token, namespace).then(names => {
       if (!names) {
         setDisplayModal(true);
         setLoading(false);
@@ -146,7 +146,7 @@ export const TerminalComponent = () => {
         `base64url.workspace.id.k8s.io.${encodeURIComponent(
           names.workspaceID,
         )}`,
-        `base64url.namespace.k8s.io.${encodeURIComponent(namespace!)}`,
+        `base64url.namespace.k8s.io.${encodeURIComponent(namespace)}`,
         `base64url.terminal.id.k8s.io.${encodeURIComponent(names.terminalID)}`,
         `base64url.terminal.size.k8s.io.${encodeURIComponent(
           `${terminal.cols}x${terminal.rows}`,
@@ -191,10 +191,10 @@ export const TerminalComponent = () => {
             Submit
           </Button>
         </form>
-        {displayModal && (
+        {displayModal && cluster && token && (
           <NamespacePickerDialog
-            onInit={() => getNamespaces(restServerUrl, cluster!, token!)}
-            previousNamespace={namespace!}
+            onInit={() => getNamespaces(restServerUrl, cluster, token)}
+            previousNamespace={namespace}
             open={displayModal}
             handleClose={handleClose}
             onSubmit={handleSubmitModal}

diff --git a/plugins/web-terminal/src/components/TerminalComponent/static/xterm.css b/plugins/web-terminal/src/components/TerminalComponent/static/xterm.css
@@ -93,7 +93,6 @@
 .xterm .xterm-viewport {
   /* On OS X this is required in order for the scroll bar to appear fully opaque */
   background-color: #000;
-  /* overflow-y: scroll;*/
   /* To hide scrollbar */
   overflow-y: hidden !important;
   cursor: default;