Edit distribution lists via story settings menu

This commit is contained in:
Josh Perez 2022-07-20 20:07:09 -04:00 committed by GitHub
parent 9986d10947
commit e321e1fea8
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
42 changed files with 2403 additions and 102 deletions

View file

@ -23,6 +23,7 @@ type PropsType = {
hasXButton?: boolean;
i18n: LocalizerType;
moduleClassName?: string;
onBackButtonClick?: () => unknown;
onClose?: () => void;
title?: ReactNode;
useFocusTrap?: boolean;
@ -42,6 +43,7 @@ export function Modal({
i18n,
moduleClassName,
noMouseClose,
onBackButtonClick,
onClose = noop,
title,
theme,
@ -70,6 +72,7 @@ export function Modal({
hasXButton={hasXButton}
i18n={i18n}
moduleClassName={moduleClassName}
onBackButtonClick={onBackButtonClick}
onClose={close}
title={title}
>
@ -86,6 +89,7 @@ export function ModalWindow({
hasXButton,
i18n,
moduleClassName,
onBackButtonClick,
onClose = noop,
title,
}: Readonly<PropsType>): JSX.Element {
@ -97,7 +101,7 @@ export function ModalWindow({
const [scrolled, setScrolled] = useState(false);
const [hasOverflow, setHasOverflow] = useState(false);
const hasHeader = Boolean(hasXButton || title);
const hasHeader = Boolean(hasXButton || title || onBackButtonClick);
const getClassName = getClassNamesFor(BASE_CLASS_NAME, moduleClassName);
function handleResize({ scroll }: ContentRect) {
@ -127,14 +131,21 @@ export function ModalWindow({
}}
>
{hasHeader && (
<div className={getClassName('__header')}>
{hasXButton && (
<div
className={classNames(
getClassName('__header'),
onBackButtonClick
? getClassName('__header--with-back-button')
: null
)}
>
{onBackButtonClick && (
<button
aria-label={i18n('close')}
type="button"
className={getClassName('__close-button')}
aria-label={i18n('back')}
className={getClassName('__back-button')}
onClick={onBackButtonClick}
tabIndex={0}
onClick={onClose}
type="button"
/>
)}
{title && (
@ -147,6 +158,18 @@ export function ModalWindow({
{title}
</h1>
)}
{hasXButton && !title && (
<div className={getClassName('__title')} />
)}
{hasXButton && (
<button
aria-label={i18n('close')}
className={getClassName('__close-button')}
onClick={onClose}
tabIndex={0}
type="button"
/>
)}
</div>
)}
<Measure scroll onResize={handleResize}>