Reference

React

Show files stored on Portaldot in any React app, verified in the user's browser.

Install

Terminal

npm install @potdrive/sdk

The package ships ESM with type declarations. React is an optional peer dependency, and the bindings live at @potdrive/sdk/react.

Components

Profile.tsx

import { PotImage, PotVideo, usePotFile } from "@potdrive/sdk/react";

export function Profile() {
  return (
    <>
      <PotImage cid="bafk2bzace…" alt="Avatar" className="rounded-full" fallback={<Spinner />} />
      <PotVideo cid="bafykbzace…" controls />
    </>
  );
}

usePotFile(cid, opts?: { secret?, mime?, rpc? }): PotFile

Fetches every block from a Portaldot node, re-hashes it, and returns an object URL. status is loading, ready, missing, corrupt or error. verified and total drive a progress UI. Pass secret (a private link's #k=) to decrypt locally.

Returns { url, bytes, status, verified, total, mime }

<PotImage cid secret? fallback? ...imgProps />

An <img> fed from usePotFile.

<PotVideo cid gateway? ...videoProps />

Streams through the gateway so the browser can seek with Range requests.

Edit this page on GitHub