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)/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/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..add387bab8 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"; @@ -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, @@ -88,9 +89,7 @@ const Editor = ({ }: EditorProps) => { const { t, i18n } = useTranslation(["Common", "Editor", "DeepLink"]); - const router = useRouter(); const searchParams = useSearchParams(); - const { filesSettings } = useFilesSettings({}); const openOnNewPage = IS_ZOOM ? false : !filesSettings?.openEditorInSameTab; 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..474dc967d6 100644 --- a/packages/doceditor/src/components/Root.tsx +++ b/packages/doceditor/src/components/Root.tsx @@ -25,15 +25,21 @@ // International. See the License terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode "use client"; +import dynamic from "next/dynamic"; -import React, { useEffect } from "react"; +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"; -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"; @@ -44,14 +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, @@ -64,7 +87,6 @@ const Root = ({ doc, fileId, hash, - timer, }: TResponse) => { const editorRef = React.useRef(null); @@ -81,11 +103,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, }); @@ -214,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/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/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/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 }; }; 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/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/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; 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();