initial commit

2025-07-03 01:43:25 +06:00
commit 5dc53b896e
279 changed files with 28956 additions and 0 deletions
--- a/torpedo/components/dashboard/email/RichTextEditor.tsx
+++ b/torpedo/components/dashboard/email/RichTextEditor.tsx
@ -0,0 +1,87 @@
+// components/RichTextEditor.tsx
+import { useEditor, EditorContent, Editor } from "@tiptap/react";
+import StarterKit from "@tiptap/starter-kit";
+import Heading from "@tiptap/extension-heading";
+import Color from "@tiptap/extension-color";
+import TextStyle from "@tiptap/extension-text-style";
+import {
+  Bold,
+  Italic,
+  Strikethrough,
+  Heading1,
+  Heading2,
+  Heading3,
+} from "lucide-react";
+
+import { Toggle } from "@/components/ui/toggle";
+
+const MenuBar: React.FC<{ editor: Editor | null }> = ({ editor }) => {
+  if (!editor) {
+    return null;
+  }
+
+  return (
+    <div className="toolbar pb-3 flex gap-2">
+      <Toggle onClick={() => editor.chain().focus().toggleBold().run()}>
+        <Bold className="h-4 w-4" />
+      </Toggle>
+      <Toggle
+        onClick={() => editor.chain().focus().toggleItalic().run()}
+        className={editor.isActive("italic") ? "is-active" : ""}
+      >
+        <Italic className="h-4 w-4" />
+      </Toggle>
+      <Toggle
+        onClick={() => editor.chain().focus().toggleStrike().run()}
+        className={editor.isActive("strike") ? "is-active" : ""}
+      >
+        <Strikethrough className="h-4 w-4" />
+      </Toggle>
+      {/* Heading Toggles */}
+      <Toggle
+        onClick={() => editor.chain().focus().toggleHeading({ level: 1 }).run()}
+        className={editor.isActive("heading", { level: 1 }) ? "is-active" : ""}
+      >
+        <Heading1 className="h-4 w-4" />
+      </Toggle>
+      <Toggle
+        onClick={() => editor.chain().focus().toggleHeading({ level: 2 }).run()}
+        className={editor.isActive("heading", { level: 2 }) ? "is-active" : ""}
+      >
+        <Heading2 className="h-4 w-4" />
+      </Toggle>
+      <Toggle
+        onClick={() => editor.chain().focus().toggleHeading({ level: 3 }).run()}
+        className={editor.isActive("heading", { level: 3 }) ? "is-active" : ""}
+      >
+        <Heading3 className="h-4 w-4" />
+      </Toggle>
+    </div>
+  );
+};
+
+const RichTextEditor: React.FC = () => {
+  const editor = useEditor({
+    extensions: [
+      StarterKit,
+      Heading.configure({
+        levels: [1, 2, 3],
+      }),
+      Color,
+      TextStyle,
+    ],
+    content: "<p>Write your email here...</p>",
+  });
+
+  return (
+    <div className="">
+      <MenuBar editor={editor} />
+      <EditorContent
+        className="flex-1 overflow-y-auto overflow-x-auto h-[70vh]"
+        editor={editor}
+      />
+    </div>
+  );
+};
+
+export default RichTextEditor;