Web: fix svg src after merge

packages/common/components/MediaViewer/MediaViewer.js

@@ -7,6 +7,15 @@ import Hammer from "hammerjs";
 import { isMobileOnly } from "react-device-detect";
 import { FileStatus } from "@docspace/common/constants";
 
+import InfoOutlineReactSvgUrl from "../../../../public/images/info.outline.react.svg?url";
+import CopyReactSvgUrl from "../../../../public/images/copy.react.svg?url";
+import DuplicateReactSvgUrl from "../../../../public/images/duplicate.react.svg?url";
+import DownloadReactSvgUrl from "../../../../public/images/download.react.svg?url";
+import DownloadAsReactSvgUrl from "../../../../public/images/download-as.react.svg?url";
+import RenameReactSvgUrl from "../../../../public/images/rename.react.svg?url";
+import TrashReactSvgUrl from "../../../../public/images/trash.react.svg?url";
+import MoveReactSvgUrl from "../../../../public/images/duplicate.react.svg?url";
+
 const mediaTypes = Object.freeze({
   audio: 1,
   video: 2,
@@ -507,21 +516,21 @@ class MediaViewer extends React.Component {
         {
           key: "download",
           label: t("Common:Download"),
-          icon: "images/download.react.svg",
+          icon: { DownloadReactSvgUrl },
           onClick: () => onClickDownload(targetFile, t),
           disabled: false,
         },
         {
           key: "rename",
           label: t("Rename"),
-          icon: "images/rename.react.svg",
+          icon: { RenameReactSvgUrl },
           onClick: () => onClickRename(targetFile),
           disabled: false,
         },
         {
           key: "delete",
           label: t("Common:Delete"),
-          icon: "images/trash.react.svg",
+          icon: { TrashReactSvgUrl },
           onClick: () => onClickDelete(targetFile, t),
           disabled: false,
         },
@@ -532,7 +541,7 @@ class MediaViewer extends React.Component {
           id: "option_room-info",
           key: "room-info",
           label: t("Common:Info"),
-          icon: "/static/images/info.outline.react.svg",
+          icon: { InfoOutlineReactSvgUrl },
           onClick: () => {
             return onShowInfoPanel(targetFile);
           },
@@ -541,21 +550,21 @@ class MediaViewer extends React.Component {
         {
           key: "download",
           label: t("Common:Download"),
-          icon: "images/download.react.svg",
+          icon: { DownloadReactSvgUrl },
           onClick: () => onClickDownload(targetFile, t),
           disabled: false,
         },
         {
           key: "move-to",
           label: t("MoveTo"),
-          icon: "images/move.react.svg",
+          icon: { MoveReactSvgUrl },
           onClick: onMoveAction,
           disabled: isPreviewFile,
         },
         // {
         //   key: "download-as",
         //   label: t("Translations:DownloadAs"),
-        //   icon: "images/download-as.react.svg", // TODO: uncomment when we can download media by changing the format
+        //   icon: {DownloadAsReactSvgUrl}, // TODO: uncomment when we can download media by changing the format
         //   onClick: onClickDownloadAs,
         //   disabled: false,
         // },
@@ -563,7 +572,7 @@ class MediaViewer extends React.Component {
           id: "option_copy-to",
           key: "copy-to",
           label: t("Translations:Copy"),
-          icon: "/static/images/copy.react.svg",
+          icon: { CopyReactSvgUrl },
           onClick: onCopyAction,
           disabled: isPreviewFile,
         },
@@ -571,14 +580,14 @@ class MediaViewer extends React.Component {
           id: "option_create-copy",
           key: "copy",
           label: t("Common:Duplicate"),
-          icon: "/static/images/duplicate.react.svg",
+          icon: { DuplicateReactSvgUrl },
           onClick: () => onDuplicate(targetFile, t),
           disabled: isPreviewFile,
         },
         {
           key: "rename",
           label: t("Rename"),
-          icon: "images/rename.react.svg",
+          icon: { RenameReactSvgUrl },
           onClick: () => onClickRename(targetFile),
           disabled: isPreviewFile,
         },
@@ -591,7 +600,7 @@ class MediaViewer extends React.Component {
         {
           key: "delete",
           label: t("Common:Delete"),
-          icon: "images/trash.react.svg",
+          icon: { TrashReactSvgUrl },
           onClick: () => onClickDelete(targetFile, t),
           disabled: isPreviewFile,
         },

packages/common/components/Section/section.stories.js

@@ -17,6 +17,8 @@ import withReadme from "storybook-readme/with-readme";
 import { boolean, withKnobs } from "@storybook/addon-knobs/react";
 import Readme from "./README.md";
 import { Router } from "react-router-dom";
+import ActionsHeaderTouchReactSvgUrl from "../../../../public/images/actions.header.touch.react.svg?url";
+
 const { authStore } = store;
 
 const HeaderContent = styled.div`
@@ -63,7 +65,7 @@ const sectionHeaderContent = (
     />
     <Headline type="content">Section Header</Headline>
     <IconButton
-      iconName={"static/images/actions.header.touch.react.svg"}
+      iconName={ActionsHeaderTouchReactSvgUrl}
       size="16"
       onClick={(e) => action("PlusIcon Clicked")(e)}
     />

packages/components/empty-screen-container/empty-screen-container.stories.js

@@ -2,6 +2,7 @@ import React from "react";
 import EmptyScreenContainer from "./";
 import Link from "../link";
 import CrossReactSvgUrl from "../../../public/images/cross.react.svg";
+import EmptyScreenFilterPng from "../../../public/images/empty_screen_filter.png";
 
 export default {
   title: "Components/EmptyScreenContainer",
@@ -37,7 +38,7 @@ const Template = (args) => {
 export const Default = Template.bind({});
 
 Default.args = {
-  imageSrc: "/static/images/empty_screen_filter.png",
+  imageSrc: { EmptyScreenFilterPng },
   imageAlt: "Empty Screen Filter image",
   headerText: "No results matching your search could be found",
   subheadingText: "No files to be displayed in this section",

packages/components/selector/README.md

@@ -13,7 +13,7 @@ import Selector from "@docspace/components/selector";
   cancelButtonLabel="Cancel"
   emptyScreenDescription="The list of users previously invited to DocSpace or separate rooms will appear here. You will be able to invite these users for collaboration at any time."
   emptyScreenHeader="No other accounts here yet"
-  emptyScreenImage="static/images/empty_screen_filter.png"
+  emptyScreenImage={EmptyScreenFilterPng}
   hasNextPage={false}
   headerLabel="Room list"
   items={[]}
@@ -30,11 +30,11 @@ import Selector from "@docspace/components/selector";
   rowLoader={<></>}
   searchEmptyScreenDescription=" SEARCH !!! The list of users previously invited to DocSpace or separate rooms will appear here. You will be able to invite these users for collaboration at any time."
   searchEmptyScreenHeader="No other accounts here yet search"
-  searchEmptyScreenImage="static/images/empty_screen_filter.png"
+  searchEmptyScreenImage={EmptyScreenFilterPng}
   searchLoader={<></>}
   searchPlaceholder="Search"
   searchValue=""
-  selectAllIcon="static/images/room.archive.svg"
+  selectAllIcon={RoomArchiveSvgUrl}
   selectAllLabel="All accounts"
   selectedAccessRight={{}}
   selectedItems={[]}

packages/components/viewer/index.js

@@ -13,6 +13,7 @@ import IconButton from "@docspace/components/icon-button";
 
 import { isMobileOnly } from "react-device-detect";
 
+import ViewerMediaCloseSvgUrl from "../../../public/images/viewer.media.close.svg?url";
 import MediaNextIcon from "../../../public/images/viewer.next.react.svg";
 import MediaPrevIcon from "../../../public/images/viewer.prew.react.svg";
 import ViewerPlayer from "./sub-components/viewer-player";
@@ -215,7 +216,7 @@ export const Viewer = (props) => {
             >
               <IconButton
                 color={"#fff"}
-                iconName="/static/images/viewer.media.close.svg"
+                iconName={ViewerMediaCloseSvgUrl}
                 size={28}
                 isClickable
               />