Web: Files: refactoring FilesRowContent, withContentActions
This commit is contained in:
parent
0131520988
commit
6381a0c524
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,624 @@
|
||||
import React from "react";
|
||||
import { inject, observer } from "mobx-react";
|
||||
import { Trans } from "react-i18next";
|
||||
import { isMobile } from "react-device-detect";
|
||||
|
||||
import toastr from "studio/toastr";
|
||||
import {
|
||||
AppServerConfig,
|
||||
FileAction,
|
||||
ShareAccessRights,
|
||||
} from "@appserver/common/constants";
|
||||
import { combineUrl } from "@appserver/common/utils";
|
||||
import {
|
||||
convertFile,
|
||||
getFileConversationProgress,
|
||||
} from "@appserver/common/api/files";
|
||||
|
||||
import config from "../../../../../../../package.json";
|
||||
import EditingWrapperComponent from "../sub-components/EditingWrapperComponent";
|
||||
import { getTitleWithoutExst } from "../../../../../../helpers/files-helpers";
|
||||
import { cancelIcon, okIcon } from "../sub-components/icons";
|
||||
import { ConvertDialog } from "../../../../../dialogs";
|
||||
|
||||
export default function withContentActions(WrappedContent) {
|
||||
class WithContentActions extends React.Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
let titleWithoutExt = getTitleWithoutExst(props.item);
|
||||
|
||||
if (props.fileActionId === -1) {
|
||||
titleWithoutExt = this.getDefaultName(props.fileActionExt);
|
||||
}
|
||||
|
||||
this.state = {
|
||||
itemTitle: titleWithoutExt,
|
||||
showConvertDialog: false,
|
||||
//loading: false
|
||||
};
|
||||
}
|
||||
|
||||
componentDidUpdate(prevProps) {
|
||||
const { fileActionId, fileActionExt } = this.props;
|
||||
if (fileActionId === -1 && fileActionExt !== prevProps.fileActionExt) {
|
||||
const itemTitle = this.getDefaultName(fileActionExt);
|
||||
this.setState({ itemTitle });
|
||||
}
|
||||
// if (fileAction) {
|
||||
// if (fileActionId !== prevProps.fileActionId) {
|
||||
// this.setState({ editingId: fileActionId });
|
||||
// }
|
||||
// }
|
||||
}
|
||||
|
||||
getDefaultName = (format) => {
|
||||
const { t } = this.props;
|
||||
|
||||
switch (format) {
|
||||
case "docx":
|
||||
return t("NewDocument");
|
||||
case "xlsx":
|
||||
return t("NewSpreadsheet");
|
||||
case "pptx":
|
||||
return t("NewPresentation");
|
||||
default:
|
||||
return t("NewFolder");
|
||||
}
|
||||
};
|
||||
|
||||
completeAction = (id) => {
|
||||
const { editCompleteAction, item } = this.props;
|
||||
|
||||
const isCancel =
|
||||
(id.currentTarget && id.currentTarget.dataset.action === "cancel") ||
|
||||
id.keyCode === 27;
|
||||
editCompleteAction(id, item, isCancel);
|
||||
};
|
||||
|
||||
onFilesClick = () => {
|
||||
const {
|
||||
filter,
|
||||
parentFolder,
|
||||
setIsLoading,
|
||||
fetchFiles,
|
||||
isImage,
|
||||
isSound,
|
||||
isVideo,
|
||||
canWebEdit,
|
||||
item,
|
||||
isTrashFolder,
|
||||
openDocEditor,
|
||||
expandedKeys,
|
||||
addExpandedKeys,
|
||||
setMediaViewerData,
|
||||
} = this.props;
|
||||
const { id, fileExst, viewUrl, providerKey, contentLength } = item;
|
||||
|
||||
if (isTrashFolder) return;
|
||||
|
||||
if (!fileExst && !contentLength) {
|
||||
setIsLoading(true);
|
||||
|
||||
if (!expandedKeys.includes(parentFolder + "")) {
|
||||
addExpandedKeys(parentFolder + "");
|
||||
}
|
||||
|
||||
fetchFiles(id, filter)
|
||||
.catch((err) => {
|
||||
toastr.error(err);
|
||||
setIsLoading(false);
|
||||
})
|
||||
.finally(() => setIsLoading(false));
|
||||
} else {
|
||||
if (canWebEdit) {
|
||||
return openDocEditor(id, providerKey);
|
||||
}
|
||||
|
||||
if (isImage || isSound || isVideo) {
|
||||
setMediaViewerData({ visible: true, id });
|
||||
return;
|
||||
}
|
||||
|
||||
return window.open(viewUrl, "_blank");
|
||||
}
|
||||
};
|
||||
|
||||
updateItem = () => {
|
||||
const {
|
||||
updateFile,
|
||||
renameFolder,
|
||||
item,
|
||||
setIsLoading,
|
||||
fileActionId,
|
||||
editCompleteAction,
|
||||
} = this.props;
|
||||
|
||||
const { itemTitle } = this.state;
|
||||
const originalTitle = getTitleWithoutExst(item);
|
||||
|
||||
setIsLoading(true);
|
||||
const isSameTitle =
|
||||
originalTitle.trim() === itemTitle.trim() || itemTitle.trim() === "";
|
||||
if (isSameTitle) {
|
||||
this.setState({
|
||||
itemTitle: originalTitle,
|
||||
});
|
||||
return editCompleteAction(fileActionId, item, isSameTitle);
|
||||
}
|
||||
|
||||
item.fileExst || item.contentLength
|
||||
? updateFile(fileActionId, itemTitle)
|
||||
.then(() => this.completeAction(fileActionId))
|
||||
.finally(() => setIsLoading(false))
|
||||
: renameFolder(fileActionId, itemTitle)
|
||||
.then(() => this.completeAction(fileActionId))
|
||||
.finally(() => setIsLoading(false));
|
||||
};
|
||||
|
||||
cancelUpdateItem = (e) => {
|
||||
const { item } = this.props;
|
||||
|
||||
const originalTitle = getTitleWithoutExst(item);
|
||||
this.setState({
|
||||
itemTitle: originalTitle,
|
||||
});
|
||||
|
||||
return this.completeAction(e);
|
||||
};
|
||||
|
||||
onClickUpdateItem = (e) => {
|
||||
const { fileActionType } = this.props;
|
||||
|
||||
fileActionType === FileAction.Create
|
||||
? this.createItem(e)
|
||||
: this.updateItem(e);
|
||||
};
|
||||
|
||||
createItem = (e) => {
|
||||
const {
|
||||
createFile,
|
||||
item,
|
||||
setIsLoading,
|
||||
openDocEditor,
|
||||
isPrivacy,
|
||||
isDesktop,
|
||||
replaceFileStream,
|
||||
t,
|
||||
setEncryptionAccess,
|
||||
createFolder,
|
||||
} = this.props;
|
||||
const { itemTitle } = this.state;
|
||||
|
||||
setIsLoading(true);
|
||||
|
||||
const itemId = e.currentTarget.dataset.itemid;
|
||||
|
||||
if (itemTitle.trim() === "") {
|
||||
toastr.warning(t("CreateWithEmptyTitle"));
|
||||
return this.completeAction(itemId);
|
||||
}
|
||||
|
||||
let tab =
|
||||
!isDesktop && item.fileExst
|
||||
? window.open(
|
||||
combineUrl(
|
||||
AppServerConfig.proxyURL,
|
||||
config.homepage,
|
||||
"/products/files/doceditor"
|
||||
),
|
||||
"_blank"
|
||||
)
|
||||
: null;
|
||||
|
||||
!item.fileExst && !item.contentLength
|
||||
? createFolder(item.parentId, itemTitle)
|
||||
.then(() => this.completeAction(itemId))
|
||||
.then(() =>
|
||||
toastr.success(
|
||||
<Trans t={t} i18nKey="FolderCreated" ns="Home">
|
||||
New folder {{ itemTitle }} is created
|
||||
</Trans>
|
||||
)
|
||||
)
|
||||
.catch((e) => toastr.error(e))
|
||||
.finally(() => {
|
||||
return setIsLoading(false);
|
||||
})
|
||||
: createFile(item.parentId, `${itemTitle}.${item.fileExst}`)
|
||||
.then((file) => {
|
||||
if (isPrivacy) {
|
||||
return setEncryptionAccess(file).then((encryptedFile) => {
|
||||
if (!encryptedFile) return Promise.resolve();
|
||||
toastr.info(t("EncryptedFileSaving"));
|
||||
return replaceFileStream(
|
||||
file.id,
|
||||
encryptedFile,
|
||||
true,
|
||||
false
|
||||
).then(() =>
|
||||
openDocEditor(file.id, file.providerKey, tab, file.webUrl)
|
||||
);
|
||||
});
|
||||
}
|
||||
return openDocEditor(file.id, file.providerKey, tab, file.webUrl);
|
||||
})
|
||||
.then(() => this.completeAction(itemId))
|
||||
.then(() => {
|
||||
const exst = item.fileExst;
|
||||
return toastr.success(
|
||||
<Trans i18nKey="FileCreated" ns="Home">
|
||||
New file {{ itemTitle }}.{{ exst }} is created
|
||||
</Trans>
|
||||
);
|
||||
})
|
||||
.catch((e) => toastr.error(e))
|
||||
.finally(() => {
|
||||
return setIsLoading(false);
|
||||
});
|
||||
};
|
||||
|
||||
renameTitle = (e) => {
|
||||
const { t } = this.props;
|
||||
|
||||
let title = e.target.value;
|
||||
//const chars = '*+:"<>?|/'; TODO: think how to solve problem with interpolation escape values in i18n translate
|
||||
const regexp = new RegExp('[*+:"<>?|\\\\/]', "gim");
|
||||
if (title.match(regexp)) {
|
||||
toastr.warning(t("ContainsSpecCharacter"));
|
||||
}
|
||||
title = title.replace(regexp, "_");
|
||||
return this.setState({ itemTitle: title });
|
||||
};
|
||||
|
||||
getStatusByDate = () => {
|
||||
const { culture, t, item, sectionWidth } = this.props;
|
||||
const { created, updated, version, fileExst } = item;
|
||||
|
||||
const title =
|
||||
version > 1
|
||||
? t("TitleModified")
|
||||
: fileExst
|
||||
? t("TitleUploaded")
|
||||
: t("TitleCreated");
|
||||
|
||||
const date = fileExst ? updated : created;
|
||||
const dateLabel = new Date(date).toLocaleString(culture);
|
||||
const mobile = (sectionWidth && sectionWidth <= 375) || isMobile;
|
||||
|
||||
return mobile ? dateLabel : `${title}: ${dateLabel}`;
|
||||
};
|
||||
|
||||
onShowVersionHistory = () => {
|
||||
const {
|
||||
homepage,
|
||||
isTabletView,
|
||||
item,
|
||||
setIsVerHistoryPanel,
|
||||
fetchFileVersions,
|
||||
history,
|
||||
isTrashFolder,
|
||||
} = this.props;
|
||||
if (isTrashFolder) return;
|
||||
|
||||
if (!isTabletView) {
|
||||
fetchFileVersions(item.id + "");
|
||||
setIsVerHistoryPanel(true);
|
||||
} else {
|
||||
history.push(
|
||||
combineUrl(AppServerConfig.proxyURL, homepage, `/${item.id}/history`)
|
||||
);
|
||||
}
|
||||
};
|
||||
|
||||
onBadgeClick = () => {
|
||||
const {
|
||||
item,
|
||||
selectedFolderPathParts,
|
||||
markAsRead,
|
||||
setNewFilesPanelVisible,
|
||||
setNewFilesIds,
|
||||
updateRootBadge,
|
||||
updateFileBadge,
|
||||
} = this.props;
|
||||
if (item.fileExst) {
|
||||
markAsRead([], [item.id])
|
||||
.then(() => {
|
||||
updateRootBadge(selectedFolderPathParts[0], 1);
|
||||
updateFileBadge(item.id);
|
||||
})
|
||||
.catch((err) => toastr.error(err));
|
||||
} else {
|
||||
setNewFilesPanelVisible(true);
|
||||
const newFolderIds = selectedFolderPathParts;
|
||||
newFolderIds.push(item.id);
|
||||
setNewFilesIds(newFolderIds);
|
||||
}
|
||||
};
|
||||
|
||||
setConvertDialogVisible = () =>
|
||||
this.setState({ showConvertDialog: !this.state.showConvertDialog });
|
||||
|
||||
onConvert = () => {
|
||||
const { item, t, setSecondaryProgressBarData } = this.props;
|
||||
setSecondaryProgressBarData({
|
||||
icon: "file",
|
||||
visible: true,
|
||||
percent: 0,
|
||||
label: t("Convert"),
|
||||
alert: false,
|
||||
});
|
||||
this.setState({ showConvertDialog: false }, () =>
|
||||
convertFile(item.id).then((convertRes) => {
|
||||
if (convertRes && convertRes[0] && convertRes[0].progress !== 100) {
|
||||
this.getConvertProgress(item.id);
|
||||
}
|
||||
})
|
||||
);
|
||||
};
|
||||
|
||||
getConvertProgress = (fileId) => {
|
||||
const {
|
||||
selectedFolderId,
|
||||
filter,
|
||||
setIsLoading,
|
||||
setSecondaryProgressBarData,
|
||||
t,
|
||||
clearSecondaryProgressData,
|
||||
fetchFiles,
|
||||
} = this.props;
|
||||
getFileConversationProgress(fileId).then((res) => {
|
||||
if (res && res[0] && res[0].progress !== 100) {
|
||||
setSecondaryProgressBarData({
|
||||
icon: "file",
|
||||
visible: true,
|
||||
percent: res[0].progress,
|
||||
label: t("Convert"),
|
||||
alert: false,
|
||||
});
|
||||
setTimeout(() => this.getConvertProgress(fileId), 1000);
|
||||
} else {
|
||||
if (res[0].error) {
|
||||
setSecondaryProgressBarData({
|
||||
visible: true,
|
||||
alert: true,
|
||||
});
|
||||
toastr.error(res[0].error);
|
||||
setTimeout(() => clearSecondaryProgressData(), TIMEOUT);
|
||||
} else {
|
||||
setSecondaryProgressBarData({
|
||||
icon: "file",
|
||||
visible: true,
|
||||
percent: 100,
|
||||
label: t("Convert"),
|
||||
alert: false,
|
||||
});
|
||||
setTimeout(() => clearSecondaryProgressData(), TIMEOUT);
|
||||
const newFilter = filter.clone();
|
||||
fetchFiles(selectedFolderId, newFilter)
|
||||
.catch((err) => {
|
||||
setSecondaryProgressBarData({
|
||||
visible: true,
|
||||
alert: true,
|
||||
});
|
||||
//toastr.error(err);
|
||||
setTimeout(() => clearSecondaryProgressData(), TIMEOUT);
|
||||
})
|
||||
.finally(() => setIsLoading(false));
|
||||
}
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
onClickLock = () => {
|
||||
const { item, lockFileAction } = this.props;
|
||||
const { locked, id } = item;
|
||||
|
||||
lockFileAction(id, !locked).catch((err) => toastr.error(err));
|
||||
};
|
||||
|
||||
onClickFavorite = () => {
|
||||
const { t, item, setFavoriteAction } = this.props;
|
||||
|
||||
setFavoriteAction("remove", item.id)
|
||||
.then(() => toastr.success(t("RemovedFromFavorites")))
|
||||
.catch((err) => toastr.error(err));
|
||||
};
|
||||
|
||||
render() {
|
||||
const { itemTitle, showConvertDialog } = this.state;
|
||||
const {
|
||||
item,
|
||||
fileActionId,
|
||||
fileActionExt,
|
||||
isLoading,
|
||||
viewer,
|
||||
t,
|
||||
isTrashFolder,
|
||||
canWebEdit,
|
||||
canConvert,
|
||||
} = this.props;
|
||||
const { id, fileExst, updated, createdBy, access, fileStatus } = item;
|
||||
|
||||
const titleWithoutExt = getTitleWithoutExst(item);
|
||||
|
||||
const isEdit = id === fileActionId && fileExst === fileActionExt;
|
||||
|
||||
const updatedDate = updated && this.getStatusByDate();
|
||||
|
||||
const fileOwner =
|
||||
createdBy &&
|
||||
((viewer.id === createdBy.id && t("AuthorMe")) ||
|
||||
createdBy.displayName);
|
||||
|
||||
const accessToEdit =
|
||||
access === ShareAccessRights.FullAccess ||
|
||||
access === ShareAccessRights.None; // TODO: fix access type for owner (now - None)
|
||||
|
||||
const linkStyles = isTrashFolder //|| window.innerWidth <= 1024
|
||||
? { noHover: true }
|
||||
: { onClick: this.onFilesClick };
|
||||
|
||||
const newItems = item.new || fileStatus === 2;
|
||||
const showNew = !!newItems;
|
||||
|
||||
return isEdit ? (
|
||||
<EditingWrapperComponent
|
||||
itemTitle={itemTitle}
|
||||
okIcon={okIcon}
|
||||
cancelIcon={cancelIcon}
|
||||
itemId={id}
|
||||
isLoading={isLoading}
|
||||
renameTitle={this.renameTitle}
|
||||
onClickUpdateItem={this.onClickUpdateItem}
|
||||
cancelUpdateItem={this.cancelUpdateItem}
|
||||
/>
|
||||
) : (
|
||||
<>
|
||||
{showConvertDialog && (
|
||||
<ConvertDialog
|
||||
visible={showConvertDialog}
|
||||
onClose={this.setConvertDialogVisible}
|
||||
onConvert={this.onConvert}
|
||||
/>
|
||||
)}
|
||||
<WrappedContent
|
||||
titleWithoutExt={titleWithoutExt}
|
||||
updatedDate={updatedDate}
|
||||
fileOwner={fileOwner}
|
||||
accessToEdit={accessToEdit}
|
||||
linkStyles={linkStyles}
|
||||
newItems={newItems}
|
||||
showNew={showNew}
|
||||
canWebEdit={canWebEdit}
|
||||
canConvert={canConvert}
|
||||
isTrashFolder={isTrashFolder}
|
||||
onFilesClick={this.onFilesClick}
|
||||
onShowVersionHistory={this.onShowVersionHistory}
|
||||
onBadgeClick={this.onBadgeClick}
|
||||
onClickLock={this.onClickLock}
|
||||
onClickFavorite={this.onClickFavorite}
|
||||
setConvertDialogVisible={this.setConvertDialogVisible}
|
||||
{...this.props}
|
||||
/>
|
||||
</>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
return inject(
|
||||
(
|
||||
{
|
||||
filesActionsStore,
|
||||
filesStore,
|
||||
selectedFolderStore,
|
||||
formatsStore,
|
||||
treeFoldersStore,
|
||||
mediaViewerDataStore,
|
||||
auth,
|
||||
versionHistoryStore,
|
||||
dialogsStore,
|
||||
uploadDataStore,
|
||||
},
|
||||
{ item, t, history }
|
||||
) => {
|
||||
const {
|
||||
editCompleteAction,
|
||||
markAsRead,
|
||||
lockFileAction,
|
||||
setFavoriteAction,
|
||||
} = filesActionsStore;
|
||||
const {
|
||||
filter,
|
||||
setIsLoading,
|
||||
fetchFiles,
|
||||
openDocEditor,
|
||||
updateFile,
|
||||
renameFolder,
|
||||
createFile,
|
||||
createFolder,
|
||||
isLoading,
|
||||
updateFileBadge,
|
||||
} = filesStore;
|
||||
const {
|
||||
iconFormatsStore,
|
||||
mediaViewersFormatsStore,
|
||||
docserviceStore,
|
||||
} = formatsStore;
|
||||
const {
|
||||
isRecycleBinFolder,
|
||||
expandedKeys,
|
||||
addExpandedKeys,
|
||||
isPrivacyFolder,
|
||||
updateRootBadge,
|
||||
} = treeFoldersStore;
|
||||
const { setMediaViewerData } = mediaViewerDataStore;
|
||||
const {
|
||||
type: fileActionType,
|
||||
extension: fileActionExt,
|
||||
id: fileActionId,
|
||||
} = filesStore.fileActionStore;
|
||||
const { replaceFileStream, setEncryptionAccess } = auth;
|
||||
const { culture, isDesktopClient, isTabletView } = auth.settingsStore;
|
||||
const { setIsVerHistoryPanel, fetchFileVersions } = versionHistoryStore;
|
||||
const { setNewFilesPanelVisible, setNewFilesIds } = dialogsStore;
|
||||
const { secondaryProgressDataStore } = uploadDataStore;
|
||||
|
||||
const {
|
||||
setSecondaryProgressBarData,
|
||||
clearSecondaryProgressData,
|
||||
} = secondaryProgressDataStore;
|
||||
const isImage = iconFormatsStore.isImage(item.fileExst);
|
||||
const isSound = iconFormatsStore.isSound(item.fileExst);
|
||||
const isVideo = mediaViewersFormatsStore.isVideo(item.fileExst);
|
||||
const canWebEdit = docserviceStore.canWebEdit(item.fileExst);
|
||||
return {
|
||||
t,
|
||||
editCompleteAction,
|
||||
filter,
|
||||
parentFolder: selectedFolderStore.parentId,
|
||||
setIsLoading,
|
||||
fetchFiles,
|
||||
isImage,
|
||||
isSound,
|
||||
isVideo,
|
||||
canWebEdit,
|
||||
isTrashFolder: isRecycleBinFolder,
|
||||
openDocEditor,
|
||||
expandedKeys,
|
||||
addExpandedKeys,
|
||||
setMediaViewerData,
|
||||
updateFile,
|
||||
renameFolder,
|
||||
fileActionId,
|
||||
editCompleteAction,
|
||||
fileActionType,
|
||||
createFile,
|
||||
isPrivacy: isPrivacyFolder,
|
||||
isDesktop: isDesktopClient,
|
||||
replaceFileStream,
|
||||
setEncryptionAccess,
|
||||
createFolder,
|
||||
fileActionExt,
|
||||
isLoading,
|
||||
culture,
|
||||
homepage: config.homepage,
|
||||
isTabletView,
|
||||
setIsVerHistoryPanel,
|
||||
fetchFileVersions,
|
||||
history,
|
||||
selectedFolderPathParts: selectedFolderStore.pathParts,
|
||||
markAsRead,
|
||||
setNewFilesPanelVisible,
|
||||
setNewFilesIds,
|
||||
updateRootBadge,
|
||||
updateFileBadge,
|
||||
setSecondaryProgressBarData,
|
||||
clearSecondaryProgressData,
|
||||
selectedFolderId: selectedFolderStore.id,
|
||||
lockFileAction,
|
||||
setFavoriteAction,
|
||||
viewer: auth.userStore.user,
|
||||
};
|
||||
}
|
||||
)(observer(WithContentActions));
|
||||
}
|
@ -1,5 +1,14 @@
|
||||
import React from "react";
|
||||
import styled from "styled-components";
|
||||
|
||||
import commonIconsStyles from "@appserver/components/utils/common-icons-style";
|
||||
|
||||
import CheckIcon from "../../../../../../../public/images/check.react.svg";
|
||||
import CrossIcon from "../../../../../../../../../../public/images/cross.react.svg";
|
||||
import FavoriteIcon from "../../../../../../../public/images/favorite.react.svg";
|
||||
import FileActionsConvertEditDocIcon from "../../../../../../../public/images/file.actions.convert.edit.doc.react.svg";
|
||||
import FileActionsLockedIcon from "../../../../../../../public/images/file.actions.locked.react.svg";
|
||||
|
||||
export const EncryptedFileIcon = styled.div`
|
||||
background: url("images/security.svg") no-repeat 0 0 / 16px 16px transparent;
|
||||
height: 16px;
|
||||
@ -8,3 +17,47 @@ export const EncryptedFileIcon = styled.div`
|
||||
margin-top: 14px;
|
||||
margin-left: ${(props) => (props.isEdit ? "40px" : "12px")};
|
||||
`;
|
||||
|
||||
const StyledCheckIcon = styled(CheckIcon)`
|
||||
${commonIconsStyles}
|
||||
path {
|
||||
fill: #a3a9ae;
|
||||
}
|
||||
:hover {
|
||||
fill: #657077;
|
||||
}
|
||||
`;
|
||||
export const okIcon = <StyledCheckIcon className="edit-ok-icon" size="scale" />;
|
||||
|
||||
const StyledCrossIcon = styled(CrossIcon)`
|
||||
${commonIconsStyles}
|
||||
path {
|
||||
fill: #a3a9ae;
|
||||
}
|
||||
:hover {
|
||||
fill: #657077;
|
||||
}
|
||||
`;
|
||||
export const cancelIcon = (
|
||||
<StyledCrossIcon className="edit-cancel-icon" size="scale" />
|
||||
);
|
||||
|
||||
export const StyledFavoriteIcon = styled(FavoriteIcon)`
|
||||
${commonIconsStyles}
|
||||
`;
|
||||
|
||||
export const StyledFileActionsConvertEditDocIcon = styled(
|
||||
FileActionsConvertEditDocIcon
|
||||
)`
|
||||
${commonIconsStyles}
|
||||
path {
|
||||
fill: #3b72a7;
|
||||
}
|
||||
`;
|
||||
|
||||
export const StyledFileActionsLockedIcon = styled(FileActionsLockedIcon)`
|
||||
${commonIconsStyles}
|
||||
path {
|
||||
fill: #3b72a7;
|
||||
}
|
||||
`;
|
||||
|
Loading…
Reference in New Issue
Block a user