Function AppxVideoPlayer

src/components/AppxVideoPlayer.tsx:7–44

({
  courseId,
  videoId,
}: {
  courseId: string;
  videoId: string;
})

import { toast } from 'sonner';

export const AppxVideoPlayer = ({
  courseId,
  videoId,
}: {
  courseId: string;
  videoId: string;
}) => {
  const [url, setUrl] = useState('');
  const doneRef = useRef(false);

  useEffect(() => {
    (async () => {
      if (doneRef.current) return;
      doneRef.current = true;
      try {
        const videoUrl = await GetAppxVideoPlayerUrl(courseId, videoId);
        setUrl(videoUrl);
      } catch {
        toast.info('This is a new type of video player', {
          description: 'Please relogin to continue',
          action: {
            label: 'Relogin',
            onClick: () => signOut(),
          },
        });
      }
    })();
  }, []);

  if (!url.length) {
    return <p>Loading...</p>;
  }
  return <iframe
    src={url}
    className="w-full rounded-lg aspect-video"
    allowFullScreen
  ></iframe >;
};