Add interaction to MethodRow stories

This commit is contained in:
Koen Vlaswinkel
2023-10-20 10:38:44 +02:00
parent d20cf92eea
commit 91f6772ab9

View File

@@ -1,4 +1,5 @@
import * as React from "react";
import { useCallback, useEffect, useState } from "react";
import { Meta, StoryFn } from "@storybook/react";
@@ -20,12 +21,33 @@ export default {
} as Meta<typeof MethodRowComponent>;
const Template: StoryFn<typeof MethodRowComponent> = (args) => {
const [modeledMethods, setModeledMethods] = useState<ModeledMethod[]>(
args.modeledMethods,
);
useEffect(() => {
setModeledMethods(args.modeledMethods);
}, [args.modeledMethods]);
const handleChange = useCallback(
(methodSignature: string, modeledMethods: ModeledMethod[]) => {
args.onChange(methodSignature, modeledMethods);
setModeledMethods(modeledMethods);
},
[args],
);
const gridTemplateColumns = args.viewState?.showMultipleModels
? MULTIPLE_MODELS_GRID_TEMPLATE_COLUMNS
: SINGLE_MODEL_GRID_TEMPLATE_COLUMNS;
return (
<DataGrid gridTemplateColumns={gridTemplateColumns}>
<MethodRowComponent {...args} />
<MethodRowComponent
{...args}
modeledMethods={modeledMethods}
onChange={handleChange}
/>
</DataGrid>
);
};