From dd93f09ebcdae99da748645fde19fe8442049d1c Mon Sep 17 00:00:00 2001 From: Timofey Boyko Date: Thu, 22 Aug 2024 12:26:48 +0300 Subject: [PATCH 1/4] Doceditor: UseSocketHelper: fix eslint --- packages/doceditor/src/hooks/useSocketHelper.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/doceditor/src/hooks/useSocketHelper.ts b/packages/doceditor/src/hooks/useSocketHelper.ts index 9eeb1a98b7..7ccca3856e 100644 --- a/packages/doceditor/src/hooks/useSocketHelper.ts +++ b/packages/doceditor/src/hooks/useSocketHelper.ts @@ -95,7 +95,7 @@ const useSocketHelper = ({ socketUrl, user }: UseSocketHelperProps) => { }); setSocketHelper(socketIOHelper); - }, [socketHelper, socketUrl]); + }, [socketHelper, socketUrl, user?.id, user?.loginEventId]); return { socketHelper }; }; From 817b1aae0cd5513321a58a0a94ed57718a767a51 Mon Sep 17 00:00:00 2001 From: Timofey Boyko Date: Thu, 22 Aug 2024 12:46:24 +0300 Subject: [PATCH 2/4] Doceditor: fix ts problems --- packages/doceditor/src/app/(root)/layout.tsx | 10 +--------- packages/doceditor/src/components/Error/Error.tsx | 4 +--- packages/doceditor/src/components/Root.tsx | 11 +++-------- .../doceditor/src/components/file-password/index.tsx | 2 +- .../doceditor/src/providers/TranslationProvider.tsx | 7 ------- packages/doceditor/src/providers/index.tsx | 4 ++-- packages/doceditor/src/utils/actions.ts | 2 -- 7 files changed, 8 insertions(+), 32 deletions(-) diff --git a/packages/doceditor/src/app/(root)/layout.tsx b/packages/doceditor/src/app/(root)/layout.tsx index 6e4f1b65b6..6e22a44e5a 100644 --- a/packages/doceditor/src/app/(root)/layout.tsx +++ b/packages/doceditor/src/app/(root)/layout.tsx @@ -55,18 +55,14 @@ export default async function RootLayout({ return <>; } - const startDate = new Date(); const [user, settings, colorTheme] = await Promise.all([ getUser(), getSettings(), getColorTheme(), ]); - const timer = new Date().getTime() - startDate.getTime(); if (settings === "access-restricted") redirect(`${getBaseUrl()}/${settings}`); - const api_host = process.env.API_HOST?.trim(); - return ( @@ -82,11 +78,7 @@ export default async function RootLayout({ - + {children} diff --git a/packages/doceditor/src/components/Error/Error.tsx b/packages/doceditor/src/components/Error/Error.tsx index 832c230346..e26f254ea3 100644 --- a/packages/doceditor/src/components/Error/Error.tsx +++ b/packages/doceditor/src/components/Error/Error.tsx @@ -9,7 +9,6 @@ import type { TFirebaseSettings } from "@docspace/shared/api/settings/types"; import useI18N from "@/hooks/useI18N"; import useTheme from "@/hooks/useTheme"; import useDeviceType from "@/hooks/useDeviceType"; -import useWhiteLabel from "@/hooks/useWhiteLabel"; import pkg from "../../../package.json"; @@ -18,7 +17,7 @@ import { ErrorProps } from "./Error.types"; const Error = ({ settings, user, error }: ErrorProps) => { const { i18n } = useI18N({ settings, user }); const { currentDeviceType } = useDeviceType(); - const { logoUrls } = useWhiteLabel(); + const { theme } = useTheme({ user }); const firebaseHelper = useMemo(() => { @@ -32,7 +31,6 @@ const Error = ({ settings, user, error }: ErrorProps) => { errorLog={error} version={pkg.version} user={user ?? ({} as TUser)} - whiteLabelLogoUrls={logoUrls} firebaseHelper={firebaseHelper} currentDeviceType={currentDeviceType} /> diff --git a/packages/doceditor/src/components/Root.tsx b/packages/doceditor/src/components/Root.tsx index 378b9aac04..b2aadac2c9 100644 --- a/packages/doceditor/src/components/Root.tsx +++ b/packages/doceditor/src/components/Root.tsx @@ -26,14 +26,14 @@ "use client"; -import React, { useEffect } from "react"; +import React from "react"; import { useTranslation } from "react-i18next"; import ErrorContainer from "@docspace/shared/components/error-container/ErrorContainer"; import { TResponse } from "@/types"; -import useError from "@/hooks/useError"; +import useError from "@/hooks/useError"; import useRootInit from "@/hooks/useRootInit"; import useDeepLink from "@/hooks/useDeepLink"; import useSelectFileDialog from "@/hooks/useSelectFileDialog"; @@ -46,6 +46,7 @@ import useStartFillingSelectDialog from "@/hooks/useStartFillingSelectDialog"; import DeepLink from "./deep-link"; import Editor from "./Editor"; + import SelectFileDialog from "./SelectFileDialog"; import SelectFolderDialog from "./SelectFolderDialog"; import SharingDialog from "./ShareDialog"; @@ -64,7 +65,6 @@ const Root = ({ doc, fileId, hash, - timer, }: TResponse) => { const editorRef = React.useRef(null); @@ -81,11 +81,6 @@ const Root = ({ const { t } = useTranslation(["Editor", "Common"]); - useEffect(() => { - console.log("editor timer: ", timer); - console.log("openEdit timer: ", config?.timer); - }, [config?.timer, timer]); - useRootInit({ documentType: config?.documentType, }); diff --git a/packages/doceditor/src/components/file-password/index.tsx b/packages/doceditor/src/components/file-password/index.tsx index 78cf52078e..735ec414b5 100644 --- a/packages/doceditor/src/components/file-password/index.tsx +++ b/packages/doceditor/src/components/file-password/index.tsx @@ -178,7 +178,7 @@ const FilePassword = ({ shareKey, title, entryTitle }: FilePasswordProps) => { id="password" inputName="password" placeholder={t("Common:Password")} - type={InputType.password} + inputType={InputType.password} inputValue={password} hasError={!!errorMessage} size={InputSize.large} diff --git a/packages/doceditor/src/providers/TranslationProvider.tsx b/packages/doceditor/src/providers/TranslationProvider.tsx index df62ddfa5c..f3556653cb 100644 --- a/packages/doceditor/src/providers/TranslationProvider.tsx +++ b/packages/doceditor/src/providers/TranslationProvider.tsx @@ -44,16 +44,9 @@ const TranslationProvider = ({ children, settings, user, - api_host, - timer, }: TTranslationProvider) => { const { i18n } = useI18N({ settings, user }); - React.useEffect(() => { - console.log("API_HOST: ", api_host); - console.log("LAYOUT API timer:", timer); - }, [api_host, timer]); - return {children}; }; diff --git a/packages/doceditor/src/providers/index.tsx b/packages/doceditor/src/providers/index.tsx index 5d955aa434..f1ffa53cde 100644 --- a/packages/doceditor/src/providers/index.tsx +++ b/packages/doceditor/src/providers/index.tsx @@ -48,9 +48,9 @@ export type TProviders = { contextData: TContextData; }; -const Providers = ({ children, contextData, api_host, timer }: TProviders) => { +const Providers = ({ children, contextData }: TProviders) => { return ( - + {children} diff --git a/packages/doceditor/src/utils/actions.ts b/packages/doceditor/src/utils/actions.ts index 8dcdc27b9d..9050912e2b 100644 --- a/packages/doceditor/src/utils/actions.ts +++ b/packages/doceditor/src/utils/actions.ts @@ -65,8 +65,6 @@ export async function getFillingSession( ); try { - console.log({ request }); - const response = await fetch(request); if (response.ok) return await response.json(); From 195297bf48a7e59c3cd3120372782b81c8b45dee Mon Sep 17 00:00:00 2001 From: Timofey Boyko Date: Thu, 22 Aug 2024 14:10:30 +0300 Subject: [PATCH 3/4] Doceditor: add dynamic import without ssr for only cliend dialogs --- .../doceditor/src/app/(root)/create/page.tsx | 12 +++++-- packages/doceditor/src/app/(root)/page.tsx | 6 +++- packages/doceditor/src/components/Editor.tsx | 3 +- packages/doceditor/src/components/Root.tsx | 36 +++++++++++++++---- 4 files changed, 44 insertions(+), 13 deletions(-) diff --git a/packages/doceditor/src/app/(root)/create/page.tsx b/packages/doceditor/src/app/(root)/create/page.tsx index 4bbf3af410..4a5ab030f2 100644 --- a/packages/doceditor/src/app/(root)/create/page.tsx +++ b/packages/doceditor/src/app/(root)/create/page.tsx @@ -25,13 +25,19 @@ // International. See the License terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode import { permanentRedirect, redirect } from "next/navigation"; +import dynamic from "next/dynamic"; import { getBaseUrl } from "@docspace/shared/utils/next-ssr-helper"; +import { EditorConfigErrorType } from "@docspace/shared/enums"; import { createFile, fileCopyAs, getEditorUrl } from "@/utils/actions"; -import CreateFileError from "@/components/CreateFileError"; -import Editor from "@/components/Editor"; -import { EditorConfigErrorType } from "@docspace/shared/enums"; + +const Editor = dynamic(() => import("@/components/Editor"), { + ssr: false, +}); +const CreateFileError = dynamic(() => import("@/components/CreateFileError"), { + ssr: false, +}); type TSearchParams = { parentId: string; diff --git a/packages/doceditor/src/app/(root)/page.tsx b/packages/doceditor/src/app/(root)/page.tsx index 553af8bbe3..19d93efbf6 100644 --- a/packages/doceditor/src/app/(root)/page.tsx +++ b/packages/doceditor/src/app/(root)/page.tsx @@ -26,6 +26,7 @@ import { headers } from "next/headers"; import Script from "next/script"; +import dynamic from "next/dynamic"; import { getSelectorsByUserAgent } from "react-device-detect"; @@ -34,7 +35,10 @@ import { ValidationStatus } from "@docspace/shared/enums"; import { getData, validatePublicRoomKey } from "@/utils/actions"; import { RootPageProps } from "@/types"; import Root from "@/components/Root"; -import FilePassword from "@/components/file-password"; + +const FilePassword = dynamic(() => import("@/components/file-password"), { + ssr: false, +}); const initialSearchParams: RootPageProps["searchParams"] = { fileId: undefined, diff --git a/packages/doceditor/src/components/Editor.tsx b/packages/doceditor/src/components/Editor.tsx index 06eb9976b8..13cfadd646 100644 --- a/packages/doceditor/src/components/Editor.tsx +++ b/packages/doceditor/src/components/Editor.tsx @@ -27,7 +27,7 @@ "use client"; import React from "react"; -import { useRouter, useSearchParams } from "next/navigation"; +import { useSearchParams } from "next/navigation"; import { useTranslation } from "react-i18next"; import { DocumentEditor } from "@onlyoffice/document-editor-react"; @@ -88,7 +88,6 @@ const Editor = ({ }: EditorProps) => { const { t, i18n } = useTranslation(["Common", "Editor", "DeepLink"]); - const router = useRouter(); const searchParams = useSearchParams(); const { filesSettings } = useFilesSettings({}); diff --git a/packages/doceditor/src/components/Root.tsx b/packages/doceditor/src/components/Root.tsx index b2aadac2c9..0754746f47 100644 --- a/packages/doceditor/src/components/Root.tsx +++ b/packages/doceditor/src/components/Root.tsx @@ -25,11 +25,17 @@ // International. See the License terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode "use client"; +import dynamic from "next/dynamic"; import React from "react"; import { useTranslation } from "react-i18next"; -import ErrorContainer from "@docspace/shared/components/error-container/ErrorContainer"; +const ErrorContainer = dynamic( + () => import("@docspace/shared/components/error-container/ErrorContainer"), + { + ssr: false, + }, +); import { TResponse } from "@/types"; @@ -44,15 +50,31 @@ import useFilesSettings from "@/hooks/useFilesSettings"; import useUpdateSearchParamId from "@/hooks/useUpdateSearchParamId"; import useStartFillingSelectDialog from "@/hooks/useStartFillingSelectDialog"; -import DeepLink from "./deep-link"; import Editor from "./Editor"; -import SelectFileDialog from "./SelectFileDialog"; -import SelectFolderDialog from "./SelectFolderDialog"; -import SharingDialog from "./ShareDialog"; +const DeepLink = dynamic(() => import("./deep-link"), { + ssr: false, +}); +const SelectFileDialog = dynamic(() => import("./SelectFileDialog"), { + ssr: false, +}); +const SelectFolderDialog = dynamic(() => import("./SelectFolderDialog"), { + ssr: false, +}); +const SharingDialog = dynamic(() => import("./ShareDialog"), { + ssr: false, +}); +const StartFillingSelectorDialog = dynamic( + () => import("./StartFillingSelectDialog"), + { + ssr: false, + }, +); +const ConflictResolveDialog = dynamic(() => import("./ConflictResolveDialog"), { + ssr: false, +}); + import { calculateAsideHeight } from "@/utils"; -import StartFillingSelectorDialog from "./StartFillingSelectDialog"; -import ConflictResolveDialog from "./ConflictResolveDialog"; const Root = ({ settings, From df066e7c07dd83da75b9c00e38ad237f9adb3431 Mon Sep 17 00:00:00 2001 From: Timofey Boyko Date: Thu, 22 Aug 2024 15:23:50 +0300 Subject: [PATCH 4/4] Doceditor: delete useless API requests --- packages/doceditor/src/components/Editor.tsx | 4 +-- packages/doceditor/src/components/Root.tsx | 1 + .../doceditor/src/hooks/useFilesSettings.ts | 27 +++++++------------ packages/doceditor/src/hooks/useTheme.ts | 8 +++--- packages/doceditor/src/types/index.ts | 1 + 5 files changed, 18 insertions(+), 23 deletions(-) diff --git a/packages/doceditor/src/components/Editor.tsx b/packages/doceditor/src/components/Editor.tsx index 13cfadd646..add387bab8 100644 --- a/packages/doceditor/src/components/Editor.tsx +++ b/packages/doceditor/src/components/Editor.tsx @@ -51,7 +51,6 @@ import { } from "@/utils/events"; import useInit from "@/hooks/useInit"; import useEditorEvents from "@/hooks/useEditorEvents"; -import useFilesSettings from "@/hooks/useFilesSettings"; type IConfigType = IConfig & { events?: { @@ -77,6 +76,8 @@ const Editor = ({ errorMessage, isSkipError, + filesSettings, + onDownloadAs, onSDKRequestSharingSettings, onSDKRequestSaveAs, @@ -89,7 +90,6 @@ const Editor = ({ const { t, i18n } = useTranslation(["Common", "Editor", "DeepLink"]); const searchParams = useSearchParams(); - const { filesSettings } = useFilesSettings({}); const openOnNewPage = IS_ZOOM ? false : !filesSettings?.openEditorInSameTab; diff --git a/packages/doceditor/src/components/Root.tsx b/packages/doceditor/src/components/Root.tsx index 0754746f47..474dc967d6 100644 --- a/packages/doceditor/src/components/Root.tsx +++ b/packages/doceditor/src/components/Root.tsx @@ -231,6 +231,7 @@ const Root = ({ errorMessage={error?.message} isSkipError={!!isSkipError} onDownloadAs={onDownloadAs} + filesSettings={filesSettings} onSDKRequestSharingSettings={onSDKRequestSharingSettings} onSDKRequestSaveAs={onSDKRequestSaveAs} onSDKRequestInsertImage={onSDKRequestInsertImage} diff --git a/packages/doceditor/src/hooks/useFilesSettings.ts b/packages/doceditor/src/hooks/useFilesSettings.ts index 87343031dd..005b918f94 100644 --- a/packages/doceditor/src/hooks/useFilesSettings.ts +++ b/packages/doceditor/src/hooks/useFilesSettings.ts @@ -30,28 +30,21 @@ import { getSettingsFiles } from "@docspace/shared/api/files"; import { TFilesSettings } from "@docspace/shared/api/files/types"; const useFilesSettings = ({}) => { - const [settings, setSettings] = React.useState({} as TFilesSettings); - - const requestRunning = React.useRef(false); - - const initSettings = React.useCallback(async () => { - if (requestRunning.current) return; - - requestRunning.current = true; - - const res = await getSettingsFiles(); - - setSettings(res); - requestRunning.current = false; - }, []); + const [settings, setSettings] = React.useState( + {} as TFilesSettings, + ); React.useEffect(() => { - if (settings.extsArchive) return; + const initSettings = async () => { + const res = await getSettingsFiles(); + + setSettings(res); + }; + initSettings(); - }, [initSettings, settings.extsArchive]); + }, []); return { filesSettings: settings }; }; export default useFilesSettings; - diff --git a/packages/doceditor/src/hooks/useTheme.ts b/packages/doceditor/src/hooks/useTheme.ts index 33330b3c79..b1a2abd991 100644 --- a/packages/doceditor/src/hooks/useTheme.ts +++ b/packages/doceditor/src/hooks/useTheme.ts @@ -90,17 +90,17 @@ const useTheme = ({ const isRequestRunning = React.useRef(false); const getCurrentColorTheme = React.useCallback(async () => { - if (isRequestRunning.current) return; + if (isRequestRunning.current || colorTheme) return; isRequestRunning.current = true; const colorThemes = await getAppearanceTheme(); - const colorTheme = colorThemes.themes.find( + const curColorTheme = colorThemes.themes.find( (t) => t.id === colorThemes.selected, ); isRequestRunning.current = false; - if (colorTheme) setCurrentColorTheme(colorTheme); - }, []); + if (curColorTheme) setCurrentColorTheme(curColorTheme); + }, [colorTheme]); const getUserTheme = React.useCallback(() => { const SYSTEM_THEME = getSystemTheme(); diff --git a/packages/doceditor/src/types/index.ts b/packages/doceditor/src/types/index.ts index 739282d2e6..0a39da9771 100644 --- a/packages/doceditor/src/types/index.ts +++ b/packages/doceditor/src/types/index.ts @@ -229,6 +229,7 @@ export type EditorProps = { isSharingAccess?: boolean; errorMessage?: string; isSkipError?: boolean; + filesSettings: TFilesSettings; onDownloadAs?: (obj: object) => void; onSDKRequestSharingSettings?: () => void;