useReadServerResource

sunpeak API

Overview

Returns a function to read a resource from the originating MCP server. The request is proxied through the host. Use useListServerResources to discover available resources first.

Wraps readServerResource

MCP Apps SDK reference

Import

import { useReadServerResource } from 'sunpeak';

Signature

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

ReadServerResourceParams

uri

string

required

URI of the resource to read (e.g. file:///path or a custom scheme like videos://intro).

Returns

readServerResource

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

Function to read a server resource by URI.

ReadServerResourceResult

contents

Array<{ uri: string; mimeType?: string; text?: string; blob?: string }>

required

Resource contents returned by the server. Each item contains either text (UTF-8 string) or blob (base64-encoded binary).

Usage

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>;
}

useRegisterToolRegister app-side tools the host can call.

​Overview

Wraps readServerResource

​Import

​Signature

​ReadServerResourceParams

​Returns

​ReadServerResourceResult

​Usage