summaryrefslogtreecommitdiffstats
path: root/excalidraw-app/data/localStorage.ts
diff options
context:
space:
mode:
Diffstat (limited to 'excalidraw-app/data/localStorage.ts')
-rw-r--r--excalidraw-app/data/localStorage.ts99
1 files changed, 99 insertions, 0 deletions
diff --git a/excalidraw-app/data/localStorage.ts b/excalidraw-app/data/localStorage.ts
new file mode 100644
index 0000000..640dfdb
--- /dev/null
+++ b/excalidraw-app/data/localStorage.ts
@@ -0,0 +1,99 @@
+import type { ExcalidrawElement } from "@excalidraw/excalidraw/element/types";
+import type { AppState } from "@excalidraw/excalidraw/types";
+import {
+ clearAppStateForLocalStorage,
+ getDefaultAppState,
+} from "@excalidraw/excalidraw/appState";
+import { clearElementsForLocalStorage } from "@excalidraw/excalidraw/element";
+import { STORAGE_KEYS } from "../app_constants";
+
+export const saveUsernameToLocalStorage = (username: string) => {
+ try {
+ localStorage.setItem(
+ STORAGE_KEYS.LOCAL_STORAGE_COLLAB,
+ JSON.stringify({ username }),
+ );
+ } catch (error: any) {
+ // Unable to access window.localStorage
+ console.error(error);
+ }
+};
+
+export const importUsernameFromLocalStorage = (): string | null => {
+ try {
+ const data = localStorage.getItem(STORAGE_KEYS.LOCAL_STORAGE_COLLAB);
+ if (data) {
+ return JSON.parse(data).username;
+ }
+ } catch (error: any) {
+ // Unable to access localStorage
+ console.error(error);
+ }
+
+ return null;
+};
+
+export const importFromLocalStorage = () => {
+ let savedElements = null;
+ let savedState = null;
+
+ try {
+ savedElements = localStorage.getItem(STORAGE_KEYS.LOCAL_STORAGE_ELEMENTS);
+ savedState = localStorage.getItem(STORAGE_KEYS.LOCAL_STORAGE_APP_STATE);
+ } catch (error: any) {
+ // Unable to access localStorage
+ console.error(error);
+ }
+
+ let elements: ExcalidrawElement[] = [];
+ if (savedElements) {
+ try {
+ elements = clearElementsForLocalStorage(JSON.parse(savedElements));
+ } catch (error: any) {
+ console.error(error);
+ // Do nothing because elements array is already empty
+ }
+ }
+
+ let appState = null;
+ if (savedState) {
+ try {
+ appState = {
+ ...getDefaultAppState(),
+ ...clearAppStateForLocalStorage(
+ JSON.parse(savedState) as Partial<AppState>,
+ ),
+ };
+ } catch (error: any) {
+ console.error(error);
+ // Do nothing because appState is already null
+ }
+ }
+ return { elements, appState };
+};
+
+export const getElementsStorageSize = () => {
+ try {
+ const elements = localStorage.getItem(STORAGE_KEYS.LOCAL_STORAGE_ELEMENTS);
+ const elementsSize = elements?.length || 0;
+ return elementsSize;
+ } catch (error: any) {
+ console.error(error);
+ return 0;
+ }
+};
+
+export const getTotalStorageSize = () => {
+ try {
+ const appState = localStorage.getItem(STORAGE_KEYS.LOCAL_STORAGE_APP_STATE);
+ const collab = localStorage.getItem(STORAGE_KEYS.LOCAL_STORAGE_COLLAB);
+
+ const appStateSize = appState?.length || 0;
+ const collabSize = collab?.length || 0;
+
+ return appStateSize + collabSize + getElementsStorageSize();
+ } catch (error: any) {
+ console.error(error);
+ return 0;
+ }
+};