useReadServerResource

import { useReadServerResource } from 'sunpeak';

function useReadServerResource(): (
  params: ReadServerResourceParams
) => Promise<ReadServerResourceResult | undefined>

import { useReadServerResource } from 'sunpeak';
import { useState } from 'react';

function VideoPlayer() {
  const readServerResource = useReadServerResource();
  const [src, setSrc] = useState<string>();

  const loadVideo = async (uri: string) => {
    const result = await readServerResource({ uri });
    const content = result?.contents[0];
    if (content && 'blob' in content && content.blob) {
      const binary = atob(content.blob);
      const bytes = Uint8Array.from(binary, c => c.charCodeAt(0));
      const blob = new Blob([bytes], { type: content.mimeType });
      setSrc(URL.createObjectURL(blob));
    }
  };

  return src
    ? <video src={src} controls />
    : <button onClick={() => loadVideo('videos://intro')}>Load Video</button>;
}