fix(Editor): open new step upon step creation
This commit is contained in:
@@ -41,8 +41,11 @@ function updateHandlerFactory(flowId: string, previousStepId: string) {
|
|||||||
export default function Editor(props: EditorProps): React.ReactElement {
|
export default function Editor(props: EditorProps): React.ReactElement {
|
||||||
const [updateStep] = useMutation(UPDATE_STEP);
|
const [updateStep] = useMutation(UPDATE_STEP);
|
||||||
const [createStep, { loading: creationInProgress }] = useMutation(CREATE_STEP);
|
const [createStep, { loading: creationInProgress }] = useMutation(CREATE_STEP);
|
||||||
const [currentStep, setCurrentStep] = React.useState<number | null>(0);
|
|
||||||
const { flow } = props;
|
const { flow } = props;
|
||||||
|
const [triggerStep] = flow.steps;
|
||||||
|
|
||||||
|
const [currentStepId, setCurrentStepId] = React.useState<string | null>(triggerStep.id);
|
||||||
|
|
||||||
const onStepChange = React.useCallback(
|
const onStepChange = React.useCallback(
|
||||||
(step: any) => {
|
(step: any) => {
|
||||||
@@ -68,7 +71,7 @@ export default function Editor(props: EditorProps): React.ReactElement {
|
|||||||
);
|
);
|
||||||
|
|
||||||
const addStep = React.useCallback(
|
const addStep = React.useCallback(
|
||||||
(previousStepId) => {
|
async (previousStepId) => {
|
||||||
const mutationInput = {
|
const mutationInput = {
|
||||||
previousStep: {
|
previousStep: {
|
||||||
id: previousStepId,
|
id: previousStepId,
|
||||||
@@ -78,10 +81,13 @@ export default function Editor(props: EditorProps): React.ReactElement {
|
|||||||
},
|
},
|
||||||
};
|
};
|
||||||
|
|
||||||
createStep({
|
const createdStep = await createStep({
|
||||||
variables: { input: mutationInput },
|
variables: { input: mutationInput },
|
||||||
update: updateHandlerFactory(flow.id, previousStepId),
|
update: updateHandlerFactory(flow.id, previousStepId),
|
||||||
});
|
});
|
||||||
|
const createdStepId = createdStep.data.createStep.id;
|
||||||
|
|
||||||
|
setCurrentStepId(createdStepId);
|
||||||
},
|
},
|
||||||
[createStep, flow.id]
|
[createStep, flow.id]
|
||||||
);
|
);
|
||||||
@@ -102,9 +108,9 @@ export default function Editor(props: EditorProps): React.ReactElement {
|
|||||||
key={step.id}
|
key={step.id}
|
||||||
step={step}
|
step={step}
|
||||||
index={index + 1}
|
index={index + 1}
|
||||||
collapsed={currentStep !== index}
|
collapsed={currentStepId !== step.id}
|
||||||
onOpen={() => setCurrentStep(index)}
|
onOpen={() => setCurrentStepId(step.id)}
|
||||||
onClose={() => setCurrentStep(null)}
|
onClose={() => setCurrentStepId(null)}
|
||||||
onChange={onStepChange}
|
onChange={onStepChange}
|
||||||
/>
|
/>
|
||||||
|
|
||||||
|
@@ -8,6 +8,7 @@ export const CREATE_STEP = gql`
|
|||||||
key
|
key
|
||||||
appKey
|
appKey
|
||||||
parameters
|
parameters
|
||||||
|
position
|
||||||
status
|
status
|
||||||
connection {
|
connection {
|
||||||
id
|
id
|
||||||
|
Reference in New Issue
Block a user