Intégration Tapestry - Protocole Graphe Social

VérifiéSûr

Intégration du protocole de graphe social Tapestry pour construire des fonctionnalités sociales dans une application React Native (Expo). Fournit des modèles de client API, des hooks React Query et des références d'API pour les profils, les abonnements, le contenu, les flux, la résolution d'identité et les échanges. À utiliser lors de l'implémentation de fonctionnalités de trading social avec des graphes d'identité et d'activité on-chain.

Spar Skills Guide Bot
DeveloppementIntermédiaire
02/06/2026
Claude CodeCursorWindsurfCopilotCodex
#tapestry#social-graph#react-native#api-integration#social-features

Recommandé pour

Synthèse automatique

Intègre le protocole de graphe social Tapestry dans une application React Native pour gérer profils, abonnements, contenus et interactions sociales.

Points forts

  • Couvre les 41 endpoints de l'API Tapestry
  • Fournit des modèles de client et hooks React Query prêts à l'emploi
  • Gère l'authentification via clé API et les méthodes d'exécution pour les écritures
  • Adapté aux applications sociales de trading comme Copium

Limites

  • La clé API est incluse dans le bundle de l'application, ce qui pose un problème de sécurité potentiel
  • Nécessite une bonne compréhension de l'API Tapestry
  • Spécifique à un seul protocole de graphe social
Quand l'utiliser

Utilisez cette compétence lorsque vous devez ajouter des fonctionnalités sociales (profils, flux, interactions) à votre application React Native via Tapestry.

Quand l'éviter

Ne l'utilisez pas si votre application n'a pas besoin d'un graphe social ou si vous utilisez un autre protocole comme Lens ou Farcaster.

Analyse de sécurité

Sûr
Score qualité85/100

The skill is an informational reference; it does not instruct the AI to execute any shell commands, network requests, or file operations. The only concern is a potential insecure practice in the example, but this does not constitute a direct execution risk.

Points d'attention
  • •Recommends bundling API key into client-side React Native code (process.env.TAPESTRY_API_KEY), which can be extracted and may expose sensitive credentials.
Comment cette analyse est faite

Exemples

Find or create a profile
I need to find or create a Tapestry profile for a user with wallet address 0x1234... and display name 'Alice'. Use the `/profiles/findOrCreate` endpoint with proper error handling.
Fetch followers list
Create a React hook to fetch the list of followers for a given profile ID from Tapestry, using React Query and the paginated endpoint `/profiles/{id}/followers`.
Post a new comment
Implement a mutation that posts a comment to a Tapestry content item. Use the execution method FAST_UNCONFIRMED for speed, and invalidate the comments query after success.

name: tapestry description: Social graph protocol integration for Copium app using Tapestry API. Use when building social features - profiles, follows, content/posts, comments, likes, activity feeds, identity resolution, or trades. Covers all 41 Tapestry API endpoints. argument-hint: [feature-or-endpoint]

Tapestry Social Graph Integration

You are building social features for a React Native (Expo) mobile app called Copium - a social trading app using Tapestry and Polymarket.

Project Context

  • Framework: React Native with Expo Router (file-based routing)
  • Auth: Privy (OAuth + embedded Solana wallet) + Mobile Wallet Adapter (MWA)
  • Wallet hook: useUnifiedWallet() from @/hooks/use-wallet provides address, walletType, provider, isConnected, logout
  • State: React Query (@tanstack/react-query) for server state
  • Styling: StyleSheet with #0a0a0a bg, #232323 borders, PlusJakartaSans font
  • API Key: process.env.TAPESTRY_API_KEY (server-side only, stored in .env.local)
  • Base URL: https://api.usetapestry.dev/api/v1

API Authentication

All endpoints require apiKey as a query parameter:

GET /profiles/{id}?apiKey=YOUR_API_KEY

The API key is in .env.local as TAPESTRY_API_KEY. Since this is a React Native app (no server-side routes), call the Tapestry API directly from a utility module, keeping the API key secure via process.env.TAPESTRY_API_KEY (bundled at build time but not exposed to web).

Execution Methods (for write operations)

| Method | Speed | Use When | |--------|-------|----------| | FAST_UNCONFIRMED | <1s | Default. Returns after graph DB write, on-chain tx in background | | QUICK_SIGNATURE | ~5s | Need tx signature but don't need confirmation | | CONFIRMED_AND_PARSED | ~15s | Need full on-chain confirmation |

API Client Pattern

Create API calls in lib/tapestry/ directory. Use this pattern:

// lib/tapestry/client.ts
const TAPESTRY_BASE = 'https://api.usetapestry.dev/api/v1';
const API_KEY = process.env.TAPESTRY_API_KEY!;

