Client:PortalSettings:OAuth2: add delete client dialog
This commit is contained in:
parent
edc3636ba0
commit
82e0c8e3e9
@ -17,6 +17,8 @@
|
||||
"Creator": "Creator",
|
||||
"ClientHelpButton": "Credentials for using OAth 2.0 as your Authentication type.<br/> <strong>Note</strong>: Any enterprise admin who knows the app's client ID will be able to retrieve information about the app including app name, authentication type, app scopes and redirect URI.",
|
||||
"CodeVerifier": "Code verifier",
|
||||
"DeleteHeader": "Delete application",
|
||||
"DeleteDescription": "If you delete this application, all active consents and authorization will be revoked. If the user tries to open the consent screen for this app, an error will be thrown in the document space and the user will be redirected to the specified redirect URL.",
|
||||
"DisableApplication": "Disable application",
|
||||
"DisableApplicationDescription": "If you disable this application, all active consents and authorization will be disabled. If necessary, you can later enable the disabled application.",
|
||||
"EditApp": "Edit application",
|
||||
|
@ -19,6 +19,7 @@ export interface OAuthProps {
|
||||
infoDialogVisible?: boolean;
|
||||
previewDialogVisible?: boolean;
|
||||
disableDialogVisible?: boolean;
|
||||
deleteDialogVisible?: boolean;
|
||||
isInit: boolean;
|
||||
setIsInit: (value: boolean) => void;
|
||||
}
|
||||
|
@ -18,6 +18,7 @@ import InfoDialog from "./sub-components/InfoDialog";
|
||||
import PreviewDialog from "./sub-components/PreviewDialog";
|
||||
import OAuthLoader from "./sub-components/List/Loader";
|
||||
import DisableDialog from "./sub-components/DisableDialog";
|
||||
import DeleteDialog from "./sub-components/DeleteDialog";
|
||||
|
||||
const MIN_LOADER_TIME = 500;
|
||||
|
||||
@ -34,6 +35,7 @@ const OAuth = ({
|
||||
isInit,
|
||||
setIsInit,
|
||||
disableDialogVisible,
|
||||
deleteDialogVisible,
|
||||
}: OAuthProps) => {
|
||||
const { t } = useTranslation(["OAuth"]);
|
||||
|
||||
@ -101,6 +103,7 @@ const OAuth = ({
|
||||
{infoDialogVisible && <InfoDialog visible={infoDialogVisible} />}
|
||||
{disableDialogVisible && <DisableDialog />}
|
||||
{previewDialogVisible && <PreviewDialog visible={previewDialogVisible} />}
|
||||
{deleteDialogVisible && <DeleteDialog />}
|
||||
</OAuthContainer>
|
||||
);
|
||||
};
|
||||
@ -120,6 +123,7 @@ export default inject(
|
||||
isInit,
|
||||
setIsInit,
|
||||
disableDialogVisible,
|
||||
deleteDialogVisible,
|
||||
} = oauthStore;
|
||||
return {
|
||||
viewAs,
|
||||
@ -134,6 +138,7 @@ export default inject(
|
||||
isInit,
|
||||
setIsInit,
|
||||
disableDialogVisible,
|
||||
deleteDialogVisible,
|
||||
};
|
||||
}
|
||||
)(observer(OAuth));
|
||||
|
@ -9,6 +9,8 @@ import {
|
||||
} from "@docspace/common/utils/oauth/interfaces";
|
||||
import { AuthenticationMethod } from "@docspace/common/utils/oauth/enums";
|
||||
|
||||
import ResetDialog from "../ResetDialog";
|
||||
|
||||
import BasicBlock from "./components/BasicBlock";
|
||||
import ClientBlock from "./components/ClientBlock";
|
||||
import SupportBlock from "./components/SupportBlock";
|
||||
@ -20,7 +22,6 @@ import { StyledContainer } from "./ClientForm.styled";
|
||||
|
||||
import { ClientFormProps, ClientStore } from "./ClientForm.types";
|
||||
import ClientFormLoader from "./Loader";
|
||||
import ResetDialog from "../ResetDialog";
|
||||
|
||||
export function isValidUrl(url: string) {
|
||||
try {
|
||||
|
@ -0,0 +1,100 @@
|
||||
import React from "react";
|
||||
import { inject, observer } from "mobx-react";
|
||||
import { useTranslation, Trans } from "react-i18next";
|
||||
|
||||
// @ts-ignore
|
||||
import ModalDialog from "@docspace/components/modal-dialog";
|
||||
// @ts-ignore
|
||||
import Button from "@docspace/components/button";
|
||||
// @ts-ignore
|
||||
import toastr from "@docspace/components/toast/toastr";
|
||||
|
||||
// @ts-ignore
|
||||
import { OAuthStoreProps } from "SRC_DIR/store/OAuthStore";
|
||||
|
||||
interface DeleteClientDialogProps {
|
||||
isVisible?: boolean;
|
||||
onClose?: () => void;
|
||||
onDisable?: () => Promise<void>;
|
||||
}
|
||||
|
||||
const DeleteClientDialog = (props: DeleteClientDialogProps) => {
|
||||
const { t, ready } = useTranslation(["OAuth", "Common"]);
|
||||
const { isVisible, onClose, onDisable } = props;
|
||||
|
||||
const [isRequestRunning, setIsRequestRunning] = React.useState(false);
|
||||
|
||||
const onDisableClick = async () => {
|
||||
try {
|
||||
setIsRequestRunning(true);
|
||||
await onDisable?.();
|
||||
|
||||
setIsRequestRunning(true);
|
||||
onClose?.();
|
||||
} catch (error) {
|
||||
toastr.error(error);
|
||||
onClose?.();
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<ModalDialog
|
||||
isLoading={!ready}
|
||||
visible={isVisible}
|
||||
onClose={onClose}
|
||||
displayType="modal"
|
||||
>
|
||||
<ModalDialog.Header>{t("DeleteHeader")}</ModalDialog.Header>
|
||||
<ModalDialog.Body>
|
||||
<Trans t={t} i18nKey="DeleteDescription" ns="OAuth" />
|
||||
</ModalDialog.Body>
|
||||
<ModalDialog.Footer>
|
||||
<Button
|
||||
// @ts-ignore
|
||||
className="delete-button"
|
||||
key="DeletePortalBtn"
|
||||
label={t("Common:OkButton")}
|
||||
size="normal"
|
||||
scale
|
||||
primary={true}
|
||||
isLoading={isRequestRunning}
|
||||
onClick={onDisableClick}
|
||||
/>
|
||||
<Button
|
||||
// @ts-ignore
|
||||
className="cancel-button"
|
||||
key="CancelDeleteBtn"
|
||||
label={t("Common:CancelButton")}
|
||||
size="normal"
|
||||
scale
|
||||
isDisabled={isRequestRunning}
|
||||
onClick={onClose}
|
||||
/>
|
||||
</ModalDialog.Footer>
|
||||
</ModalDialog>
|
||||
);
|
||||
};
|
||||
|
||||
export default inject(({ oauthStore }: { oauthStore: OAuthStoreProps }) => {
|
||||
const {
|
||||
bufferSelection,
|
||||
setDeleteDialogVisible,
|
||||
setActiveClient,
|
||||
setSelection,
|
||||
deleteClient,
|
||||
deleteDialogVisible,
|
||||
} = oauthStore;
|
||||
|
||||
const onClose = () => {
|
||||
setDeleteDialogVisible(false);
|
||||
};
|
||||
|
||||
const onDisable = async () => {
|
||||
setActiveClient(bufferSelection.clientId);
|
||||
await deleteClient([bufferSelection.clientId]);
|
||||
setActiveClient("");
|
||||
setSelection("");
|
||||
};
|
||||
|
||||
return { isVisible: deleteDialogVisible, onClose, onDisable };
|
||||
})(observer(DeleteClientDialog));
|
@ -12,13 +12,13 @@ import toastr from "@docspace/components/toast/toastr";
|
||||
// @ts-ignore
|
||||
import { OAuthStoreProps } from "SRC_DIR/store/OAuthStore";
|
||||
|
||||
interface DisableClientDialog {
|
||||
interface DisableClientDialogProps {
|
||||
isVisible?: boolean;
|
||||
onClose?: () => void;
|
||||
onDisable?: () => Promise<void>;
|
||||
}
|
||||
|
||||
const DisableClientDialog = (props: DisableClientDialog) => {
|
||||
const DisableClientDialog = (props: DisableClientDialogProps) => {
|
||||
const { t, ready } = useTranslation(["OAuth", "Common"]);
|
||||
const { isVisible, onClose, onDisable } = props;
|
||||
|
||||
|
@ -13,13 +13,13 @@ import toastr from "@docspace/components/toast/toastr";
|
||||
// @ts-ignore
|
||||
import { OAuthStoreProps } from "SRC_DIR/store/OAuthStore";
|
||||
|
||||
interface DisableClientDialog {
|
||||
interface ResetDialogProps {
|
||||
isVisible?: boolean;
|
||||
onClose?: () => void;
|
||||
onReset?: (id: string) => Promise<void>;
|
||||
}
|
||||
|
||||
const DisableClientDialog = (props: DisableClientDialog) => {
|
||||
const ResetDialog = (props: ResetDialogProps) => {
|
||||
const { id } = useParams();
|
||||
|
||||
const { t, ready } = useTranslation(["OAuth", "Common"]);
|
||||
@ -91,4 +91,4 @@ export default inject(({ oauthStore }: { oauthStore: OAuthStoreProps }) => {
|
||||
};
|
||||
|
||||
return { isVisible: resetDialogVisible, onClose, onReset };
|
||||
})(observer(DisableClientDialog));
|
||||
})(observer(ResetDialog));
|
||||
|
@ -484,6 +484,7 @@ class OAuthStore implements OAuthStoreProps {
|
||||
this.setPreviewDialogVisible(false);
|
||||
this.setInfoDialogVisible(true);
|
||||
this.setDisableDialogVisible(false);
|
||||
this.setDeleteDialogVisible(false);
|
||||
};
|
||||
|
||||
const onRevoke = () => {
|
||||
@ -492,6 +493,7 @@ class OAuthStore implements OAuthStoreProps {
|
||||
this.setInfoDialogVisible(false);
|
||||
this.setRevokeDialogVisible(true);
|
||||
this.setDisableDialogVisible(false);
|
||||
this.setDeleteDialogVisible(false);
|
||||
};
|
||||
|
||||
const onDisable = () => {
|
||||
@ -500,6 +502,7 @@ class OAuthStore implements OAuthStoreProps {
|
||||
this.setInfoDialogVisible(false);
|
||||
this.setRevokeDialogVisible(false);
|
||||
this.setDisableDialogVisible(true);
|
||||
this.setDeleteDialogVisible(false);
|
||||
};
|
||||
|
||||
const openOption = {
|
||||
@ -548,25 +551,29 @@ class OAuthStore implements OAuthStoreProps {
|
||||
}
|
||||
|
||||
const onDelete = () => {
|
||||
this.setInfoDialogVisible(false);
|
||||
this.setBufferSelection(clientId);
|
||||
this.setPreviewDialogVisible(false);
|
||||
|
||||
if (!isGroupContext) {
|
||||
this.deleteClient([clientId]);
|
||||
} else {
|
||||
this.deleteClient(this.selection);
|
||||
}
|
||||
this.setInfoDialogVisible(false);
|
||||
this.setRevokeDialogVisible(false);
|
||||
this.setDisableDialogVisible(false);
|
||||
this.setDeleteDialogVisible(true);
|
||||
};
|
||||
|
||||
const onShowPreview = () => {
|
||||
this.setBufferSelection(clientId);
|
||||
this.setInfoDialogVisible(false);
|
||||
this.setPreviewDialogVisible(true);
|
||||
this.setInfoDialogVisible(false);
|
||||
this.setRevokeDialogVisible(false);
|
||||
this.setDisableDialogVisible(false);
|
||||
this.setDeleteDialogVisible(false);
|
||||
};
|
||||
|
||||
const onEnable = async (status: boolean) => {
|
||||
this.setInfoDialogVisible(false);
|
||||
this.setPreviewDialogVisible(false);
|
||||
this.setInfoDialogVisible(false);
|
||||
this.setRevokeDialogVisible(false);
|
||||
this.setDisableDialogVisible(false);
|
||||
this.setDeleteDialogVisible(false);
|
||||
|
||||
if (isGroupContext) {
|
||||
try {
|
||||
|
Loading…
Reference in New Issue
Block a user