mirrors/signal-desktop
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages 2 Wiki Activity Actions

Refactored and cleaned up Modal and friends

Browse source
This commit is contained in:
Alvaro 2022-09-29 16:40:09 -06:00 • committed by GitHub
parent f64426fbe0
commit 00a720faa9
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
31 changed files with 853 additions and 787 deletions
Download patch file Download diff file Expand all files Collapse all files

60
ts/components/ConfirmationDialog.tsx
View file

@ -7,7 +7,7 @@ import { animated } from '@react-spring/web';
import { Button, ButtonVariant } from './Button';
import type { LocalizerType } from '../types/Util';
import { ModalHost } from './ModalHost';
import { Modal, ModalWindow } from './Modal';
import { ModalPage } from './Modal';
import type { Theme } from '../util/theme';
import { useAnimated } from '../hooks/useAnimated';
@ -96,6 +96,34 @@ export const ConfirmationDialog = React.memo(
const hasActions = Boolean(actions.length);
const footer = (
<>
<Button
onClick={handleCancel}
ref={focusRef}
variant={
cancelButtonVariant ||
(hasActions ? ButtonVariant.Secondary : ButtonVariant.Primary)
}
>
{cancelText || i18n('confirmation-dialog--Cancel')}
</Button>
{actions.map((action, i) => (
<Button
key={action.text}
onClick={() => {
action.action();
close();
}}
data-action={i}
variant={getButtonVariant(action.style)}
>
{action.text}
</Button>
))}
</>
);
const modalName = `ConfirmationDialog.${dialogName}`;
return (
@ -108,41 +136,17 @@ export const ConfirmationDialog = React.memo(
theme={theme}
>
<animated.div style={modalStyles}>
<ModalWindow
<ModalPage
modalName={modalName}
hasXButton={hasXButton}
i18n={i18n}
moduleClassName={moduleClassName}
onClose={cancelAndClose}
title={title}
modalFooter={footer}
>
{children}
<Modal.ButtonFooter>
<Button
onClick={handleCancel}
ref={focusRef}
variant={
cancelButtonVariant ||
(hasActions ? ButtonVariant.Secondary : ButtonVariant.Primary)
}
>
{cancelText || i18n('confirmation-dialog--Cancel')}
</Button>
{actions.map((action, i) => (
<Button
key={action.text}
onClick={() => {
action.action();
close();
}}
data-action={i}
variant={getButtonVariant(action.style)}
>
{action.text}
</Button>
))}
</Modal.ButtonFooter>
</ModalWindow>
</ModalPage>
</animated.div>
</ModalHost>
);