@echoxyz/sonar-react 0.12.1 → 0.13.0

package/CHANGELOG.md

@@ -1,5 +1,27 @@
 # @echoxyz/sonar-react
 
+## 0.13.0
+
+### Minor Changes
+
+- Add wrapper function and hook for ReadCommitmentData endpoint
+
+### Patch Changes
+
+- Updated dependencies
+    - @echoxyz/sonar-core@0.14.0
+
+## 0.12.2
+
+### Patch Changes
+
+- 171a0db: Added support for ReadEntityInvestmentHistory API
+- Updated dependencies [c551d7c]
+- Updated dependencies [e276112]
+- Updated dependencies [171a0db]
+- Updated dependencies [b2cd697]
+    - @echoxyz/sonar-core@0.13.0
+
 ## 0.12.1
 
 ### Patch Changes

package/README.md

@@ -77,7 +77,41 @@ export default function OAuthCallback() {
 }
 ```
 
-4. Load the Sonar entity associated with the user's wallet
+4. (Optional) Load the authenticated user's profile
+
+```tsx
+import { useSonarProfile } from "@echoxyz/sonar-react";
+
+const UserProfilePanel = () => {
+    const { authenticated, loading, profile, error } = useSonarProfile();
+
+    if (!authenticated) {
+        return <p>Please sign in to view your profile</p>;
+    }
+
+    if (loading) {
+        return <p>Loading...</p>;
+    }
+
+    if (error) {
+        return <p>Error: {error.message}</p>;
+    }
+
+    if (!profile) {
+        return null;
+    }
+
+    return (
+        <div>
+            <span>Entity ID: {profile.EntityID}</span>
+            {/* EmailAddress only present if authorized with contact:email scope */}
+            {profile.EmailAddress && <span>Email: {profile.EmailAddress}</span>}
+        </div>
+    );
+};
+```
+
+5. Load the Sonar entity associated with the user's wallet
 
 ```tsx
 import { useSonarEntity } from "./hooks/useSonarEntity";
