full support for generic event nouns

Author: jonesmac

packages/plugins/packages/boundwitness/src/components/_shared/Payloads/payloads-table/TableBody.stories.tsx

@@ -38,13 +38,11 @@ const Default = Template.bind({})
 Default.args = {}
 
 const WithData = Template.bind({})
-WithData.args = {
-  ...data, eventNoun: 'boundwitness', clickableFields: ['hash'],
-}
+WithData.args = { ...data, clickableFields: ['payload'] }
 
 const WithCustomNouns = TemplateWithCustomNouns.bind({})
 WithCustomNouns.args = {
-  ...data, eventNoun: 'customNoun', clickableFields: ['hash'],
+  ...data, eventNoun: 'customNoun', clickableFields: ['customNoun'],
 }
 
 export {

packages/plugins/packages/boundwitness/src/components/_shared/Payloads/payloads-table/TableBody.tsx

@@ -11,16 +11,14 @@ import { useTableHeight } from '@xyo-network/react-table'
 import type { RefObject } from 'react'
 import React, { useLayoutEffect } from 'react'
 
-type clickableFields = 'payload'
-
-export interface BoundWitnessPayloadTableBodyProps<TNoun extends ExtendEventNoun = EventNoun> extends PayloadTableBodyProps {
-  clickableFields?: clickableFields[]
+export interface BoundWitnessPayloadTableBodyProps<TNoun extends ExtendEventNoun<string> = EventNoun> extends PayloadTableBodyProps {
+  clickableFields?: TNoun[]
   eventNoun?: TNoun
   payloadHashes?: string[]
   payloadSchemas?: string[]
 }
 
-export const BoundWitnessPayloadTableBody = <TNoun extends ExtendEventNoun = EventNoun>({
+export const BoundWitnessPayloadTableBody = <TNoun extends ExtendEventNoun<string> = EventNoun>({
   clickableFields,
   eventNoun = 'payload' as TNoun,
   payloadHashes,
@@ -34,7 +32,7 @@ export const BoundWitnessPayloadTableBody = <TNoun extends ExtendEventNoun = Eve
   } = props
 
   const { setRowHeight } = useTableHeight()
-  const [tableRowRef, dispatch] = useEvent<HTMLTableRowElement>(undefined, ref as RefObject<HTMLTableRowElement | null> | undefined)
+  const [tableRowRef, dispatch] = useEvent<HTMLTableRowElement, TNoun>(undefined, ref as RefObject<HTMLTableRowElement | null> | undefined)
 
   useLayoutEffect(() => {
     if (tableRowRef.current) {
@@ -53,7 +51,7 @@ export const BoundWitnessPayloadTableBody = <TNoun extends ExtendEventNoun = Eve
               <TableRow ref={tableRowRef} key={hash}>
                 <TableCell title={payloadSchemas[index]}>{payloadSchemas[index]}</TableCell>
                 <HashTableCell title={hash} value={hash}>
-                  {clickableFields?.includes('payload')
+                  {clickableFields?.includes(eventNoun)
                     ? (
                         <Link
                           sx={{ cursor: 'pointer' }}

packages/sdk/packages/event/src/hooks/useEvent.ts

@@ -3,11 +3,11 @@ import type { RefObject } from 'react'
 import { useCustomEvent } from './useCustomEvent.ts'
 
 export type EventNoun = 'payload' | 'boundwitness' | 'address' | 'hash' | 'signature' | 'schema'
-export type ExtendEventNoun<Extension extends string = string> = Extension | EventNoun
+export type ExtendEventNoun<Extension extends string | void = void> = Extension extends string ? Extension : EventNoun
 
 export type EventVerb = 'click' | 'favorite'
 
-export interface Event<TNoun = EventNoun, TVerb = EventVerb, TData = string> {
+export interface Event<TNoun = ExtendEventNoun, TVerb = EventVerb, TData = string> {
   data?: TData
   noun: TNoun
   verb: TVerb