@filoz/synapse-react 0.0.1

package/src/payments/use-deposit-and-approve.ts

@@ -0,0 +1,71 @@
+import { getChain } from '@filoz/synapse-core/chains'
+import type { DepositAndApproveOptions } from '@filoz/synapse-core/pay'
+import * as payments from '@filoz/synapse-core/pay'
+import { type MutateOptions, useMutation, useQueryClient } from '@tanstack/react-query'
+import type { TransactionReceipt } from 'viem'
+import { waitForTransactionReceipt } from 'viem/actions'
+import { useAccount, useChainId, useConfig } from 'wagmi'
+import { getConnectorClient } from 'wagmi/actions'
+
+type UseDepositVariables = Pick<DepositAndApproveOptions, 'amount'>
+interface UseDepositAndApproveProps extends Omit<DepositAndApproveOptions, 'amount'> {
+  /**
+   * The mutation options.
+   */
+  mutation?: Omit<MutateOptions<TransactionReceipt, Error, UseDepositVariables>, 'mutationFn'>
+  /**
+   * The callback to call when the hash is available.
+   */
+  onHash?: (hash: string) => void
+}
+
+/**
+ * Deposit ERC20 tokens into the payments contract.
+ *
+ * @param props - The props for the deposit.
+ * @param props.address - The address of the account to deposit from.
+ * @param props.token - The address of the ERC20 token to deposit.
+ * @param props.mutation - The mutation options.
+ * @param props.onHash - The callback to call when the hash is available.
+ * @returns The deposit mutation.
+ */
+export function useDepositAndApprove(props?: UseDepositAndApproveProps) {
+  const config = useConfig()
+  const chainId = useChainId({ config })
+  const chain = getChain(chainId)
+  const account = useAccount({ config })
+  const queryClient = useQueryClient()
+  const token = props?.token ?? chain.contracts.usdfc.address
+  const from = props?.address ?? account.address
+
+  return useMutation({
+    mutationFn: async ({ amount }: UseDepositVariables) => {
+      const client = await getConnectorClient(config, {
+        account: account.address,
+        chainId,
+      })
+
+      const hash = await payments.depositAndApprove(client, {
+        amount,
+      })
+
+      props?.onHash?.(hash)
+      const transactionReceipt = await waitForTransactionReceipt(config.getClient(), {
+        hash: hash,
+      })
+
+      queryClient.invalidateQueries({
+        queryKey: ['synapse-payments-account-info', from, token],
+      })
+      queryClient.invalidateQueries({
+        queryKey: ['synapse-erc20-balance', from, token],
+      })
+      queryClient.invalidateQueries({
+        queryKey: ['synapse-payments-operator-approvals', from, token, chain.contracts.storage.address],
+      })
+
+      return transactionReceipt
+    },
+    ...props?.mutation,
+  })
+}

package/src/usdfc.ts

@@ -0,0 +1,26 @@
+import { watchUsdfc } from '@filoz/synapse-core/usdfc'
+import { type MutateOptions, useMutation } from '@tanstack/react-query'
+import { useConfig } from 'wagmi'
+import { getConnectorClient } from 'wagmi/actions'
+
+export interface UseWatchUsdfcProps {
+  mutation?: Omit<MutateOptions<boolean, Error>, 'mutationFn'>
+}
+
+/**
+ * Add the USDFC token to the wallet.
+ *
+ * @param props - The props for the add USDFC.
+ * @param props.mutation - The mutation options.
+ */
+export function useAddUsdfc(props?: UseWatchUsdfcProps) {
+  const config = useConfig()
+
+  return useMutation({
+    ...props?.mutation,
+    mutationFn: async () => {
+      const client = await getConnectorClient(config)
+      return await watchUsdfc(client)
+    },
+  })
+}

package/src/warm-storage/index.ts

@@ -0,0 +1,5 @@
+export * from './use-create-data-set.ts'
+export * from './use-data-sets.ts'
+export * from './use-providers.ts'
+export * from './use-service-price.ts'
+export * from './use-upload.ts'

package/src/warm-storage/use-create-data-set.ts

