diff --git a/src/components/Board/Board.container.js b/src/components/Board/Board.container.js index 1ed954ec0..ada9adc83 100644 --- a/src/components/Board/Board.container.js +++ b/src/components/Board/Board.container.js @@ -70,6 +70,7 @@ import { IS_BROWSING_FROM_APPLE_TOUCH, IS_BROWSING_FROM_SAFARI } from '../../constants'; +import LoadingIcon from '../UI/LoadingIcon'; //import { isAndroid } from '../../cordova-util'; const ogv = require('ogv'); @@ -1183,6 +1184,9 @@ export class BoardContainer extends Component { handleCopyRemoteBoard = async () => { const { intl, showNotification, history, switchBoard } = this.props; try { + this.setState({ + isSaving: true + }); const copiedBoard = await this.createBoardsRecursively( this.state.copyPublicBoard ); @@ -1194,7 +1198,6 @@ export class BoardContainer extends Component { const translatedBoard = this.translateBoard(copiedBoard); this.setState({ translatedBoard, - isSaving: false, copyPublicBoard: false, blockedPrivateBoard: false }); @@ -1202,7 +1205,11 @@ export class BoardContainer extends Component { } catch (err) { console.log(err.message); showNotification(intl.formatMessage(messages.boardCopyError)); + this.handleCloseDialog(); } + this.setState({ + isSaving: false + }); }; async createBoardsRecursively(board, records) { @@ -1264,10 +1271,6 @@ export class BoardContainer extends Component { // Loggedin user? if ('name' in userData && 'email' in userData) { - this.setState({ - isSaving: true - }); - try { const boardId = await updateApiObjectsNoChild(newBoard, true); newBoard = { @@ -1290,7 +1293,7 @@ export class BoardContainer extends Component { const nextBoard = await API.getBoard(tile.loadBoard); await this.createBoardsRecursively(nextBoard, records); } catch (err) { - if (err.response.status === 404) { + if (!err.respose || err.response?.status === 404) { //look for this board in available boards const localBoard = boards.find(b => b.id === tile.loadBoard); if (localBoard) { @@ -1348,7 +1351,9 @@ export class BoardContainer extends Component { }); } - handleCloseDialog = () => { + handleCloseDialog = (event, reason) => { + const { isSaving } = this.state; + if (isSaving) return; this.setState({ copyPublicBoard: false, blockedPrivateBoard: false @@ -1611,7 +1616,11 @@ export class BoardContainer extends Component { - @@ -1619,8 +1628,13 @@ export class BoardContainer extends Component { onClick={this.handleCopyRemoteBoard} color="primary" variant="contained" + disabled={this.state.isSaving} > - {this.props.intl.formatMessage(messages.boardCopyAccept)} + {this.state.isSaving ? ( + + ) : ( + this.props.intl.formatMessage(messages.boardCopyAccept) + )} diff --git a/src/components/Communicator/CommunicatorDialog/CommunicatorDialog.container.js b/src/components/Communicator/CommunicatorDialog/CommunicatorDialog.container.js index 3891f1ae2..0f1551fb6 100644 --- a/src/components/Communicator/CommunicatorDialog/CommunicatorDialog.container.js +++ b/src/components/Communicator/CommunicatorDialog/CommunicatorDialog.container.js @@ -293,9 +293,6 @@ class CommunicatorDialogContainer extends React.Component { // Loggedin user? if ('name' in userData && 'email' in userData) { try { - this.setState({ - loading: true - }); const boardId = await updateApiObjectsNoChild(newBoard, true); newBoard = { ...newBoard, @@ -303,10 +300,6 @@ class CommunicatorDialogContainer extends React.Component { }; } catch (err) { console.log(err.message); - } finally { - this.setState({ - loading: false - }); } } @@ -321,7 +314,7 @@ class CommunicatorDialogContainer extends React.Component { const nextBoard = await API.getBoard(tile.loadBoard); await this.createBoardsRecursively(nextBoard, records); } catch (err) { - if (err.response.status === 404) { + if (!err.respose || err.response?.status === 404) { //look for this board in available boards const localBoard = availableBoards.find( b => b.id === tile.loadBoard diff --git a/src/components/Communicator/CommunicatorDialog/CommunicatorDialogBoardItem.component.js b/src/components/Communicator/CommunicatorDialog/CommunicatorDialogBoardItem.component.js index 43b5f6df3..d6642dbe2 100644 --- a/src/components/Communicator/CommunicatorDialog/CommunicatorDialogBoardItem.component.js +++ b/src/components/Communicator/CommunicatorDialog/CommunicatorDialogBoardItem.component.js @@ -30,6 +30,7 @@ import TextField from '@material-ui/core/TextField'; import CircularProgress from '@material-ui/core/CircularProgress'; import Slide from '@material-ui/core/Slide'; import DialogContentText from '@material-ui/core/DialogContentText'; +import LoadingIcon from '../../UI/LoadingIcon'; import IconButton from '../../UI/IconButton'; import { TAB_INDEXES } from './CommunicatorDialog.constants'; @@ -73,6 +74,8 @@ class CommunicatorDialogBoardItem extends React.Component { ? props.board.description : '' }; + + this.handleDialogClose = this.handleDialogClose.bind(this); } openMenu(e) { @@ -149,7 +152,6 @@ class CommunicatorDialogBoardItem extends React.Component { async handleBoardCopy(board) { this.setState({ - openCopyBoard: false, loading: true }); try { @@ -157,6 +159,7 @@ class CommunicatorDialogBoardItem extends React.Component { } catch (err) { } finally { this.setState({ + openCopyBoard: false, loading: false }); } @@ -839,7 +842,9 @@ class CommunicatorDialogBoardItem extends React.Component { { + if (!this.state.loading) this.handleDialogClose(); + }} aria-labelledby="board-copy-dialog" open={this.state.openCopyBoard} > @@ -858,6 +863,7 @@ class CommunicatorDialogBoardItem extends React.Component { @@ -868,8 +874,13 @@ class CommunicatorDialogBoardItem extends React.Component { }} variant="contained" color="primary" + disabled={this.state.loading} > - {intl.formatMessage(messages.accept)} + {this.state.loading ? ( + + ) : ( + intl.formatMessage(messages.accept) + )}