first commit

app/src/functions/generateUniqueId.ts

@@ -0,0 +1,2 @@
+export const generateUniqueId = (): string =>
+    `${Date.now()}-${Math.random().toString(36).substr(2, 9)}`;

app/src/functions/handleResizePannel.ts

@@ -0,0 +1,24 @@
+export const handleResize = (
+    e: React.MouseEvent<HTMLDivElement>,
+    containerRef: React.RefObject<HTMLDivElement | null>
+) => {
+    if (!containerRef.current) return; // Ensure containerRef is not null
+    const startY = e.clientY;
+    const startHeight = containerRef.current.offsetHeight;
+
+    const onMouseMove = (moveEvent: MouseEvent) => {
+        const newHeight = Math.max(
+            120,
+            Math.min(400, startHeight + moveEvent.clientY - startY)
+        );
+        containerRef.current!.style.height = `${newHeight}px`;
+    };
+
+    const onMouseUp = () => {
+        document.removeEventListener("mousemove", onMouseMove);
+        document.removeEventListener("mouseup", onMouseUp);
+    };
+
+    document.addEventListener("mousemove", onMouseMove);
+    document.addEventListener("mouseup", onMouseUp);
+};

app/src/functions/idbUtils.ts

@@ -0,0 +1,45 @@
+const DB_NAME = 'GLTFStorage';
+const STORE_NAME = 'models';
+const DB_VERSION = 1;
+
+export function initializeDB(): Promise<IDBDatabase> {
+  return new Promise((resolve, reject) => {
+    const request = indexedDB.open(DB_NAME, DB_VERSION);
+
+    request.onupgradeneeded = () => {
+      const db = request.result;
+      if (!db.objectStoreNames.contains(STORE_NAME)) {
+        db.createObjectStore(STORE_NAME);
+      }
+    };
+
+    request.onsuccess = () => resolve(request.result);
+    request.onerror = () => reject(request.error);
+  });
+}
+
+export async function storeGLTF(key: string, file: Blob): Promise<void> {
+  const db = await initializeDB();
+
+  return new Promise((resolve, reject) => {
+    const transaction = db.transaction(STORE_NAME, 'readwrite');
+    const store = transaction.objectStore(STORE_NAME);
+    const request = store.put(file, key);
+
+    request.onsuccess = () => resolve();
+    request.onerror = () => reject(request.error);
+  });
+}
+
+export async function retrieveGLTF(key: string): Promise<Blob | undefined> {
+  const db = await initializeDB();
+
+  return new Promise((resolve, reject) => {
+    const transaction = db.transaction(STORE_NAME, 'readonly');
+    const store = transaction.objectStore(STORE_NAME);
+    const request = store.get(key);
+
+    request.onsuccess = () => resolve(request.result as Blob | undefined);
+    request.onerror = () => reject(request.error);
+  });
+}