Feature/restore files convertation

packages/asc-web-common/api/files/index.js

@@ -734,3 +734,11 @@ export function setRecentSetting(set) {
     data: { set },
   });
 }
+
+export function hideConfirmConvert(save) {
+  return request({
+    method: "put",
+    url: "/files/hideconfirmconvert.json",
+    data: { save },
+  });
+}

packages/asc-web-common/components/FloatingButton/FloatingButton.js

@@ -27,7 +27,7 @@ const FloatingButton = ({ id, className, style, ...rest }) => {
   return (
     <StyledCircleWrap
       id={id}
-      className={className}
+      className={`${className} not-selectable`}
       style={style}
       icon={icon}
       onClick={onClick}

products/ASC.Files/Client/public/locales/en/ConvertDialog.json

@@ -1,7 +1,9 @@
 {
   "ConversionMessage": "All the documents you upload will be converted into Office Open XML format (docx, xlsx or pptx) for faster editing.",
+  "ConversionFileMessage": "The document file you open will be converted to the Office Open XML format for faster viewing and editing.",
   "ConversionTitle": "Document uploading",
+  "ConvertAndOpenTitle": "Convert and open document",
   "ConvertingLabel": "Converting files: {{file}} of {{totalFiles}}",
   "HideMessage": "Do not show this message again",
   "SaveOriginalFormatMessage": "Save the file copy in the original format"
-}
+}

products/ASC.Files/Client/public/locales/ru/ConvertDialog.json

@@ -1,7 +1,9 @@
 {
   "ConversionMessage": "Все документы, которые Вы загружаете, будут сконвертированы в соответствующий формат Office Open XML (docx, xlsx или pptx) для быстрого редактирования.",
+  "ConversionFileMessage": "Файл документа, который Вы открываете, будет сконвертирован в формат Office Open XML для быстрого просмотра и редактирования.",
   "ConversionTitle": "Загрузка документа",
+  "ConvertAndOpenTitle": "Конвертация и открытие документа",
   "ConvertingLabel": "Сконвертировано файлов: {{file}} из {{totalFiles}}",
   "HideMessage": "Больше не показывать это сообщение",
   "SaveOriginalFormatMessage": "Сохранить также копию файла в исходном формате"
-}
+}

products/ASC.Files/Client/src/HOCs/withBadges.js

@@ -7,20 +7,13 @@ import {
 } from "@appserver/common/constants";
 import toastr from "studio/toastr";
 import { combineUrl } from "@appserver/common/utils";
-import {
-  convertFile,
-  getFileConversationProgress,
-} from "@appserver/common/api/files";
+import { getFileConversationProgress } from "@appserver/common/api/files";
 
 import Badges from "../components/Badges";
 import config from "../../package.json";
 
 export default function withBadges(WrappedComponent) {
   class WithBadges extends React.Component {
-    constructor(props) {
-      super(props);
-      this.state = { showConvertDialog: false };
-    }
     onClickLock = () => {
       const { item, lockFileAction, isAdmin } = this.props;
       const { locked, id, access } = item;
@@ -74,27 +67,6 @@ export default function withBadges(WrappedComponent) {
       }
     };
 
-    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,
@@ -147,8 +119,13 @@ export default function withBadges(WrappedComponent) {
         }
       });
     };
+
+    setConvertDialogVisible = () => {
+      this.props.setConvertItem(this.props.item);
+      this.props.setConvertDialogVisible(true);
+    };
+
     render() {
-      const { showConvertDialog } = this.state;
       const {
         t,
         item,
@@ -188,16 +165,7 @@ export default function withBadges(WrappedComponent) {
       );
 
       return (
-        <>
-          {showConvertDialog && (
-            <ConvertDialog
-              visible={showConvertDialog}
-              onClose={this.setConvertDialogVisible}
-              onConvert={this.onConvert}
-            />
-          )}
-          <WrappedComponent badgesComponent={badgesComponent} {...this.props} />
-        </>
+        <WrappedComponent badgesComponent={badgesComponent} {...this.props} />
       );
     }
   }
