ChannelPopover: cancel dismisses popover

This commit is contained in:
Liam Fitzgerald 2021-04-19 15:58:44 +10:00
parent 1b1d7e9e80
commit c92753d1ed
No known key found for this signature in database
GPG Key ID: D390E12C61D1CFFB
2 changed files with 6 additions and 5 deletions

View File

@ -90,8 +90,8 @@ export function FormGroupChild(props: { id: string }) {
return <Box display="none" />; return <Box display="none" />;
} }
export function FormGroup(props: PropFunc<typeof Box>) { export function FormGroup(props: { onReset?: () => void; } & PropFunc<typeof Box>) {
const { children, ...rest } = props; const { children, onReset, ...rest } = props;
const [submits, setSubmits] = useState({} as { [id: string]: SubmitHandler }); const [submits, setSubmits] = useState({} as { [id: string]: SubmitHandler });
const [resets, setResets] = useState({} as Record<string, () => void>); const [resets, setResets] = useState({} as Record<string, () => void>);
const [dirty, setDirty] = useState({} as Record<string, boolean>); const [dirty, setDirty] = useState({} as Record<string, boolean>);
@ -102,7 +102,8 @@ export function FormGroup(props: PropFunc<typeof Box>) {
const resetAll = useCallback(() => { const resetAll = useCallback(() => {
_.map(resets, (r) => r()); _.map(resets, (r) => r());
}, [resets]); onReset && onReset();
}, [resets, onReset]);
const submitAll = useCallback(async () => { const submitAll = useCallback(async () => {
await Promise.all( await Promise.all(
@ -160,7 +161,7 @@ export function FormGroup(props: PropFunc<typeof Box>) {
borderTop="1" borderTop="1"
borderTopColor="washedGray" borderTopColor="washedGray"
> >
<Button disabled={!isDirty} onClick={resetAll}>Cancel</Button> <Button onClick={resetAll}>Cancel</Button>
<StatelessAsyncButton <StatelessAsyncButton
onClick={submitAll} onClick={submitAll}
disabled={hasErrors || !isDirty} disabled={hasErrors || !isDirty}

View File

@ -84,7 +84,7 @@ export function ChannelPopoverRoutes(props: ChannelPopoverRoutesProps) {
isOwner={isOwner} isOwner={isOwner}
baseUrl={props.baseUrl} baseUrl={props.baseUrl}
/> />
<FormGroup height="100%" overflowY="auto" pt="5" flexGrow={1}> <FormGroup onReset={onDismiss} height="100%" overflowY="auto" pt="5" flexGrow={1}>
<ChannelNotifications {...props} /> <ChannelNotifications {...props} />
{!isOwner && ( {!isOwner && (
<Col mx="4" mb="6" flexShrink={0}> <Col mx="4" mb="6" flexShrink={0}>