export async function tapestryFetch<T>(
  endpoint: string,
  options?: { method?: string; body?: any; params?: Record<string, string> }
): Promise<T> {
  const { method = 'GET', body, params = {} } = options ?? {};
  const url = new URL(`${TAPESTRY_BASE}${endpoint}`);
  url.searchParams.set('apiKey', API_KEY);
  Object.entries(params).forEach(([k, v]) => v && url.searchParams.set(k, v));

  const res = await fetch(url.toString(), {
    method,
    headers: body ? { 'Content-Type': 'application/json' } : undefined,
    body: body ? JSON.stringify(body) : undefined,
  });

  if (!res.ok) {
    const err = await res.json().catch(() => ({}));
    throw new Error(err.error || `Tapestry API error: ${res.status}`);
  }
  return res.json();
}

React Hook Pattern

// hooks/use-tapestry-profile.ts
import { useQuery, useMutation, useQueryClient } from '@tanstack/react-query';
import { tapestryFetch } from '@/lib/tapestry/client';

export function useTapestryProfile(username: string) {
  return useQuery({
    queryKey: ['tapestry-profile', username],
    queryFn: () => tapestryFetch<ProfileResponse>(`/profiles/${username}`),
    enabled: !!username,
  });
}

All Endpoints Reference

For detailed endpoint specs, see reference.md.

Quick Endpoint Map

Profiles

  • GET /profiles/ - List/search profiles (by wallet, phone, twitter, email)
  • POST /profiles/findOrCreate - Find or create profile
  • GET /profiles/{id} - Get profile by ID or username
  • PUT /profiles/{id} - Update profile
  • GET /profiles/{id}/followers - Get followers
  • GET /profiles/{id}/following - Get following
  • GET /profiles/{id}/followers/global - Cross-namespace followers
  • GET /profiles/{id}/following/global - Cross-namespace following
  • GET /profiles/{id}/following-who-follow - Mutual connections
  • GET /profiles/{id}/wallets - Get linked wallets
  • PATCH /profiles/{id}/wallets - Link wallets
  • DELETE /profiles/{id}/wallets - Unlink wallets
  • PATCH /profiles/{id}/contacts - Link contacts
  • DELETE /profiles/{id}/contacts - Unlink contacts
  • POST /profiles/{id}/notification - Send notification
  • GET /profiles/{id}/referrals - Get referral tree
  • GET /profiles/{id}/suggested-profiles - Suggested follows
  • GET /profiles/suggested/{identifier} - Suggestions by wallet/contact
  • GET /profiles/suggested/{identifier}/global - Cross-namespace suggestions
  • GET /profiles/token-owners/{tokenAddress} - Token holder profiles
  • GET /search/profiles - Search profiles by text

Social Graph (Followers)

  • POST /followers/add - Follow { startId, endId }
  • POST /followers/remove - Unfollow { startId, endId }
  • GET /followers/state - Check follow state ?startId=&endId=

Content (Posts)

  • GET /contents/ - List content (with filters, ordering, pagination)
  • GET /contents/aggregation - Aggregate content properties
  • POST /contents/batch/read - Batch get by IDs (max 20)
  • POST /contents/findOrCreate - Create content { id, profileId, properties: [{key,value}] }
  • GET /contents/{id} - Get content details
  • PUT /contents/{id} - Update content properties
  • DELETE /contents/{id} - Delete content

Comments

  • GET /comments/ - List comments ?contentId=&profileId=&targetProfileId=
  • POST /comments/ - Create comment { profileId, text, contentId?, commentId?, targetProfileId? }
  • POST /comments/batch/read - Batch get (max 20)
  • GET /comments/{id} - Get comment with replies
  • PUT /comments/{id} - Update comment
  • DELETE /comments/{id} - Delete comment
  • GET /comments/{id}/replies - Get replies

Likes

  • GET /likes/{nodeId} - Get profiles who liked a node
  • POST /likes/{nodeId} - Like { startId }
  • DELETE /likes/{nodeId} - Unlike { startId }

Activity Feeds

  • GET /activity/feed - User activity feed ?username=
  • GET /activity/global - Global activity feed
  • GET /activity/swap - Swap activity from followed wallets ?username=&tokenAddress=

Identities

  • GET /identities/{id} - Resolve wallets/contacts from ID
  • GET /identities/{id}/profiles - Find profiles across namespaces

Trades

  • POST /trades/ - Log a trade
  • GET /trades/all-trades - Get all trades in time period
  • GET /trades/fetch-transaction-history - Wallet tx history

Wallets

  • POST /wallets/{address}/connect - Connect two wallets
  • GET /wallets/{address}/socialCounts - Social counts by wallet