@@ -118,76 +152,63 @@ const ExampleEntityPanel = () => {
 
 If you want to fetch all entities associated with the logged in user, you can use the `useSonarEntities` hook.
 
-5. Implement the purchase flow
+6. Implement the purchase flow
 
 ```tsx
-function Example({
-  entityID,
-  walletAddress,
-}: {
-  entityID: string;
-  walletAddress: string;
-}) {
-  const sonarPurchaser = useSonarPurchase({
-    saleUUID: sonarConfig.saleUUID,
-    entityID,
-    entityType,
-    walletAddress,
-  });
-
-  if (sonarPurchaser.loading) {
-    return <p>Loading...</p>;
-  }
-
-  if (sonarPurchaser.error) {
-    return <p>Error: {error.message}</p>;
-  }
-
-  return (
-    <div>
-      {sonarPurchaser.readyToPurchase && (
-        <PurchaseButton
-          generatePurchasePermit={sonarPurchaser.generatePurchasePermit}
-        />
-      )}
-
-      {!sonarPurchaser.readyToPurchase &&
-        sonarPurchaser.failureReason ===
-          PrePurchaseFailureReason.REQUIRES_LIVENESS && (
-          <button
-            onClick={() => {
-              window.open(prePurchaseCheckResult.LivenessCheckURL, "_blank");
-            }}
-          >
-            Complete liveness check to purchase
-          </button>
-        )}
-    </div>
-  );
+function Example({ entityID, walletAddress }: { entityID: string; walletAddress: string }) {
+    const sonarPurchaser = useSonarPurchase({
+        saleUUID: sonarConfig.saleUUID,
+        entityID,
+        entityType,
+        walletAddress,
+    });
+
+    if (sonarPurchaser.loading) {
+        return <p>Loading...</p>;
+    }
+
+    if (sonarPurchaser.error) {
+        return <p>Error: {error.message}</p>;
+    }
+
+    return (
+        <div>
+            {sonarPurchaser.readyToPurchase && (
+                <PurchaseButton generatePurchasePermit={sonarPurchaser.generatePurchasePermit} />
+            )}
+
+            {!sonarPurchaser.readyToPurchase &&
+                sonarPurchaser.failureReason === PrePurchaseFailureReason.REQUIRES_LIVENESS && (
+                    <button
+                        onClick={() => {
+                            window.open(prePurchaseCheckResult.LivenessCheckURL, "_blank");
+                        }}
+                    >
+                        Complete liveness check to purchase
+                    </button>
+                )}
+        </div>
+    );
 }
 
 function PurchaseButton({
-  generatePurchasePermit,
+    generatePurchasePermit,
 }: {
-  generatePurchasePermit: () => Promise<GeneratePurchasePermitResponse>;
+    generatePurchasePermit: () => Promise<GeneratePurchasePermitResponse>;
 }) {
-  const purchase = async () => {
-    const response = await generatePurchasePermit();
-    const r = response as unknown as {
-      Signature: string;
-      PermitJSON: BasicPermitV2;
+    const purchase = async () => {
+        const response = await generatePurchasePermit();
+        const r = response as unknown as {
+            Signature: string;
+            PermitJSON: BasicPermitV2;
+        };
+        if (r.Signature && r.PermitJSON) {
+            console.log(permit.Signature, permit.Permit);
+            return;
+        }
     };
-    if (r.Signature && r.PermitJSON) {
-      console.log(permit.Signature, permit.Permit);
-      return;
-    }
-  };
 
-  return (
-    <button onClick={purchase}>
-      Purchase
-    </button>
-  );
+    return <button onClick={purchase}>Purchase</button>;
 }
 ```
 
@@ -203,9 +224,19 @@ function PurchaseButton({
 - `useSonarAuth()` → `{ authenticated, ready, token?, login(), completeOAuth({ code, state }), logout() }`
 
 - `useSonarClient()` → low-level `SonarClient` instance.
-  
+
+- `useSonarProfile()` → `{ authenticated, loading, profile?, error? }` high-level hook for fetching the authenticated user's profile (entity ID and email).
+
 - `useSonarEntity()` → `{ authenticated, loading, entity?, error? }` high-level convenience hook for fetching a Sonar entity by wallet address.
 
+- `useSonarEntities()` → `{ authenticated, loading, entities?, error? }` high-level hook for fetching all entities available to the authenticated user.
+
+- `useSonarPurchase()` → `{ loading, readyToPurchase, error?, generatePurchasePermit() }` high-level hook to check if the user is ready to purchase and generate a purchase permit.
+
+- `useEntityInvestmentHistory()` → `{ loading, investmentHistory?, error? }` high-level hook to fetch Echo private group investment history for a given entity.
+
+- `useCommitmentData()` → `{ loading, commitmentData?, error? }` high-level hook to poll for commitment data for a given sale. Note this calls a public API endpoint so the client does not need to be authenticated.
+
 ## Notes
 
 - Tokens are not auto-refreshed. On expiry, call `logout()` and re-run the OAuth flow.

package/dist/index.cjs

@@ -21,10 +21,13 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 var index_exports = {};
 __export(index_exports, {
   SonarProvider: () => SonarProvider,
+  useCommitmentData: () => useCommitmentData,
+  useEntityInvestmentHistory: () => useEntityInvestmentHistory,
   useSonarAuth: () => useSonarAuth,
   useSonarClient: () => useSonarClient,
   useSonarEntities: () => useSonarEntities,
   useSonarEntity: () => useSonarEntity,
+  useSonarProfile: () => useSonarProfile,
   useSonarPurchase: () => useSonarPurchase
 });
 module.exports = __toCommonJS(index_exports);
@@ -308,12 +311,150 @@ function useSonarPurchase(args) {
   }, [saleUUID, entityID, walletAddress, client, generatePurchasePermit]);
   return state;
 }
+function useSonarProfile() {
+  const { authenticated, ready } = useSonarAuth();
+  const client = useSonarClient();
+  const [state, setState] = (0, import_react2.useState)({
+    loading: false
+  });
+  const fullyConnected = ready && authenticated;
+  const refetch = (0, import_react2.useCallback)(async () => {
+    if (!fullyConnected) {
+      return;
+    }
+    setState((s) => ({ ...s, loading: true }));
+    try {
+      const resp = await client.myProfile();
+      setState({
+        loading: false,
+        profile: resp,
+        error: void 0
+      });
+    } catch (err) {
+      const error = err instanceof Error ? err : new Error(String(err));
+      setState({ loading: false, profile: void 0, error });
+    }
+  }, [client, fullyConnected]);
+  const reset = (0, import_react2.useCallback)(() => {
+    setState({
+      loading: false,
+      profile: void 0,
+      error: void 0
+    });
+  }, []);
+  (0, import_react2.useEffect)(() => {
+    if (fullyConnected) {
+      refetch();
+    }
+  }, [fullyConnected, refetch]);
+  (0, import_react2.useEffect)(() => {
+    if (ready && !authenticated) {
+      reset();
+    }
+  }, [ready, authenticated, reset]);
+  return {
+    authenticated,
+    loading: state.loading,
+    profile: state.profile,
+    error: state.error
+  };
+}
+function useEntityInvestmentHistory() {
+  const { authenticated, ready } = useSonarAuth();
+  const client = useSonarClient();
+  const [state, setState] = (0, import_react2.useState)({
+    loading: false
+  });
+  const fullyConnected = ready && authenticated;
+  const refetch = (0, import_react2.useCallback)(async () => {
+    if (!fullyConnected) {
+      return;
+    }
+    setState((s) => ({ ...s, loading: true }));
+    try {
+      const resp = await client.readEntityInvestmentHistory();
+      setState({
+        loading: false,
+        investmentHistory: resp,
+        error: void 0
+      });
+    } catch (err) {
+      const error = err instanceof Error ? err : new Error(String(err));
+      setState({ loading: false, investmentHistory: void 0, error });
+    }
+  }, [client, fullyConnected]);
+  const reset = (0, import_react2.useCallback)(() => {
+    setState({
+      loading: false,
+      investmentHistory: void 0,
+      error: void 0
+    });
+  }, []);
+  (0, import_react2.useEffect)(() => {
+    if (fullyConnected) {
+      refetch();
+    }
+  }, [fullyConnected, refetch]);
+  (0, import_react2.useEffect)(() => {
+    if (ready && !authenticated) {
+      reset();
+    }
+  }, [ready, authenticated, reset]);
+  return {
+    authenticated,
+    loading: state.loading,
+    investmentHistory: state.investmentHistory,
+    error: state.error
+  };
+}
+var MIN_POLLING_INTERVAL_MS = 1e3;
+function useCommitmentData(args) {
+  const saleUUID = args.saleUUID;
+  const pollingIntervalMs = args.pollingIntervalMs;
+  if (pollingIntervalMs !== void 0 && pollingIntervalMs < MIN_POLLING_INTERVAL_MS) {
+    throw new Error(`pollingIntervalMs must be at least ${MIN_POLLING_INTERVAL_MS}ms`);
+  }
+  const client = useSonarClient();
+  const [state, setState] = (0, import_react2.useState)({
+    loading: false
+  });
+  const refetch = (0, import_react2.useCallback)(async () => {
+    setState((s) => ({ ...s, loading: true }));
+    try {
+      const resp = await client.readCommitmentData({ saleUUID });
+      setState({
+        loading: false,
+        commitmentData: resp,
+        error: void 0
+      });
+    } catch (err) {
+      const error = err instanceof Error ? err : new Error(String(err));
+      setState({ loading: false, commitmentData: void 0, error });
+    }
+  }, [client, saleUUID]);
+  (0, import_react2.useEffect)(() => {
+    refetch();
+    if (pollingIntervalMs === void 0) {
+      return;
+    }
+    const intervalId = setInterval(() => {
+      refetch();
+    }, pollingIntervalMs);
+    return () => {
+      clearInterval(intervalId);
+    };
+  }, [refetch, pollingIntervalMs]);
+  return state;
+}
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   SonarProvider,
+  useCommitmentData,
+  useEntityInvestmentHistory,
   useSonarAuth,
   useSonarClient,
   useSonarEntities,
   useSonarEntity,
+  useSonarProfile,
   useSonarPurchase
 });

