feat: add YouTube video embed support for TipTap editor (#294)

* feat: add YouTube video embed support for TipTap editor

- Paste YouTube URLs to auto-embed videos with metadata
- Edit video title and URL through dropdown menu
- Convert embed back to plain URL link
- Fetch video titles automatically via YouTube oEmbed API

* fix:
- reverted NewCardForm CSS properties back to max-h-48.
- Added boolean prop to TipTap Edtior for YouTube embed.
- Disabled YouTube embed feature for NewCardForm Editor

* chore: lint

* chore: translations

* chore: update translations

---------

Co-authored-by: Henry <henry_ball@hotmail.co.uk>

apps/web/src/components/YouTubeEmbed/YouTubeCard.tsx

@@ -0,0 +1,53 @@
+import YouTubeDropdown from "./YouTubeDropdown";
+
+interface YouTubeCardProps {
+  videoId: string;
+  url: string;
+  title: string;
+  showEmbed?: boolean;
+  onConvertToLink: () => void;
+  onDelete: () => void;
+  onUpdate: (url: string, title: string) => void;
+}
+
+const YouTubeCard = ({
+  videoId,
+  url,
+  title,
+  showEmbed = true,
+  onConvertToLink,
+  onDelete,
+  onUpdate,
+}: YouTubeCardProps) => {
+  return (
+    <div className="w-full max-w-md rounded-lg border border-light-300 bg-light-50 dark:border-dark-300 dark:bg-dark-50">
+      <div className="flex items-center justify-between gap-6 p-0 px-6">
+        <h3 className="truncate text-sm font-medium">{title}</h3>
+        <div className="mt-3">
+          <YouTubeDropdown
+            url={url}
+            title={title}
+            onConvertToLink={onConvertToLink}
+            onDelete={onDelete}
+            onUpdate={onUpdate}
+          />
+        </div>
+      </div>
+
+      {showEmbed && videoId && (
+        <div className="p-6 pt-1">
+          <iframe
+            src={`https://www.youtube.com/embed/${videoId}?rel=0`}
+            title={title}
+            className="aspect-video w-full rounded-lg"
+            allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
+            referrerPolicy="strict-origin-when-cross-origin"
+            allowFullScreen
+          />
+        </div>
+      )}
+    </div>
+  );
+};
+
+export default YouTubeCard;