Merge and migrate locally-trusted preload scripts to contextBridge API (#2553)

* Migrate intl_provider to contextBridge

* Migrate modalPreload to contextBridge

* Migrate loadingScreenPreload to contextBridge

* Migrate downloadDropdown preloads to contextBridge

* Migrate server dropdown preload to contextBridge

* Migrate urlView preload to contextBridge

* Merge all desktop API scripts into one

* Remove unused communication channel constants

src/renderer/components/ConfigureServer.tsx

@@ -14,7 +14,6 @@ import Input, {STATUS, SIZE} from 'renderer/components/Input';
 import LoadingBackground from 'renderer/components/LoadingScreen/LoadingBackground';
 import SaveButton from 'renderer/components/SaveButton/SaveButton';
 
-import {PING_DOMAIN, PING_DOMAIN_RESPONSE} from 'common/communication';
 import {MODAL_TRANSITION_TIMEOUT} from 'common/utils/constants';
 import urlUtils from 'common/utils/url';
 
@@ -77,33 +76,15 @@ function ConfigureServer({
         if (urlUtils.startsWithProtocol(checkURL)) {
             return Promise.resolve(checkURL);
         }
-
-        return new Promise((resolve) => {
-            let eventCount = 0;
-
-            const handler = (event: {data: {type: string; data: string | Error}}) => {
-                let newURL = checkURL;
-
-                if (event.data.type === PING_DOMAIN_RESPONSE) {
-                    if (event.data.data instanceof Error) {
-                        console.error(`Could not ping url: ${checkURL}`);
-                    } else {
-                        newURL = `${event.data.data}://${checkURL}`;
-                        setUrl(newURL);
-                    }
-
-                    window.removeEventListener('message', handler);
-                    resolve(newURL);
-                } else if (eventCount >= 3) {
-                    window.removeEventListener('message', handler);
-                    resolve(newURL);
-                }
-
-                eventCount++;
-            };
-
-            window.addEventListener('message', handler);
-            window.postMessage({type: PING_DOMAIN, data: checkURL}, window.location.href);
+        return window.desktop.modals.pingDomain(checkURL).then((result: string | Error) => {
+            let newURL = checkURL;
+            if (result instanceof Error) {
+                console.error(`Could not ping url: ${checkURL}`);
+            } else {
+                newURL = `${result}://${checkURL}`;
+                setUrl(newURL);
+            }
+            return newURL;
         });
     };
 

src/renderer/components/DownloadsDropdown/DownloadsDropdownItemFile.tsx

@@ -7,8 +7,6 @@ import classNames from 'classnames';
 
 import {useIntl} from 'react-intl';
 
-import {DOWNLOADS_DROPDOWN_OPEN_FILE} from 'common/communication';
-
 import FileSizeAndStatus from './FileSizeAndStatus';
 import ProgressBar from './ProgressBar';
 import ThreeDotButton from './ThreeDotButton';
@@ -26,7 +24,7 @@ const DownloadsDropdownItemFile = ({item, activeItem}: OwnProps) => {
     const onFileClick = (e: React.MouseEvent<HTMLDivElement>) => {
         e.preventDefault();
 
-        window.postMessage({type: DOWNLOADS_DROPDOWN_OPEN_FILE, payload: {item}}, window.location.href);
+        window.desktop.downloadsDropdown.openFile(item);
     };
 
     const itemFilename = item.type === 'update' ?

src/renderer/components/DownloadsDropdown/ThreeDotButton.tsx

@@ -6,8 +6,6 @@ import {DownloadedItem} from 'types/downloads';
 
 import classNames from 'classnames';
 
-import {TOGGLE_DOWNLOADS_DROPDOWN_MENU} from 'common/communication';
-
 type OwnProps = {
     activeItem?: DownloadedItem;
     item: DownloadedItem;
@@ -22,13 +20,10 @@ const ThreeDotButton = ({item, activeItem, visible}: OwnProps) => {
         e.stopPropagation();
 
         const coords = buttonElement.current?.getBoundingClientRect();
-        window.postMessage({
-            type: TOGGLE_DOWNLOADS_DROPDOWN_MENU,
-            payload: {
-                coordinates: coords?.toJSON(),
-                item,
-            },
-        }, window.location.href);
+        window.desktop.downloadsDropdown.toggleDownloadsDropdownMenu({
+            coordinates: coords?.toJSON(),
+            item,
+        });
     };
 
     return (

src/renderer/components/DownloadsDropdown/Update/UpdateAvailable.tsx

@@ -8,8 +8,6 @@ import {FormattedMessage} from 'react-intl';
 
 import {Button} from 'react-bootstrap';
 
-import {START_UPDATE_DOWNLOAD} from 'common/communication';
-
 import Thumbnail from '../Thumbnail';
 
 type OwnProps = {
@@ -19,7 +17,7 @@ type OwnProps = {
 const UpdateAvailable = ({item}: OwnProps) => {
     const onButtonClick = (e: React.MouseEvent<HTMLButtonElement>) => {
         e?.preventDefault?.();
-        window.postMessage({type: START_UPDATE_DOWNLOAD}, window.location.href);
+        window.desktop.downloadsDropdown.startUpdateDownload();
     };
 
     return (

src/renderer/components/DownloadsDropdown/Update/UpdateDownloaded.tsx

@@ -10,8 +10,6 @@ import {Button} from 'react-bootstrap';
 
 import classNames from 'classnames';
 
-import {START_UPGRADE} from 'common/communication';
-
 import Thumbnail from '../Thumbnail';
 import FileSizeAndStatus from '../FileSizeAndStatus';
 
@@ -24,7 +22,7 @@ const UpdateAvailable = ({item}: OwnProps) => {
 
     const onButtonClick = (e: React.MouseEvent<HTMLButtonElement>) => {
         e?.preventDefault?.();
-        window.postMessage({type: START_UPGRADE}, window.location.href);
+        window.desktop.downloadsDropdown.startUpgrade();
     };
 
     return (

src/renderer/components/NewTeamModal.tsx

@@ -9,7 +9,6 @@ import {FormattedMessage, injectIntl, IntlShape} from 'react-intl';
 import {TeamWithIndex} from 'types/config';
 
 import urlUtils from 'common/utils/url';
-import {PING_DOMAIN, PING_DOMAIN_RESPONSE} from 'common/communication';
 
 type Props = {
     onClose?: () => void;
@@ -157,20 +156,12 @@ class NewTeamModal extends React.PureComponent<Props, State> {
             return Promise.resolve(undefined);
         }
 
-        return new Promise((resolve) => {
-            const handler = (event: {data: {type: string; data: string | Error}}) => {
-                if (event.data.type === PING_DOMAIN_RESPONSE) {
-                    if (event.data.data instanceof Error) {
-                        console.error(`Could not ping url: ${teamUrl}`);
-                    } else {
-                        this.setState({teamUrl: `${event.data.data}://${this.state.teamUrl}`});
-                    }
-                    window.removeEventListener('message', handler);
-                    resolve(undefined);
-                }
-            };
-            window.addEventListener('message', handler);
-            window.postMessage({type: PING_DOMAIN, data: teamUrl}, window.location.href);
+        return window.desktop.modals.pingDomain(teamUrl).then((result: string | Error) => {
+            if (result instanceof Error) {
+                console.error(`Could not ping url: ${teamUrl}`);
+            } else {
+                this.setState({teamUrl: `${result}://${this.state.teamUrl}`});
+            }
         });
     }
 

src/renderer/components/urlDescription.tsx

@@ -3,13 +3,11 @@
 
 import React, {useEffect} from 'react';
 
-import {UPDATE_URL_VIEW_WIDTH} from 'common/communication';
-
 export default function UrlDescription(props: {url: string}) {
     const urlRef = React.createRef<HTMLDivElement>();
 
     useEffect(() => {
-        window.postMessage({type: UPDATE_URL_VIEW_WIDTH, data: urlRef.current?.scrollWidth}, window.location.href);
+        window.desktop.updateURLViewWidth(urlRef.current?.scrollWidth);
     }, []);
 
     if (props.url) {