@@ -226,7 +194,11 @@ export default function withBadges(WrappedComponent) {
       } = filesActionsStore;
       const { isTabletView } = auth.settingsStore;
       const { setIsVerHistoryPanel, fetchFileVersions } = versionHistoryStore;
-      const { setNewFilesPanelVisible } = dialogsStore;
+      const {
+        setNewFilesPanelVisible,
+        setConvertDialogVisible,
+        setConvertItem,
+      } = dialogsStore;
       const { filter, setIsLoading, fetchFiles } = filesStore;
       const { secondaryProgressDataStore } = uploadDataStore;
       const {
@@ -258,6 +230,8 @@ export default function withBadges(WrappedComponent) {
         setIsLoading,
         clearSecondaryProgressData,
         fetchFiles,
+        setConvertDialogVisible,
+        setConvertItem,
       };
     }
   )(observer(WithBadges));

products/ASC.Files/Client/src/HOCs/withContextOptions.js

@@ -98,8 +98,25 @@ export default function withContextOptions(WrappedComponent) {
     };
 
     onClickLinkEdit = () => {
+      const {
+        item,
+        canConvert,
+        setConvertItem,
+        setConvertDialogVisible,
+      } = this.props;
+
+      if (canConvert) {
+        setConvertItem(item);
+        setConvertDialogVisible(true);
+      } else {
+        onPreviewClick();
+      }
+    };
+
+    onPreviewClick = () => {
       const { item, openDocEditor } = this.props;
       const { id, providerKey } = item;
+
       openDocEditor(id, providerKey);
     };
 
@@ -300,7 +317,7 @@ export default function withContextOptions(WrappedComponent) {
               key: option,
               label: t("Preview"),
               icon: "/static/images/eye.react.svg",
-              onClick: this.onClickLinkEdit,
+              onClick: this.onPreviewClick,
               disabled: false,
             };
           case "view":

products/ASC.Files/Client/src/HOCs/withFileActions.js