Key Integration Points for Copium

1. Profile Creation (on signup/login)

After wallet connection + X login, call findOrCreate:

await tapestryFetch('/profiles/findOrCreate', {
  method: 'POST',
  body: {
    username: twitterHandle, // from Privy OAuth
    walletAddress: address,  // from useUnifiedWallet
    blockchain: 'SOLANA',
    image: twitterProfileImage,
    bio: twitterBio,
    contact: { id: twitterHandle, type: 'TWITTER' },
  },
});

2. Follow/Unfollow

await tapestryFetch('/followers/add', {
  method: 'POST',
  body: { startId: myProfileId, endId: targetProfileId },
});

3. Create a Post (Content)

await tapestryFetch('/contents/findOrCreate', {
  method: 'POST',
  body: {
    id: `post-${Date.now()}`,
    profileId: myProfileId,
    properties: [
      { key: 'text', value: 'My post content' },
      { key: 'type', value: 'trade_call' },
    ],
  },
});

4. Like Content

await tapestryFetch(`/likes/${contentId}`, {
  method: 'POST',
  body: { startId: myProfileId },
});

5. Comment on Content

await tapestryFetch('/comments/', {
  method: 'POST',
  body: {
    profileId: myProfileId,
    contentId: contentId,
    text: 'Great trade!',
  },
});

6. Activity Feed

const feed = await tapestryFetch('/activity/feed', {
  params: { username: myUsername },
});

7. Search Users

const results = await tapestryFetch('/search/profiles', {
  params: { query: searchText },
});

8. Polymarket Integration Pattern

Store Polymarket-related data as content properties:

await tapestryFetch('/contents/findOrCreate', {
  method: 'POST',
  body: {
    id: `prediction-${marketId}-${profileId}`,
    profileId: myProfileId,
    properties: [
      { key: 'type', value: 'prediction' },
      { key: 'marketId', value: polymarketConditionId },
      { key: 'position', value: 'YES' },
      { key: 'amount', value: 50 },
      { key: 'odds', value: 0.65 },
    ],
  },
});

Response Types

interface TapestryProfile {
  id: string;
  namespace: string;
  created_at: number;
  username: string;
  bio: string | null;
  image: string | null;
}

interface ProfileResponse {
  profile: TapestryProfile;
  walletAddress: string;
  socialCounts: { followers: number; following: number };
  namespace: { name: string | null; readableName: string | null };
}

interface ContentResponse {
  id: string;
  created_at: number;
  properties: Record<string, any>;
}

interface CommentResponse {
  comment: { id: string; created_at: number; text: string };
  author: TapestryProfile;
  socialCounts: { likeCount: number };
  requestingProfileSocialInfo?: { hasLiked: boolean };
}

interface ActivityItem {
  type: 'following' | 'new_content' | 'like' | 'comment' | 'new_follower';
  actor_id: string;
  actor_username: string;
  target_id?: string;
  target_username?: string;
  timestamp: number;
  activity: string;
}

interface PaginatedResponse<T> {
  page: number;
  pageSize: number;
  totalCount: number;
  data?: T[];
  profiles?: T[];
  activities?: T[];
}

File Structure Convention

lib/tapestry/
  client.ts          # Base fetch wrapper
  profiles.ts        # Profile API functions
  social.ts          # Follow/unfollow/like functions
  content.ts         # Content/posts CRUD
  comments.ts        # Comments CRUD
  activity.ts        # Activity feed functions
  types.ts           # TypeScript interfaces

hooks/
  use-tapestry-profile.ts
  use-tapestry-feed.ts
  use-tapestry-social.ts
  use-tapestry-content.ts

When implementing features with $ARGUMENTS, refer to reference.md for full endpoint details.

Du fichier au premier essai

Le téléchargement contient exactement le contenu affiché sur cette fiche. Cette copie peut différer de la dernière version du dépôt source.

Consulter la source et ses fichiers annexes

Ce téléchargement contient uniquement SKILL.md. Les scripts, références, modèles et dépendances éventuels ne sont pas inclus. Récupérez les fichiers nécessaires depuis la source en conservant leur arborescence avant de poursuivre.

1. Télécharger le fichier

Télécharger SKILL.md

Depuis la racine d’un projet de test, enregistrez le fichier sous .skill-downloads/tapestry-social-graph-protocol-integration-mm5t8a4i/SKILL.md, ou utilisez la commande suivante. Ce dossier sert à examiner la skill avant son installation.

Commande pour macOS/Linux ou WSL : un shell POSIX et curl sont nécessaires. Sous Windows sans WSL, utilisez le bouton de téléchargement et créez le dossier manuellement.

