From d77b6f81a93b089588ea0d917a9fe223c7fbce54 Mon Sep 17 00:00:00 2001 From: Devin Binnie <52460000+devinbinnie@users.noreply.github.com> Date: Mon, 9 Aug 2021 12:04:27 -0400 Subject: [PATCH] [MM-36423][MM-36427] Edit/Delete modals for dropdown (#1682) * [MM-36423] Edit/Delete modals for dropdown * [MM-36427] Remove Server Management from Settings modal * Style fixes * Hover states for edit/delete buttons * Update config.yml * Oops I broke something --- .circleci/config.yml | 2 +- scripts/cp_artifacts.sh | 2 + src/common/communication.ts | 2 + src/main/main.ts | 73 +++++++ src/main/preload/dropdown.js | 8 + src/renderer/components/SettingsPage.tsx | 73 +------ src/renderer/components/TeamList.tsx | 193 ------------------ src/renderer/components/TeamListItem.tsx | 48 ----- src/renderer/css/components/TeamListItem.css | 21 -- src/renderer/css/components/index.css | 1 - src/renderer/css/dropdown.scss | 36 +++- src/renderer/dropdown.tsx | 31 ++- src/renderer/modals/editServer/editServer.tsx | 66 ++++++ .../modals/removeServer/removeServer.tsx | 71 +++++++ webpack.config.renderer.js | 14 ++ 15 files changed, 302 insertions(+), 339 deletions(-) delete mode 100644 src/renderer/components/TeamList.tsx delete mode 100644 src/renderer/components/TeamListItem.tsx delete mode 100644 src/renderer/css/components/TeamListItem.css create mode 100644 src/renderer/modals/editServer/editServer.tsx create mode 100644 src/renderer/modals/removeServer/removeServer.tsx diff --git a/.circleci/config.yml b/.circleci/config.yml index e45afc59..04595f38 100644 --- a/.circleci/config.yml +++ b/.circleci/config.yml @@ -449,7 +449,7 @@ workflows: branches: only: - /^release-\d+(\.\d+){1,2}(-rc.*)?/ - - pull/1681 + - pull/1682 - store_artifacts: # for master/PR builds diff --git a/scripts/cp_artifacts.sh b/scripts/cp_artifacts.sh index 841f1261..53c62479 100644 --- a/scripts/cp_artifacts.sh +++ b/scripts/cp_artifacts.sh @@ -39,6 +39,7 @@ if [[ -f "${SRC}/mattermost-desktop-${VERSION}-mac-x64.zip" ]]; then cp "${SRC}/mattermost-desktop-${VERSION}-mac-x64.zip" "${DEST}/mattermost-desktop-${VERSION}-mac-x64.zip" if [[ -f "${SRC}"/mattermost-desktop-${VERSION}-mac-x64.dmg ]]; then cp "${SRC}/mattermost-desktop-${VERSION}-mac-x64.dmg.blockmap" "${DEST}/mattermost-desktop-${VERSION}-mac-x64.dmg.blockmap" + cp "${SRC}/mattermost-desktop-${VERSION}-mac-x64.dmg" "${DEST}/mattermost-desktop-${VERSION}-mac-x64.dmg" fi SOMETHING_COPIED=$((SOMETHING_COPIED + 8)) fi @@ -47,6 +48,7 @@ if [[ -f "${SRC}/mattermost-desktop-${VERSION}-mac-arm64.zip" ]]; then cp "${SRC}/mattermost-desktop-${VERSION}-mac-arm64.zip" "${DEST}/mattermost-desktop-${VERSION}-mac-arm64.zip" if [[ -f "${SRC}"/mattermost-desktop-${VERSION}-mac-arm64.dmg ]]; then cp "${SRC}/mattermost-desktop-${VERSION}-mac-arm64.dmg.blockmap" "${DEST}/mattermost-desktop-${VERSION}-mac-arm64.dmg.blockmap" + cp "${SRC}/mattermost-desktop-${VERSION}-mac-arm64.dmg" "${DEST}/mattermost-desktop-${VERSION}-mac-arm64.dmg" fi SOMETHING_COPIED=$((SOMETHING_COPIED + 16)) fi diff --git a/src/common/communication.ts b/src/common/communication.ts index e4e8fd8c..75b1faa4 100644 --- a/src/common/communication.ts +++ b/src/common/communication.ts @@ -35,6 +35,8 @@ export const OPEN_EXTERNAL = 'open_external'; export const DOUBLE_CLICK_ON_WINDOW = 'double_click'; export const SHOW_NEW_SERVER_MODAL = 'show_new_server_modal'; +export const SHOW_EDIT_SERVER_MODAL = 'show-edit-server-modal'; +export const SHOW_REMOVE_SERVER_MODAL = 'show-remove-server-modal'; export const RETRIEVE_MODAL_INFO = 'retrieve-modal-info'; export const MODAL_INFO = 'modal-info'; diff --git a/src/main/main.ts b/src/main/main.ts index 25dadcd0..97eaa328 100644 --- a/src/main/main.ts +++ b/src/main/main.ts @@ -37,6 +37,8 @@ import { USER_ACTIVITY_UPDATE, EMIT_CONFIGURATION, SWITCH_TAB, + SHOW_EDIT_SERVER_MODAL, + SHOW_REMOVE_SERVER_MODAL, } from 'common/communication'; import Config from 'common/config'; import {getDefaultTeamWithTabsFromTeam} from 'common/tabs/TabView'; @@ -245,6 +247,8 @@ function initializeInterCommunicationEventListeners() { ipcMain.on(DOUBLE_CLICK_ON_WINDOW, WindowManager.handleDoubleClick); ipcMain.on(SHOW_NEW_SERVER_MODAL, handleNewServerModal); + ipcMain.on(SHOW_EDIT_SERVER_MODAL, handleEditServerModal); + ipcMain.on(SHOW_REMOVE_SERVER_MODAL, handleRemoveServerModal); ipcMain.on(WINDOW_CLOSE, WindowManager.close); ipcMain.on(WINDOW_MAXIMIZE, WindowManager.maximize); ipcMain.on(WINDOW_MINIMIZE, WindowManager.minimize); @@ -504,6 +508,75 @@ function handleNewServerModal() { } } +function handleEditServerModal(e: IpcMainEvent, name: string) { + const html = getLocalURLString('editServer.html'); + + const modalPreload = getLocalPreload('modalPreload.js'); + + const mainWindow = WindowManager.getMainWindow(); + if (!mainWindow) { + return; + } + const serverIndex = config.teams.findIndex((team) => team.name === name); + if (serverIndex < 0) { + return; + } + const modalPromise = addModal('editServer', html, modalPreload, config.teams[serverIndex], mainWindow); + if (modalPromise) { + modalPromise.then((data) => { + const teams = config.teams; + teams[serverIndex].name = data.name; + teams[serverIndex].url = data.url; + config.set('teams', teams); + }).catch((e) => { + // e is undefined for user cancellation + if (e) { + log.error(`there was an error in the edit server modal: ${e}`); + } + }); + } else { + log.warn('There is already an edit server modal'); + } +} + +function handleRemoveServerModal(e: IpcMainEvent, name: string) { + const html = getLocalURLString('removeServer.html'); + + const modalPreload = getLocalPreload('modalPreload.js'); + + const mainWindow = WindowManager.getMainWindow(); + if (!mainWindow) { + return; + } + const modalPromise = addModal('removeServer', html, modalPreload, name, mainWindow); + if (modalPromise) { + modalPromise.then((remove) => { + if (remove) { + const teams = config.teams; + const removedTeam = teams.findIndex((team) => team.name === name); + if (removedTeam < 0) { + return; + } + const removedOrder = teams[removedTeam].order; + teams.splice(removedTeam, 1); + teams.forEach((value) => { + if (value.order > removedOrder) { + value.order--; + } + }); + config.set('teams', teams); + } + }).catch((e) => { + // e is undefined for user cancellation + if (e) { + log.error(`there was an error in the edit server modal: ${e}`); + } + }); + } else { + log.warn('There is already an edit server modal'); + } +} + function initializeAfterAppReady() { app.setAppUserModelId('Mattermost.Desktop'); // Use explicit AppUserModelID const defaultSession = session.defaultSession; diff --git a/src/main/preload/dropdown.js b/src/main/preload/dropdown.js index 6903ef04..98327b97 100644 --- a/src/main/preload/dropdown.js +++ b/src/main/preload/dropdown.js @@ -13,6 +13,8 @@ import { SWITCH_SERVER, CLOSE_TEAMS_DROPDOWN, SHOW_NEW_SERVER_MODAL, + SHOW_EDIT_SERVER_MODAL, + SHOW_REMOVE_SERVER_MODAL, UPDATE_TEAMS, } from 'common/communication'; @@ -32,6 +34,12 @@ window.addEventListener('message', async (event) => { case SHOW_NEW_SERVER_MODAL: ipcRenderer.send(SHOW_NEW_SERVER_MODAL); break; + case SHOW_EDIT_SERVER_MODAL: + ipcRenderer.send(SHOW_EDIT_SERVER_MODAL, event.data.data.name); + break; + case SHOW_REMOVE_SERVER_MODAL: + ipcRenderer.send(SHOW_REMOVE_SERVER_MODAL, event.data.data.name); + break; case CLOSE_TEAMS_DROPDOWN: ipcRenderer.send(CLOSE_TEAMS_DROPDOWN); break; diff --git a/src/renderer/components/SettingsPage.tsx b/src/renderer/components/SettingsPage.tsx index fea5d4df..4eb40fa4 100644 --- a/src/renderer/components/SettingsPage.tsx +++ b/src/renderer/components/SettingsPage.tsx @@ -14,10 +14,9 @@ import {debounce} from 'underscore'; import {CombinedConfig, LocalConfiguration, Team} from 'types/config'; import {DeepPartial} from 'types/utils'; -import {GET_LOCAL_CONFIGURATION, UPDATE_CONFIGURATION, DOUBLE_CLICK_ON_WINDOW, GET_DOWNLOAD_LOCATION, SWITCH_SERVER, ADD_SERVER, RELOAD_CONFIGURATION} from 'common/communication'; +import {GET_LOCAL_CONFIGURATION, UPDATE_CONFIGURATION, DOUBLE_CLICK_ON_WINDOW, GET_DOWNLOAD_LOCATION, ADD_SERVER, RELOAD_CONFIGURATION} from 'common/communication'; import {getDefaultTeamWithTabsFromTeam} from 'common/tabs/TabView'; -import TeamList from './TeamList'; import AutoSaveIndicator, {SavingState} from './AutoSaveIndicator'; const CONFIG_TYPE_SERVERS = 'servers'; @@ -48,11 +47,6 @@ type SaveQueueItem = { data: CombinedConfig[keyof CombinedConfig]; } -function backToIndex(serverName: string) { - window.ipcRenderer.send(SWITCH_SERVER, serverName); - window.close(); -} - export default class SettingsPage extends React.PureComponent, State> { trayIconThemeRef: React.RefObject; downloadLocationRef: React.RefObject; @@ -428,64 +422,6 @@ export default class SettingsPage extends React.PureComponent - - { - backToIndex(name); - }} - /> - - - ); - - const serversRow = ( - - -

{'Server Management'}

-
- -
- - -

- {'+ Add New Server'} -

- - - ); - - let srvMgmt; - if (this.state.enableServerManagement === true) { - srvMgmt = ( -
- {serversRow} - {teamsRow} -
-
- ); - } - const options = []; // MacOS has an option in the Dock, to set the app to autostart, so we choose to not support this option for OSX @@ -800,12 +736,7 @@ export default class SettingsPage extends React.PureComponent - {srvMgmt} - {optionsRow} - - ); + waitForIpc = optionsRow; } else { waitForIpc = (

