Client:OAuth2: fix delete operation

packages/client/src/pages/PortalSettings/categories/developer-tools/OAuth/sub-components/DeleteDialog.js

@@ -1,71 +0,0 @@
-import React, { useEffect } from "react";
-import ModalDialog from "@docspace/components/modal-dialog";
-import Button from "@docspace/components/button";
-import styled from "styled-components";
-import { useTranslation } from "react-i18next";
-
-const StyledBodyText = styled.div`
-  line-height: 20px;
-`;
-
-const Footer = styled.div`
-  width: 100%;
-  display: flex;
-
-  button {
-    width: 100%;
-  }
-  button:first-of-type {
-    margin-right: 10px;
-  }
-`;
-
-const DeleteDialog = ({
-  visible,
-  onClose,
-  header,
-  handleSubmit,
-  currentClient,
-}) => {
-  const onKeyPress = (e) =>
-    (e.key === "Esc" || e.key === "Escape") && onClose();
-
-  const { t } = useTranslation(["Common", "EmptyTrashDialog"]);
-
-  useEffect(() => {
-    window.addEventListener("keyup", onKeyPress);
-    return () => window.removeEventListener("keyup", onKeyPress);
-  });
-
-  const handleDeleteClick = () => {
-    handleSubmit(currentClient.id);
-    onClose();
-  };
-
-  return (
-    <ModalDialog visible={visible} onClose={onClose} displayType="modal">
-      <ModalDialog.Header>{`Delete profile`}</ModalDialog.Header>
-      <ModalDialog.Body>
-        <StyledBodyText>{`Do you want to delete profile: ${currentClient.name}`}</StyledBodyText>
-      </ModalDialog.Body>
-
-      <ModalDialog.Footer>
-        <Footer>
-          <Button
-            label={t("Common:Delete")}
-            size="normal"
-            primary={true}
-            onClick={handleDeleteClick}
-          />
-          <Button
-            label={t("Common:CancelButton")}
-            size="normal"
-            onClick={onClose}
-          />
-        </Footer>
-      </ModalDialog.Footer>
-    </ModalDialog>
-  );
-};
-
-export default DeleteDialog;

packages/client/src/store/OAuthStore.ts

@@ -41,9 +41,6 @@ export interface OAuthStoreProps {
   previewDialogVisible: boolean;
   setPreviewDialogVisible: (value: boolean) => void;
 
-  deleteDialogVisible: boolean;
-  setDeleteDialogVisible: (value: boolean) => void;
-
   clientsIsLoading: boolean;
   setClientsIsLoading: (value: boolean) => void;
 
@@ -64,7 +61,7 @@ export interface OAuthStoreProps {
 
   regenerateSecret: (clientId: string) => Promise<string | undefined>;
 
-  deleteClient: (clientId: string) => Promise<void>;
+  deleteClient: (clientId: string[]) => Promise<void>;
 
   currentPage: number;
   nextPage: number | null;
@@ -106,7 +103,6 @@ class OAuthStore implements OAuthStoreProps {
 
   infoDialogVisible: boolean = false;
   previewDialogVisible: boolean = false;
-  deleteDialogVisible: boolean = false;
 
   selection: string[] = [];
 
@@ -136,10 +132,6 @@ class OAuthStore implements OAuthStoreProps {
     this.previewDialogVisible = value;
   };
 
-  setDeleteDialogVisible = (value: boolean) => {
-    this.deleteDialogVisible = value;
-  };
-
   setSelection = (clientId: string) => {
     if (!clientId) {
       this.selection = [];
@@ -301,9 +293,24 @@ class OAuthStore implements OAuthStoreProps {
     }
   };
 
-  deleteClient = async (clientId: string) => {
+  deleteClient = async (clientsId: string[]) => {
     try {
-      await deleteClient(clientId);
+      const requests: Promise<void>[] = [];
+
+      clientsId.forEach((id) => {
+        this.setActiveClient(id);
+        requests.push(deleteClient(id));
+      });
+
+      await Promise.all(requests);
+
+      runInAction(() => {
+        this.clients = this.clients.filter(
+          (c) => !clientsId.includes(c.clientId)
+        );
+      });
+
+      this.setActiveClient("");
     } catch (e) {
       console.log(e);
     }
@@ -339,11 +346,12 @@ class OAuthStore implements OAuthStoreProps {
     const onDelete = () => {
       this.setInfoDialogVisible(false);
       this.setPreviewDialogVisible(false);
-      if (!isGroupContext) {
-        this.setBufferSelection(clientId);
-      }
 
-      this.setDeleteDialogVisible(true);
+      if (!isGroupContext) {
+        this.deleteClient([clientId]);
+      } else {
+        this.deleteClient(this.selection);
+      }
     };
 
     const onShowInfo = () => {
@@ -361,6 +369,7 @@ class OAuthStore implements OAuthStoreProps {
     const onEnable = async (status: boolean) => {
       this.setInfoDialogVisible(false);
       this.setPreviewDialogVisible(false);
+
       if (isGroupContext) {
         try {
           const actions: Promise<void>[] = [];