add withFlash() context HOC

This commit is contained in:
Dane Everitt 2020-08-01 19:44:50 -07:00
parent b92c97060b
commit 0c7f118f45
No known key found for this signature in database
GPG key ID: EEA66103B3D71F53
2 changed files with 30 additions and 6 deletions

View file

@ -9,23 +9,22 @@ import tw from 'twin.macro';
import Button from '@/components/elements/Button';
import useServer from '@/plugins/useServer';
import useFileManagerSwr from '@/plugins/useFileManagerSwr';
import useFlash from '@/plugins/useFlash';
import withFlash, { WithFlashProps } from '@/hoc/withFlash';
interface FormikValues {
name: string;
}
type Props = RequiredModalProps & { files: string[]; useMoveTerminology?: boolean };
type OwnProps = WithFlashProps & RequiredModalProps & { files: string[]; useMoveTerminology?: boolean };
export default ({ files, useMoveTerminology, ...props }: Props) => {
const RenameFileModal = ({ flash, files, useMoveTerminology, ...props }: OwnProps) => {
const { uuid } = useServer();
const { mutate } = useFileManagerSwr();
const { clearFlashes, clearAndAddHttpError } = useFlash();
const directory = ServerContext.useStoreState(state => state.files.directory);
const setSelectedFiles = ServerContext.useStoreActions(actions => actions.files.setSelectedFiles);
const submit = ({ name }: FormikValues, { setSubmitting }: FormikHelpers<FormikValues>) => {
clearFlashes('files');
flash.clearFlashes('files');
const len = name.split('/').length;
if (files.length === 1) {
@ -51,7 +50,7 @@ export default ({ files, useMoveTerminology, ...props }: Props) => {
.catch(error => {
mutate();
setSubmitting(false);
clearAndAddHttpError({ key: 'files', error });
flash.clearAndAddHttpError({ key: 'files', error });
})
.then(() => props.onDismissed());
};
@ -96,3 +95,5 @@ export default ({ files, useMoveTerminology, ...props }: Props) => {
</Formik>
);
};
export default withFlash(RenameFileModal);

View file

@ -0,0 +1,23 @@
import React from 'react';
import useFlash from '@/plugins/useFlash';
import { Actions } from 'easy-peasy';
import { ApplicationStore } from '@/state';
export interface WithFlashProps {
flash: Actions<ApplicationStore>['flashes'];
}
function withFlash<TOwnProps> (Component: React.ComponentType<TOwnProps & WithFlashProps>): React.ComponentType<TOwnProps> {
return (props: TOwnProps) => {
const { addError, addFlash, clearFlashes, clearAndAddHttpError } = useFlash();
return (
<Component
flash={{ addError, addFlash, clearFlashes, clearAndAddHttpError }}
{...props}
/>
);
};
}
export default withFlash;