Web: Doceditor: fixed render dialogs

This commit is contained in:
Artem Tarasov 2022-03-24 11:40:05 +03:00
parent 1cdb996b62
commit 8741870f63
2 changed files with 77 additions and 87 deletions

View File

@ -4,24 +4,20 @@ import React from "react";
// import Error520 from "studio/Error520";
// import Error404 from "studio/Error404";
export function loadComponent(scope, module, moduleName = null) {
export function loadComponent(scope, module) {
return async () => {
// Initializes the share scope. This fills it with known provided modules from this build and all remotes
await __webpack_init_sharing__("default");
const container = window[scope]; // or get the container somewhere else
// Initialize the container, it may provide shared modules
await container.init(__webpack_share_scopes__.default);
console.log(container);
const factory = await window[scope].get(module);
const Module = factory();
if (moduleName)
window[moduleName] =
moduleName === "filesUtils" ? Module : Module.default;
return Module;
};
}
const useDynamicScript = (args) => {
export const useDynamicScript = (args) => {
const [ready, setReady] = React.useState(false);
const [failed, setFailed] = React.useState(false);
@ -29,6 +25,7 @@ const useDynamicScript = (args) => {
if (!args.url) {
return;
}
const exists = document.getElementById(args.id);
if (exists) {
@ -61,10 +58,10 @@ const useDynamicScript = (args) => {
document.head.appendChild(element);
//TODO: Comment if you don't want to remove loaded remoteEntry
return () => {
console.log(`Dynamic Script Removed: ${args.url}`);
// document.head.removeChild(element);
};
// return () => {
// console.log(`Dynamic Script Removed: ${args.url}`);
// document.head.removeChild(element);
// };
}, [args.url]);
return {

View File

@ -26,7 +26,7 @@ const withDialogs = (WrappedComponent) => {
const { t } = useTranslation();
const { fileInfo, fileId } = props;
const { fileInfo, fileId, mfReady } = props;
const onSDKRequestSharingSettings = () => {
setIsVisible(true);
@ -206,89 +206,82 @@ const withDialogs = (WrappedComponent) => {
setTitleSelectorFolder(e.target.value);
};
const sharingDialog = React.useMemo(
() => (
<DynamicComponent
className="dynamic-sharing-dialog"
system={{
scope: FILES_SCOPE,
url: FILES_REMOTE_ENTRY_URL,
module: "./SharingDialog",
name: "SharingDialog",
}}
isVisible={isVisible}
sharingObject={fileInfo}
onCancel={onCancel}
onSuccess={loadUsersRightsList}
/>
),
[isVisible]
const sharingDialog = mfReady && (
<DynamicComponent
className="dynamic-sharing-dialog"
system={{
scope: FILES_SCOPE,
url: FILES_REMOTE_ENTRY_URL,
module: "./SharingDialog",
name: "SharingDialog",
}}
isVisible={isVisible}
sharingObject={fileInfo}
onCancel={onCancel}
onSuccess={loadUsersRightsList}
/>
);
const selectFileDialog = React.useMemo(
() => (
<DynamicComponent
system={{
scope: FILES_SCOPE,
url: FILES_REMOTE_ENTRY_URL,
module: "./SelectFileDialog",
}}
resetTreeFolders
foldersType="exceptPrivacyTrashFolders"
isPanelVisible={isFileDialogVisible}
onSelectFile={onSelectFile}
onClose={onCloseFileDialog}
{...fileTypeDetection()}
titleFilesList={selectFilesListTitle()}
headerName={t("SelectFileTitle")}
/>
),
[isFileDialogVisible]
const fileType = fileTypeDetection();
const selectFileDialog = mfReady && (
<DynamicComponent
system={{
scope: FILES_SCOPE,
url: FILES_REMOTE_ENTRY_URL,
module: "./SelectFileDialog",
}}
resetTreeFolders
foldersType="exceptPrivacyTrashFolders"
isPanelVisible={isFileDialogVisible}
onSelectFile={onSelectFile}
onClose={onCloseFileDialog}
{...fileType}
titleFilesList={selectFilesListTitle()}
headerName={t("SelectFileTitle")}
/>
);
const selectFolderDialog = React.useMemo(
() => (
<DynamicComponent
resetTreeFolders
showButtons
isSetFolderImmediately
asideHeightContent="calc(100% - 50px)"
foldersType="exceptSortedByTags"
system={{
scope: FILES_SCOPE,
url: FILES_REMOTE_ENTRY_URL,
module: "./SelectFolderDialog",
}}
isPanelVisible={isFolderDialogVisible}
onClose={onCloseFolderDialog}
onSave={onClickSaveSelectFolder}
headerName={t("FolderForSave")}
header={
const selectFolderDialog = mfReady && (
<DynamicComponent
resetTreeFolders
showButtons
isSetFolderImmediately
asideHeightContent="calc(100% - 50px)"
foldersType="exceptSortedByTags"
system={{
scope: FILES_SCOPE,
url: FILES_REMOTE_ENTRY_URL,
module: "./SelectFolderDialog",
}}
isPanelVisible={isFolderDialogVisible}
onClose={onCloseFolderDialog}
onSave={onClickSaveSelectFolder}
headerName={t("FolderForSave")}
header={
<StyledSelectFolder>
<Text className="editor-select-folder_text">{t("FileName")}</Text>
<TextInput
className="editor-select-folder_text-input"
scale
onChange={onChangeInput}
value={titleSelectorFolder}
/>
</StyledSelectFolder>
}
{...(extension !== "fb2" && {
footer: (
<StyledSelectFolder>
<Text className="editor-select-folder_text">{t("FileName")}</Text>
<TextInput
className="editor-select-folder_text-input"
scale
onChange={onChangeInput}
value={titleSelectorFolder}
<Checkbox
className="editor-select-folder_checkbox"
label={t("OpenSavedDocument")}
onChange={onClickCheckbox}
isChecked={openNewTab}
/>
</StyledSelectFolder>
}
{...(extension !== "fb2" && {
footer: (
<StyledSelectFolder>
<Checkbox
className="editor-select-folder_checkbox"
label={t("OpenSavedDocument")}
onChange={onClickCheckbox}
isChecked={openNewTab}
/>
</StyledSelectFolder>
),
})}
/>
),
[openNewTab, titleSelectorFolder, isFolderDialogVisible]
),
})}
/>
);
return (