@@ -0,0 +1,62 @@
+import type { DataSetCreatedResponse } from '@filoz/synapse-core/curio'
+import * as Curio from '@filoz/synapse-core/curio'
+import type { PDPProvider } from '@filoz/synapse-core/warm-storage'
+import { createDataSet } from '@filoz/synapse-core/warm-storage'
+import { type MutateOptions, useMutation, useQueryClient } from '@tanstack/react-query'
+import { useAccount, useChainId, useConfig } from 'wagmi'
+import { getConnectorClient } from 'wagmi/actions'
+
+export interface UseCreateDataSetProps {
+  /**
+   * The callback to call when the hash is available.
+   */
+  onHash?: (hash: string) => void
+  mutation?: Omit<MutateOptions<DataSetCreatedResponse, Error, UseCreateDataSetVariables>, 'mutationFn'>
+}
+
+export interface UseCreateDataSetVariables {
+  /**
+   * PDP Provider
+   */
+  provider: PDPProvider
+  cdn: boolean
+}
+
+export type UseCreateDataSetResult = DataSetCreatedResponse
+
+export function useCreateDataSet(props: UseCreateDataSetProps) {
+  const config = useConfig()
+  const chainId = useChainId({ config })
+  const account = useAccount({ config })
+  const queryClient = useQueryClient()
+  return useMutation({
+    ...props?.mutation,
+    mutationFn: async ({ provider, cdn }: UseCreateDataSetVariables) => {
+      const connectorClient = await getConnectorClient(config, {
+        account: account.address,
+        chainId,
+      })
+
+      const { hash, statusUrl } = await createDataSet(connectorClient, {
+        publicClient: config.getClient(),
+        provider,
+        cdn,
+        // metadata: {
+        //   title: 'Test Data Set',
+        //   description: 'Test Description',
+        // },
+      })
+      props?.onHash?.(hash)
+
+      const dataSet = await Curio.pollForDataSetCreationStatus({ statusUrl })
+
+      queryClient.invalidateQueries({
+        queryKey: ['synapse-warm-storage-data-sets', account.address],
+      })
+      queryClient.invalidateQueries({
+        queryKey: ['synapse-warm-storage-providers-with-data-sets', account.address],
+      })
+      return dataSet
+    },
+  })
+}

package/src/warm-storage/use-data-sets.ts

@@ -0,0 +1,74 @@
+import { type MetadataObject, metadataArrayToObject } from '@filoz/synapse-core'
+import { getChain } from '@filoz/synapse-core/chains'
+import type { CurioPieceWithUrl } from '@filoz/synapse-core/curio'
+import * as PDP from '@filoz/synapse-core/curio'
+import { type DataSet, getDataSets, readProviders } from '@filoz/synapse-core/warm-storage'
+import { skipToken, type UseQueryOptions, useQuery } from '@tanstack/react-query'
+import type { Simplify } from 'type-fest'
+import type { Address } from 'viem'
+import { readContract } from 'viem/actions'
+import { useChainId, useConfig } from 'wagmi'
+import { useProviders } from './use-providers.ts'
+
+export type PieceWithMetadata = Simplify<CurioPieceWithUrl & { metadata: MetadataObject }>
+
+export interface DataSetWithPieces extends DataSet {
+  pieces: PieceWithMetadata[]
+}
+
+export type UseDataSetsResult = DataSetWithPieces[]
+
+export interface UseDataSetsProps {
+  address?: Address
+  query?: Omit<UseQueryOptions<UseDataSetsResult>, 'queryKey' | 'queryFn'>
+}
+
+export function useDataSets(props: UseDataSetsProps) {
+  const config = useConfig()
+  const chainId = useChainId()
+  const address = props.address
+  const { data: providersPrefected } = useProviders()
+  const chain = getChain(chainId)
+  return useQuery({
+    queryKey: ['synapse-warm-storage-data-sets', address],
+    queryFn: address
+      ? async () => {
+          const providers = providersPrefected ?? (await readProviders(config.getClient()))
+          const dataSets = await getDataSets(config.getClient(), { address })
+          const dataSetsWithPieces = await Promise.all(
+            dataSets.map(async (dataSet) => {
+              // TODO: Get the active pieces from the PDP contract instead of the Curio API
+              const pieces = await PDP.getPiecesForDataSet({
+                endpoint: providers.find((p) => p.providerId === dataSet.providerId)?.pdp.serviceURL || '',
+                dataSetId: dataSet.pdpDatasetId,
+                chainId,
+                address,
+                cdn: dataSet.cdn,
+              })
+
+              const piecesWithMetadata = await Promise.all(
+                pieces.map(async (piece) => {
+                  const metadata = await readContract(config.getClient(), {
+                    address: chain.contracts.storageView.address,
+                    abi: chain.contracts.storageView.abi,
+                    functionName: 'getAllPieceMetadata',
+                    args: [dataSet.pdpDatasetId, BigInt(piece.pieceId)],
+                  })
+                  return {
+                    ...piece,
+                    metadata: metadataArrayToObject(metadata),
+                  }
+                })
+              )
+
+              return {
+                ...dataSet,
+                pieces: piecesWithMetadata,
+              }
+            })
+          )
+          return dataSetsWithPieces
+        }
+      : skipToken,
+  })
+}

