keycloak-scim/src/authentication/DuplicateFlowModal.tsx

105 lines
2.5 KiB
TypeScript
Raw Normal View History

import React, { useEffect } from "react";
import { useTranslation } from "react-i18next";
Initial version of the authentication section (#887) * initial version of create authentication screen * initial version of authentication details * added flow details labels to view header * not in use fix * create execution tree * fixed collapsable row layout * fix drag and drop expand * fix merge error * move to modal * diff and post drag and drop changes * fixed locating the parent row * move "live text" for d&d to common messages * firefox fix * initial version of the diagram * use dagre to layout automatically * moved to sperate file * conditional node * now renders subflows sequential * changed to render sequential or parallel flows * fixed render of sub flows * added button edge, drawer and selectable nodes * add requirement dropdown * also do move so we can merge * also do move so we can merge * fixed merge * added refresh * change requirement * fixed merge error * now uses the new routes * Split out routes into multiple files * Update src/authentication/AuthenticationSection.tsx Co-authored-by: Jon Koops <jonkoops@gmail.com> * Update src/authentication/FlowDetails.tsx Co-authored-by: Jon Koops <jonkoops@gmail.com> * Update src/authentication/FlowDetails.tsx Co-authored-by: Jon Koops <jonkoops@gmail.com> * Update src/authentication/FlowDetails.tsx Co-authored-by: Jon Koops <jonkoops@gmail.com> * Update src/authentication/FlowDetails.tsx Co-authored-by: Jon Koops <jonkoops@gmail.com> * fixed labels * merge fix * make execution of these parrallel * added some tests * Update src/authentication/components/FlowRequirementDropdown.tsx Co-authored-by: Jon Koops <jonkoops@gmail.com> * more review changes * fixed merge error Co-authored-by: Jon Koops <jonkoops@gmail.com>
2021-08-09 08:47:34 +00:00
import { FormProvider, useForm } from "react-hook-form";
import {
AlertVariant,
Button,
ButtonVariant,
Form,
Modal,
ModalVariant,
} from "@patternfly/react-core";
import { useAdminClient } from "../context/auth/AdminClient";
import { useAlerts } from "../components/alert/Alerts";
Initial version of the authentication section (#887) * initial version of create authentication screen * initial version of authentication details * added flow details labels to view header * not in use fix * create execution tree * fixed collapsable row layout * fix drag and drop expand * fix merge error * move to modal * diff and post drag and drop changes * fixed locating the parent row * move "live text" for d&d to common messages * firefox fix * initial version of the diagram * use dagre to layout automatically * moved to sperate file * conditional node * now renders subflows sequential * changed to render sequential or parallel flows * fixed render of sub flows * added button edge, drawer and selectable nodes * add requirement dropdown * also do move so we can merge * also do move so we can merge * fixed merge * added refresh * change requirement * fixed merge error * now uses the new routes * Split out routes into multiple files * Update src/authentication/AuthenticationSection.tsx Co-authored-by: Jon Koops <jonkoops@gmail.com> * Update src/authentication/FlowDetails.tsx Co-authored-by: Jon Koops <jonkoops@gmail.com> * Update src/authentication/FlowDetails.tsx Co-authored-by: Jon Koops <jonkoops@gmail.com> * Update src/authentication/FlowDetails.tsx Co-authored-by: Jon Koops <jonkoops@gmail.com> * Update src/authentication/FlowDetails.tsx Co-authored-by: Jon Koops <jonkoops@gmail.com> * fixed labels * merge fix * make execution of these parrallel * added some tests * Update src/authentication/components/FlowRequirementDropdown.tsx Co-authored-by: Jon Koops <jonkoops@gmail.com> * more review changes * fixed merge error Co-authored-by: Jon Koops <jonkoops@gmail.com>
2021-08-09 08:47:34 +00:00
import { NameDescription } from "./form/NameDescription";
type DuplicateFlowModalProps = {
name: string;
description: string;
toggleDialog: () => void;
onComplete: () => void;
};
export const DuplicateFlowModal = ({
name,
description,
toggleDialog,
onComplete,
}: DuplicateFlowModalProps) => {
const { t } = useTranslation("authentication");
Initial version of the authentication section (#887) * initial version of create authentication screen * initial version of authentication details * added flow details labels to view header * not in use fix * create execution tree * fixed collapsable row layout * fix drag and drop expand * fix merge error * move to modal * diff and post drag and drop changes * fixed locating the parent row * move "live text" for d&d to common messages * firefox fix * initial version of the diagram * use dagre to layout automatically * moved to sperate file * conditional node * now renders subflows sequential * changed to render sequential or parallel flows * fixed render of sub flows * added button edge, drawer and selectable nodes * add requirement dropdown * also do move so we can merge * also do move so we can merge * fixed merge * added refresh * change requirement * fixed merge error * now uses the new routes * Split out routes into multiple files * Update src/authentication/AuthenticationSection.tsx Co-authored-by: Jon Koops <jonkoops@gmail.com> * Update src/authentication/FlowDetails.tsx Co-authored-by: Jon Koops <jonkoops@gmail.com> * Update src/authentication/FlowDetails.tsx Co-authored-by: Jon Koops <jonkoops@gmail.com> * Update src/authentication/FlowDetails.tsx Co-authored-by: Jon Koops <jonkoops@gmail.com> * Update src/authentication/FlowDetails.tsx Co-authored-by: Jon Koops <jonkoops@gmail.com> * fixed labels * merge fix * make execution of these parrallel * added some tests * Update src/authentication/components/FlowRequirementDropdown.tsx Co-authored-by: Jon Koops <jonkoops@gmail.com> * more review changes * fixed merge error Co-authored-by: Jon Koops <jonkoops@gmail.com>
2021-08-09 08:47:34 +00:00
const form = useForm({
shouldUnregister: false,
});
Initial version of the authentication section (#887) * initial version of create authentication screen * initial version of authentication details * added flow details labels to view header * not in use fix * create execution tree * fixed collapsable row layout * fix drag and drop expand * fix merge error * move to modal * diff and post drag and drop changes * fixed locating the parent row * move "live text" for d&d to common messages * firefox fix * initial version of the diagram * use dagre to layout automatically * moved to sperate file * conditional node * now renders subflows sequential * changed to render sequential or parallel flows * fixed render of sub flows * added button edge, drawer and selectable nodes * add requirement dropdown * also do move so we can merge * also do move so we can merge * fixed merge * added refresh * change requirement * fixed merge error * now uses the new routes * Split out routes into multiple files * Update src/authentication/AuthenticationSection.tsx Co-authored-by: Jon Koops <jonkoops@gmail.com> * Update src/authentication/FlowDetails.tsx Co-authored-by: Jon Koops <jonkoops@gmail.com> * Update src/authentication/FlowDetails.tsx Co-authored-by: Jon Koops <jonkoops@gmail.com> * Update src/authentication/FlowDetails.tsx Co-authored-by: Jon Koops <jonkoops@gmail.com> * Update src/authentication/FlowDetails.tsx Co-authored-by: Jon Koops <jonkoops@gmail.com> * fixed labels * merge fix * make execution of these parrallel * added some tests * Update src/authentication/components/FlowRequirementDropdown.tsx Co-authored-by: Jon Koops <jonkoops@gmail.com> * more review changes * fixed merge error Co-authored-by: Jon Koops <jonkoops@gmail.com>
2021-08-09 08:47:34 +00:00
const { setValue, trigger, getValues } = form;
const adminClient = useAdminClient();
const { addAlert, addError } = useAlerts();
useEffect(() => {
setValue("description", description);
setValue("name", t("copyOf", { name }));
}, [name, description, setValue]);
const save = async () => {
await trigger();
const form = getValues();
try {
await adminClient.authenticationManagement.copyFlow({
flow: name,
2021-08-25 12:33:57 +00:00
newName: form.alias,
});
if (form.description !== description) {
const newFlow = (
await adminClient.authenticationManagement.getFlows()
2021-08-25 12:33:57 +00:00
).find((flow) => flow.alias === form.alias)!;
newFlow.description = form.description;
await adminClient.authenticationManagement.updateFlow(
{ flowId: newFlow.id! },
newFlow
);
}
addAlert(t("copyFlowSuccess"), AlertVariant.success);
} catch (error) {
addError("authentication:copyFlowError", error);
}
onComplete();
};
return (
<Modal
title={t("duplicateFlow")}
isOpen={true}
onClose={toggleDialog}
variant={ModalVariant.small}
actions={[
Initial version of the authentication section (#887) * initial version of create authentication screen * initial version of authentication details * added flow details labels to view header * not in use fix * create execution tree * fixed collapsable row layout * fix drag and drop expand * fix merge error * move to modal * diff and post drag and drop changes * fixed locating the parent row * move "live text" for d&d to common messages * firefox fix * initial version of the diagram * use dagre to layout automatically * moved to sperate file * conditional node * now renders subflows sequential * changed to render sequential or parallel flows * fixed render of sub flows * added button edge, drawer and selectable nodes * add requirement dropdown * also do move so we can merge * also do move so we can merge * fixed merge * added refresh * change requirement * fixed merge error * now uses the new routes * Split out routes into multiple files * Update src/authentication/AuthenticationSection.tsx Co-authored-by: Jon Koops <jonkoops@gmail.com> * Update src/authentication/FlowDetails.tsx Co-authored-by: Jon Koops <jonkoops@gmail.com> * Update src/authentication/FlowDetails.tsx Co-authored-by: Jon Koops <jonkoops@gmail.com> * Update src/authentication/FlowDetails.tsx Co-authored-by: Jon Koops <jonkoops@gmail.com> * Update src/authentication/FlowDetails.tsx Co-authored-by: Jon Koops <jonkoops@gmail.com> * fixed labels * merge fix * make execution of these parrallel * added some tests * Update src/authentication/components/FlowRequirementDropdown.tsx Co-authored-by: Jon Koops <jonkoops@gmail.com> * more review changes * fixed merge error Co-authored-by: Jon Koops <jonkoops@gmail.com>
2021-08-09 08:47:34 +00:00
<Button
id="modal-confirm"
key="confirm"
onClick={save}
data-testid="confirm"
>
{t("duplicate")}
</Button>,
<Button
Initial version of the authentication section (#887) * initial version of create authentication screen * initial version of authentication details * added flow details labels to view header * not in use fix * create execution tree * fixed collapsable row layout * fix drag and drop expand * fix merge error * move to modal * diff and post drag and drop changes * fixed locating the parent row * move "live text" for d&d to common messages * firefox fix * initial version of the diagram * use dagre to layout automatically * moved to sperate file * conditional node * now renders subflows sequential * changed to render sequential or parallel flows * fixed render of sub flows * added button edge, drawer and selectable nodes * add requirement dropdown * also do move so we can merge * also do move so we can merge * fixed merge * added refresh * change requirement * fixed merge error * now uses the new routes * Split out routes into multiple files * Update src/authentication/AuthenticationSection.tsx Co-authored-by: Jon Koops <jonkoops@gmail.com> * Update src/authentication/FlowDetails.tsx Co-authored-by: Jon Koops <jonkoops@gmail.com> * Update src/authentication/FlowDetails.tsx Co-authored-by: Jon Koops <jonkoops@gmail.com> * Update src/authentication/FlowDetails.tsx Co-authored-by: Jon Koops <jonkoops@gmail.com> * Update src/authentication/FlowDetails.tsx Co-authored-by: Jon Koops <jonkoops@gmail.com> * fixed labels * merge fix * make execution of these parrallel * added some tests * Update src/authentication/components/FlowRequirementDropdown.tsx Co-authored-by: Jon Koops <jonkoops@gmail.com> * more review changes * fixed merge error Co-authored-by: Jon Koops <jonkoops@gmail.com>
2021-08-09 08:47:34 +00:00
data-testid="cancel"
id="modal-cancel"
key="cancel"
variant={ButtonVariant.link}
onClick={() => {
toggleDialog();
}}
>
{t("common:cancel")}
</Button>,
]}
>
Initial version of the authentication section (#887) * initial version of create authentication screen * initial version of authentication details * added flow details labels to view header * not in use fix * create execution tree * fixed collapsable row layout * fix drag and drop expand * fix merge error * move to modal * diff and post drag and drop changes * fixed locating the parent row * move "live text" for d&d to common messages * firefox fix * initial version of the diagram * use dagre to layout automatically * moved to sperate file * conditional node * now renders subflows sequential * changed to render sequential or parallel flows * fixed render of sub flows * added button edge, drawer and selectable nodes * add requirement dropdown * also do move so we can merge * also do move so we can merge * fixed merge * added refresh * change requirement * fixed merge error * now uses the new routes * Split out routes into multiple files * Update src/authentication/AuthenticationSection.tsx Co-authored-by: Jon Koops <jonkoops@gmail.com> * Update src/authentication/FlowDetails.tsx Co-authored-by: Jon Koops <jonkoops@gmail.com> * Update src/authentication/FlowDetails.tsx Co-authored-by: Jon Koops <jonkoops@gmail.com> * Update src/authentication/FlowDetails.tsx Co-authored-by: Jon Koops <jonkoops@gmail.com> * Update src/authentication/FlowDetails.tsx Co-authored-by: Jon Koops <jonkoops@gmail.com> * fixed labels * merge fix * make execution of these parrallel * added some tests * Update src/authentication/components/FlowRequirementDropdown.tsx Co-authored-by: Jon Koops <jonkoops@gmail.com> * more review changes * fixed merge error Co-authored-by: Jon Koops <jonkoops@gmail.com>
2021-08-09 08:47:34 +00:00
<FormProvider {...form}>
<Form isHorizontal>
<NameDescription />
</Form>
</FormProvider>
</Modal>
);
};