diff --git a/src/components/App.tsx b/src/components/App.tsx index c9cc339ba..fcdb3e06c 100644 --- a/src/components/App.tsx +++ b/src/components/App.tsx @@ -124,6 +124,7 @@ import { MIME_TYPES, TAP_TWICE_TIMEOUT, TOUCH_CTX_MENU_TIMEOUT, + APP_NAME, } from "../constants"; import LayerUI from "./LayerUI"; @@ -502,7 +503,7 @@ class App extends React.Component { }; private importLibraryFromUrl = async (url: string) => { - window.history.replaceState({}, "Excalidraw", window.location.origin); + window.history.replaceState({}, APP_NAME, window.location.origin); try { const request = await fetch(url); const blob = await request.blob(); diff --git a/src/constants.ts b/src/constants.ts index cdf1250b4..0a6a793cd 100644 --- a/src/constants.ts +++ b/src/constants.ts @@ -1,5 +1,7 @@ import { FontFamily } from "./element/types"; +export const APP_NAME = "Excalidraw"; + export const DRAGGING_THRESHOLD = 10; // 10px export const LINE_CONFIRM_THRESHOLD = 10; // 10px export const ELEMENT_SHIFT_TRANSLATE_AMOUNT = 5; @@ -85,3 +87,4 @@ export const STORAGE_KEYS = { // time in milliseconds export const TAP_TWICE_TIMEOUT = 300; export const TOUCH_CTX_MENU_TIMEOUT = 500; +export const TITLE_TIMEOUT = 10000; diff --git a/src/excalidraw-app/collab/CollabWrapper.tsx b/src/excalidraw-app/collab/CollabWrapper.tsx index aa5c0c1bf..9e46a630c 100644 --- a/src/excalidraw-app/collab/CollabWrapper.tsx +++ b/src/excalidraw-app/collab/CollabWrapper.tsx @@ -1,7 +1,7 @@ import React, { PureComponent } from "react"; import throttle from "lodash.throttle"; -import { ENV, EVENT } from "../../constants"; +import { APP_NAME, ENV, EVENT } from "../../constants"; import { decryptAESGEM, @@ -157,11 +157,7 @@ class CollabWrapper extends PureComponent { }; openPortal = async () => { - window.history.pushState( - {}, - "Excalidraw", - await generateCollaborationLink(), - ); + window.history.pushState({}, APP_NAME, await generateCollaborationLink()); const elements = this.excalidrawRef.current!.getSceneElements(); // remove deleted elements from elements array & history to ensure we don't // expose potentially sensitive user data in case user manually deletes @@ -178,7 +174,7 @@ class CollabWrapper extends PureComponent { closePortal = () => { this.saveCollabRoomToFirebase(); - window.history.pushState({}, "Excalidraw", window.location.origin); + window.history.pushState({}, APP_NAME, window.location.origin); this.destroySocketClient(); trackEvent(EVENT_SHARE, "session end"); }; diff --git a/src/excalidraw-app/index.tsx b/src/excalidraw-app/index.tsx index 170c28e59..c8b151f47 100644 --- a/src/excalidraw-app/index.tsx +++ b/src/excalidraw-app/index.tsx @@ -28,6 +28,7 @@ import { SAVE_TO_LOCAL_STORAGE_TIMEOUT } from "./app_constants"; import { EVENT_LOAD, EVENT_SHARE, trackEvent } from "../analytics"; import { ErrorDialog } from "../components/ErrorDialog"; import { getDefaultAppState } from "../appState"; +import { APP_NAME, TITLE_TIMEOUT } from "../constants"; const excalidrawRef: React.MutableRefObject< MarkRequired @@ -118,7 +119,7 @@ const initializeScene = async (opts: { scene = await loadScene(jsonMatch[1], jsonMatch[2], initialData); } if (!isCollabScene) { - window.history.replaceState({}, "Excalidraw", window.location.origin); + window.history.replaceState({}, APP_NAME, window.location.origin); } } else { // https://github.com/excalidraw/excalidraw/issues/1919 @@ -137,7 +138,7 @@ const initializeScene = async (opts: { } isCollabScene = false; - window.history.replaceState({}, "Excalidraw", window.location.origin); + window.history.replaceState({}, APP_NAME, window.location.origin); } } if (isCollabScene) { @@ -246,6 +247,10 @@ function ExcalidrawWrapper(props: { collab: CollabAPI }) { } }; + const titleTimeout = setTimeout( + () => (document.title = APP_NAME), + TITLE_TIMEOUT, + ); window.addEventListener(EVENT.HASHCHANGE, onHashChange, false); window.addEventListener(EVENT.UNLOAD, onBlur, false); window.addEventListener(EVENT.BLUR, onBlur, false); @@ -253,6 +258,7 @@ function ExcalidrawWrapper(props: { collab: CollabAPI }) { window.removeEventListener(EVENT.HASHCHANGE, onHashChange, false); window.removeEventListener(EVENT.UNLOAD, onBlur, false); window.removeEventListener(EVENT.BLUR, onBlur, false); + clearTimeout(titleTimeout); }; }, [collab.initializeSocketClient]);