add public delete (#239)

Author: nikgraf

apps/events/src/components/playground.tsx

@@ -1,27 +1,55 @@
-import { useQuery } from '@graphprotocol/hypergraph-react';
+import { getSmartAccountWalletClient } from '@/lib/smart-account';
+import { _useDeleteEntityPublic, useQuery } from '@graphprotocol/hypergraph-react';
+import { useState } from 'react';
 import { Event } from '../schema';
+import { Button } from './ui/button';
 
 export const Playground = () => {
-  const {
-    data: entityData,
-    isLoading,
-    isError,
-  } = useQuery(Event, {
+  const { data, isLoading, isError } = useQuery(Event, {
     mode: 'public',
     include: {
       sponsors: {
         jobOffers: {},
       },
     },
   });
+  const [isDeleting, setIsDeleting] = useState(false);
 
-  console.log({ isLoading, isError, entityData });
+  const deleteEntity = _useDeleteEntityPublic(Event, {
+    space: '1c954768-7e14-4f0f-9396-0fe9dcd55fe8',
+  });
+
+  console.log({ isLoading, isError, data });
 
   return (
     <div>
       {isLoading && <div>Loading...</div>}
       {isError && <div>Error</div>}
-      <pre className="text-xs">{JSON.stringify(entityData, null, 2)}</pre>
+      {data?.map((event) => (
+        <div key={event.id}>
+          <h2>{event.name}</h2>
+          <Button
+            onClick={async () => {
+              setIsDeleting(true);
+              const walletClient = await getSmartAccountWalletClient();
+              if (!walletClient) {
+                alert('Wallet client not found');
+                return;
+              }
+              await deleteEntity({
+                id: event.id,
+                // @ts-expect-error - TODO: fix the types error
+                walletClient,
+              });
+              setIsDeleting(false);
+            }}
+            disabled={isDeleting}
+          >
+            {isDeleting ? 'Deleting...' : 'Delete'}
+          </Button>
+          <pre className="text-xs">{JSON.stringify(event, null, 2)}</pre>
+        </div>
+      ))}
     </div>
   );
 };

apps/events/src/lib/smart-account.ts

@@ -8,7 +8,6 @@ export const getSmartAccountWalletClient = async () => {
     // return await grc20getSmartAccountWalletClient({
     //   privateKey,
     // });
-    console.log('privateKey', privateKey);
     return await getWalletClient({
       privateKey,
     });

packages/hypergraph-react/src/index.ts

@@ -23,6 +23,7 @@ export {
   useUpdateEntity,
 } from './HypergraphSpaceContext.js';
 export { generateDeleteOps as _generateDeleteOps } from './internal/generate-delete-ops.js';
+export { useDeleteEntityPublic as _useDeleteEntityPublic } from './internal/use-delete-entity-public.js';
 export { useGenerateCreateOps as _useGenerateCreateOps } from './internal/use-generate-create-ops.js';
 export { useQueryPublic as _useQueryPublic } from './internal/use-query-public.js';
 export { publishOps } from './publish-ops.js';

packages/hypergraph-react/src/internal/use-delete-entity-public.tsx

@@ -0,0 +1,83 @@
+import { type GeoSmartAccount, Graph, type Op } from '@graphprotocol/grc-20';
+import type { Entity } from '@graphprotocol/hypergraph';
+import { useQueryClient } from '@tanstack/react-query';
+import request, { gql } from 'graphql-request';
+import { publishOps } from '../publish-ops.js';
+import { GEO_API_TESTNET_ENDPOINT } from './constants.js';
+
+type DeleteEntityPublicParams = {
+  space: string;
+};
+
+const deleteEntityQueryDocument = gql`
+query entityToDelete($entityId: String!, $spaceId: String!) {
+  entity(id: $entityId, spaceId: $spaceId) {
+    values {
+      propertyId
+    }
+    relations {
+      id
+    }
+  }
+}
+`;
+
+type EntityToDeleteQueryResult = {
+  entity: {
+    values: {
+      propertyId: string;
+    }[];
+    relations: {
+      id: string;
+    }[];
+  };
+} | null;
+
+export const useDeleteEntityPublic = <S extends Entity.AnyNoContext>(type: S, { space }: DeleteEntityPublicParams) => {
+  const queryClient = useQueryClient();
+
+  return async ({ id, walletClient }: { id: string; walletClient: GeoSmartAccount }) => {
+    try {
+      const result = await request<EntityToDeleteQueryResult>(GEO_API_TESTNET_ENDPOINT, deleteEntityQueryDocument, {
+        spaceId: space,
+        entityId: id,
+      });
+      if (!result) {
+        return { success: false, error: 'Entity not found' };
+      }
+      const { values, relations } = result.entity;
+      const ops: Op[] = [];
+      const { ops: unsetEntityValuesOps } = Graph.unsetEntityValues({
+        id,
+        properties: values.map(({ propertyId }) => propertyId),
+      });
+      ops.push(...unsetEntityValuesOps);
+      for (const relation of relations) {
+        const { ops: deleteRelationOps } = Graph.deleteRelation({ id: relation.id });
+        ops.push(...deleteRelationOps);
+      }
+
+      const { cid, txResult } = await publishOps({
+        ops,
+        space,
+        name: `Delete entity ${id}`,
+        walletClient,
+        network: 'TESTNET',
+      });
+      // TODO: temporary fix until we get the information from the API when a transaction is confirmed
+      await new Promise((resolve) => setTimeout(resolve, 2000));
+      queryClient.invalidateQueries({
+        queryKey: [
+          'hypergraph-public-entities',
+          // @ts-expect-error - TODO: find a better way to access the type.name
+          type.name,
+          space,
+        ],
+      });
+
+      return { success: true, cid, txResult };
+    } catch (error) {
+      return { success: false, error: 'Failed to delete entity' };
+    }
+  };
+};