D10234.1767379022.diff
No OneTemporary
Actions

Size

1 KB

Referenced Files

None

Subscribers

None

D10234.1767379022.diff
View Options

	diff --git a/web/modals/modal.css b/web/modals/modal.css
	--- a/web/modals/modal.css
	+++ b/web/modals/modal.css
	@@ -63,6 +63,10 @@
	color: var(--modal-fg);
	}

	+.subheaderContainer {
	+ margin-top: 16px;
	+}
	+
	.modalContentContainer {
	padding: 16px 32px 24px;
	}
	diff --git a/web/modals/modal.react.js b/web/modals/modal.react.js
	--- a/web/modals/modal.react.js
	+++ b/web/modals/modal.react.js
	@@ -22,6 +22,7 @@
	+size?: ModalSize,
	+modalHeaderCentered?: boolean,
	+secondaryHeaderButton?: React.Node,
	+ +subheader?: React.Node,
	+primaryButton?: React.Node,
	};

	@@ -41,6 +42,7 @@
	withCloseButton = true,
	modalHeaderCentered = false,
	secondaryHeaderButton,
	+ subheader,
	primaryButton,
	} = props;

	@@ -90,6 +92,14 @@
	return <h2 className={css.subtitle}>{subtitle}</h2>;
	}, [subtitle]);

	+ const subheaderContainer = React.useMemo(() => {
	+ if (!subheader) {
	+ return null;
	+ }
	+
	+ return <div className={css.subheaderContainer}>{subheader}</div>;
	+ }, [subheader]);
	+
	const buttonContainer = React.useMemo(() => {
	if (!primaryButton) {
	return null;
	@@ -117,6 +127,7 @@
	</div>
	{subtitleNode}
	</div>
	+ {subheaderContainer}
	<div className={css.modalContentContainer}>{children}</div>
	{buttonContainer}
	</div>
	@@ -131,6 +142,7 @@
	modalHeader,
	name,
	onClose,
	+ subheaderContainer,
	subtitleNode,
	],
	);