Social Stories

import { useMemo } from "react"
import { SocialStories, type Story } from "@/components/ui/social-stories"

export function SocialStoriesDemo() {
  const stories = useMemo<Story[]>(
    () => [
      {
        id: "1",
        platform: "instagram",
        mediaUrl:
          "https://cloud-snapp.vercel.app/api/cdn/bloddyrdr2.mp4",
        linkUrl: "https://instagram.com",
        caption: "",
        duration: 5,
      },
      {
        id: "2",
        platform: "instagram",
        mediaUrl:
          "https://cloud-snapp.vercel.app/api/cdn/vid_mwl2m2.mp4",
        linkUrl: "https://instagram.com",
        caption: "",
        duration: 7,
      },
      {
        id: "3",
        platform: "instagram",
        mediaUrl:
          "https://cloud-snapp.vercel.app/api/cdn/sanatanrajput.mp4",
        linkUrl: "https://instagram.com",
        caption: "",
        duration: 10,
      },
    ],
    []
  )

  const profile = useMemo(
    () => ({
      name: "Abhishek Singh",
      avatarUrl:
        "https://cloud-snapp.vercel.app/api/cdn/mypfp.jpg?fmt=avif",
    }),
    []
  )

  return (
    <div className="w-full h-screen flex items-center justify-center bg-black antialiased">
      <SocialStories stories={stories} profile={profile} />
    </div>
  )
}

export default SocialStoriesDemo