mirror of
https://github.com/supermemoryai/supermemory.git
synced 2026-08-30 02:42:59 +00:00
53 lines
1.4 KiB
TypeScript
53 lines
1.4 KiB
TypeScript
"use client"
|
|
|
|
import { memo } from "react"
|
|
import type { DocumentsWithMemoriesResponseSchema } from "@repo/validation/api"
|
|
import type { z } from "zod"
|
|
import { dmSansClassName } from "@/lib/fonts"
|
|
import { cn } from "@lib/utils"
|
|
import { extractYouTubeVideoId } from "../utils"
|
|
|
|
type DocumentsResponse = z.infer<typeof DocumentsWithMemoriesResponseSchema>
|
|
type DocumentWithMemories = DocumentsResponse["documents"][0]
|
|
|
|
export const YoutubePreview = memo(function YoutubePreview({
|
|
document,
|
|
}: {
|
|
document: DocumentWithMemories
|
|
}) {
|
|
const videoId = extractYouTubeVideoId(document.url)
|
|
|
|
if (!videoId) {
|
|
return (
|
|
<div className="bg-[#0B1017] p-3 rounded-[18px] space-y-2">
|
|
{document.title && (
|
|
<p className={cn(dmSansClassName(), "text-[13px] font-semibold")}>
|
|
{document.title}
|
|
</p>
|
|
)}
|
|
{document.content && (
|
|
<p className="text-[11px] text-[#737373] line-clamp-4">
|
|
{document.content}
|
|
</p>
|
|
)}
|
|
</div>
|
|
)
|
|
}
|
|
|
|
const embedUrl = `https://www.youtube.com/embed/${videoId}`
|
|
|
|
return (
|
|
<div className="bg-[#0B1017] rounded-[18px] overflow-hidden">
|
|
<div className="relative w-full aspect-video bg-black">
|
|
<iframe
|
|
src={embedUrl}
|
|
title={document.title || "YouTube video"}
|
|
className="size-full"
|
|
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
|
|
allowFullScreen
|
|
loading="lazy"
|
|
/>
|
|
</div>
|
|
</div>
|
|
)
|
|
})
|