smig/excalidraw
1
0
Fork 0
mirror of https://github.com/excalidraw/excalidraw.git synced 2025-05-03 10:00:07 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat: disable collab feature when running in iframe (#6646)

Browse source 
Co-authored-by: dwelle <luzar.david@gmail.com>
This commit is contained in:
Arnost Pleskot 2023-06-12 17:44:31 +02:00 • committed by GitHub
parent 74d2fc6406
commit 3bd5d87cac
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
5 changed files with 39 additions and 19 deletions
Download patch file Download diff file Expand all files Collapse all files

33
src/excalidraw-app/index.tsx
View file

@ -42,6 +42,7 @@ import {
preventUnload,
ResolvablePromise,
resolvablePromise,
isRunningInIframe,
} from "../utils";
import {
FIREBASE_STORAGE_PREFIXES,
@ -98,7 +99,7 @@ languageDetector.init({
});
const initializeScene = async (opts: {
collabAPI: CollabAPI;
collabAPI: CollabAPI | null;
excalidrawAPI: ExcalidrawImperativeAPI;
}): Promise<
{ scene: ExcalidrawInitialDataState | null } & (
@ -183,7 +184,7 @@ const initializeScene = async (opts: {
}
}
if (roomLinkData) {
if (roomLinkData && opts.collabAPI) {
const { excalidrawAPI } = opts;
const scene = await opts.collabAPI.startCollaboration(roomLinkData);
@ -237,6 +238,7 @@ export const appLangCodeAtom = atom(
const ExcalidrawWrapper = () => {
const [errorMessage, setErrorMessage] = useState("");
const [langCode, setLangCode] = useAtom(appLangCodeAtom);
const isCollabDisabled = isRunningInIframe();
// initial state
// ---------------------------------------------------------------------------
@ -272,7 +274,7 @@ const ExcalidrawWrapper = () => {
});
useEffect(() => {
if (!collabAPI || !excalidrawAPI) {
if (!excalidrawAPI || (!isCollabDisabled && !collabAPI)) {
return;
}
@ -283,7 +285,7 @@ const ExcalidrawWrapper = () => {
if (!data.scene) {
return;
}
if (collabAPI.isCollaborating()) {
if (collabAPI?.isCollaborating()) {
if (data.scene.elements) {
collabAPI
.fetchImageFilesFromFirebase({
@ -353,7 +355,7 @@ const ExcalidrawWrapper = () => {
const libraryUrlTokens = parseLibraryTokensFromUrl();
if (!libraryUrlTokens) {
if (
collabAPI.isCollaborating() &&
collabAPI?.isCollaborating() &&
!isCollaborationLink(window.location.href)
) {
collabAPI.stopCollaboration(false);
@ -382,7 +384,10 @@ const ExcalidrawWrapper = () => {
if (isTestEnv()) {
return;
}
if (!document.hidden && !collabAPI.isCollaborating()) {
if (
!document.hidden &&
((collabAPI && !collabAPI.isCollaborating()) || isCollabDisabled)
) {
// don't sync if local state is newer or identical to browser state
if (isBrowserStorageStateNewer(STORAGE_KEYS.VERSION_DATA_STATE)) {
const localDataState = importFromLocalStorage();
@ -398,7 +403,7 @@ const ExcalidrawWrapper = () => {
excalidrawAPI.updateLibrary({
libraryItems: getLibraryItemsFromStorage(),
});
collabAPI.setUsername(username || "");
collabAPI?.setUsername(username || "");
}
if (isBrowserStorageStateNewer(STORAGE_KEYS.VERSION_FILES)) {
@ -466,7 +471,7 @@ const ExcalidrawWrapper = () => {
);
clearTimeout(titleTimeout);
};
}, [collabAPI, excalidrawAPI, setLangCode]);
}, [isCollabDisabled, collabAPI, excalidrawAPI, setLangCode]);
useEffect(() => {
const unloadHandler = (event: BeforeUnloadEvent) => {
@ -649,7 +654,7 @@ const ExcalidrawWrapper = () => {
autoFocus={true}
theme={theme}
renderTopRightUI={(isMobile) => {
if (isMobile) {
if (isMobile || !collabAPI || isCollabDisabled) {
return null;
}
return (
@ -663,15 +668,21 @@ const ExcalidrawWrapper = () => {
<AppMainMenu
setCollabDialogShown={setCollabDialogShown}
isCollaborating={isCollaborating}
isCollabEnabled={!isCollabDisabled}
/>
<AppWelcomeScreen
setCollabDialogShown={setCollabDialogShown}
isCollabEnabled={!isCollabDisabled}
/>
<AppWelcomeScreen setCollabDialogShown={setCollabDialogShown} />
<AppFooter />
{isCollaborating && isOffline && (
<div className="collab-offline-warning">
{t("alerts.collabOfflineWarning")}
</div>
)}
{excalidrawAPI && <Collab excalidrawAPI={excalidrawAPI} />}
{excalidrawAPI && !isCollabDisabled && (
<Collab excalidrawAPI={excalidrawAPI} />
)}
</Excalidraw>
{errorMessage && (
<ErrorDialog onClose={() => setErrorMessage("")}>