feat: implemented an ability to reject the authorisation opt-out flag

Signed-off-by: Oleksii Orel <[email protected]>

packages/dashboard-backend/src/devworkspaceClient/services/sshKeysApi/__tests__/index.spec.ts

@@ -66,12 +66,6 @@ describe('SSH Keys API', () => {
         response: {} as IncomingMessage,
       });
     },
-    // replaceNamespacedSecret: () => {
-    //   return Promise.resolve({
-    //     body: {} as V1Secret,
-    //     response: {} as IncomingMessage,
-    //   });
-    // },
     deleteNamespacedSecret: () => {
       return Promise.resolve({
         body: undefined,

packages/dashboard-backend/src/routes/api/workspacePreferences.ts

@@ -24,7 +24,7 @@ const tags = ['WorkspacePreferences'];
 export function registerWorkspacePreferencesRoute(instance: FastifyInstance) {
   instance.register(async server => {
     server.get(
-      `${baseApiPath}/workspacepreferences/:namespace`,
+      `${baseApiPath}/workspace-preferences/namespace/:namespace`,
       getSchema({ tags, params: namespacedSchema }),
       async function (request: FastifyRequest) {
         const { namespace } = request.params as restParams.INamespacedParams;
@@ -35,7 +35,7 @@ export function registerWorkspacePreferencesRoute(instance: FastifyInstance) {
     );
 
     server.delete(
-      `${baseApiPath}/workspacepreferences/:namespace/skip-authorisation/:provider`,
+      `${baseApiPath}/workspace-preferences/namespace/:namespace/skip-authorisation/:provider`,
       getSchema({
         tags,
         params: namespacedWorkspacePreferencesSchema,

packages/dashboard-frontend/jest.setup.ts

@@ -11,3 +11,4 @@
  */
 
 import '@testing-library/jest-dom';
+import '@/utils/che-tooltip';

packages/dashboard-frontend/src/components/CheTooltip/__tests__/CheTooltip.spec.tsx

@@ -0,0 +1,36 @@
+/*
+ * Copyright (c) 2018-2023 Red Hat, Inc.
+ * This program and the accompanying materials are made
+ * available under the terms of the Eclipse Public License 2.0
+ * which is available at https://www.eclipse.org/legal/epl-2.0/
+ *
+ * SPDX-License-Identifier: EPL-2.0
+ *
+ * Contributors:
+ *   Red Hat, Inc. - initial API and implementation
+ */
+
+import React from 'react';
+import renderer, { ReactTestRendererJSON } from 'react-test-renderer';
+
+import CheTooltip from '@/components/CheTooltip';
+
+describe('CheTooltip component', () => {
+  it('should render CheTooltip component correctly', () => {
+    const content = <span>Tooltip text.</span>;
+
+    const component = (
+      <CheTooltip content={content}>
+        <>some text</>
+      </CheTooltip>
+    );
+
+    expect(getComponentSnapshot(component)).toMatchSnapshot();
+  });
+});
+
+function getComponentSnapshot(
+  component: React.ReactElement,
+): null | ReactTestRendererJSON | ReactTestRendererJSON[] {
+  return renderer.create(component).toJSON();
+}

packages/dashboard-frontend/src/components/CheTooltip/__tests__/__snapshots__/CheTooltip.spec.tsx.snap

@@ -0,0 +1,10 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`CheTooltip component should render CheTooltip component correctly 1`] = `
+<div>
+  some text
+  <span>
+    Tooltip text.
+  </span>
+</div>
+`;

packages/dashboard-frontend/src/components/CheTooltip/index.tsx

@@ -0,0 +1,40 @@
+/*
+ * Copyright (c) 2018-2023 Red Hat, Inc.
+ * This program and the accompanying materials are made
+ * available under the terms of the Eclipse Public License 2.0
+ * which is available at https://www.eclipse.org/legal/epl-2.0/
+ *
+ * SPDX-License-Identifier: EPL-2.0
+ *
+ * Contributors:
+ *   Red Hat, Inc. - initial API and implementation
+ */
+
+import { Tooltip, TooltipPosition } from '@patternfly/react-core';
+import React from 'react';
+
+type Props = {
+  children: React.ReactElement;
+  content: React.ReactNode;
+  position?: TooltipPosition;
+};
+
+class CheTooltip extends React.PureComponent<Props> {
+  public render(): React.ReactElement {
+    const { content, position, children } = this.props;
+
+    return (
+      <Tooltip
+        exitDelay={3000}
+        isContentLeftAligned={true}
+        position={position ? position : TooltipPosition.right}
+        content={content}
+        style={{ border: '1px solid', borderRadius: '3px', opacity: '0.9' }}
+      >
+        {children}
+      </Tooltip>
+    );
+  }
+}
+
+export default CheTooltip;

packages/dashboard-frontend/src/pages/UserPreferences/ContainerRegistriesTab/index.tsx

@@ -275,11 +275,17 @@ export class ContainerRegistries extends React.PureComponent<Props, State> {
     const actions = [
       {
         title: 'Edit registry',
-        onClick: (event, rowIndex) => this.showOnEditRegistryModal(rowIndex),
+        onClick: (event, rowIndex) => {
+          event.stopPropagation();
+          this.showOnEditRegistryModal(rowIndex);
+        },
       },
       {
         title: 'Delete registry',
-        onClick: (event, rowIndex) => this.showOnDeleteRegistryModal(rowIndex),
+        onClick: (event, rowIndex) => {
+          event.stopPropagation();
+          this.showOnDeleteRegistryModal(rowIndex);
+        },
       },
     ];
 
@@ -342,6 +348,7 @@ export class ContainerRegistries extends React.PureComponent<Props, State> {
                 actions={actions}
                 rows={rows}
                 onSelect={(event, isSelected, rowIndex) => {
+                  event.stopPropagation();
                   this.onChangeRegistrySelection(isSelected, rowIndex);
                 }}
                 canSelectAll={true}

packages/dashboard-frontend/src/pages/UserPreferences/GitServicesTab/ProviderIcon/__tests__/ProviderIcon.spec.tsx

@@ -0,0 +1,78 @@
+/*
+ * Copyright (c) 2018-2023 Red Hat, Inc.
+ * This program and the accompanying materials are made
+ * available under the terms of the Eclipse Public License 2.0
+ * which is available at https://www.eclipse.org/legal/epl-2.0/
+ *
+ * SPDX-License-Identifier: EPL-2.0
+ *
+ * Contributors:
+ *   Red Hat, Inc. - initial API and implementation
+ */
+
+import { api } from '@eclipse-che/common';
+import React from 'react';
+import { Provider } from 'react-redux';
+import { AnyAction } from 'redux';
+import { MockStoreEnhanced } from 'redux-mock-store';
+import { ThunkDispatch } from 'redux-thunk';
+
+import { ProviderIcon } from '@/pages/UserPreferences/GitServicesTab/ProviderIcon';
+import getComponentRenderer from '@/services/__mocks__/getComponentRenderer';
+import { AppState } from '@/store';
+import { FakeStoreBuilder } from '@/store/__mocks__/storeBuilder';
+import {
+  selectProvidersWithToken,
+  selectSkipOauthProviders,
+} from '@/store/GitOauthConfig/selectors';
+
+const { createSnapshot } = getComponentRenderer(getComponent);
+
+function getComponent(
+  store: MockStoreEnhanced<AppState, ThunkDispatch<AppState, undefined, AnyAction>>,
+  gitOauth: api.GitOauthProvider,
+): React.ReactElement {
+  const state = store.getState();
+  return (
+    <Provider store={store}>
+      <ProviderIcon
+        gitProvider={gitOauth}
+        providersWithToken={selectProvidersWithToken(state)}
+        skipOauthProviders={selectSkipOauthProviders(state)}
+        requestSkipAuthorisationProviders={jest.fn()}
+        requestGitOauthConfig={jest.fn()}
+        revokeOauth={jest.fn()}
+        deleteSkipOauth={jest.fn()}
+      />
+    </Provider>
+  );
+}
+
+describe('ProviderIcon component', () => {
+  it('should render ProviderIcon component correctly when the user has been authorized successfully.', () => {
+    const gitOauth: api.GitOauthProvider = 'github';
+    const store = new FakeStoreBuilder().withGitOauthConfig([], ['github'], []).build();
+
+    const snapshot = createSnapshot(store, gitOauth);
+
+    expect(snapshot.toJSON()).toMatchSnapshot();
+  });
+
+  it('should render ProviderIcon component correctly when authorization has been rejected by user.', () => {
+    const gitOauth: api.GitOauthProvider = 'github';
+    const store = new FakeStoreBuilder().withGitOauthConfig([], [], ['github']).build();
+
+    const snapshot = createSnapshot(store, gitOauth);
+
+    expect(snapshot.toJSON()).toMatchSnapshot();
+  });
+
+  it('should render ProviderIcon component correctly when the user has not been authorized yet.', () => {
+    const gitOauth: api.GitOauthProvider = 'github';
+    const store = new FakeStoreBuilder().withGitOauthConfig([], [], []).build();
+
+    const snapshot = createSnapshot(store, gitOauth);
+
+    expect(snapshot.toJSON()).toMatchSnapshot();
+  });
+});

packages/dashboard-frontend/src/pages/UserPreferences/GitServicesTab/ProviderIcon/__tests__/__snapshots__/ProviderIcon.spec.tsx.snap

@@ -0,0 +1,79 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`ProviderIcon component should render ProviderIcon component correctly when authorization has been rejected by user. 1`] = `
+<div>
+  <svg
+    aria-hidden={true}
+    aria-labelledby={null}
+    fill="var(--pf-global--warning-color--100)"
+    height="1em"
+    role="img"
+    style={
+      {
+        "verticalAlign": "-0.125em",
+      }
+    }
+    viewBox="0 0 576 512"
+    width="1em"
+  >
+    <path
+      d="M569.517 440.013C587.975 472.007 564.806 512 527.94 512H48.054c-36.937 0-59.999-40.055-41.577-71.987L246.423 23.985c18.467-32.009 64.72-31.951 83.154 0l239.94 416.028zM288 354c-25.405 0-46 20.595-46 46s20.595 46 46 46 46-20.595 46-46-20.595-46-46-46zm-43.673-165.346l7.418 136c.347 6.364 5.609 11.346 11.982 11.346h48.546c6.373 0 11.635-4.982 11.982-11.346l7.418-136c.375-6.874-5.098-12.654-11.982-12.654h-63.383c-6.884 0-12.356 5.78-11.981 12.654z"
+    />
+  </svg>
+  <span>
+    Authorization has been rejected by user.
+  </span>
+</div>
+`;
+
+exports[`ProviderIcon component should render ProviderIcon component correctly when the user has been authorized successfully. 1`] = `
+<div>
+  <svg
+    aria-hidden={true}
+    aria-labelledby={null}
+    fill="var(--pf-global--success-color--100)"
+    height="1em"
+    role="img"
+    style={
+      {
+        "verticalAlign": "-0.125em",
+      }
+    }
+    viewBox="0 0 512 512"
+    width="1em"
+  >
+    <path
+      d="M504 256c0 136.967-111.033 248-248 248S8 392.967 8 256 119.033 8 256 8s248 111.033 248 248zM227.314 387.314l184-184c6.248-6.248 6.248-16.379 0-22.627l-22.627-22.627c-6.248-6.249-16.379-6.249-22.628 0L216 308.118l-70.059-70.059c-6.248-6.248-16.379-6.248-22.628 0l-22.627 22.627c-6.248 6.248-6.248 16.379 0 22.627l104 104c6.249 6.249 16.379 6.249 22.628.001z"
+    />
+  </svg>
+  <span>
+    User has been authorized successfully.
+  </span>
+</div>
+`;
+
+exports[`ProviderIcon component should render ProviderIcon component correctly when the user has not been authorized yet. 1`] = `
+<div>
+  <svg
+    aria-hidden={true}
+    aria-labelledby={null}
+    fill="var(--pf-global--disabled-color--100)"
+    height="1em"
+    role="img"
+    style={
+      {
+        "verticalAlign": "-0.125em",
+      }
+    }
+    viewBox="0 0 1024 1024"
+    width="1em"
+  >
+    <path
+      d="M512,896 C300.2,896 128,723.9 128,512 C128,300.3 300.2,128 512,128 C723.7,128 896,300.2 896,512 C896,723.8 723.7,896 512,896 L512,896 Z M512.1,0 C229.7,0 0,229.8 0,512 C0,794.3 229.8,1024 512.1,1024 C794.4,1024 1024,794.3 1024,512 C1024,229.7 794.4,0 512.1,0 L512.1,0 Z"
+    />
+  </svg>
+  <span>
+    User has not been authorized yet.
+  </span>
+</div>
+`;