{'Loading configuration...'}

); } diff --git a/src/renderer/components/TeamList.tsx b/src/renderer/components/TeamList.tsx deleted file mode 100644 index 6b03c3fe..00000000 --- a/src/renderer/components/TeamList.tsx +++ /dev/null @@ -1,193 +0,0 @@ -// Copyright (c) 2015-2016 Yuya Ochiai -// Copyright (c) 2016-present Mattermost, Inc. All Rights Reserved. -// See LICENSE.txt for license information. - -import React from 'react'; -import {ListGroup} from 'react-bootstrap'; - -import {Team, TeamWithIndex} from 'types/config'; - -import TeamListItem from './TeamListItem'; -import NewTeamModal from './NewTeamModal'; -import RemoveServerModal from './RemoveServerModal'; - -type Props = { - onTeamClick: (teamName: string) => void; - onTeamsChange: (teams: Team[]) => void; - showAddTeamForm?: boolean; - teams: Team[]; - addServer: (team: Team) => void; - updateTeam: (index: number, team: Team) => void; - setAddTeamFormVisibility: (visible: boolean) => void; -}; - -type State = { - team: TeamWithIndex; - showEditTeamForm: boolean; - indexToRemoveServer: number; -} - -export default class TeamList extends React.PureComponent { - constructor(props: Props) { - super(props); - - this.state = { - showEditTeamForm: false, - indexToRemoveServer: -1, - team: { - url: '', - name: '', - index: 0, - order: props.teams.length, - }, - }; - } - - handleTeamRemove = (index: number) => { - console.log(index); - const teams = this.props.teams; - const removedOrder = this.props.teams[index].order; - teams.splice(index, 1); - teams.forEach((value) => { - if (value.order > removedOrder) { - value.order--; - } - }); - this.props.onTeamsChange(teams); - } - - handleTeamAdd = (team: TeamWithIndex) => { - const teams = this.props.teams; - - // check if team already exists and then change existing team or add new one - if ((typeof team.index !== 'undefined') && teams[team.index]) { - teams[team.index].name = team.name; - teams[team.index].url = team.url; - teams[team.index].order = team.order; - } else { - teams.push(team); - } - - this.setState({ - showEditTeamForm: false, - team: { - url: '', - name: '', - index: 0, - order: teams.length, - }, - }); - - this.props.onTeamsChange(teams); - } - - openServerRemoveModal = (indexForServer: number) => { - this.setState({indexToRemoveServer: indexForServer}); - } - - closeServerRemoveModal = () => { - this.setState({indexToRemoveServer: -1}); - } - - handleTeamRemovePrompt = (index: number) => { - return () => { - (document.activeElement as HTMLElement).blur(); - this.openServerRemoveModal(index); - }; - } - - handleTeamEditing = (team: Team, index: number) => { - return () => { - (document.activeElement as HTMLElement).blur(); - this.setState({ - showEditTeamForm: true, - team: { - url: team.url, - name: team.name, - index, - order: team.order, - }, - }); - }; - } - - render() { - const teamNodes = this.props.teams.map((team, i) => { - return ( - this.props.onTeamClick(team.name)} - /> - ); - }); - - const addServerForm = ( - { - this.setState({ - showEditTeamForm: false, - team: { - name: '', - url: '', - index: 0, - order: this.props.teams.length, - }, - }); - this.props.setAddTeamFormVisibility(false); - }} - onSave={(newTeam) => { - const teamData = { - name: newTeam.name, - url: newTeam.url, - order: newTeam.order, - }; - if (this.props.showAddTeamForm) { - this.props.addServer(teamData); - } else { - this.props.updateTeam(newTeam.index, teamData); - } - this.setState({ - showEditTeamForm: false, - team: { - name: '', - url: '', - index: 0, - order: newTeam.order + 1, - }, - }); - this.render(); - this.props.setAddTeamFormVisibility(false); - }} - team={this.state.team} - />); - - const removeServer = this.props.teams[this.state.indexToRemoveServer]; - const removeServerModal = ( - { - this.handleTeamRemove(this.state.indexToRemoveServer); - this.closeServerRemoveModal(); - }} - /> - ); - - return ( - - { teamNodes } - { addServerForm } - { removeServerModal} - - ); - } -} diff --git a/src/renderer/components/TeamListItem.tsx b/src/renderer/components/TeamListItem.tsx deleted file mode 100644 index 0ada7ff5..00000000 --- a/src/renderer/components/TeamListItem.tsx +++ /dev/null @@ -1,48 +0,0 @@ -// Copyright (c) 2015-2016 Yuya Ochiai -// Copyright (c) 2016-present Mattermost, Inc. All Rights Reserved. -// See LICENSE.txt for license information. - -import React from 'react'; - -type Props = { - name: string; - onTeamEditing: () => void; - onTeamRemove: () => void; - onTeamClick: React.MouseEventHandler; - url: string; -}; - -export default class TeamListItem extends React.PureComponent { - handleTeamRemove = () => { - this.props.onTeamRemove(); - } - handleTeamEditing = () => { - this.props.onTeamEditing(); - } - render() { - return ( -
-
-

