// Copyright (c) 2016-present Mattermost, Inc. All Rights Reserved. // See LICENSE.txt for license information. import React from 'react'; import ReactDOM from 'react-dom'; import classNames from 'classnames'; import {FormattedMessage} from 'react-intl'; import {DownloadedItem} from 'types/downloads'; import { CLOSE_DOWNLOADS_DROPDOWN, REQUEST_CLEAR_DOWNLOADS_DROPDOWN, REQUEST_DOWNLOADS_DROPDOWN_INFO, SEND_DOWNLOADS_DROPDOWN_SIZE, UPDATE_DOWNLOADS_DROPDOWN, } from 'common/communication'; import IntlProvider from './intl_provider'; import DownloadsDropdownItem from './components/DownloadsDropdown/DownloadsDropdownItem'; import './css/downloadsDropdown.scss'; type State = { downloads: DownloadedItem[]; darkMode?: boolean; windowBounds?: Electron.Rectangle; item?: DownloadedItem; } class DownloadsDropdown extends React.PureComponent, State> { constructor(props: Record) { super(props); this.state = { downloads: [], }; window.addEventListener('message', this.handleMessageEvent); } componentDidMount() { window.postMessage({type: REQUEST_DOWNLOADS_DROPDOWN_INFO}, window.location.href); } componentDidUpdate() { window.postMessage({type: SEND_DOWNLOADS_DROPDOWN_SIZE, data: {width: document.body.scrollWidth, height: document.body.scrollHeight}}, window.location.href); } handleMessageEvent = (event: MessageEvent) => { if (event.data.type === UPDATE_DOWNLOADS_DROPDOWN) { const {downloads, darkMode, windowBounds, item} = event.data.data; const newDownloads = Object.values(downloads); newDownloads.sort((a, b) => { // Show App update first if (a.type === 'update') { return -1; } else if (b.type === 'update') { return 1; } return b?.addedAt - a?.addedAt; }); this.setState({ downloads: newDownloads, darkMode, windowBounds, item, }); } } closeMenu = () => { window.postMessage({type: CLOSE_DOWNLOADS_DROPDOWN}, window.location.href); } clearAll = () => { if (!this.clearAllButtonDisabled()) { window.postMessage({type: REQUEST_CLEAR_DOWNLOADS_DROPDOWN}, window.location.href); } } clearAllButtonDisabled = () => { return this.state.downloads?.length === 1 && this.state.downloads[0]?.type === 'update'; } render() { return (

{(this.state.downloads || []).map((downloadItem: DownloadedItem) => { return ( ); })}
); } } ReactDOM.render( , document.getElementById('app'), );