Fixed creation of users + better frontend handling of permissions

frontend/components/editor/index.tsx

@@ -0,0 +1,109 @@
+"use client";
+
+import * as React from "react";
+
+import { cn } from "@/lib/utils";
+import { Card } from "@/components/ui/card";
+import { Editor, EditorContent, useEditor } from "@tiptap/react";
+import StarterKit from "@tiptap/starter-kit";
+import Underline from "@tiptap/extension-underline";
+import Link from "@tiptap/extension-link";
+import TTImage from "@tiptap/extension-image";
+import TextAlign from "@tiptap/extension-text-align";
+import Youtube from "@tiptap/extension-youtube";
+import Dropcursor from "@tiptap/extension-dropcursor";
+import { EditorMenu } from "./editor-menu";
+import { FontSize, TextColor } from "./extensions/marks";
+
+interface EditorProps {
+	content: string;
+	onChange?: (content: string) => void;
+	className?: string;
+	onTitleChange?: (t: string) => void;
+}
+
+export function LocalEditor({
+	content,
+	onChange,
+	className,
+	onTitleChange: setTitle,
+}: EditorProps) {
+	const getTitle = (editor: Editor) => {
+		const firstNode = editor.state.doc.firstChild;
+
+		if (!firstNode) {
+			editor.commands.setNode("heading", {
+				level: 1,
+				content: [{ type: "text", text: "Titre" }],
+			});
+		}
+
+		if (
+			firstNode &&
+			!(firstNode.type.name === "heading" && firstNode.attrs.level === 1)
+		) {
+			setFirstLineAsH1(editor);
+		}
+
+		return firstNode?.textContent;
+	};
+
+	const setFirstLineAsH1 = (editor: Editor) => {
+		const firstNode = editor.state.doc.firstChild;
+
+		// Check if the first node is a paragraph and make it h1
+		if (firstNode && firstNode.type.name === "paragraph") {
+			editor.commands.setNode("heading", { level: 1 });
+		}
+	};
+
+	const editor = useEditor({
+		extensions: [
+			StarterKit,
+			FontSize,
+			TextColor,
+			Underline,
+			Link,
+			Youtube,
+			Dropcursor,
+			TTImage.configure({
+				HTMLAttributes: {
+					class: "max-w-full w-auto h-auto resize overflow-auto",
+				},
+			}),
+			TextAlign.configure({
+				alignments: ["left", "center", "right", "justify"],
+				defaultAlignment: "justify",
+				types: ["heading", "paragraph"],
+			}),
+		],
+		content,
+		immediatelyRender: false,
+		editorProps: {
+			attributes: {
+				class: "prose prose-sm sm:prose-base lg:prose-lg xl:prose-2xl m-5 focus:outline-none dark:prose-invert",
+			},
+		},
+
+		onCreate: ({ editor }) => {
+			const title = getTitle(editor);
+			setTitle?.(title ?? "");
+		},
+		onUpdate: ({ editor }) => {
+			onChange?.(editor.getHTML());
+			const title = getTitle(editor);
+			setTitle?.(title ?? "");
+		},
+	});
+
+	if (!editor) {
+		return null;
+	}
+
+	return (
+		<Card className={cn("border rounded-lg overflow-hidden", className)}>
+			<EditorMenu editor={editor} />
+			<EditorContent editor={editor} />
+		</Card>
+	);
+}