From 9159efb79ede1889877f59153022d7a4c83a5200 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Jes=C3=BAs=20Espino?= Date: Mon, 1 Aug 2022 13:12:11 +0200 Subject: [PATCH] Showing the right confirmation modals on channel-board linking (#3453) * Showing the right confirmation modals on channel-board linking * Addressing PR review channges * Fixing linter * Fixing another linter error --- .../webapp/src/components/boardSelector.tsx | 18 ++++++++++++++---- webapp/i18n/en.json | 12 ++++++++---- .../src/components/confirmationDialogBox.scss | 1 + .../src/components/shareBoard/shareBoard.scss | 8 ++++++++ .../src/components/shareBoard/shareBoard.tsx | 18 ++++++++++++++---- 5 files changed, 45 insertions(+), 12 deletions(-) diff --git a/mattermost-plugin/webapp/src/components/boardSelector.tsx b/mattermost-plugin/webapp/src/components/boardSelector.tsx index e4fba9dce..8390db17f 100644 --- a/mattermost-plugin/webapp/src/components/boardSelector.tsx +++ b/mattermost-plugin/webapp/src/components/boardSelector.tsx @@ -112,6 +112,19 @@ const BoardSelector = () => { dispatch(setLinkToChannel('')) } + let confirmationSubText + if (showLinkBoardConfirmation?.channelId !== '') { + confirmationSubText = intl.formatMessage({ + id: 'boardSelector.confirm-link-board-subtext-with-other-channel', + defaultMessage: 'Linking the "{boardName}" board to this channel would give all members of this channel "Editor" access to the board.\n\nAdditionally, this board is linked to another channel, and will be unlinked from the other channel when you link it here.\n\nAre you sure you want to link it?' + }, {boardName: showLinkBoardConfirmation?.title}) + } else { + confirmationSubText = intl.formatMessage({ + id: 'boardSelector.confirm-link-board-subtext', + defaultMessage: 'Linking the "{boardName}" board to this channel would give all members of this channel "Editor" access to the board.\n\nAre you sure you want to link it?' + }, {boardName: showLinkBoardConfirmation?.title}) + } + return (
{ linkBoard(showLinkBoardConfirmation, true), onClose: () => setShowLinkBoardConfirmation(null), diff --git a/webapp/i18n/en.json b/webapp/i18n/en.json index 4433e4365..ea49da266 100644 --- a/webapp/i18n/en.json +++ b/webapp/i18n/en.json @@ -307,6 +307,7 @@ "boardSelector.confirm-link-board": "Link board to channel", "boardSelector.confirm-link-board-button": "Yes, link board", "boardSelector.confirm-link-board-subtext": "Linking the \"{boardName}\" board to this channel would give all members of this channel \"Editor\" access to the board. Are you sure you want to link it?", + "boardSelector.confirm-link-board-subtext-with-other-channel": "Linking the \"{boardName}\" board to this channel would give all members of this channel \"Editor\" access to the board. Additionally, this board is linked to another channel, and will be unlinked from the other channel when you link it here. Are you sure you want to link it?", "boardSelector.create-a-board": "Create a board", "boardSelector.link": "Link", "boardSelector.search-for-boards": "Search for boards", @@ -358,9 +359,12 @@ "share-board.publish": "Publish", "share-board.share": "Share", "shareBoard.channels-select-group": "Channels", - "shareBoard.confirm-link-public-channel": "You're adding a public channel", - "shareBoard.confirm-link-public-channel-button": "Yes, add public channel", - "shareBoard.confirm-link-public-channel-subtext": "Anyone who joins that public channel will now get “Editor” access to the board, are you sure you want to proceed?", + "shareBoard.confirm-link-channel": "Link board to channel", + "shareBoard.confirm-link-channel-button": "Yes, link here", + "shareBoard.confirm-link-channel-button-with-other-channel": "Yes, unlink and link here", + "shareBoard.confirm-link-channel-subtext": "When you link a channel to a board, all members of the channel (existing and new) will be able to edit it. Are you sure you want to link it?", + "shareBoard.confirm-link-channel-subtext-with-other-channel": "When you link a channel to a board, all members of the channel (existing and new) will be able to edit it. This board is currently linked to another channel. It will be unlinked if you choose to link it here. Are you sure you want to link it?", + "shareBoard.confirm-unlink.title": "Unlink channel from board", "shareBoard.confirm-unlink.body": "When you unlink a channel from a board, all members of the channel (existing and new) will loose access to it unless they are given permission separately. {lineBreak} Are you sure you want to unlink it?", "shareBoard.confirm-unlink.confirmBtnText": "Yes, unlink", "shareBoard.confirm-unlink.title": "Unlink channel from board", @@ -371,4 +375,4 @@ "tutorial_tip.ok": "Next", "tutorial_tip.out": "Opt out of these tips.", "tutorial_tip.seen": "Seen this before?" -} \ No newline at end of file +} diff --git a/webapp/src/components/confirmationDialogBox.scss b/webapp/src/components/confirmationDialogBox.scss index 7c99692d8..4669b1007 100644 --- a/webapp/src/components/confirmationDialogBox.scss +++ b/webapp/src/components/confirmationDialogBox.scss @@ -43,6 +43,7 @@ .sub-text { text-align: center; + white-space: pre-line; } } diff --git a/webapp/src/components/shareBoard/shareBoard.scss b/webapp/src/components/shareBoard/shareBoard.scss index 9cc395f09..ad6a925b3 100644 --- a/webapp/src/components/shareBoard/shareBoard.scss +++ b/webapp/src/components/shareBoard/shareBoard.scss @@ -15,6 +15,14 @@ position: fixed; width: 500px; } + + .action-buttons { + .Button { + height: unset; + min-height: 40px; + padding: 5px 20px; + } + } } .toolbar { diff --git a/webapp/src/components/shareBoard/shareBoard.tsx b/webapp/src/components/shareBoard/shareBoard.tsx index b2c4ee99e..ba06d5bc2 100644 --- a/webapp/src/components/shareBoard/shareBoard.tsx +++ b/webapp/src/components/shareBoard/shareBoard.tsx @@ -146,7 +146,7 @@ export default function ShareBoardDialog(props: Props): JSX.Element { } const onLinkBoard = async (channel: Channel, confirmed?: boolean) => { - if (channel.type === ChannelTypeOpen && !confirmed) { + if (!confirmed) { setShowLinkChannelConfirmation(channel) return } @@ -322,6 +322,16 @@ export default function ShareBoardDialog(props: Props): JSX.Element { const toolbar = board.isTemplate ? shareTemplateTitle : shareBoardTitle + let confirmSubtext + let confirmButtonText + if (board.channelId == '') { + confirmSubtext = intl.formatMessage({id: 'shareBoard.confirm-link-channel-subtext', defaultMessage: 'When you link a channel to a board, all members of the channel (existing and new) will be able to edit it.\n\nAre you sure you want to link it?'}) + confirmButtonText = intl.formatMessage({id: 'shareBoard.confirm-link-channel-button', defaultMessage: 'Yes, link here'}) + } else { + confirmSubtext = intl.formatMessage({id: 'shareBoard.confirm-link-channel-subtext-with-other-channel', defaultMessage: 'When you link a channel to a board, all members of the channel (existing and new) will be able to edit it.\n\nThis board is currently linked to another channel.\nIt will be unlinked if you choose to link it here.\n\nAre you sure you want to link it?'}) + confirmButtonText = intl.formatMessage({id: 'shareBoard.confirm-link-channel-button-with-other-channel', defaultMessage: 'Yes, unlink and link here'}) + } + return ( onLinkBoard(showLinkChannelConfirmation, true), onClose: () => setShowLinkChannelConfirmation(null), }}