@@ -138,13 +138,16 @@ export default function withFileActions(WrappedFileItem) {
         isImage,
         isSound,
         isVideo,
+        canConvert,
         canWebEdit,
         item,
         isTrashFolder,
         openDocEditor,
         expandedKeys,
         addExpandedKeys,
         setMediaViewerData,
+        setConvertItem,
+        setConvertDialogVisible,
       } = this.props;
       const {
         id,
@@ -172,6 +175,12 @@ export default function withFileActions(WrappedFileItem) {
           })
           .finally(() => setIsLoading(false));
       } else {
+        if (canConvert) {
+          setConvertItem(item);
+          setConvertDialogVisible(true);
+          return;
+        }
+
         if (fileStatus === 2) this.onMarkAsRead(id);
 
         if (canWebEdit) {
@@ -269,7 +278,11 @@ export default function withFileActions(WrappedFileItem) {
       { item, t, history }
     ) => {
       const { selectRowAction, onSelectItem, markAsRead } = filesActionsStore;
-      const { setSharingPanelVisible } = dialogsStore;
+      const {
+        setSharingPanelVisible,
+        setConvertDialogVisible,
+        setConvertItem,
+      } = dialogsStore;
       const {
         isPrivacyFolder,
         isRecycleBinFolder,
@@ -318,6 +331,7 @@ export default function withFileActions(WrappedFileItem) {
       const isSound = iconFormatsStore.isSound(item.fileExst);
       const isVideo = mediaViewersFormatsStore.isVideo(item.fileExst);
       const canWebEdit = docserviceStore.canWebEdit(item.fileExst);
+      const canConvert = docserviceStore.canConvert(item.fileExst);
 
       return {
         t,
@@ -349,13 +363,16 @@ export default function withFileActions(WrappedFileItem) {
         isSound,
         isVideo,
         canWebEdit,
+        canConvert,
         isTrashFolder: isRecycleBinFolder,
         openDocEditor,
         expandedKeys,
         addExpandedKeys,
         setMediaViewerData,
         getFolderInfo,
         markAsRead,
+        setConvertItem,
+        setConvertDialogVisible,
       };
     }
   )(observer(WithFileActions));

products/ASC.Files/Client/src/components/Badges.js

@@ -13,15 +13,15 @@ const Badges = ({
   item,
   canWebEdit,
   isTrashFolder,
-  /* canConvert, */
+  canConvert,
   accessToEdit,
   showNew,
   onFilesClick,
   onClickLock,
   onClickFavorite,
   onShowVersionHistory,
   onBadgeClick,
-  /*setConvertDialogVisible*/
+  setConvertDialogVisible,
 }) => {
   const { id, locked, fileStatus, versionGroup, title, fileExst } = item;
 
@@ -32,28 +32,32 @@ const Badges = ({
 
   return fileExst ? (
     <div className="badges additional-badges">
-      {/* TODO: Uncomment after fix conversation {canConvert && !isTrashFolder && (
-                  <IconButton
-                    onClick={setConvertDialogVisible}
-                    iconName="FileActionsConvertIcon"
-                    className="badge"
-                    size="small"
-                    isfill={true}
-                    color="#A3A9AE"
-                    hoverColor="#3B72A7"
-                  />
-      )} */}
-      {canWebEdit && !isTrashFolder && accessToEdit && showEditBadge && (
+      {canConvert && !isTrashFolder && (
         <IconButton
-          onClick={onFilesClick}
-          iconName="/static/images/access.edit.react.svg"
-          className="badge icons-group"
+          onClick={setConvertDialogVisible}
+          iconName="/static/images/refresh.react.svg"
+          className="badge"
           size="small"
           isfill={true}
           color="#A3A9AE"
           hoverColor="#3B72A7"
         />
       )}
+      {canWebEdit &&
+        !isTrashFolder &&
+        accessToEdit &&
+        showEditBadge &&
+        !canConvert && (
+          <IconButton
+            onClick={onFilesClick}
+            iconName="/static/images/access.edit.react.svg"
+            className="badge icons-group"
+            size="small"
+            isfill={true}
+            color="#A3A9AE"
+            hoverColor="#3B72A7"
+          />
+        )}
       {locked && accessToEdit && (
         <StyledFileActionsLockedIcon
           className="badge lock-file icons-group"

products/ASC.Files/Client/src/components/FilesPanels/index.js

@@ -17,6 +17,7 @@ import {
   DownloadDialog,
   ThirdPartyDialog,
   ConflictResolveDialog,
+  ConvertDialog,
 } from "../dialogs";
 
 const Panels = (props) => {
@@ -36,6 +37,7 @@ const Panels = (props) => {
     thirdPartyDialogVisible,
     newFilesPanelVisible,
     conflictResolveDialogVisible,
+    convertDialogVisible,
   } = props;
 
   return [
@@ -68,6 +70,7 @@ const Panels = (props) => {
     conflictResolveDialogVisible && (
       <ConflictResolveDialog key="conflict-resolve-dialog" />
     ),
+    convertDialogVisible && <ConvertDialog key="convert-dialog" />,
   ];
 };
 
@@ -87,6 +90,7 @@ export default inject(
       thirdPartyDialogVisible,
       newFilesPanelVisible,
       conflictResolveDialogVisible,
+      convertDialogVisible,
 
       connectItem, //TODO:
     } = dialogsStore;
@@ -110,6 +114,7 @@ export default inject(
       thirdPartyDialogVisible,
       newFilesPanelVisible,
       conflictResolveDialogVisible,
+      convertDialogVisible,
     };
   }
 )(observer(Panels));