{ this.props.name }

-

- { this.props.url } -

-
-
- {'Edit'} - {' - '} - {'Remove'} -
-
- ); - } -} diff --git a/src/renderer/css/components/TeamListItem.css b/src/renderer/css/components/TeamListItem.css deleted file mode 100644 index d2516ca6..00000000 --- a/src/renderer/css/components/TeamListItem.css +++ /dev/null @@ -1,21 +0,0 @@ -.TeamListItem { - display: flex; -} - -.TeamListItem:hover { - background: #eee; -} - -.TeamListItem-left { - flex-grow: 1; -} - -.TeamListItem p { - overflow-wrap: break-word; - margin-bottom: 0; -} - -.TeamListItem h4 { - overflow: hidden; - text-overflow: ellipsis; -}; diff --git a/src/renderer/css/components/index.css b/src/renderer/css/components/index.css index a50e8b2b..5760a22e 100644 --- a/src/renderer/css/components/index.css +++ b/src/renderer/css/components/index.css @@ -5,7 +5,6 @@ @import url("NewTeamModal.css"); @import url("PermissionRequestDialog.css"); @import url("TabBar.css"); -@import url("TeamListItem.css"); @import url("UpdaterPage.css"); @import url("CertificateModal.css"); @import url("ExtraBar.css"); diff --git a/src/renderer/css/dropdown.scss b/src/renderer/css/dropdown.scss index 78c14413..d6c70da4 100644 --- a/src/renderer/css/dropdown.scss +++ b/src/renderer/css/dropdown.scss @@ -183,8 +183,20 @@ body { margin-left: 18px; background-color: transparent; border: none; + border-radius: 2px; padding: 0; + &:hover, &:focus { + background: rgba(61, 60, 64, 0.08); + box-shadow: 0px 0px 0px 4px rgba(61, 60, 64, 0.08); + outline: none; + } + + &.TeamDropdown__button-remove:hover, &.TeamDropdown__button-remove:focus { + background: rgba(247, 67, 67, 0.16); + box-shadow: 0px 0px 0px 4px rgba(247, 67, 67, 0.16); + } + > i::before { margin: 0; } @@ -194,6 +206,11 @@ body { .TeamDropdown__button-edit, .TeamDropdown__button-remove { opacity: 0; pointer-events: none; + + &:focus { + opacity: 1; + pointer-events: all; + } } .TeamDropdown__button-remove { @@ -204,7 +221,7 @@ body { } i { - color: #f74343; + color: #F74343; } } @@ -235,6 +252,15 @@ body { > .TeamDropdown__draggable-handle > span, &.addServer > span { color: #DDD; } + + .TeamDropdown__button-remove i { + color: #F74343; + } + + .TeamDropdown__button-edit:hover, .TeamDropdown__button-edit:focus { + background: rgba(221, 223, 228, 0.08); + box-shadow: 0px 0px 0px 4px rgba(221, 223, 228, 0.08); + } } .TeamDropdown__badge-expired i { @@ -248,4 +274,12 @@ body { .TeamDropdown__draggable-handle > i.icon-drag-vertical::before { color:rgba(221, 221, 221, 0.32); } + + .TeamDropdown__badge-count i { + color: #e81023; + } + + .TeamDropdown__badge-dot { + background: #196CAF; + } } diff --git a/src/renderer/dropdown.tsx b/src/renderer/dropdown.tsx index ea80a7fc..9f1acf10 100644 --- a/src/renderer/dropdown.tsx +++ b/src/renderer/dropdown.tsx @@ -8,7 +8,16 @@ import {DragDropContext, Draggable, DraggingStyle, Droppable, DropResult, NotDra import {Team, TeamWithTabs} from 'types/config'; -import {CLOSE_TEAMS_DROPDOWN, REQUEST_TEAMS_DROPDOWN_INFO, SEND_DROPDOWN_MENU_SIZE, SHOW_NEW_SERVER_MODAL, SWITCH_SERVER, UPDATE_TEAMS, UPDATE_TEAMS_DROPDOWN} from 'common/communication'; +import { + CLOSE_TEAMS_DROPDOWN, + REQUEST_TEAMS_DROPDOWN_INFO, + SEND_DROPDOWN_MENU_SIZE, + SHOW_NEW_SERVER_MODAL, + SHOW_EDIT_SERVER_MODAL, + SHOW_REMOVE_SERVER_MODAL, + SWITCH_SERVER, UPDATE_TEAMS, + UPDATE_TEAMS_DROPDOWN, +} from 'common/communication'; import {getTabViewName} from 'common/tabs/TabView'; @@ -144,6 +153,22 @@ class TeamDropdown extends React.PureComponent, State> { } } + editServer = (team: string) => { + return (event: React.MouseEvent) => { + event.stopPropagation(); + window.postMessage({type: SHOW_EDIT_SERVER_MODAL, data: {name: team}}, window.location.href); + this.closeMenu(); + }; + } + + removeServer = (team: string) => { + return (event: React.MouseEvent) => { + event.stopPropagation(); + window.postMessage({type: SHOW_REMOVE_SERVER_MODAL, data: {name: team}}, window.location.href); + this.closeMenu(); + }; + } + render() { return (
, State> {
diff --git a/src/renderer/modals/editServer/editServer.tsx b/src/renderer/modals/editServer/editServer.tsx new file mode 100644 index 00000000..21c0f9ad --- /dev/null +++ b/src/renderer/modals/editServer/editServer.tsx @@ -0,0 +1,66 @@ +// Copyright (c) 2016-present Mattermost, Inc. All Rights Reserved. +// See LICENSE.txt for license information. + +import 'bootstrap/dist/css/bootstrap.min.css'; +import 'renderer/css/modals.css'; + +import React, {useEffect, useState} from 'react'; +import ReactDOM from 'react-dom'; + +import {TeamWithIndex} from 'types/config'; +import {ModalMessage} from 'types/modals'; + +import {MODAL_CANCEL, MODAL_INFO, MODAL_RESULT, RETRIEVE_MODAL_INFO} from 'common/communication'; + +import NewTeamModal from '../../components/NewTeamModal'; //'./addServer.jsx'; + +import setupDarkMode from '../darkMode'; + +setupDarkMode(); + +const onClose = () => { + window.postMessage({type: MODAL_CANCEL}, window.location.href); +}; + +const onSave = (data: TeamWithIndex) => { + window.postMessage({type: MODAL_RESULT, data}, window.location.href); +}; + +const EditServerModalWrapper: React.FC = () => { + const [server, setServer] = useState(); + + const handleEditServerMessage = (event: {data: ModalMessage}) => { + switch (event.data.type) { + case MODAL_INFO: { + setServer(event.data.data); + break; + } + default: + break; + } + }; + + useEffect(() => { + window.addEventListener('message', handleEditServerMessage); + window.postMessage({type: RETRIEVE_MODAL_INFO}, window.location.href); + }, []); + + return ( + + ); +}; + +const start = async () => { + ReactDOM.render( + , + document.getElementById('app'), + ); +}; + +start(); diff --git a/src/renderer/modals/removeServer/removeServer.tsx b/src/renderer/modals/removeServer/removeServer.tsx new file mode 100644 index 00000000..3b43e395 --- /dev/null +++ b/src/renderer/modals/removeServer/removeServer.tsx @@ -0,0 +1,71 @@ +// Copyright (c) 2016-present Mattermost, Inc. All Rights Reserved. +// See LICENSE.txt for license information. + +import 'bootstrap/dist/css/bootstrap.min.css'; +import 'renderer/css/modals.css'; + +import React, {useEffect, useState} from 'react'; +import ReactDOM from 'react-dom'; + +import {ModalMessage} from 'types/modals'; + +import {MODAL_CANCEL, MODAL_INFO, MODAL_RESULT, RETRIEVE_MODAL_INFO} from 'common/communication'; + +import RemoveServerModal from '../../components/RemoveServerModal'; + +import setupDarkMode from '../darkMode'; + +setupDarkMode(); + +const onClose = () => { + window.postMessage({type: MODAL_CANCEL}, window.location.href); +}; + +const onSave = (data: boolean) => { + window.postMessage({type: MODAL_RESULT, data}, window.location.href); +}; + +const RemoveServerModalWrapper: React.FC = () => { + const [serverName, setServerName] = useState(''); + + const handleRemoveServerMessage = (event: {data: ModalMessage}) => { + switch (event.data.type) { + case MODAL_INFO: { + setServerName(event.data.data); + break; + } + default: + break; + } + }; + + useEffect(() => { + window.addEventListener('message', handleRemoveServerMessage); + window.postMessage({type: RETRIEVE_MODAL_INFO}, window.location.href); + }, []); + + return ( + { + onClose(); + }} + onCancel={() => { + onSave(false); + }} + onAccept={() => { + onSave(true); + }} + /> + ); +}; + +const start = async () => { + ReactDOM.render( + , + document.getElementById('app'), + ); +}; + +start(); diff --git a/webpack.config.renderer.js b/webpack.config.renderer.js index 49a54f16..7bfa28bc 100644 --- a/webpack.config.renderer.js +++ b/webpack.config.renderer.js @@ -22,6 +22,8 @@ module.exports = merge(base, { dropdown: './src/renderer/dropdown.tsx', urlView: './src/renderer/modals/urlView/urlView.tsx', newServer: './src/renderer/modals/newServer/newServer.tsx', + editServer: './src/renderer/modals/editServer/editServer.tsx', + removeServer: './src/renderer/modals/removeServer/removeServer.tsx', loginModal: './src/renderer/modals/login/login.tsx', permissionModal: './src/renderer/modals/permission/permission.tsx', certificateModal: './src/renderer/modals/certificate/certificate.tsx', @@ -62,6 +64,18 @@ module.exports = merge(base, { chunks: ['newServer'], filename: 'newServer.html', }), + new HtmlWebpackPlugin({ + title: 'Mattermost Desktop Settings', + template: 'src/renderer/index.html', + chunks: ['editServer'], + filename: 'editServer.html', + }), + new HtmlWebpackPlugin({ + title: 'Mattermost Desktop Settings', + template: 'src/renderer/index.html', + chunks: ['removeServer'], + filename: 'removeServer.html', + }), new HtmlWebpackPlugin({ title: 'Mattermost Desktop Settings', template: 'src/renderer/index.html',