diff --git a/src/pages/editor/constants/payload.ts b/src/pages/editor/constants/payload.ts
index 10090485..f5ca059a 100644
--- a/src/pages/editor/constants/payload.ts
+++ b/src/pages/editor/constants/payload.ts
@@ -1,8 +1,6 @@
-import { generateId } from "@designcombo/timeline";
 import { DEFAULT_FONT } from "./font";
 
 export const TEXT_ADD_PAYLOAD = {
-  id: generateId(),
   display: {
     from: 0,
     to: 5000,
diff --git a/src/pages/editor/menu-item/texts.tsx b/src/pages/editor/menu-item/texts.tsx
index 37f27265..597de823 100644
--- a/src/pages/editor/menu-item/texts.tsx
+++ b/src/pages/editor/menu-item/texts.tsx
@@ -1,4 +1,5 @@
 import { Button, buttonVariants } from "@/components/ui/button";
+import { generateId } from "@designcombo/timeline";
 import { ADD_TEXT } from "@designcombo/state";
 import { dispatch } from "@designcombo/events";
 import { useIsDraggingOverTimeline } from "../hooks/is-dragging-over-timeline";
@@ -11,7 +12,10 @@ export const Texts = () => {
 
   const handleAddText = () => {
     dispatch(ADD_TEXT, {
-      payload: TEXT_ADD_PAYLOAD,
+      payload: {
+        ...TEXT_ADD_PAYLOAD,
+        id: generateId(),
+      },
       options: {},
     });
   };