package/dist/index.d.cts

@@ -1,6 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import React from 'react';
-import { SonarClient, EntityDetails, GeneratePurchasePermitResponse, PrePurchaseFailureReason, EntityID } from '@echoxyz/sonar-core';
+import { SonarClient, EntityDetails, GeneratePurchasePermitResponse, PrePurchaseFailureReason, EntityID, MyProfileResponse, EntityInvestmentHistoryResponse, ReadCommitmentDataResponse } from '@echoxyz/sonar-core';
 
 type SonarProviderProps = {
     children: React.ReactNode;
@@ -77,5 +77,31 @@ declare function useSonarPurchase(args: {
     entityID: EntityID;
     walletAddress: string;
 }): UseSonarPurchaseResult;
+type UseSonarProfileResult = {
+    authenticated: boolean;
+    loading: boolean;
+    profile?: MyProfileResponse;
+    error?: Error;
+};
+declare function useSonarProfile(): UseSonarProfileResult;
+type UseEntityInvestmentHistoryResult = {
+    authenticated: boolean;
+    loading: boolean;
+    investmentHistory?: EntityInvestmentHistoryResponse;
+    error?: Error;
+};
+declare function useEntityInvestmentHistory(): UseEntityInvestmentHistoryResult;
+type UseCommitmentDataResult = {
+    loading: boolean;
+    commitmentData?: ReadCommitmentDataResponse;
+    error?: Error;
+};
+/**
+ * Fetches commitment data for a sale and optionally polls for updates. Polling is disabled by default.
+ */
+declare function useCommitmentData(args: {
+    saleUUID: string;
+    pollingIntervalMs?: number;
+}): UseCommitmentDataResult;
 
-export { SonarProvider, type SonarProviderConfig, type UseSonarEntitiesResult, type UseSonarEntityResult, type UseSonarPurchaseResult, type UseSonarPurchaseResultError, type UseSonarPurchaseResultLoading, type UseSonarPurchaseResultNotReadyToPurchase, type UseSonarPurchaseResultReadyToPurchase, useSonarAuth, useSonarClient, useSonarEntities, useSonarEntity, useSonarPurchase };
+export { SonarProvider, type SonarProviderConfig, type UseCommitmentDataResult, type UseEntityInvestmentHistoryResult, type UseSonarEntitiesResult, type UseSonarEntityResult, type UseSonarProfileResult, type UseSonarPurchaseResult, type UseSonarPurchaseResultError, type UseSonarPurchaseResultLoading, type UseSonarPurchaseResultNotReadyToPurchase, type UseSonarPurchaseResultReadyToPurchase, useCommitmentData, useEntityInvestmentHistory, useSonarAuth, useSonarClient, useSonarEntities, useSonarEntity, useSonarProfile, useSonarPurchase };

package/dist/index.d.ts

@@ -1,6 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import React from 'react';
-import { SonarClient, EntityDetails, GeneratePurchasePermitResponse, PrePurchaseFailureReason, EntityID } from '@echoxyz/sonar-core';
+import { SonarClient, EntityDetails, GeneratePurchasePermitResponse, PrePurchaseFailureReason, EntityID, MyProfileResponse, EntityInvestmentHistoryResponse, ReadCommitmentDataResponse } from '@echoxyz/sonar-core';
 
 type SonarProviderProps = {
     children: React.ReactNode;
@@ -77,5 +77,31 @@ declare function useSonarPurchase(args: {
     entityID: EntityID;
     walletAddress: string;
 }): UseSonarPurchaseResult;
+type UseSonarProfileResult = {
+    authenticated: boolean;
+    loading: boolean;
+    profile?: MyProfileResponse;
+    error?: Error;
+};
+declare function useSonarProfile(): UseSonarProfileResult;
+type UseEntityInvestmentHistoryResult = {
+    authenticated: boolean;
+    loading: boolean;
+    investmentHistory?: EntityInvestmentHistoryResponse;
+    error?: Error;
+};
+declare function useEntityInvestmentHistory(): UseEntityInvestmentHistoryResult;
+type UseCommitmentDataResult = {
+    loading: boolean;
+    commitmentData?: ReadCommitmentDataResponse;
+    error?: Error;
+};
+/**
+ * Fetches commitment data for a sale and optionally polls for updates. Polling is disabled by default.
+ */
+declare function useCommitmentData(args: {
+    saleUUID: string;
+    pollingIntervalMs?: number;
+}): UseCommitmentDataResult;
 
-export { SonarProvider, type SonarProviderConfig, type UseSonarEntitiesResult, type UseSonarEntityResult, type UseSonarPurchaseResult, type UseSonarPurchaseResultError, type UseSonarPurchaseResultLoading, type UseSonarPurchaseResultNotReadyToPurchase, type UseSonarPurchaseResultReadyToPurchase, useSonarAuth, useSonarClient, useSonarEntities, useSonarEntity, useSonarPurchase };
+export { SonarProvider, type SonarProviderConfig, type UseCommitmentDataResult, type UseEntityInvestmentHistoryResult, type UseSonarEntitiesResult, type UseSonarEntityResult, type UseSonarProfileResult, type UseSonarPurchaseResult, type UseSonarPurchaseResultError, type UseSonarPurchaseResultLoading, type UseSonarPurchaseResultNotReadyToPurchase, type UseSonarPurchaseResultReadyToPurchase, useCommitmentData, useEntityInvestmentHistory, useSonarAuth, useSonarClient, useSonarEntities, useSonarEntity, useSonarProfile, useSonarPurchase };

package/dist/index.js

@@ -279,11 +279,149 @@ function useSonarPurchase(args) {
   }, [saleUUID, entityID, walletAddress, client, generatePurchasePermit]);
   return state;
 }
