replace all require(svgs) with esm import (#7948)
Signed-off-by: Kerry Archibald <kerrya@element.io>
This commit is contained in:
parent
522ad1aafb
commit
61cd463a3b
33 changed files with 104 additions and 54 deletions
|
@ -17,6 +17,7 @@ limitations under the License.
|
|||
import React, { useEffect, useState } from "react";
|
||||
|
||||
import { _t } from "../../languageHandler";
|
||||
import FileDropSvg from '../../../res/img/upload-big.svg';
|
||||
|
||||
interface IProps {
|
||||
parent: HTMLElement;
|
||||
|
@ -109,7 +110,7 @@ const FileDropTarget: React.FC<IProps> = ({ parent, onFileDrop }) => {
|
|||
|
||||
if (state.dragging) {
|
||||
return <div className="mx_FileDropTarget">
|
||||
<img src={require("../../../res/img/upload-big.svg")} className="mx_FileDropTarget_image" alt="" />
|
||||
<img src={FileDropSvg} className="mx_FileDropTarget_image" alt="" />
|
||||
{ _t("Drop file here to upload") }
|
||||
</div>;
|
||||
}
|
||||
|
|
|
@ -46,6 +46,12 @@ import { createSpaceFromCommunity } from "../../utils/space";
|
|||
import { Action } from "../../dispatcher/actions";
|
||||
import { RightPanelPhases } from "../../stores/right-panel/RightPanelStorePhases";
|
||||
import { UPDATE_EVENT } from "../../stores/AsyncStore";
|
||||
import CreateRoomSvg from '../../../res/img/icons-create-room.svg';
|
||||
import CancelSmallSvg from '../../../res/img/cancel-small.svg';
|
||||
import CancelSvg from '../../../res/img/cancel.svg';
|
||||
import ExternalLinkSvg from '../../../res/img/external-link.svg';
|
||||
import AddRoomSvg from '../../../res/img/icons-room-add.svg';
|
||||
import CameraSvg from '../../../res/img/camera.svg';
|
||||
|
||||
const LONG_DESC_PLACEHOLDER = _td(
|
||||
`<h1>HTML for your community's page</h1>
|
||||
|
@ -135,7 +141,7 @@ class CategoryRoomList extends React.Component {
|
|||
(<AccessibleButton className="mx_GroupView_featuredThings_addButton"
|
||||
onClick={this.onAddRoomsToSummaryClicked}
|
||||
>
|
||||
<img src={require("../../../res/img/icons-create-room.svg")} width="64" height="64" />
|
||||
<img src={CreateRoomSvg} width="64" height="64" />
|
||||
<div className="mx_GroupView_featuredThings_addButton_label">
|
||||
{ _t('Add a Room') }
|
||||
</div>
|
||||
|
@ -235,7 +241,7 @@ class FeaturedRoom extends React.Component {
|
|||
const deleteButton = this.props.editing ?
|
||||
<img
|
||||
className="mx_GroupView_featuredThing_deleteButton"
|
||||
src={require("../../../res/img/cancel-small.svg")}
|
||||
src={CancelSmallSvg}
|
||||
width="14"
|
||||
height="14"
|
||||
alt="Delete"
|
||||
|
@ -306,7 +312,7 @@ class RoleUserList extends React.Component {
|
|||
render() {
|
||||
const addButton = this.props.editing ?
|
||||
(<AccessibleButton className="mx_GroupView_featuredThings_addButton" onClick={this.onAddUsersClicked}>
|
||||
<img src={require("../../../res/img/icons-create-room.svg")} width="64" height="64" />
|
||||
<img src={CreateRoomSvg} width="64" height="64" />
|
||||
<div className="mx_GroupView_featuredThings_addButton_label">
|
||||
{ _t('Add a User') }
|
||||
</div>
|
||||
|
@ -386,7 +392,7 @@ class FeaturedUser extends React.Component {
|
|||
const deleteButton = this.props.editing ?
|
||||
<img
|
||||
className="mx_GroupView_featuredThing_deleteButton"
|
||||
src={require("../../../res/img/cancel-small.svg")}
|
||||
src={CancelSmallSvg}
|
||||
width="14"
|
||||
height="14"
|
||||
alt="Delete"
|
||||
|
@ -844,7 +850,7 @@ export default class GroupView extends React.Component {
|
|||
},
|
||||
) }
|
||||
<a href={hostingSignupLink} target="_blank" rel="noreferrer noopener">
|
||||
<img src={require("../../../res/img/external-link.svg")} width="11" height="10" alt='' />
|
||||
<img src={ExternalLinkSvg} width="11" height="10" alt='' />
|
||||
</a>
|
||||
</div>;
|
||||
}
|
||||
|
@ -925,7 +931,7 @@ export default class GroupView extends React.Component {
|
|||
onClick={this._onAddRoomsClick}
|
||||
>
|
||||
<div className="mx_GroupView_rooms_header_addRow_button">
|
||||
<img src={require("../../../res/img/icons-room-add.svg")} width="24" height="24" />
|
||||
<img src={AddRoomSvg} width="24" height="24" />
|
||||
</div>
|
||||
<div className="mx_GroupView_rooms_header_addRow_label">
|
||||
{ _t('Add rooms to this community') }
|
||||
|
@ -1257,7 +1263,7 @@ export default class GroupView extends React.Component {
|
|||
<div className="mx_GroupView_avatarPicker_edit">
|
||||
<label htmlFor="avatarInput" className="mx_GroupView_avatarPicker_label">
|
||||
<img
|
||||
src={require("../../../res/img/camera.svg")}
|
||||
src={CameraSvg}
|
||||
alt={_t("Upload avatar")}
|
||||
title={_t("Upload avatar")}
|
||||
width="17"
|
||||
|
@ -1331,7 +1337,7 @@ export default class GroupView extends React.Component {
|
|||
onClick={this._onCancelClick}
|
||||
>
|
||||
<img
|
||||
src={require("../../../res/img/cancel.svg")}
|
||||
src={CancelSvg}
|
||||
className="mx_filterFlipColor"
|
||||
width="18"
|
||||
height="18"
|
||||
|
|
|
@ -26,6 +26,7 @@ import AccessibleButton from '../views/elements/AccessibleButton';
|
|||
import MatrixClientContext from "../../contexts/MatrixClientContext";
|
||||
import AutoHideScrollbar from "./AutoHideScrollbar";
|
||||
import { replaceableComponent } from "../../utils/replaceableComponent";
|
||||
import GroupsSvg from '../../../res/img/icons-groups.svg';
|
||||
|
||||
@replaceableComponent("structures.MyGroups")
|
||||
export default class MyGroups extends React.Component {
|
||||
|
@ -106,7 +107,7 @@ export default class MyGroups extends React.Component {
|
|||
}
|
||||
|
||||
return <div className="mx_MyGroups">
|
||||
<SimpleRoomHeader title={_t("Communities")} icon={require("../../../res/img/icons-groups.svg")} />
|
||||
<SimpleRoomHeader title={_t("Communities")} icon={GroupsSvg} />
|
||||
<div className='mx_MyGroups_header'>
|
||||
<div className="mx_MyGroups_headerCard">
|
||||
<AccessibleButton className='mx_MyGroups_headerCard_button' onClick={this._onCreateGroupClick} />
|
||||
|
|
|
@ -30,6 +30,7 @@ import { StaticNotificationState } from "../../stores/notifications/StaticNotifi
|
|||
import AccessibleButton from "../views/elements/AccessibleButton";
|
||||
import InlineSpinner from "../views/elements/InlineSpinner";
|
||||
import MatrixClientContext from "../../contexts/MatrixClientContext";
|
||||
import WarningTriangleSvg from '../../../res/img/feather-customised/warning-triangle.svg';
|
||||
|
||||
const STATUS_BAR_HIDDEN = 0;
|
||||
const STATUS_BAR_EXPANDED = 1;
|
||||
|
@ -285,7 +286,7 @@ export default class RoomStatusBar extends React.PureComponent<IProps, IState> {
|
|||
<div role="alert">
|
||||
<div className="mx_RoomStatusBar_connectionLostBar">
|
||||
<img
|
||||
src={require("../../../res/img/feather-customised/warning-triangle.svg")}
|
||||
src={WarningTriangleSvg}
|
||||
width="24"
|
||||
height="24"
|
||||
title="/!\ "
|
||||
|
|
|
@ -62,6 +62,7 @@ import { SettingUpdatedPayload } from "../../dispatcher/payloads/SettingUpdatedP
|
|||
import UserIdentifierCustomisations from "../../customisations/UserIdentifier";
|
||||
import PosthogTrackers from "../../PosthogTrackers";
|
||||
import { ViewHomePagePayload } from "../../dispatcher/payloads/ViewHomePagePayload";
|
||||
import SwitchThemeSvg from '../../../res/img/element-icons/roomlist/dark-light-mode.svg';
|
||||
|
||||
const CustomStatusSection = () => {
|
||||
const cli = useContext(MatrixClientContext);
|
||||
|
@ -515,7 +516,7 @@ export default class UserMenu extends React.Component<IProps, IState> {
|
|||
title={this.state.isDarkTheme ? _t("Switch to light mode") : _t("Switch to dark mode")}
|
||||
>
|
||||
<img
|
||||
src={require("../../../res/img/element-icons/roomlist/dark-light-mode.svg")}
|
||||
src={SwitchThemeSvg}
|
||||
alt={_t("Switch theme")}
|
||||
width={16}
|
||||
/>
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue