@stacknet/rackutils

React hooks and components for reading and writing StackNet Racks — a decentralized VCS backed by IPFS.

Install

pnpm add @stacknet/rackutils

Peer dependencies: react >= 18, react-dom >= 18

Quick Start

import { RackBrowser } from '@stacknet/rackutils/components';

<RackBrowser
  config={{ apiBaseUrl: '' }}
  className="h-[600px]"
/>

Hooks

import { useRepos, useRepoTree, useRepoPush, useRackClient } from '@stacknet/rackutils/hooks';

useRepos(config)

List repositories.

const { repos, loading, error, refresh } = useRepos({ apiBaseUrl: '' });

useRepoTree(config, repoId, ref?)

Get the file tree for a repo at a given ref (branch/commit).

const { entries, loading, getFileContent } = useRepoTree(config, repoId, 'main');
// entries: TreeEntry[] — { path, mode, cid, isDir }
// getFileContent(cid) → Promise<string>

useRepoPush(config)

Push files to a repository.

const { push, pushing, error } = useRepoPush(config);

await push(repoId, [
  { path: 'SKILL.md', content: '# My Skill\n...' },
  { path: 'agent.yaml', content: 'name: my-agent\n...' },
], 'Update skill definition');

useRackClient(config)

Low-level client with all Rack API operations.

const client = useRackClient(config);
await client.initRepo({ name: 'my-skill', is_gitagent: true });
await client.getBranches(repoId);
await client.getDiff(repoId, 'main', 'feature');

Components

RackBrowser

Full file browser with repo list, file tree, and content viewer.

<RackBrowser
  config={{
    apiBaseUrl: '',       // same-origin proxy
    ownerMid: 'mid-123', // filter by owner
    authorMid: 'mid-123', // for write operations
  }}
  category="skills"      // optional category filter
  className="h-[600px]"
/>

API Proxy

The hooks expect a proxy at /api/rack/* that forwards to StackNet's /cpx/rack/*:

| Widget Route | StackNet Route | |-------------|----------------| | /api/rack/repos | /cpx/rack/repos | | /api/rack/init | /cpx/rack/init | | /api/rack/:id/push | /cpx/rack/:id/push | | /api/rack/:id/tree/:ref | /cpx/rack/:id/tree/:ref | | /api/rack/:id/blob/:cid | /cpx/rack/:id/blob/:cid | | /api/rack/:id/log | /cpx/rack/:id/log | | /api/rack/:id/branches | /cpx/rack/:id/branches |

Types

import type { RepoInfo, RepoCommit, RepoTree, TreeEntry, RepoFile, RackConfig } from '@stacknet/rackutils/types';

License

MIT