Prefer arrow functions and callbacks (#1210)

src/data/blob.ts

@@ -2,7 +2,7 @@ import { getDefaultAppState } from "../appState";
 import { restore } from "./restore";
 import { t } from "../i18n";
 
-export async function loadFromBlob(blob: any) {
+export const loadFromBlob = async (blob: any) => {
   const updateAppState = (contents: string) => {
     const defaultAppState = getDefaultAppState();
     let elements = [];
@@ -40,4 +40,4 @@ export async function loadFromBlob(blob: any) {
 
   const { elements, appState } = updateAppState(contents);
   return restore(elements, appState, { scrollToContent: true });
-}
+};

src/data/index.ts

@@ -72,17 +72,15 @@ export type SocketUpdateDataIncoming =
 // part of `AppState`.
 (window as any).handle = null;
 
-function byteToHex(byte: number): string {
-  return `0${byte.toString(16)}`.slice(-2);
-}
+const byteToHex = (byte: number): string => `0${byte.toString(16)}`.slice(-2);
 
-async function generateRandomID() {
+const generateRandomID = async () => {
   const arr = new Uint8Array(10);
   window.crypto.getRandomValues(arr);
   return Array.from(arr, byteToHex).join("");
-}
+};
 
-async function generateEncryptionKey() {
+const generateEncryptionKey = async () => {
   const key = await window.crypto.subtle.generateKey(
     {
       name: "AES-GCM",
@@ -92,29 +90,29 @@ async function generateEncryptionKey() {
     ["encrypt", "decrypt"],
   );
   return (await window.crypto.subtle.exportKey("jwk", key)).k;
-}
+};
 
-function createIV() {
+const createIV = () => {
   const arr = new Uint8Array(12);
   return window.crypto.getRandomValues(arr);
-}
+};
 
-export function getCollaborationLinkData(link: string) {
+export const getCollaborationLinkData = (link: string) => {
   if (link.length === 0) {
     return;
   }
   const hash = new URL(link).hash;
   return hash.match(/^#room=([a-zA-Z0-9_-]+),([a-zA-Z0-9_-]+)$/);
-}
+};
 
-export async function generateCollaborationLink() {
+export const generateCollaborationLink = async () => {
   const id = await generateRandomID();
   const key = await generateEncryptionKey();
   return `${window.location.origin}${window.location.pathname}#room=${id},${key}`;
-}
+};
 
-function getImportedKey(key: string, usage: string) {
-  return window.crypto.subtle.importKey(
+const getImportedKey = (key: string, usage: string) =>
+  window.crypto.subtle.importKey(
     "jwk",
     {
       alg: "A128GCM",
@@ -130,12 +128,11 @@ function getImportedKey(key: string, usage: string) {
     false, // extractable
     [usage],
   );
-}
 
-export async function encryptAESGEM(
+export const encryptAESGEM = async (
   data: Uint8Array,
   key: string,
-): Promise<EncryptedData> {
+): Promise<EncryptedData> => {
   const importedKey = await getImportedKey(key, "encrypt");
   const iv = createIV();
   return {
@@ -149,13 +146,13 @@ export async function encryptAESGEM(
     ),
     iv,
   };
-}
+};
 
-export async function decryptAESGEM(
+export const decryptAESGEM = async (
   data: ArrayBuffer,
   key: string,
   iv: Uint8Array,
-): Promise<SocketUpdateDataIncoming> {
+): Promise<SocketUpdateDataIncoming> => {
   try {
     const importedKey = await getImportedKey(key, "decrypt");
     const decrypted = await window.crypto.subtle.decrypt(
@@ -178,12 +175,12 @@ export async function decryptAESGEM(
   return {
     type: "INVALID_RESPONSE",
   };
-}
+};
 
-export async function exportToBackend(
+export const exportToBackend = async (
   elements: readonly ExcalidrawElement[],
   appState: AppState,
-) {
+) => {
   const json = serializeAsJSON(elements, appState);
   const encoded = new TextEncoder().encode(json);
 
@@ -233,12 +230,12 @@ export async function exportToBackend(
     console.error(error);
     window.alert(t("alerts.couldNotCreateShareableLink"));
   }
-}
+};
 
-export async function importFromBackend(
+export const importFromBackend = async (
   id: string | null,
   privateKey: string | undefined,
-) {
+) => {
   let elements: readonly ExcalidrawElement[] = [];
   let appState: AppState = getDefaultAppState();
 
@@ -281,9 +278,9 @@ export async function importFromBackend(
   } finally {
     return restore(elements, appState, { scrollToContent: true });
   }
-}
+};
 
-export async function exportCanvas(
+export const exportCanvas = async (
   type: ExportType,
   elements: readonly NonDeletedExcalidrawElement[],
   appState: AppState,
@@ -303,7 +300,7 @@ export async function exportCanvas(
     scale?: number;
     shouldAddWatermark: boolean;
   },
-) {
+) => {
   if (elements.length === 0) {
     return window.alert(t("alerts.cannotExportEmptyCanvas"));
   }
@@ -362,9 +359,9 @@ export async function exportCanvas(
   if (tempCanvas !== canvas) {
     tempCanvas.remove();
   }
-}
+};
 
-export async function loadScene(id: string | null, privateKey?: string) {
+export const loadScene = async (id: string | null, privateKey?: string) => {
   let data;
   if (id != null) {
     // the private key is used to decrypt the content from the server, take
@@ -380,4 +377,4 @@ export async function loadScene(id: string | null, privateKey?: string) {
     appState: data.appState && { ...data.appState },
     commitToHistory: false,
   };
-}
+};

src/data/json.ts

@@ -5,11 +5,11 @@ import { cleanAppStateForExport } from "../appState";
 import { fileOpen, fileSave } from "browser-nativefs";
 import { loadFromBlob } from "./blob";
 
-export function serializeAsJSON(
+export const serializeAsJSON = (
   elements: readonly ExcalidrawElement[],
   appState: AppState,
-): string {
-  return JSON.stringify(
+): string =>
+  JSON.stringify(
     {
       type: "excalidraw",
       version: 1,
@@ -20,12 +20,11 @@ export function serializeAsJSON(
     null,
     2,
   );
-}
 
-export async function saveAsJSON(
+export const saveAsJSON = async (
   elements: readonly ExcalidrawElement[],
   appState: AppState,
-) {
+) => {
   const serialized = serializeAsJSON(elements, appState);
 
   const name = `${appState.name}.excalidraw`;
@@ -41,12 +40,12 @@ export async function saveAsJSON(
     },
     (window as any).handle,
   );
-}
-export async function loadFromJSON() {
+};
+export const loadFromJSON = async () => {
   const blob = await fileOpen({
     description: "Excalidraw files",
     extensions: ["json", "excalidraw"],
     mimeTypes: ["application/json", "application/vnd.excalidraw+json"],
   });
   return loadFromBlob(blob);
-}
+};

src/data/localStorage.ts

@@ -7,7 +7,7 @@ const LOCAL_STORAGE_KEY = "excalidraw";
 const LOCAL_STORAGE_KEY_STATE = "excalidraw-state";
 const LOCAL_STORAGE_KEY_COLLAB = "excalidraw-collab";
 
-export function saveUsernameToLocalStorage(username: string) {
+export const saveUsernameToLocalStorage = (username: string) => {
   try {
     localStorage.setItem(
       LOCAL_STORAGE_KEY_COLLAB,
@@ -17,9 +17,9 @@ export function saveUsernameToLocalStorage(username: string) {
     // Unable to access window.localStorage
     console.error(error);
   }
-}
+};
 
-export function restoreUsernameFromLocalStorage(): string | null {
+export const restoreUsernameFromLocalStorage = (): string | null => {
   try {
     const data = localStorage.getItem(LOCAL_STORAGE_KEY_COLLAB);
     if (data) {
@@ -31,12 +31,12 @@ export function restoreUsernameFromLocalStorage(): string | null {
   }
 
   return null;
-}
+};
 
-export function saveToLocalStorage(
+export const saveToLocalStorage = (
   elements: readonly ExcalidrawElement[],
   appState: AppState,
-) {
+) => {
   try {
     localStorage.setItem(
       LOCAL_STORAGE_KEY,
@@ -50,9 +50,9 @@ export function saveToLocalStorage(
     // Unable to access window.localStorage
     console.error(error);
   }
-}
+};
 
-export function restoreFromLocalStorage() {
+export const restoreFromLocalStorage = () => {
   let savedElements = null;
   let savedState = null;
 
@@ -86,4 +86,4 @@ export function restoreFromLocalStorage() {
   }
 
   return restore(elements, appState);
-}
+};

src/data/restore.ts

@@ -12,13 +12,13 @@ import { calculateScrollCenter } from "../scene";
 import { randomId } from "../random";
 import { DEFAULT_TEXT_ALIGN } from "../appState";
 
-export function restore(
+export const restore = (
   // we're making the elements mutable for this API because we want to
   //  efficiently remove/tweak properties on them (to migrate old scenes)
   savedElements: readonly Mutable<ExcalidrawElement>[],
   savedState: AppState | null,
   opts?: { scrollToContent: boolean },
-): DataState {
+): DataState => {
   const elements = savedElements
     .filter((el) => {
       // filtering out selection, which is legacy, no longer kept in elements,
@@ -94,4 +94,4 @@ export function restore(
     elements: elements,
     appState: savedState,
   };
-}
+};