luisgulo/focalboard
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Showing the right confirmation modals on channel-board linking (#3453)

Browse source 
* Showing the right confirmation modals on channel-board linking

* Addressing PR review channges

* Fixing linter

* Fixing another linter error
This commit is contained in:
Jesús Espino 2022-08-01 13:12:11 +02:00 committed by GitHub
parent b31f2afe81
commit 9159efb79e
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
5 changed files with 45 additions and 12 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

18
mattermost-plugin/webapp/src/components/boardSelector.tsx
View file

@ -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 (
<div className='focalboard-body'>
<Dialog
@ -128,10 +141,7 @@ const BoardSelector = () => {
<ConfirmationDialog
dialogBox={{
heading: intl.formatMessage({id: 'boardSelector.confirm-link-board', defaultMessage: 'Link board to channel'}),
subText: 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. Are you sure you want to link it?'
}, {boardName: showLinkBoardConfirmation.title}),
subText: confirmationSubText,
confirmButtonText: intl.formatMessage({id: 'boardSelector.confirm-link-board-button', defaultMessage: 'Yes, link board'}),
onConfirm: () => linkBoard(showLinkBoardConfirmation, true),
onClose: () => setShowLinkBoardConfirmation(null),

12
webapp/i18n/en.json
View file

@ -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?"
}
}

1
webapp/src/components/confirmationDialogBox.scss
View file

@ -43,6 +43,7 @@
.sub-text {
text-align: center;
white-space: pre-line;
}
}

8
webapp/src/components/shareBoard/shareBoard.scss
View file

@ -15,6 +15,14 @@
position: fixed;
width: 500px;
}
.action-buttons {
.Button {
height: unset;
min-height: 40px;
padding: 5px 20px;
}
}
}
.toolbar {

18
webapp/src/components/shareBoard/shareBoard.tsx
View file

@ -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 (
<Dialog
onClose={props.onClose}
@ -331,9 +341,9 @@ export default function ShareBoardDialog(props: Props): JSX.Element {
{showLinkChannelConfirmation &&
<ConfirmationDialog
dialogBox={{
heading: intl.formatMessage({id: 'shareBoard.confirm-link-public-channel', defaultMessage: 'You\'re adding a public channel'}),
subText: intl.formatMessage({id: 'shareBoard.confirm-link-public-channel-subtext', defaultMessage: 'Anyone who joins that public channel will now get “Editor” access to the board, are you sure you want to proceed?'}),
confirmButtonText: intl.formatMessage({id: 'shareBoard.confirm-link-public-channel-button', defaultMessage: 'Yes, add public channel'}),
heading: intl.formatMessage({id: 'shareBoard.confirm-link-channel', defaultMessage: 'Link board to channel'}),
subText: confirmSubtext,
confirmButtonText: confirmButtonText,
onConfirm: () => onLinkBoard(showLinkChannelConfirmation, true),
onClose: () => setShowLinkChannelConfirmation(null),
}}