Merge pull request #208 from Sanjit-K/main

fixed: [BUG] crypto.randomUUID is not a function Runtime Error #205. …

3 files changed, 12 insertions, 9 deletions

diff --git a/apps/web/src/stores/media-store.ts b/apps/web/src/stores/media-store.ts
index 600b42f2..7d4851c2 100644
--- a/apps/web/src/stores/media-store.ts
+++ b/apps/web/src/stores/media-store.ts
@@ -1,6 +1,7 @@
 import { create } from "zustand";
 import { storageService } from "@/lib/storage/storage-service";
 import { useTimelineStore } from "./timeline-store";
+import { generateUUID } from "@/lib/utils";
 
 export type MediaType = "image" | "video" | "audio";
 
@@ -162,7 +163,7 @@ export const useMediaStore = create<MediaStore>((set, get) => ({
   addMediaItem: async (projectId, item) => {
     const newItem: MediaItem = {
       ...item,
-      id: crypto.randomUUID(),
+      id: generateUUID(),
     };
 
     // Add to local state immediately for UI responsiveness
diff --git a/apps/web/src/stores/project-store.ts b/apps/web/src/stores/project-store.ts
index 3cc2a1dc..efb9cc71 100644
--- a/apps/web/src/stores/project-store.ts
+++ b/apps/web/src/stores/project-store.ts
@@ -4,6 +4,7 @@ import { storageService } from "@/lib/storage/storage-service";
 import { toast } from "sonner";

 import { useMediaStore } from "./media-store";

 import { useTimelineStore } from "./timeline-store";

+import { generateUUID } from "@/lib/utils";

 

 interface ProjectStore {

   activeProject: TProject | null;

@@ -36,7 +37,7 @@ export const useProjectStore = create<ProjectStore>((set, get) => ({
 

   createNewProject: async (name: string) => {

     const newProject: TProject = {

-      id: crypto.randomUUID(),

+      id: generateUUID(),

       name,

       thumbnail: "",

       createdAt: new Date(),

@@ -224,7 +225,7 @@ export const useProjectStore = create<ProjectStore>((set, get) => ({
         existingNumbers.length > 0 ? Math.max(...existingNumbers) + 1 : 1;

 

       const newProject: TProject = {

-        id: crypto.randomUUID(),

+        id: generateUUID(),

         name: `(${nextNumber}) ${baseName}`,

         thumbnail: project.thumbnail,

         createdAt: new Date(),

diff --git a/apps/web/src/stores/timeline-store.ts b/apps/web/src/stores/timeline-store.ts
index 33847baa..37b45b4a 100644
--- a/apps/web/src/stores/timeline-store.ts
+++ b/apps/web/src/stores/timeline-store.ts
@@ -13,6 +13,7 @@ import { useEditorStore } from "./editor-store";
 import { useMediaStore, getMediaAspectRatio } from "./media-store";
 import { storageService } from "@/lib/storage/storage-service";
 import { useProjectStore } from "./project-store";
+import { generateUUID } from "@/lib/utils";
 
 // Helper function to manage element naming with suffixes
 const getElementNameWithSuffix = (
@@ -279,7 +280,7 @@ export const useTimelineStore = create<TimelineStore>((set, get) => {
               : "Track";
 
       const newTrack: TimelineTrack = {
-        id: crypto.randomUUID(),
+        id: generateUUID(),
         name: trackName,
         type,
         elements: [],
@@ -304,7 +305,7 @@ export const useTimelineStore = create<TimelineStore>((set, get) => {
               : "Track";
 
       const newTrack: TimelineTrack = {
-        id: crypto.randomUUID(),
+        id: generateUUID(),
         name: trackName,
         type,
         elements: [],
@@ -363,7 +364,7 @@ export const useTimelineStore = create<TimelineStore>((set, get) => {
 
       const newElement: TimelineElement = {
         ...elementData,
-        id: crypto.randomUUID(),
+        id: generateUUID(),
         startTime: elementData.startTime || 0,
         trimStart: 0,
         trimEnd: 0,
@@ -564,7 +565,7 @@ export const useTimelineStore = create<TimelineStore>((set, get) => {
       const secondDuration =
         element.duration - element.trimStart - element.trimEnd - relativeTime;
 
-      const secondElementId = crypto.randomUUID();
+      const secondElementId = generateUUID();
 
       updateTracksAndSave(
         get()._tracks.map((track) =>
@@ -690,7 +691,7 @@ export const useTimelineStore = create<TimelineStore>((set, get) => {
 
       // Find existing audio track or prepare to create one
       const existingAudioTrack = _tracks.find((t) => t.type === "audio");
-      const audioElementId = crypto.randomUUID();
+      const audioElementId = generateUUID();
 
       if (existingAudioTrack) {
         // Add audio element to existing audio track
@@ -714,7 +715,7 @@ export const useTimelineStore = create<TimelineStore>((set, get) => {
       } else {
         // Create new audio track with the audio element in a single atomic update
         const newAudioTrack: TimelineTrack = {
-          id: crypto.randomUUID(),
+          id: generateUUID(),
           name: "Audio Track",
           type: "audio",
           elements: [