package/src/warm-storage/use-providers.ts

@@ -0,0 +1,21 @@
+import { type PDPProvider, readProviders } from '@filoz/synapse-core/warm-storage'
+import { type UseQueryOptions, useQuery } from '@tanstack/react-query'
+import { useConfig } from 'wagmi'
+
+export interface UseProvidersProps {
+  query?: Omit<UseQueryOptions<UseProvidersResult>, 'queryKey' | 'queryFn'>
+}
+
+export type UseProvidersResult = PDPProvider[]
+
+export function useProviders(props?: UseProvidersProps) {
+  const config = useConfig()
+
+  return useQuery({
+    ...props?.query,
+    queryKey: ['synapse-warm-storage-providers'],
+    queryFn: () => {
+      return readProviders(config.getClient())
+    },
+  })
+}

package/src/warm-storage/use-service-price.ts

@@ -0,0 +1,34 @@
+import { type ServicePriceResult, servicePrice } from '@filoz/synapse-core/warm-storage'
+import { type UseQueryOptions, useQuery } from '@tanstack/react-query'
+import { useConfig } from 'wagmi'
+
+/**
+ * The props for the useServicePrice hook.
+ */
+export interface UseServicePriceProps {
+  query?: Omit<UseQueryOptions<ServicePriceResult>, 'queryKey' | 'queryFn'>
+}
+
+/**
+ * The result for the useServicePrice hook.
+ */
+export type UseServicePriceResult = ServicePriceResult
+
+/**
+ * Get the service price for the warm storage.
+ *
+ * @param props - The props to use.
+ * @returns The service price.
+ */
+export function useServicePrice(props?: UseServicePriceProps) {
+  const config = useConfig()
+
+  return useQuery({
+    ...props?.query,
+    queryKey: ['synapse-warm-storage-get-service-price'],
+    queryFn: async () => {
+      const result = await servicePrice(config.getClient())
+      return result
+    },
+  })
+}

package/src/warm-storage/use-upload.ts

@@ -0,0 +1,58 @@
+import { getChain } from '@filoz/synapse-core/chains'
+import type { AddPiecesSuccess } from '@filoz/synapse-core/curio'
+import * as Curio from '@filoz/synapse-core/curio'
+import type { SessionKey } from '@filoz/synapse-core/session-key'
+import { upload } from '@filoz/synapse-core/warm-storage'
+import { type MutateOptions, useMutation, useQueryClient } from '@tanstack/react-query'
+import { useAccount, useChainId, useConfig } from 'wagmi'
+import { getConnectorClient } from 'wagmi/actions'
+
+export interface UseUploadProps {
+  /**
+   * The callback to call when the hash is available.
+   */
+  onHash?: (hash: string) => void
+  mutation?: Omit<MutateOptions<AddPiecesSuccess, Error, UseUploadVariables>, 'mutationFn'>
+}
+
+export interface UseUploadVariables {
+  files: File[]
+  dataSetId: bigint
+  sessionKey?: SessionKey
+}
+export function useUpload(props: UseUploadProps) {
+  const config = useConfig()
+  const chainId = useChainId({ config })
+  const chain = getChain(chainId)
+  const account = useAccount({ config })
+  const queryClient = useQueryClient()
+  const client = config.getClient()
+
+  return useMutation({
+    ...props?.mutation,
+    mutationFn: async ({ files, dataSetId, sessionKey }: UseUploadVariables) => {
+      let connectorClient = await getConnectorClient(config, {
+        account: account.address,
+        chainId,
+      })
+      if (sessionKey && (await sessionKey.isValid(connectorClient, 'AddPieces'))) {
+        connectorClient = sessionKey.client(chain, client.transport)
+      }
+
+      const pieces = await upload(connectorClient, {
+        dataSetId,
+        data: files,
+      })
+
+      props?.onHash?.(pieces.txHash)
+      const rsp = await Curio.pollForAddPiecesStatus({
+        statusUrl: pieces.statusUrl,
+      })
+
+      queryClient.invalidateQueries({
+        queryKey: ['synapse-warm-storage-data-sets', account.address],
+      })
+      return rsp
+    },
+  })
+}