debian-image-builder-frontend/src/Components/CreateImageWizard/formComponents/FileSystemConfigToggle.js
2022-02-28 15:27:09 +01:00

48 lines
1.5 KiB
JavaScript

import React, {
useState,
useEffect,
} from 'react';
import {
ToggleGroup,
ToggleGroupItem,
} from '@patternfly/react-core';
import useFormApi from '@data-driven-forms/react-form-renderer/use-form-api';
import useFieldApi from '@data-driven-forms/react-form-renderer/use-field-api';
const FileSystemConfigToggle = ({ ...props }) => {
const { change, getState } = useFormApi();
const { input } = useFieldApi(props);
const [ selected, setSelected ] =
useState(getState()?.values?.['file-system-config-toggle'] || 'auto');
useEffect(() => {
change(input.name, selected);
}, [ selected ]);
const onClick = (_, evt) => {
setSelected(evt.currentTarget.id);
};
return (
<>
<ToggleGroup
data-testid="fsc-paritioning-toggle"
aria-label="Automatic partitioning toggle">
<ToggleGroupItem
onChange={ onClick }
text="Use automatic partitioning"
buttonId="auto"
isSelected={ selected === 'auto' } />
<ToggleGroupItem
onChange={ onClick }
text="Manually configure partitions"
buttonId="manual"
isSelected={ selected === 'manual' }
data-testid="file-system-config-toggle-manual" />
</ToggleGroup>
</>
);
};
export default FileSystemConfigToggle;