diff options
| author | Oskar Nyberg <oskar@mullvad.net> | 2023-12-01 10:17:37 +0100 |
|---|---|---|
| committer | Oskar Nyberg <oskar@mullvad.net> | 2024-01-29 09:33:49 +0100 |
| commit | 5cb2625d8c56e9803d3a0b5df6f2d8a621039fc4 (patch) | |
| tree | b287a739a24dad42e39062622e4fc8b8eae5db2f | |
| parent | bc7da5b1e4dc74ea3efc8bfbf9a499738f2da251 (diff) | |
| download | mullvadvpn-5cb2625d8c56e9803d3a0b5df6f2d8a621039fc4.tar.xz mullvadvpn-5cb2625d8c56e9803d3a0b5df6f2d8a621039fc4.zip | |
Allow multiple paragraphes in InfoButton
| -rw-r--r-- | gui/src/renderer/components/InfoButton.tsx | 2 | ||||
| -rw-r--r-- | gui/src/renderer/components/Modal.tsx | 8 |
2 files changed, 7 insertions, 3 deletions
diff --git a/gui/src/renderer/components/InfoButton.tsx b/gui/src/renderer/components/InfoButton.tsx index 35e0849cf7..8807356d79 100644 --- a/gui/src/renderer/components/InfoButton.tsx +++ b/gui/src/renderer/components/InfoButton.tsx @@ -33,7 +33,7 @@ export function InfoIcon(props: IInfoIconProps) { } interface IInfoButtonProps extends React.HTMLAttributes<HTMLButtonElement> { - message?: string; + message?: string | Array<string>; children?: React.ReactNode; size?: number; } diff --git a/gui/src/renderer/components/Modal.tsx b/gui/src/renderer/components/Modal.tsx index e87e2113f2..60b7dd1473 100644 --- a/gui/src/renderer/components/Modal.tsx +++ b/gui/src/renderer/components/Modal.tsx @@ -156,7 +156,7 @@ const ModalAlertButtonContainer = styled.div({ interface IModalAlertProps { type?: ModalAlertType; iconColor?: string; - message?: string; + message?: string | Array<string>; buttons: React.ReactNode[]; children?: React.ReactNode; close?: () => void; @@ -252,6 +252,9 @@ class ModalAlertImpl extends React.Component<IModalAlertImplProps, IModalAlertSt } private renderModal() { + const messages = + typeof this.props.message === 'string' ? [this.props.message] : this.props.message; + return ( <BackAction action={this.close}> <ModalBackground $visible={this.state.visible && !this.props.closing}> @@ -268,7 +271,8 @@ class ModalAlertImpl extends React.Component<IModalAlertImplProps, IModalAlertSt {this.props.type && ( <ModalAlertIcon>{this.renderTypeIcon(this.props.type)}</ModalAlertIcon> )} - {this.props.message && <ModalMessage>{this.props.message}</ModalMessage>} + {messages && + messages.map((message) => <ModalMessage key={message}>{message}</ModalMessage>)} {this.props.children} </StyledCustomScrollbars> |