+function useSonarProfile() {
+  const { authenticated, ready } = useSonarAuth();
+  const client = useSonarClient();
+  const [state, setState] = useState2({
+    loading: false
+  });
+  const fullyConnected = ready && authenticated;
+  const refetch = useCallback2(async () => {
+    if (!fullyConnected) {
+      return;
+    }
+    setState((s) => ({ ...s, loading: true }));
+    try {
+      const resp = await client.myProfile();
+      setState({
+        loading: false,
+        profile: resp,
+        error: void 0
+      });
+    } catch (err) {
+      const error = err instanceof Error ? err : new Error(String(err));
+      setState({ loading: false, profile: void 0, error });
+    }
+  }, [client, fullyConnected]);
+  const reset = useCallback2(() => {
+    setState({
+      loading: false,
+      profile: void 0,
+      error: void 0
+    });
+  }, []);
+  useEffect2(() => {
+    if (fullyConnected) {
+      refetch();
+    }
+  }, [fullyConnected, refetch]);
+  useEffect2(() => {
+    if (ready && !authenticated) {
+      reset();
+    }
+  }, [ready, authenticated, reset]);
+  return {
+    authenticated,
+    loading: state.loading,
+    profile: state.profile,
+    error: state.error
+  };
+}
+function useEntityInvestmentHistory() {
+  const { authenticated, ready } = useSonarAuth();
+  const client = useSonarClient();
+  const [state, setState] = useState2({
+    loading: false
+  });
+  const fullyConnected = ready && authenticated;
+  const refetch = useCallback2(async () => {
+    if (!fullyConnected) {
+      return;
+    }
+    setState((s) => ({ ...s, loading: true }));
+    try {
+      const resp = await client.readEntityInvestmentHistory();
+      setState({
+        loading: false,
+        investmentHistory: resp,
+        error: void 0
+      });
+    } catch (err) {
+      const error = err instanceof Error ? err : new Error(String(err));
+      setState({ loading: false, investmentHistory: void 0, error });
+    }
+  }, [client, fullyConnected]);
+  const reset = useCallback2(() => {
+    setState({
+      loading: false,
+      investmentHistory: void 0,
+      error: void 0
+    });
+  }, []);
+  useEffect2(() => {
+    if (fullyConnected) {
+      refetch();
+    }
+  }, [fullyConnected, refetch]);
+  useEffect2(() => {
+    if (ready && !authenticated) {
+      reset();
+    }
+  }, [ready, authenticated, reset]);
+  return {
+    authenticated,
+    loading: state.loading,
+    investmentHistory: state.investmentHistory,
+    error: state.error
+  };
+}
+var MIN_POLLING_INTERVAL_MS = 1e3;
+function useCommitmentData(args) {
+  const saleUUID = args.saleUUID;
+  const pollingIntervalMs = args.pollingIntervalMs;
+  if (pollingIntervalMs !== void 0 && pollingIntervalMs < MIN_POLLING_INTERVAL_MS) {
+    throw new Error(`pollingIntervalMs must be at least ${MIN_POLLING_INTERVAL_MS}ms`);
+  }
+  const client = useSonarClient();
+  const [state, setState] = useState2({
+    loading: false
+  });
+  const refetch = useCallback2(async () => {
+    setState((s) => ({ ...s, loading: true }));
+    try {
+      const resp = await client.readCommitmentData({ saleUUID });
+      setState({
+        loading: false,
+        commitmentData: resp,
+        error: void 0
+      });
+    } catch (err) {
+      const error = err instanceof Error ? err : new Error(String(err));
+      setState({ loading: false, commitmentData: void 0, error });
+    }
+  }, [client, saleUUID]);
+  useEffect2(() => {
+    refetch();
+    if (pollingIntervalMs === void 0) {
+      return;
+    }
+    const intervalId = setInterval(() => {
+      refetch();
+    }, pollingIntervalMs);
+    return () => {
+      clearInterval(intervalId);
+    };
+  }, [refetch, pollingIntervalMs]);
+  return state;
+}
 export {
   SonarProvider,
+  useCommitmentData,
+  useEntityInvestmentHistory,
   useSonarAuth,
   useSonarClient,
   useSonarEntities,
   useSonarEntity,
+  useSonarProfile,
   useSonarPurchase
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@echoxyz/sonar-react",
-  "version": "0.12.1",
+  "version": "0.13.0",
   "type": "module",
   "main": "./dist/index.cjs",
   "module": "./dist/index.js",
@@ -16,7 +16,7 @@
     "react": ">=18"
   },
   "dependencies": {
-    "@echoxyz/sonar-core": "0.12.0"
+    "@echoxyz/sonar-core": "0.14.0"
   },
   "devDependencies": {
     "@testing-library/react": "^16.0.0",