mkdir -p '.skill-downloads/tapestry-social-graph-protocol-integration-mm5t8a4i' && curl --fail --show-error --location 'https://skills-guides.com/api/skills/tapestry-social-graph-protocol-integration-mm5t8a4i/download' --output '.skill-downloads/tapestry-social-graph-protocol-integration-mm5t8a4i/SKILL.md.part' && mv '.skill-downloads/tapestry-social-graph-protocol-integration-mm5t8a4i/SKILL.md.part' '.skill-downloads/tapestry-social-graph-protocol-integration-mm5t8a4i/SKILL.md'

2. Vérifier les prérequis

Lisez SKILL.md avant de l’utiliser. Si le fichier cite des scripts ou services externes, examinez-les et préparez les accès nécessaires dans votre environnement de test.

Aucune section de prérequis reconnue dans ce fichier. Cela ne signifie pas qu’il est autonome : les bibliothèques, outils et accès peuvent être cités ailleurs dans le contenu ou dans le dépôt source.

Les plateformes de la fiche sont des indications du catalogue. Les chemins ci-dessous suivent la documentation des outils ; ils ne prouvent pas que cette skill y a été exécutée. Aucune version minimale de ces outils n’est attestée pour cette fiche.

3. Charger la skill

Après vérification, copiez le dossier complet dans le projet avec l’une des commandes ci-dessous, puis ouvrez une nouvelle session de l’outil. La commande s’arrête si un dossier du même nom existe déjà : comparez les fichiers avant de le remplacer.

Claude Code
test -f '.skill-downloads/tapestry-social-graph-protocol-integration-mm5t8a4i/SKILL.md' && test -s '.skill-downloads/tapestry-social-graph-protocol-integration-mm5t8a4i/SKILL.md' && mkdir -p '.claude/skills' && test ! -e '.claude/skills/tapestry' && cp -R '.skill-downloads/tapestry-social-graph-protocol-integration-mm5t8a4i' '.claude/skills/tapestry'

Cursor
test -f '.skill-downloads/tapestry-social-graph-protocol-integration-mm5t8a4i/SKILL.md' && test -s '.skill-downloads/tapestry-social-graph-protocol-integration-mm5t8a4i/SKILL.md' && mkdir -p '.cursor/skills' && test ! -e '.cursor/skills/tapestry' && cp -R '.skill-downloads/tapestry-social-graph-protocol-integration-mm5t8a4i' '.cursor/skills/tapestry'

Codex
test -f '.skill-downloads/tapestry-social-graph-protocol-integration-mm5t8a4i/SKILL.md' && test -s '.skill-downloads/tapestry-social-graph-protocol-integration-mm5t8a4i/SKILL.md' && mkdir -p '.agents/skills' && test ! -e '.agents/skills/tapestry' && cp -R '.skill-downloads/tapestry-social-graph-protocol-integration-mm5t8a4i' '.agents/skills/tapestry'

OpenSkills

OpenSkills doit déjà être installé. La procédure locale install/read est contrôlée avec OpenSkills 1.5.0, qui exige Node.js ≥ 20.6.0. Aucun slug du catalogue n’est résolu automatiquement.

Installation officielle d’OpenSkills
openskills install './.skill-downloads/tapestry-social-graph-protocol-integration-mm5t8a4i'

openskills read 'tapestry-social-graph-protocol-integration-mm5t8a4i'

La lecture doit afficher le contenu du fichier installé et son dossier de base. Elle ne lance ni la skill ni ses dépendances.

Pour un agent qui lit AGENTS.md, synchronisez ensuite l’index. Cette commande modifie AGENTS.md : relisez le diff avant de l’utiliser.

openskills sync

Mode manuel ou autre outil : joignez SKILL.md à une conversation, ou ouvrez-le dans un agent capable de lire les fichiers. Ajoutez les ressources annexes nécessaires. Il n’existe pas de dossier universel reconnu par tous les outils.

4. Faire un premier essai

Utilisez une entrée courte et fictive : un endpoint d’API, un petit document ou un brief d’interface. Dans une nouvelle conversation, joignez le fichier ou donnez son chemin à l’agent, puis adaptez cette demande :

Lis .skill-downloads/tapestry-social-graph-protocol-integration-mm5t8a4i/SKILL.md et applique ses instructions à cet exemple : [décrire une entrée de test]. Indique les fichiers, dépendances ou accès qui manquent. Produis le résultat demandé par la skill sans inventer de données ni exécuter de script non examiné.

Résultat attendu : une sortie correspondant aux instructions de la skill, ou une liste précise des prérequis manquants. Une simple confirmation de lecture ne valide pas le premier usage. Si une ressource externe est indisponible, ce parcours reste à tester.

Skills similaires