@medialane/ui 0.303.0 → 0.305.0

package/dist/components/collection-provenance-tab.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/collection-provenance-tab.tsx"],"sourcesContent":["\"use client\";\n\nimport { useState, useEffect, useMemo } from \"react\";\nimport type { ApiActivity } from \"@medialane/sdk\";\nimport { assetHref, profileHref } from \"@medialane/sdk\";\nimport { ExternalLink, Inbox } from \"lucide-react\";\nimport Image from \"./image.js\";\nimport Link from \"./link.js\";\nimport { AddressDisplay } from \"./address-display.js\";\nimport { CurrencyIcon } from \"./currency-icon.js\";\nimport { LoadMoreSentinel } from \"./load-more-sentinel.js\";\nimport { useActivities } from \"../utils/use-activities.js\";\nimport { useImageUrl } from \"../utils/use-image-url.js\";\nimport { ACTIVITY_TYPE_CONFIG } from \"../data/activity.js\";\nimport { EXPLORER_URL } from \"../utils/explorer-url.js\";\nimport { formatDisplayPrice } from \"../utils/format.js\";\nimport { timeAgo } from \"../utils/time.js\";\nimport { cn } from \"../utils/cn.js\";\n\nconst PAGE_SIZE = 30;\n\nconst EVENT_TITLE: Record<string, string> = {\n  mint: \"Minted\",\n  listing: \"Listed for sale\",\n  sale: \"Purchased\",\n  offer: \"Offer made\",\n  transfer: \"Transferred\",\n  cancelled: \"Listing cancelled\",\n};\n\nfunction dayLabel(iso: string): string {\n  const date = new Date(iso);\n  const today = new Date();\n  const yesterday = new Date();\n  yesterday.setDate(today.getDate() - 1);\n  if (date.toDateString() === today.toDateString()) return \"Today\";\n  if (date.toDateString() === yesterday.toDateString()) return \"Yesterday\";\n  return date.toLocaleDateString(undefined, { day: \"numeric\", month: \"long\", year: \"numeric\" });\n}\n\nfunction groupByDay(events: ApiActivity[]) {\n  const groups: { label: string; events: ApiActivity[] }[] = [];\n  for (const event of events) {\n    const label = dayLabel(event.timestamp);\n    const last = groups[groups.length - 1];\n    if (last && last.label === label) last.events.push(event);\n    else groups.push({ label, events: [event] });\n  }\n  return groups;\n}\n\nfunction ProvenanceEvent({ event, showAsset }: { event: ApiActivity; showAsset: boolean }) {\n  const resolveImage = useImageUrl();\n  const config = ACTIVITY_TYPE_CONFIG[event.type];\n  const Icon = config?.icon ?? ExternalLink;\n  const contract = event.nftContract ?? event.contractAddress ?? null;\n  const tokenId = event.nftTokenId ?? event.tokenId ?? null;\n  const actor =\n    event.offerer ?? event.fulfiller ?? (event.type === \"mint\" ? event.to : event.from) ?? null;\n  const amount = event.amount && Number(event.amount) > 1 ? event.amount : null;\n  const name = event.token?.name ?? (tokenId ? `#${tokenId}` : null);\n  const image = resolveImage(event.token?.image ?? null);\n  const leadWithAsset = showAsset && !!name;\n  const assetLink = contract && tokenId ? assetHref(event.chain ?? \"STARKNET\", contract, tokenId) : null;\n\n  const actorLink = actor ? (\n    <span className=\"text-sm font-normal text-muted-foreground\">\n      by{\" \"}\n      <Link\n        href={profileHref({ address: actor })}\n        className=\"font-medium text-foreground/80 hover:text-primary transition-colors\"\n      >\n        <AddressDisplay address={actor} chars={6} showCopy={false} className=\"text-sm\" />\n      </Link>\n    </span>\n  ) : null;\n\n  const tile = (\n    <span\n      className={cn(\n        \"flex h-11 w-11 shrink-0 items-center justify-center rounded-xl\",\n        config?.bgClass ?? \"bg-muted\"\n      )}\n      aria-hidden\n    >\n      <Icon className={cn(\"h-5 w-5\", config?.colorClass ?? \"text-muted-foreground\")} />\n    </span>\n  );\n\n  const thumb = (\n    <span className=\"relative h-14 w-14 shrink-0\">\n      <span className=\"block h-full w-full overflow-hidden rounded-xl bg-gradient-to-br from-brand-blue/25 via-brand-purple/25 to-brand-rose/25\">\n        {image ? (\n          <Image src={image} alt=\"\" width={56} height={56} className=\"h-full w-full object-cover\" unoptimized />\n        ) : null}\n      </span>\n      <span\n        className={cn(\n          \"absolute -bottom-1 -right-1 flex h-6 w-6 items-center justify-center rounded-full bg-card ring-2 ring-card\"\n        )}\n        aria-hidden\n      >\n        <span className={cn(\"flex h-full w-full items-center justify-center rounded-full\", config?.bgClass ?? \"bg-muted\")}>\n          <Icon className={cn(\"h-3 w-3\", config?.colorClass ?? \"text-muted-foreground\")} />\n        </span>\n      </span>\n    </span>\n  );\n\n  return (\n    <li className=\"flex items-center gap-4 rounded-2xl border border-border/50 bg-card/60 p-4 backdrop-blur-sm transition-colors hover:bg-card/90\">\n      {leadWithAsset ? (assetLink ? <Link href={assetLink} className=\"shrink-0\">{thumb}</Link> : thumb) : tile}\n\n      <div className=\"min-w-0 flex-1\">\n        {leadWithAsset ? (\n          <>\n            {assetLink ? (\n              <Link href={assetLink} className=\"block truncate text-base font-semibold leading-tight hover:text-primary transition-colors\">\n                {name}\n              </Link>\n            ) : (\n              <p className=\"truncate text-base font-semibold leading-tight\">{name}</p>\n            )}\n            <p className=\"mt-1 flex flex-wrap items-baseline gap-x-1.5 text-sm\">\n              <span className={cn(\"font-medium\", config?.colorClass)}>{EVENT_TITLE[event.type] ?? event.type}</span>\n              {amount ? <span className=\"text-muted-foreground\">×{amount}</span> : null}\n              {actorLink}\n            </p>\n          </>\n        ) : (\n          <p className=\"flex flex-wrap items-baseline gap-x-1.5 text-base font-semibold leading-tight\">\n            {EVENT_TITLE[event.type] ?? event.type}\n            {amount ? <span className=\"text-sm font-medium text-muted-foreground\">×{amount}</span> : null}\n            {actorLink}\n          </p>\n        )}\n      </div>\n\n      <div className=\"flex shrink-0 flex-col items-end gap-1\">\n        {event.price?.formatted ? (\n          <span className=\"flex items-center gap-1.5 text-base font-bold tabular-nums\">\n            {event.price.currency ? <CurrencyIcon symbol={event.price.currency} size={15} aria-hidden /> : null}\n            {formatDisplayPrice(event.price.formatted)}\n            {event.price.currency ? (\n              <span className=\"text-xs font-medium text-muted-foreground\">{event.price.currency}</span>\n            ) : null}\n          </span>\n        ) : null}\n        <span className=\"flex items-center gap-1 text-xs text-muted-foreground\">\n          <time dateTime={event.timestamp} title={new Date(event.timestamp).toLocaleString()}>\n            {timeAgo(event.timestamp)}\n          </time>\n          {event.txHash ? (\n            <a\n              href={`${EXPLORER_URL}/tx/${event.txHash}`}\n              target=\"_blank\"\n              rel=\"noopener noreferrer\"\n              className=\"rounded-md p-1 hover:bg-muted hover:text-foreground transition-colors\"\n              aria-label=\"View transaction\"\n            >\n              <ExternalLink className=\"h-3.5 w-3.5\" aria-hidden />\n            </a>\n          ) : null}\n        </span>\n      </div>\n    </li>\n  );\n}\n\nfunction ProvenanceSkeleton() {\n  return (\n    <div className=\"grid gap-2.5 lg:grid-cols-2\" aria-hidden>\n      {Array.from({ length: 5 }).map((_, i) => (\n        <div key={i} className=\"flex items-center gap-4 rounded-2xl border border-border/50 bg-card/60 p-4\">\n          <div className=\"h-11 w-11 shrink-0 rounded-xl bg-muted animate-pulse\" />\n          <div className=\"flex-1 space-y-2\">\n            <div className=\"h-4 w-44 rounded bg-muted animate-pulse\" />\n            <div className=\"h-3 w-24 rounded bg-muted animate-pulse\" />\n          </div>\n          <div className=\"h-4 w-16 rounded bg-muted animate-pulse\" />\n        </div>\n      ))}\n    </div>\n  );\n}\n\nexport interface CollectionProvenanceTabProps {\n  contract: string;\n}\n\nexport function CollectionProvenanceTab({ contract }: CollectionProvenanceTabProps) {\n  const [page, setPage] = useState(1);\n  const [all, setAll] = useState<ApiActivity[]>([]);\n  const { activities, meta, isLoading } = useActivities({ contract, page, limit: PAGE_SIZE });\n\n  useEffect(() => {\n    if (activities.length === 0) return;\n    setAll((prev) => (page === 1 ? activities : [...prev, ...activities]));\n  }, [activities, page]);\n\n  const groups = useMemo(() => groupByDay(all), [all]);\n  const showAsset = useMemo(\n    () => new Set(all.map((e) => e.nftTokenId ?? e.tokenId ?? \"\")).size > 1,\n    [all]\n  );\n  const hasMore = meta ? all.length < (meta.total ?? 0) : false;\n\n  if (isLoading && all.length === 0) return <ProvenanceSkeleton />;\n\n  if (all.length === 0) {\n    return (\n      <div className=\"py-20 flex flex-col items-center gap-3 text-center\">\n        <Inbox className=\"h-10 w-10 text-muted-foreground/40\" />\n        <p className=\"text-sm font-medium text-muted-foreground\">No history yet</p>\n        <p className=\"text-xs text-muted-foreground/70 max-w-xs\">\n          Mints, transfers, listings and sales will appear here as they happen.\n        </p>\n      </div>\n    );\n  }\n\n  return (\n    <div className=\"space-y-8\">\n      {groups.map((group) => (\n        <section key={group.label}>\n          <h3 className=\"mb-3 font-display text-lg font-bold\">{group.label}</h3>\n          <ol className=\"grid gap-2.5 lg:grid-cols-2\">\n            {group.events.map((event, i) => (\n              <ProvenanceEvent\n                key={`${event.txHash ?? event.orderHash}-${event.type}-${i}`}\n                event={event}\n                showAsset={showAsset}\n              />\n            ))}\n          </ol>\n        </section>\n      ))}\n      <LoadMoreSentinel hasMore={hasMore} isLoading={isLoading} onLoadMore={() => setPage((p) => p + 1)} />\n    </div>\n  );\n}\n"],"mappings":";AAkEI,SAiDM,UA3CF,KANJ;AAhEJ,SAAS,UAAU,WAAW,eAAe;AAE7C,SAAS,WAAW,mBAAmB;AACvC,SAAS,cAAc,aAAa;AACpC,OAAO,WAAW;AAClB,OAAO,UAAU;AACjB,SAAS,sBAAsB;AAC/B,SAAS,oBAAoB;AAC7B,SAAS,wBAAwB;AACjC,SAAS,qBAAqB;AAC9B,SAAS,mBAAmB;AAC5B,SAAS,4BAA4B;AACrC,SAAS,oBAAoB;AAC7B,SAAS,0BAA0B;AACnC,SAAS,eAAe;AACxB,SAAS,UAAU;AAEnB,MAAM,YAAY;AAElB,MAAM,cAAsC;AAAA,EAC1C,MAAM;AAAA,EACN,SAAS;AAAA,EACT,MAAM;AAAA,EACN,OAAO;AAAA,EACP,UAAU;AAAA,EACV,WAAW;AACb;AAEA,SAAS,SAAS,KAAqB;AACrC,QAAM,OAAO,IAAI,KAAK,GAAG;AACzB,QAAM,QAAQ,oBAAI,KAAK;AACvB,QAAM,YAAY,oBAAI,KAAK;AAC3B,YAAU,QAAQ,MAAM,QAAQ,IAAI,CAAC;AACrC,MAAI,KAAK,aAAa,MAAM,MAAM,aAAa,EAAG,QAAO;AACzD,MAAI,KAAK,aAAa,MAAM,UAAU,aAAa,EAAG,QAAO;AAC7D,SAAO,KAAK,mBAAmB,QAAW,EAAE,KAAK,WAAW,OAAO,QAAQ,MAAM,UAAU,CAAC;AAC9F;AAEA,SAAS,WAAW,QAAuB;AACzC,QAAM,SAAqD,CAAC;AAC5D,aAAW,SAAS,QAAQ;AAC1B,UAAM,QAAQ,SAAS,MAAM,SAAS;AACtC,UAAM,OAAO,OAAO,OAAO,SAAS,CAAC;AACrC,QAAI,QAAQ,KAAK,UAAU,MAAO,MAAK,OAAO,KAAK,KAAK;AAAA,QACnD,QAAO,KAAK,EAAE,OAAO,QAAQ,CAAC,KAAK,EAAE,CAAC;AAAA,EAC7C;AACA,SAAO;AACT;AAEA,SAAS,gBAAgB,EAAE,OAAO,UAAU,GAA+C;AACzF,QAAM,eAAe,YAAY;AACjC,QAAM,SAAS,qBAAqB,MAAM,IAAI;AAC9C,QAAM,OAAO,QAAQ,QAAQ;AAC7B,QAAM,WAAW,MAAM,eAAe,MAAM,mBAAmB;AAC/D,QAAM,UAAU,MAAM,cAAc,MAAM,WAAW;AACrD,QAAM,QACJ,MAAM,WAAW,MAAM,cAAc,MAAM,SAAS,SAAS,MAAM,KAAK,MAAM,SAAS;AACzF,QAAM,SAAS,MAAM,UAAU,OAAO,MAAM,MAAM,IAAI,IAAI,MAAM,SAAS;AACzE,QAAM,OAAO,MAAM,OAAO,SAAS,UAAU,IAAI,OAAO,KAAK;AAC7D,QAAM,QAAQ,aAAa,MAAM,OAAO,SAAS,IAAI;AACrD,QAAM,gBAAgB,aAAa,CAAC,CAAC;AACrC,QAAM,YAAY,YAAY,UAAU,UAAU,MAAM,SAAS,YAAY,UAAU,OAAO,IAAI;AAElG,QAAM,YAAY,QAChB,qBAAC,UAAK,WAAU,6CAA4C;AAAA;AAAA,IACvD;AAAA,IACH;AAAA,MAAC;AAAA;AAAA,QACC,MAAM,YAAY,EAAE,SAAS,MAAM,CAAC;AAAA,QACpC,WAAU;AAAA,QAEV,8BAAC,kBAAe,SAAS,OAAO,OAAO,GAAG,UAAU,OAAO,WAAU,WAAU;AAAA;AAAA,IACjF;AAAA,KACF,IACE;AAEJ,QAAM,OACJ;AAAA,IAAC;AAAA;AAAA,MACC,WAAW;AAAA,QACT;AAAA,QACA,QAAQ,WAAW;AAAA,MACrB;AAAA,MACA,eAAW;AAAA,MAEX,8BAAC,QAAK,WAAW,GAAG,WAAW,QAAQ,cAAc,uBAAuB,GAAG;AAAA;AAAA,EACjF;AAGF,QAAM,QACJ,qBAAC,UAAK,WAAU,+BACd;AAAA,wBAAC,UAAK,WAAU,4HACb,kBACC,oBAAC,SAAM,KAAK,OAAO,KAAI,IAAG,OAAO,IAAI,QAAQ,IAAI,WAAU,8BAA6B,aAAW,MAAC,IAClG,MACN;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACC,WAAW;AAAA,UACT;AAAA,QACF;AAAA,QACA,eAAW;AAAA,QAEX,8BAAC,UAAK,WAAW,GAAG,+DAA+D,QAAQ,WAAW,UAAU,GAC9G,8BAAC,QAAK,WAAW,GAAG,WAAW,QAAQ,cAAc,uBAAuB,GAAG,GACjF;AAAA;AAAA,IACF;AAAA,KACF;AAGF,SACE,qBAAC,QAAG,WAAU,kIACX;AAAA,oBAAiB,YAAY,oBAAC,QAAK,MAAM,WAAW,WAAU,YAAY,iBAAM,IAAU,QAAS;AAAA,IAEpG,oBAAC,SAAI,WAAU,kBACZ,0BACC,iCACG;AAAA,kBACC,oBAAC,QAAK,MAAM,WAAW,WAAU,6FAC9B,gBACH,IAEA,oBAAC,OAAE,WAAU,kDAAkD,gBAAK;AAAA,MAEtE,qBAAC,OAAE,WAAU,wDACX;AAAA,4BAAC,UAAK,WAAW,GAAG,eAAe,QAAQ,UAAU,GAAI,sBAAY,MAAM,IAAI,KAAK,MAAM,MAAK;AAAA,QAC9F,SAAS,qBAAC,UAAK,WAAU,yBAAwB;AAAA;AAAA,UAAE;AAAA,WAAO,IAAU;AAAA,QACpE;AAAA,SACH;AAAA,OACF,IAEA,qBAAC,OAAE,WAAU,iFACV;AAAA,kBAAY,MAAM,IAAI,KAAK,MAAM;AAAA,MACjC,SAAS,qBAAC,UAAK,WAAU,6CAA4C;AAAA;AAAA,QAAE;AAAA,SAAO,IAAU;AAAA,MACxF;AAAA,OACH,GAEJ;AAAA,IAEA,qBAAC,SAAI,WAAU,0CACZ;AAAA,YAAM,OAAO,YACZ,qBAAC,UAAK,WAAU,8DACb;AAAA,cAAM,MAAM,WAAW,oBAAC,gBAAa,QAAQ,MAAM,MAAM,UAAU,MAAM,IAAI,eAAW,MAAC,IAAK;AAAA,QAC9F,mBAAmB,MAAM,MAAM,SAAS;AAAA,QACxC,MAAM,MAAM,WACX,oBAAC,UAAK,WAAU,6CAA6C,gBAAM,MAAM,UAAS,IAChF;AAAA,SACN,IACE;AAAA,MACJ,qBAAC,UAAK,WAAU,yDACd;AAAA,4BAAC,UAAK,UAAU,MAAM,WAAW,OAAO,IAAI,KAAK,MAAM,SAAS,EAAE,eAAe,GAC9E,kBAAQ,MAAM,SAAS,GAC1B;AAAA,QACC,MAAM,SACL;AAAA,UAAC;AAAA;AAAA,YACC,MAAM,GAAG,YAAY,OAAO,MAAM,MAAM;AAAA,YACxC,QAAO;AAAA,YACP,KAAI;AAAA,YACJ,WAAU;AAAA,YACV,cAAW;AAAA,YAEX,8BAAC,gBAAa,WAAU,eAAc,eAAW,MAAC;AAAA;AAAA,QACpD,IACE;AAAA,SACN;AAAA,OACF;AAAA,KACF;AAEJ;AAEA,SAAS,qBAAqB;AAC5B,SACE,oBAAC,SAAI,WAAU,+BAA8B,eAAW,MACrD,gBAAM,KAAK,EAAE,QAAQ,EAAE,CAAC,EAAE,IAAI,CAAC,GAAG,MACjC,qBAAC,SAAY,WAAU,8EACrB;AAAA,wBAAC,SAAI,WAAU,wDAAuD;AAAA,IACtE,qBAAC,SAAI,WAAU,oBACb;AAAA,0BAAC,SAAI,WAAU,2CAA0C;AAAA,MACzD,oBAAC,SAAI,WAAU,2CAA0C;AAAA,OAC3D;AAAA,IACA,oBAAC,SAAI,WAAU,2CAA0C;AAAA,OANjD,CAOV,CACD,GACH;AAEJ;AAMO,SAAS,wBAAwB,EAAE,SAAS,GAAiC;AAClF,QAAM,CAAC,MAAM,OAAO,IAAI,SAAS,CAAC;AAClC,QAAM,CAAC,KAAK,MAAM,IAAI,SAAwB,CAAC,CAAC;AAChD,QAAM,EAAE,YAAY,MAAM,UAAU,IAAI,cAAc,EAAE,UAAU,MAAM,OAAO,UAAU,CAAC;AAE1F,YAAU,MAAM;AACd,QAAI,WAAW,WAAW,EAAG;AAC7B,WAAO,CAAC,SAAU,SAAS,IAAI,aAAa,CAAC,GAAG,MAAM,GAAG,UAAU,CAAE;AAAA,EACvE,GAAG,CAAC,YAAY,IAAI,CAAC;AAErB,QAAM,SAAS,QAAQ,MAAM,WAAW,GAAG,GAAG,CAAC,GAAG,CAAC;AACnD,QAAM,YAAY;AAAA,IAChB,MAAM,IAAI,IAAI,IAAI,IAAI,CAAC,MAAM,EAAE,cAAc,EAAE,WAAW,EAAE,CAAC,EAAE,OAAO;AAAA,IACtE,CAAC,GAAG;AAAA,EACN;AACA,QAAM,UAAU,OAAO,IAAI,UAAU,KAAK,SAAS,KAAK;AAExD,MAAI,aAAa,IAAI,WAAW,EAAG,QAAO,oBAAC,sBAAmB;AAE9D,MAAI,IAAI,WAAW,GAAG;AACpB,WACE,qBAAC,SAAI,WAAU,sDACb;AAAA,0BAAC,SAAM,WAAU,sCAAqC;AAAA,MACtD,oBAAC,OAAE,WAAU,6CAA4C,4BAAc;AAAA,MACvE,oBAAC,OAAE,WAAU,6CAA4C,mFAEzD;AAAA,OACF;AAAA,EAEJ;AAEA,SACE,qBAAC,SAAI,WAAU,aACZ;AAAA,WAAO,IAAI,CAAC,UACX,qBAAC,aACC;AAAA,0BAAC,QAAG,WAAU,uCAAuC,gBAAM,OAAM;AAAA,MACjE,oBAAC,QAAG,WAAU,+BACX,gBAAM,OAAO,IAAI,CAAC,OAAO,MACxB;AAAA,QAAC;AAAA;AAAA,UAEC;AAAA,UACA;AAAA;AAAA,QAFK,GAAG,MAAM,UAAU,MAAM,SAAS,IAAI,MAAM,IAAI,IAAI,CAAC;AAAA,MAG5D,CACD,GACH;AAAA,SAVY,MAAM,KAWpB,CACD;AAAA,IACD,oBAAC,oBAAiB,SAAkB,WAAsB,YAAY,MAAM,QAAQ,CAAC,MAAM,IAAI,CAAC,GAAG;AAAA,KACrG;AAEJ;","names":[]}
+{"version":3,"sources":["../../src/components/collection-provenance-tab.tsx"],"sourcesContent":["\"use client\";\n\nimport { useState, useEffect, useMemo } from \"react\";\nimport type { ApiActivity } from \"@medialane/sdk\";\nimport { assetHref, profileHref } from \"@medialane/sdk\";\nimport { ExternalLink, Inbox } from \"lucide-react\";\nimport Image from \"./image.js\";\nimport Link from \"./link.js\";\nimport { AddressDisplay } from \"./address-display.js\";\nimport { CurrencyIcon } from \"./currency-icon.js\";\nimport { LoadMoreSentinel } from \"./load-more-sentinel.js\";\nimport { useActivities } from \"../utils/use-activities.js\";\nimport { useImageUrl } from \"../utils/use-image-url.js\";\nimport { ACTIVITY_TYPE_CONFIG } from \"../data/activity.js\";\nimport { EXPLORER_URL } from \"../utils/explorer-url.js\";\nimport { formatDisplayPrice } from \"../utils/format.js\";\nimport { timeAgo } from \"../utils/time.js\";\nimport { cn } from \"../utils/cn.js\";\n\nconst PAGE_SIZE = 30;\n\nconst EVENT_TITLE: Record<string, string> = {\n  mint: \"Minted\",\n  listing: \"Listed for sale\",\n  sale: \"Purchased\",\n  offer: \"Offer made\",\n  transfer: \"Transferred\",\n  cancelled: \"Listing cancelled\",\n};\n\nfunction dayLabel(iso: string): string {\n  const date = new Date(iso);\n  const today = new Date();\n  const yesterday = new Date();\n  yesterday.setDate(today.getDate() - 1);\n  if (date.toDateString() === today.toDateString()) return \"Today\";\n  if (date.toDateString() === yesterday.toDateString()) return \"Yesterday\";\n  return date.toLocaleDateString(undefined, { day: \"numeric\", month: \"long\", year: \"numeric\" });\n}\n\nfunction groupByDay(events: ApiActivity[]) {\n  const groups: { label: string; events: ApiActivity[] }[] = [];\n  for (const event of events) {\n    const label = dayLabel(event.timestamp);\n    const last = groups[groups.length - 1];\n    if (last && last.label === label) last.events.push(event);\n    else groups.push({ label, events: [event] });\n  }\n  return groups;\n}\n\nfunction ProvenanceEvent({ event, showAsset }: { event: ApiActivity; showAsset: boolean }) {\n  const resolveImage = useImageUrl();\n  const config = ACTIVITY_TYPE_CONFIG[event.type];\n  const Icon = config?.icon ?? ExternalLink;\n  const contract = event.nftContract ?? event.contractAddress ?? null;\n  const tokenId = event.nftTokenId ?? event.tokenId ?? null;\n  const actor =\n    event.offerer ?? event.fulfiller ?? (event.type === \"mint\" ? event.to : event.from) ?? null;\n  const amount = event.amount && Number(event.amount) > 1 ? event.amount : null;\n  const name = event.token?.name ?? (tokenId ? `#${tokenId}` : null);\n  const image = resolveImage(event.token?.image ?? null);\n  const leadWithAsset = showAsset && !!name;\n  const assetLink = contract && tokenId ? assetHref(event.chain ?? \"STARKNET\", contract, tokenId) : null;\n\n  const actorLink = actor ? (\n    <span className=\"text-sm font-normal text-muted-foreground\">\n      by{\" \"}\n      <Link\n        href={profileHref({ address: actor })}\n        className=\"font-medium text-foreground/80 hover:text-primary transition-colors\"\n      >\n        <AddressDisplay address={actor} chars={6} showCopy={false} className=\"text-sm\" />\n      </Link>\n    </span>\n  ) : null;\n\n  const tile = (\n    <span\n      className={cn(\n        \"flex h-11 w-11 shrink-0 items-center justify-center rounded-xl\",\n        config?.bgClass ?? \"bg-muted\"\n      )}\n      aria-hidden\n    >\n      <Icon className={cn(\"h-5 w-5\", config?.colorClass ?? \"text-muted-foreground\")} />\n    </span>\n  );\n\n  const thumb = (\n    <span className=\"relative block h-14 w-14 shrink-0\">\n      <span className=\"block h-full w-full overflow-hidden rounded-xl bg-gradient-to-br from-brand-blue/25 via-brand-purple/25 to-brand-rose/25\">\n        {image ? (\n          <Image src={image} alt=\"\" width={56} height={56} className=\"h-full w-full object-cover\" unoptimized />\n        ) : null}\n      </span>\n      <span\n        className={cn(\n          \"absolute -bottom-1 -right-1 flex h-6 w-6 items-center justify-center rounded-full bg-card ring-2 ring-card\"\n        )}\n        aria-hidden\n      >\n        <span className={cn(\"flex h-full w-full items-center justify-center rounded-full\", config?.bgClass ?? \"bg-muted\")}>\n          <Icon className={cn(\"h-3 w-3\", config?.colorClass ?? \"text-muted-foreground\")} />\n        </span>\n      </span>\n    </span>\n  );\n\n  return (\n    <li className=\"flex items-center gap-4 rounded-2xl border border-border/50 bg-card/60 p-4 backdrop-blur-sm transition-colors hover:bg-card/90\">\n      {leadWithAsset ? (assetLink ? <Link href={assetLink} className=\"block shrink-0\">{thumb}</Link> : thumb) : tile}\n\n      <div className=\"min-w-0 flex-1\">\n        {leadWithAsset ? (\n          <>\n            {assetLink ? (\n              <Link href={assetLink} className=\"block truncate text-base font-semibold leading-tight hover:text-primary transition-colors\">\n                {name}\n              </Link>\n            ) : (\n              <p className=\"truncate text-base font-semibold leading-tight\">{name}</p>\n            )}\n            <p className=\"mt-1 flex flex-wrap items-baseline gap-x-1.5 text-sm\">\n              <span className={cn(\"font-medium\", config?.colorClass)}>{EVENT_TITLE[event.type] ?? event.type}</span>\n              {amount ? <span className=\"text-muted-foreground\">×{amount}</span> : null}\n              {actorLink}\n            </p>\n          </>\n        ) : (\n          <p className=\"flex flex-wrap items-baseline gap-x-1.5 text-base font-semibold leading-tight\">\n            {EVENT_TITLE[event.type] ?? event.type}\n            {amount ? <span className=\"text-sm font-medium text-muted-foreground\">×{amount}</span> : null}\n            {actorLink}\n          </p>\n        )}\n      </div>\n\n      <div className=\"flex shrink-0 flex-col items-end gap-1\">\n        {event.price?.formatted ? (\n          <span className=\"flex items-center gap-1.5 text-base font-bold tabular-nums\">\n            {event.price.currency ? <CurrencyIcon symbol={event.price.currency} size={15} aria-hidden /> : null}\n            {formatDisplayPrice(event.price.formatted)}\n            {event.price.currency ? (\n              <span className=\"text-xs font-medium text-muted-foreground\">{event.price.currency}</span>\n            ) : null}\n          </span>\n        ) : null}\n        <span className=\"flex items-center gap-1 text-xs text-muted-foreground\">\n          <time dateTime={event.timestamp} title={new Date(event.timestamp).toLocaleString()}>\n            {timeAgo(event.timestamp)}\n          </time>\n          {event.txHash ? (\n            <a\n              href={`${EXPLORER_URL}/tx/${event.txHash}`}\n              target=\"_blank\"\n              rel=\"noopener noreferrer\"\n              className=\"rounded-md p-1 hover:bg-muted hover:text-foreground transition-colors\"\n              aria-label=\"View transaction\"\n            >\n              <ExternalLink className=\"h-3.5 w-3.5\" aria-hidden />\n            </a>\n          ) : null}\n        </span>\n      </div>\n    </li>\n  );\n}\n\nfunction ProvenanceSkeleton() {\n  return (\n    <div className=\"grid gap-2.5 lg:grid-cols-2\" aria-hidden>\n      {Array.from({ length: 5 }).map((_, i) => (\n        <div key={i} className=\"flex items-center gap-4 rounded-2xl border border-border/50 bg-card/60 p-4\">\n          <div className=\"h-11 w-11 shrink-0 rounded-xl bg-muted animate-pulse\" />\n          <div className=\"flex-1 space-y-2\">\n            <div className=\"h-4 w-44 rounded bg-muted animate-pulse\" />\n            <div className=\"h-3 w-24 rounded bg-muted animate-pulse\" />\n          </div>\n          <div className=\"h-4 w-16 rounded bg-muted animate-pulse\" />\n        </div>\n      ))}\n    </div>\n  );\n}\n\nexport interface CollectionProvenanceTabProps {\n  contract: string;\n}\n\nexport function CollectionProvenanceTab({ contract }: CollectionProvenanceTabProps) {\n  const [page, setPage] = useState(1);\n  const [all, setAll] = useState<ApiActivity[]>([]);\n  const { activities, meta, isLoading } = useActivities({ contract, page, limit: PAGE_SIZE });\n\n  useEffect(() => {\n    if (activities.length === 0) return;\n    setAll((prev) => (page === 1 ? activities : [...prev, ...activities]));\n  }, [activities, page]);\n\n  const groups = useMemo(() => groupByDay(all), [all]);\n  const showAsset = useMemo(\n    () => new Set(all.map((e) => e.nftTokenId ?? e.tokenId ?? \"\")).size > 1,\n    [all]\n  );\n  const hasMore = meta ? all.length < (meta.total ?? 0) : false;\n\n  if (isLoading && all.length === 0) return <ProvenanceSkeleton />;\n\n  if (all.length === 0) {\n    return (\n      <div className=\"py-20 flex flex-col items-center gap-3 text-center\">\n        <Inbox className=\"h-10 w-10 text-muted-foreground/40\" />\n        <p className=\"text-sm font-medium text-muted-foreground\">No history yet</p>\n        <p className=\"text-xs text-muted-foreground/70 max-w-xs\">\n          Mints, transfers, listings and sales will appear here as they happen.\n        </p>\n      </div>\n    );\n  }\n\n  return (\n    <div className=\"space-y-8\">\n      {groups.map((group) => (\n        <section key={group.label}>\n          <h3 className=\"mb-3 font-display text-lg font-bold\">{group.label}</h3>\n          <ol className=\"grid gap-2.5 lg:grid-cols-2\">\n            {group.events.map((event, i) => (\n              <ProvenanceEvent\n                key={`${event.txHash ?? event.orderHash}-${event.type}-${i}`}\n                event={event}\n                showAsset={showAsset}\n              />\n            ))}\n          </ol>\n        </section>\n      ))}\n      <LoadMoreSentinel hasMore={hasMore} isLoading={isLoading} onLoadMore={() => setPage((p) => p + 1)} />\n    </div>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/components/creator-page.cjs

@@ -39,7 +39,8 @@ var import_lucide_react = require("lucide-react");
 var import_link = __toESM(require("./link.js"), 1);
 var import_button = require("./button.js");
 var import_skeleton = require("./skeleton.js");
-var import_address_display = require("./address-display.js");
+var import_tabs = require("./tabs.js");
+var import_underline_tabs = require("./underline-tabs.js");
 var import_creator_header = require("./creator-header.js");
 var import_hidden_content_banner = require("./hidden-content-banner.js");
 var import_tab_empty_state = require("./tab-empty-state.js");
@@ -64,15 +65,9 @@ var import_use_collections = require("../utils/use-collections.js");
 var import_use_orders = require("../utils/use-orders.js");
 var import_use_activities = require("../utils/use-activities.js");
 var import_use_profiles = require("../utils/use-profiles.js");
-const TABS = [
-  { id: "assets", label: "Assets", Icon: import_lucide_react.Image },
-  { id: "collections", label: "Collections", Icon: import_lucide_react.LayoutGrid },
-  { id: "listings", label: "Listings", Icon: import_lucide_react.ShoppingBag },
-  { id: "activity", label: "Activity", Icon: import_lucide_react.Activity }
-];
 const GRID = "grid grid-cols-2 sm:grid-cols-3 lg:grid-cols-4 xl:grid-cols-5 gap-4";
 const isNft = (itemType) => itemType === "ERC721" || itemType === "ERC1155";
-function CreatorPage({ address: addressProp, username, useAssetActions, useMarketActions }) {
+function CreatorPage({ username, useAssetActions, useMarketActions }) {
   const { walletAddress } = (0, import_medialane_app.useMedialaneApp)();
   const client = (0, import_use_medialane_client.useMedialaneClient)();
   const resolveImage = (0, import_use_image_url.useImageUrl)();
@@ -80,10 +75,8 @@ function CreatorPage({ address: addressProp, username, useAssetActions, useMarke
   const [activeTab, setActiveTab] = (0, import_react.useState)("assets");
   const [reportOpen, setReportOpen] = (0, import_react.useState)(false);
   const [reportToken, setReportToken] = (0, import_react.useState)(null);
-  const byName = (0, import_use_profiles.useCreatorByUsername)(username);
-  const byAddress = (0, import_use_profiles.useCreatorProfile)(username ? void 0 : addressProp);
-  const creator = username ? byName.creator : byAddress.profile;
-  const address = username ? creator?.walletAddress ?? null : addressProp ?? null;
+  const { creator, isLoading: creatorLoading } = (0, import_use_profiles.useCreatorByUsername)(username);
+  const address = creator?.walletAddress ?? null;
   const isOwner = !!address && !!walletAddress && (0, import_same_address.isSameAddress)(address, walletAddress);
   const { tokens, meta, isLoading: tokensLoading, mutate: refreshTokens } = (0, import_use_tokens.useTokensByOwner)(address, 1, 20);
   const { collections, isLoading: collectionsLoading } = (0, import_use_collections.useCollectionsByOwner)(address);
@@ -94,13 +87,13 @@ function CreatorPage({ address: addressProp, username, useAssetActions, useMarke
   const market = useMarketActions();
   const listings = orders.filter((o) => o.status === "ACTIVE" && isNft(o.offer.itemType));
   const identity = (0, import_profile_identity.profileIdentity)({ username: creator?.username, name: creator?.name, walletAddress: address });
-  if (username && byName.isLoading) {
+  if (creatorLoading) {
     return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "min-h-screen pb-20", children: [
       /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "px-6 pt-20 pb-6", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_creator_header.CreatorHeader, { creator: null, image: null, stats: [], loading: true }) }),
       /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: (0, import_cn.cn)("px-6", GRID), children: Array.from({ length: 8 }).map((_, i) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_token_card.TokenCardSkeleton, {}, i)) })
     ] });
   }
-  if (username && !creator) {
+  if (!creator) {
     return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "mx-auto max-w-lg space-y-4 px-4 py-24 text-center", children: [
       /* @__PURE__ */ (0, import_jsx_runtime.jsx)("h1", { className: "text-2xl font-bold", children: "Creator not found" }),
       /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("p", { className: "text-muted-foreground", children: [
@@ -113,14 +106,15 @@ function CreatorPage({ address: addressProp, username, useAssetActions, useMarke
       /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_button.Button, { variant: "outline", asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_link.default, { href: "/creators", children: "Browse creators" }) })
     ] });
   }
-  const counts = {
-    assets: meta?.total ?? void 0,
-    collections: collectionsLoading ? void 0 : collections.length,
-    ...activeTab === "listings" && !ordersLoading ? { listings: listings.length } : {}
-  };
+  const tabs = [
+    { id: "assets", label: "Assets", icon: import_lucide_react.Image, count: meta?.total ?? void 0 },
+    { id: "collections", label: "Collections", icon: import_lucide_react.LayoutGrid, count: collectionsLoading ? void 0 : collections.length },
+    { id: "listings", label: "Listings", icon: import_lucide_react.ShoppingBag, count: activeTab === "listings" && !ordersLoading ? listings.length : void 0 },
+    { id: "activity", label: "Activity", icon: import_lucide_react.Activity }
+  ];
   return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "min-h-screen overflow-x-hidden pb-20", children: [
     hidden === true ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_hidden_content_banner.HiddenContentBanner, {}) : null,
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "px-6 pt-20 pb-6", children: creator ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "px-6 pt-20 pb-6", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
       import_creator_header.CreatorHeader,
       {
         creator,
@@ -130,54 +124,39 @@ function CreatorPage({ address: addressProp, username, useAssetActions, useMarke
           { label: "Collections", value: collectionsLoading ? null : collections.length }
         ]
       }
-    ) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "flex flex-wrap items-center gap-2", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_address_display.AddressDisplay, { address: address ?? "", chars: 10, className: "text-base font-semibold tabular-nums" }) }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "sticky top-0 z-20 mt-4 flex items-center gap-2 border-b border-border bg-background/95 px-6 backdrop-blur-sm", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "-mb-px flex min-w-0 flex-1 items-center gap-0.5 overflow-x-auto scrollbar-none", children: TABS.map(({ id, label, Icon }) => {
-        const count = counts[id];
-        const active = activeTab === id;
-        return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
-          "button",
-          {
-            onClick: () => setActiveTab(id),
-            className: (0, import_cn.cn)(
-              "relative flex shrink-0 items-center gap-2 whitespace-nowrap px-4 py-3 text-sm font-medium transition-colors duration-200",
-              active ? "text-foreground" : "text-muted-foreground hover:text-foreground"
-            ),
-            children: [
-              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Icon, { className: "h-3.5 w-3.5" }),
-              label,
-              count ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: (0, import_cn.cn)("min-w-[18px] rounded-full px-1.5 py-px text-center text-2xs font-bold tabular-nums", active ? "bg-primary/15 text-primary" : "bg-muted text-muted-foreground"), children: count }) : null,
-              active ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "absolute inset-x-0 bottom-0 h-0.5 rounded-full bg-primary" }) : null
-            ]
-          },
-          id
-        );
-      }) }),
-      address ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_more_menu.MoreMenu, { explorerHref: `${import_explorer_url.EXPLORER_URL}/contract/${address}`, shareTitle: identity.name ?? identity.identity, onReport: () => setReportOpen(true) }) : null
-    ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "mt-6 px-6", children: [
-      activeTab === "assets" && (tokensLoading ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: GRID, children: Array.from({ length: 8 }).map((_, i) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_token_card.TokenCardSkeleton, {}, i)) }) : tokens.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tab_empty_state.TabEmptyState, { icon: import_lucide_react.Image, heading: "No assets yet", body: "Works this creator makes on Medialane appear here." }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: GRID, children: tokens.map((t) => {
-        const listing = t.activeOrders?.find((o) => isNft(o.offer.itemType));
-        return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-          import_token_card.TokenCard,
-          {
-            token: t,
-            isOwner,
-            usdValue: (0, import_order_usd.orderUsd)(listing?.price, prices),
-            onList: isOwner ? actions.list : void 0,
-            onTransfer: isOwner ? actions.transfer : void 0,
-            onCancel: isOwner ? actions.cancel : void 0,
-            onBuy: !isOwner && listing ? () => market.buy(listing) : void 0,
-            onOffer: isOwner ? void 0 : market.offer,
-            onReport: setReportToken
-          },
-          `${t.contractAddress}-${t.tokenId}`
-        );
-      }) })),
-      activeTab === "collections" && (collectionsLoading ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "grid grid-cols-2 gap-4 lg:grid-cols-3", children: Array.from({ length: 6 }).map((_, i) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_collection_card.CollectionCardSkeleton, {}, i)) }) : collections.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tab_empty_state.TabEmptyState, { icon: import_lucide_react.LayoutGrid, heading: "No collections yet", body: "Collections this creator makes appear here." }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "grid grid-cols-2 gap-4 lg:grid-cols-3", children: collections.map((c) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_collection_card.CollectionCard, { collection: c }, c.contractAddress)) })),
-      activeTab === "listings" && (ordersLoading ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: GRID, children: Array.from({ length: 4 }).map((_, i) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_listing_card.ListingCardSkeleton, {}, i)) }) : listings.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tab_empty_state.TabEmptyState, { icon: import_lucide_react.ShoppingBag, heading: "No active listings", body: "Works this creator lists for sale appear here." }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: GRID, children: listings.map((o) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_listing_card.ListingCard, { order: o, onBuy: isOwner ? void 0 : market.buy, usdValue: (0, import_order_usd.orderUsd)(o.price, prices), overflowMenu: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_listing_card_menu.ListingCardMenu, { order: o }) }, o.orderHash)) })),
-      activeTab === "activity" && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "max-w-2xl", children: activitiesLoading ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "space-y-5", children: Array.from({ length: 6 }).map((_, i) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_skeleton.Skeleton, { className: "h-10 w-full rounded-xl" }, i)) }) : activities.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tab_empty_state.TabEmptyState, { icon: import_lucide_react.Activity, heading: "No activity yet", body: "This creator's activity appears here as it happens." }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { children: activities.map((a, i) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_activity_timeline_row.ActivityTimelineRow, { event: a, isLast: i === activities.length - 1 }, i)) }) })
-    ] }),
+    ) }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+      import_underline_tabs.UnderlineTabs,
+      {
+        tabs,
+        value: activeTab,
+        onValueChange: (id) => setActiveTab(id),
+        trailing: address ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_more_menu.MoreMenu, { explorerHref: `${import_explorer_url.EXPLORER_URL}/contract/${address}`, shareTitle: identity.name ?? identity.identity, onReport: () => setReportOpen(true) }) : null,
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tabs.TabsContent, { value: "assets", className: "mt-6 px-6", children: tokensLoading ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: GRID, children: Array.from({ length: 8 }).map((_, i) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_token_card.TokenCardSkeleton, {}, i)) }) : tokens.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tab_empty_state.TabEmptyState, { icon: import_lucide_react.Image, heading: "No assets yet", body: "Works this creator makes on Medialane appear here." }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: GRID, children: tokens.map((t) => {
+            const listing = t.activeOrders?.find((o) => isNft(o.offer.itemType));
+            return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+              import_token_card.TokenCard,
+              {
+                token: t,
+                isOwner,
+                usdValue: (0, import_order_usd.orderUsd)(listing?.price, prices),
+                onList: isOwner ? actions.list : void 0,
+                onTransfer: isOwner ? actions.transfer : void 0,
+                onCancel: isOwner ? actions.cancel : void 0,
+                onBuy: !isOwner && listing ? () => market.buy(listing) : void 0,
+                onOffer: isOwner ? void 0 : market.offer,
+                onReport: setReportToken
+              },
+              `${t.contractAddress}-${t.tokenId}`
+            );
+          }) }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tabs.TabsContent, { value: "collections", className: "mt-6 px-6", children: collectionsLoading ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "grid grid-cols-2 gap-4 lg:grid-cols-3", children: Array.from({ length: 6 }).map((_, i) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_collection_card.CollectionCardSkeleton, {}, i)) }) : collections.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tab_empty_state.TabEmptyState, { icon: import_lucide_react.LayoutGrid, heading: "No collections yet", body: "Collections this creator makes appear here." }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "grid grid-cols-2 gap-4 lg:grid-cols-3", children: collections.map((c) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_collection_card.CollectionCard, { collection: c }, c.contractAddress)) }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tabs.TabsContent, { value: "listings", className: "mt-6 px-6", children: ordersLoading ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: GRID, children: Array.from({ length: 4 }).map((_, i) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_listing_card.ListingCardSkeleton, {}, i)) }) : listings.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tab_empty_state.TabEmptyState, { icon: import_lucide_react.ShoppingBag, heading: "No active listings", body: "Works this creator lists for sale appear here." }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: GRID, children: listings.map((o) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_listing_card.ListingCard, { order: o, onBuy: isOwner ? void 0 : market.buy, usdValue: (0, import_order_usd.orderUsd)(o.price, prices), overflowMenu: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_listing_card_menu.ListingCardMenu, { order: o }) }, o.orderHash)) }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tabs.TabsContent, { value: "activity", className: "mt-6 max-w-2xl px-6", children: activitiesLoading ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "space-y-5", children: Array.from({ length: 6 }).map((_, i) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_skeleton.Skeleton, { className: "h-10 w-full rounded-xl" }, i)) }) : activities.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tab_empty_state.TabEmptyState, { icon: import_lucide_react.Activity, heading: "No activity yet", body: "This creator's activity appears here as it happens." }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { children: activities.map((a, i) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_activity_timeline_row.ActivityTimelineRow, { event: a, isLast: i === activities.length - 1 }, i)) }) })
+        ]
+      }
+    ),
     actions.dialogs,
     market.dialogs,
     reportToken ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(

package/dist/components/creator-page.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/creator-page.tsx"],"sourcesContent":["\"use client\";\n\nimport { useState } from \"react\";\nimport useSWR from \"swr\";\nimport { Activity, Image as ImageIcon, LayoutGrid, ShoppingBag } from \"lucide-react\";\nimport type { ApiToken } from \"@medialane/sdk\";\nimport Link from \"./link.js\";\nimport { Button } from \"./button.js\";\nimport { Skeleton } from \"./skeleton.js\";\nimport { AddressDisplay } from \"./address-display.js\";\nimport { CreatorHeader } from \"./creator-header.js\";\nimport { HiddenContentBanner } from \"./hidden-content-banner.js\";\nimport { TabEmptyState } from \"./tab-empty-state.js\";\nimport { TokenCard, TokenCardSkeleton } from \"./token-card.js\";\nimport { CollectionCard, CollectionCardSkeleton } from \"./collection-card.js\";\nimport { ListingCard, ListingCardSkeleton } from \"./listing-card.js\";\nimport { ListingCardMenu } from \"./listing-card-menu.js\";\nimport { ActivityTimelineRow } from \"./activity-timeline-row.js\";\nimport { MoreMenu } from \"./more-menu.js\";\nimport { useMedialaneApp } from \"./medialane-app.js\";\nimport { ReportDialog } from \"./report-dialog.js\";\nimport type { UsePortfolioAssetActions } from \"./portfolio-assets.js\";\nimport type { CollectionMarketActions } from \"./collection-page.js\";\nimport { cn } from \"../utils/cn.js\";\nimport { EXPLORER_URL } from \"../utils/explorer-url.js\";\nimport { isSameAddress } from \"../utils/same-address.js\";\nimport { orderUsd } from \"../utils/order-usd.js\";\nimport { profileIdentity } from \"../utils/profile-identity.js\";\nimport { useImageUrl } from \"../utils/use-image-url.js\";\nimport { useMedialaneClient } from \"../utils/use-medialane-client.js\";\nimport { useUsdPrices } from \"../utils/use-usd-prices.js\";\nimport { useTokensByOwner } from \"../utils/use-tokens.js\";\nimport { useCollectionsByOwner } from \"../utils/use-collections.js\";\nimport { useUserOrders } from \"../utils/use-orders.js\";\nimport { useActivitiesByAddress } from \"../utils/use-activities.js\";\nimport { useCreatorByUsername, useCreatorProfile } from \"../utils/use-profiles.js\";\n\nconst TABS = [\n  { id: \"assets\", label: \"Assets\", Icon: ImageIcon },\n  { id: \"collections\", label: \"Collections\", Icon: LayoutGrid },\n  { id: \"listings\", label: \"Listings\", Icon: ShoppingBag },\n  { id: \"activity\", label: \"Activity\", Icon: Activity },\n] as const;\n\ntype TabId = (typeof TABS)[number][\"id\"];\n\nconst GRID = \"grid grid-cols-2 sm:grid-cols-3 lg:grid-cols-4 xl:grid-cols-5 gap-4\";\nconst isNft = (itemType: string) => itemType === \"ERC721\" || itemType === \"ERC1155\";\n\nexport interface CreatorPageProps {\n  address?: string;\n  username?: string;\n  useAssetActions: UsePortfolioAssetActions;\n  useMarketActions: () => CollectionMarketActions;\n}\n\nexport function CreatorPage({ address: addressProp, username, useAssetActions, useMarketActions }: CreatorPageProps) {\n  const { walletAddress } = useMedialaneApp();\n  const client = useMedialaneClient();\n  const resolveImage = useImageUrl();\n  const prices = useUsdPrices();\n  const [activeTab, setActiveTab] = useState<TabId>(\"assets\");\n  const [reportOpen, setReportOpen] = useState(false);\n  const [reportToken, setReportToken] = useState<ApiToken | null>(null);\n\n  const byName = useCreatorByUsername(username);\n  const byAddress = useCreatorProfile(username ? undefined : addressProp);\n  const creator = username ? byName.creator : byAddress.profile;\n  const address = username ? creator?.walletAddress ?? null : addressProp ?? null;\n  const isOwner = !!address && !!walletAddress && isSameAddress(address, walletAddress);\n\n  const { tokens, meta, isLoading: tokensLoading, mutate: refreshTokens } = useTokensByOwner(address, 1, 20);\n  const { collections, isLoading: collectionsLoading } = useCollectionsByOwner(address);\n  const { orders, isLoading: ordersLoading } = useUserOrders(activeTab === \"listings\" ? address : null);\n  const { activities, isLoading: activitiesLoading } = useActivitiesByAddress(activeTab === \"activity\" ? address : null);\n  const { data: hidden } = useSWR(address ? `creator-hidden-${address}` : null, () => client.api.creators.isHidden(address!).catch(() => false));\n  const actions = useAssetActions({ refresh: () => void refreshTokens() });\n  const market = useMarketActions();\n\n  const listings = orders.filter((o) => o.status === \"ACTIVE\" && isNft(o.offer.itemType));\n  const identity = profileIdentity({ username: creator?.username, name: creator?.name, walletAddress: address });\n\n  if (username && byName.isLoading) {\n    return (\n      <div className=\"min-h-screen pb-20\">\n        <div className=\"px-6 pt-20 pb-6\"><CreatorHeader creator={null} image={null} stats={[]} loading /></div>\n        <div className={cn(\"px-6\", GRID)}>{Array.from({ length: 8 }).map((_, i) => <TokenCardSkeleton key={i} />)}</div>\n      </div>\n    );\n  }\n\n  if (username && !creator) {\n    return (\n      <div className=\"mx-auto max-w-lg space-y-4 px-4 py-24 text-center\">\n        <h1 className=\"text-2xl font-bold\">Creator not found</h1>\n        <p className=\"text-muted-foreground\"><span className=\"tabular-nums\">@{username}</span> isn&apos;t a profile yet.</p>\n        <Button variant=\"outline\" asChild><Link href=\"/creators\">Browse creators</Link></Button>\n      </div>\n    );\n  }\n\n  const counts: Partial<Record<TabId, number>> = {\n    assets: meta?.total ?? undefined,\n    collections: collectionsLoading ? undefined : collections.length,\n    ...(activeTab === \"listings\" && !ordersLoading ? { listings: listings.length } : {}),\n  };\n\n  return (\n    <div className=\"min-h-screen overflow-x-hidden pb-20\">\n      {hidden === true ? <HiddenContentBanner /> : null}\n\n      <div className=\"px-6 pt-20 pb-6\">\n        {creator ? (\n          <CreatorHeader\n            creator={creator}\n            image={resolveImage(creator.avatarImage || tokens[0]?.metadata?.image)}\n            stats={[\n              { label: \"Assets\", value: meta?.total ?? null },\n              { label: \"Collections\", value: collectionsLoading ? null : collections.length },\n            ]}\n          />\n        ) : (\n          <div className=\"flex flex-wrap items-center gap-2\">\n            <AddressDisplay address={address ?? \"\"} chars={10} className=\"text-base font-semibold tabular-nums\" />\n          </div>\n        )}\n      </div>\n\n      <div className=\"sticky top-0 z-20 mt-4 flex items-center gap-2 border-b border-border bg-background/95 px-6 backdrop-blur-sm\">\n        <div className=\"-mb-px flex min-w-0 flex-1 items-center gap-0.5 overflow-x-auto scrollbar-none\">\n          {TABS.map(({ id, label, Icon }) => {\n            const count = counts[id];\n            const active = activeTab === id;\n            return (\n              <button\n                key={id}\n                onClick={() => setActiveTab(id)}\n                className={cn(\n                  \"relative flex shrink-0 items-center gap-2 whitespace-nowrap px-4 py-3 text-sm font-medium transition-colors duration-200\",\n                  active ? \"text-foreground\" : \"text-muted-foreground hover:text-foreground\"\n                )}\n              >\n                <Icon className=\"h-3.5 w-3.5\" />\n                {label}\n                {count ? (\n                  <span className={cn(\"min-w-[18px] rounded-full px-1.5 py-px text-center text-2xs font-bold tabular-nums\", active ? \"bg-primary/15 text-primary\" : \"bg-muted text-muted-foreground\")}>{count}</span>\n                ) : null}\n                {active ? <span className=\"absolute inset-x-0 bottom-0 h-0.5 rounded-full bg-primary\" /> : null}\n              </button>\n            );\n          })}\n        </div>\n        {address ? (\n          <MoreMenu explorerHref={`${EXPLORER_URL}/contract/${address}`} shareTitle={identity.name ?? identity.identity} onReport={() => setReportOpen(true)} />\n        ) : null}\n      </div>\n\n      <div className=\"mt-6 px-6\">\n        {activeTab === \"assets\" && (\n          tokensLoading ? (\n            <div className={GRID}>{Array.from({ length: 8 }).map((_, i) => <TokenCardSkeleton key={i} />)}</div>\n          ) : tokens.length === 0 ? (\n            <TabEmptyState icon={ImageIcon} heading=\"No assets yet\" body=\"Works this creator makes on Medialane appear here.\" />\n          ) : (\n            <div className={GRID}>\n              {tokens.map((t: ApiToken) => {\n                const listing = t.activeOrders?.find((o) => isNft(o.offer.itemType));\n                return (\n                  <TokenCard\n                    key={`${t.contractAddress}-${t.tokenId}`}\n                    token={t}\n                    isOwner={isOwner}\n                    usdValue={orderUsd(listing?.price, prices)}\n                    onList={isOwner ? actions.list : undefined}\n                    onTransfer={isOwner ? actions.transfer : undefined}\n                    onCancel={isOwner ? actions.cancel : undefined}\n                    onBuy={!isOwner && listing ? () => market.buy(listing) : undefined}\n                    onOffer={isOwner ? undefined : market.offer}\n                    onReport={setReportToken}\n                  />\n                );\n              })}\n            </div>\n          )\n        )}\n\n        {activeTab === \"collections\" && (\n          collectionsLoading ? (\n            <div className=\"grid grid-cols-2 gap-4 lg:grid-cols-3\">{Array.from({ length: 6 }).map((_, i) => <CollectionCardSkeleton key={i} />)}</div>\n          ) : collections.length === 0 ? (\n            <TabEmptyState icon={LayoutGrid} heading=\"No collections yet\" body=\"Collections this creator makes appear here.\" />\n          ) : (\n            <div className=\"grid grid-cols-2 gap-4 lg:grid-cols-3\">{collections.map((c) => <CollectionCard key={c.contractAddress} collection={c} />)}</div>\n          )\n        )}\n\n        {activeTab === \"listings\" && (\n          ordersLoading ? (\n            <div className={GRID}>{Array.from({ length: 4 }).map((_, i) => <ListingCardSkeleton key={i} />)}</div>\n          ) : listings.length === 0 ? (\n            <TabEmptyState icon={ShoppingBag} heading=\"No active listings\" body=\"Works this creator lists for sale appear here.\" />\n          ) : (\n            <div className={GRID}>\n              {listings.map((o) => <ListingCard key={o.orderHash} order={o} onBuy={isOwner ? undefined : market.buy} usdValue={orderUsd(o.price, prices)} overflowMenu={<ListingCardMenu order={o} />} />)}\n            </div>\n          )\n        )}\n\n        {activeTab === \"activity\" && (\n          <div className=\"max-w-2xl\">\n            {activitiesLoading ? (\n              <div className=\"space-y-5\">{Array.from({ length: 6 }).map((_, i) => <Skeleton key={i} className=\"h-10 w-full rounded-xl\" />)}</div>\n            ) : activities.length === 0 ? (\n              <TabEmptyState icon={Activity} heading=\"No activity yet\" body=\"This creator's activity appears here as it happens.\" />\n            ) : (\n              <div>{activities.map((a, i) => <ActivityTimelineRow key={i} event={a} isLast={i === activities.length - 1} />)}</div>\n            )}\n          </div>\n        )}\n      </div>\n\n      {actions.dialogs}\n      {market.dialogs}\n      {reportToken ? (\n        <ReportDialog\n          open={!!reportToken}\n          onOpenChange={(open) => { if (!open) setReportToken(null); }}\n          target={{ type: \"TOKEN\", contract: reportToken.contractAddress, tokenId: reportToken.tokenId, name: reportToken.metadata?.name ?? undefined }}\n        />\n      ) : null}\n      {address ? (\n        <ReportDialog open={reportOpen} onOpenChange={setReportOpen} target={{ type: \"CREATOR\", address, name: identity.name ?? identity.identity }} />\n      ) : null}\n    </div>\n  );\n}\n"],"mappings":"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","names":["ImageIcon","useSWR","Link"]}
+{"version":3,"sources":["../../src/components/creator-page.tsx"],"sourcesContent":["\"use client\";\n\nimport { useState } from \"react\";\nimport useSWR from \"swr\";\nimport { Activity, Image as ImageIcon, LayoutGrid, ShoppingBag } from \"lucide-react\";\nimport type { ApiToken } from \"@medialane/sdk\";\nimport Link from \"./link.js\";\nimport { Button } from \"./button.js\";\nimport { Skeleton } from \"./skeleton.js\";\nimport { TabsContent } from \"./tabs.js\";\nimport { UnderlineTabs, type UnderlineTab } from \"./underline-tabs.js\";\nimport { CreatorHeader } from \"./creator-header.js\";\nimport { HiddenContentBanner } from \"./hidden-content-banner.js\";\nimport { TabEmptyState } from \"./tab-empty-state.js\";\nimport { TokenCard, TokenCardSkeleton } from \"./token-card.js\";\nimport { CollectionCard, CollectionCardSkeleton } from \"./collection-card.js\";\nimport { ListingCard, ListingCardSkeleton } from \"./listing-card.js\";\nimport { ListingCardMenu } from \"./listing-card-menu.js\";\nimport { ActivityTimelineRow } from \"./activity-timeline-row.js\";\nimport { MoreMenu } from \"./more-menu.js\";\nimport { useMedialaneApp } from \"./medialane-app.js\";\nimport { ReportDialog } from \"./report-dialog.js\";\nimport type { UsePortfolioAssetActions } from \"./portfolio-assets.js\";\nimport type { CollectionMarketActions } from \"./collection-page.js\";\nimport { cn } from \"../utils/cn.js\";\nimport { EXPLORER_URL } from \"../utils/explorer-url.js\";\nimport { isSameAddress } from \"../utils/same-address.js\";\nimport { orderUsd } from \"../utils/order-usd.js\";\nimport { profileIdentity } from \"../utils/profile-identity.js\";\nimport { useImageUrl } from \"../utils/use-image-url.js\";\nimport { useMedialaneClient } from \"../utils/use-medialane-client.js\";\nimport { useUsdPrices } from \"../utils/use-usd-prices.js\";\nimport { useTokensByOwner } from \"../utils/use-tokens.js\";\nimport { useCollectionsByOwner } from \"../utils/use-collections.js\";\nimport { useUserOrders } from \"../utils/use-orders.js\";\nimport { useActivitiesByAddress } from \"../utils/use-activities.js\";\nimport { useCreatorByUsername } from \"../utils/use-profiles.js\";\n\ntype TabId = \"assets\" | \"collections\" | \"listings\" | \"activity\";\n\nconst GRID = \"grid grid-cols-2 sm:grid-cols-3 lg:grid-cols-4 xl:grid-cols-5 gap-4\";\nconst isNft = (itemType: string) => itemType === \"ERC721\" || itemType === \"ERC1155\";\n\nexport interface CreatorPageProps {\n  username: string;\n  useAssetActions: UsePortfolioAssetActions;\n  useMarketActions: () => CollectionMarketActions;\n}\n\nexport function CreatorPage({ username, useAssetActions, useMarketActions }: CreatorPageProps) {\n  const { walletAddress } = useMedialaneApp();\n  const client = useMedialaneClient();\n  const resolveImage = useImageUrl();\n  const prices = useUsdPrices();\n  const [activeTab, setActiveTab] = useState<TabId>(\"assets\");\n  const [reportOpen, setReportOpen] = useState(false);\n  const [reportToken, setReportToken] = useState<ApiToken | null>(null);\n\n  const { creator, isLoading: creatorLoading } = useCreatorByUsername(username);\n  const address = creator?.walletAddress ?? null;\n  const isOwner = !!address && !!walletAddress && isSameAddress(address, walletAddress);\n\n  const { tokens, meta, isLoading: tokensLoading, mutate: refreshTokens } = useTokensByOwner(address, 1, 20);\n  const { collections, isLoading: collectionsLoading } = useCollectionsByOwner(address);\n  const { orders, isLoading: ordersLoading } = useUserOrders(activeTab === \"listings\" ? address : null);\n  const { activities, isLoading: activitiesLoading } = useActivitiesByAddress(activeTab === \"activity\" ? address : null);\n  const { data: hidden } = useSWR(address ? `creator-hidden-${address}` : null, () => client.api.creators.isHidden(address!).catch(() => false));\n  const actions = useAssetActions({ refresh: () => void refreshTokens() });\n  const market = useMarketActions();\n\n  const listings = orders.filter((o) => o.status === \"ACTIVE\" && isNft(o.offer.itemType));\n  const identity = profileIdentity({ username: creator?.username, name: creator?.name, walletAddress: address });\n\n  if (creatorLoading) {\n    return (\n      <div className=\"min-h-screen pb-20\">\n        <div className=\"px-6 pt-20 pb-6\"><CreatorHeader creator={null} image={null} stats={[]} loading /></div>\n        <div className={cn(\"px-6\", GRID)}>{Array.from({ length: 8 }).map((_, i) => <TokenCardSkeleton key={i} />)}</div>\n      </div>\n    );\n  }\n\n  if (!creator) {\n    return (\n      <div className=\"mx-auto max-w-lg space-y-4 px-4 py-24 text-center\">\n        <h1 className=\"text-2xl font-bold\">Creator not found</h1>\n        <p className=\"text-muted-foreground\"><span className=\"tabular-nums\">@{username}</span> isn&apos;t a profile yet.</p>\n        <Button variant=\"outline\" asChild><Link href=\"/creators\">Browse creators</Link></Button>\n      </div>\n    );\n  }\n\n  const tabs: UnderlineTab[] = [\n    { id: \"assets\", label: \"Assets\", icon: ImageIcon, count: meta?.total ?? undefined },\n    { id: \"collections\", label: \"Collections\", icon: LayoutGrid, count: collectionsLoading ? undefined : collections.length },\n    { id: \"listings\", label: \"Listings\", icon: ShoppingBag, count: activeTab === \"listings\" && !ordersLoading ? listings.length : undefined },\n    { id: \"activity\", label: \"Activity\", icon: Activity },\n  ];\n\n  return (\n    <div className=\"min-h-screen overflow-x-hidden pb-20\">\n      {hidden === true ? <HiddenContentBanner /> : null}\n\n      <div className=\"px-6 pt-20 pb-6\">\n        <CreatorHeader\n          creator={creator}\n          image={resolveImage(creator.avatarImage || tokens[0]?.metadata?.image)}\n          stats={[\n            { label: \"Assets\", value: meta?.total ?? null },\n            { label: \"Collections\", value: collectionsLoading ? null : collections.length },\n          ]}\n        />\n      </div>\n\n      <UnderlineTabs\n        tabs={tabs}\n        value={activeTab}\n        onValueChange={(id) => setActiveTab(id as TabId)}\n        trailing={address ? <MoreMenu explorerHref={`${EXPLORER_URL}/contract/${address}`} shareTitle={identity.name ?? identity.identity} onReport={() => setReportOpen(true)} /> : null}\n      >\n        <TabsContent value=\"assets\" className=\"mt-6 px-6\">\n          {tokensLoading ? (\n            <div className={GRID}>{Array.from({ length: 8 }).map((_, i) => <TokenCardSkeleton key={i} />)}</div>\n          ) : tokens.length === 0 ? (\n            <TabEmptyState icon={ImageIcon} heading=\"No assets yet\" body=\"Works this creator makes on Medialane appear here.\" />\n          ) : (\n            <div className={GRID}>\n              {tokens.map((t: ApiToken) => {\n                const listing = t.activeOrders?.find((o) => isNft(o.offer.itemType));\n                return (\n                  <TokenCard\n                    key={`${t.contractAddress}-${t.tokenId}`}\n                    token={t}\n                    isOwner={isOwner}\n                    usdValue={orderUsd(listing?.price, prices)}\n                    onList={isOwner ? actions.list : undefined}\n                    onTransfer={isOwner ? actions.transfer : undefined}\n                    onCancel={isOwner ? actions.cancel : undefined}\n                    onBuy={!isOwner && listing ? () => market.buy(listing) : undefined}\n                    onOffer={isOwner ? undefined : market.offer}\n                    onReport={setReportToken}\n                  />\n                );\n              })}\n            </div>\n          )}\n        </TabsContent>\n\n        <TabsContent value=\"collections\" className=\"mt-6 px-6\">\n          {collectionsLoading ? (\n            <div className=\"grid grid-cols-2 gap-4 lg:grid-cols-3\">{Array.from({ length: 6 }).map((_, i) => <CollectionCardSkeleton key={i} />)}</div>\n          ) : collections.length === 0 ? (\n            <TabEmptyState icon={LayoutGrid} heading=\"No collections yet\" body=\"Collections this creator makes appear here.\" />\n          ) : (\n            <div className=\"grid grid-cols-2 gap-4 lg:grid-cols-3\">{collections.map((c) => <CollectionCard key={c.contractAddress} collection={c} />)}</div>\n          )}\n        </TabsContent>\n\n        <TabsContent value=\"listings\" className=\"mt-6 px-6\">\n          {ordersLoading ? (\n            <div className={GRID}>{Array.from({ length: 4 }).map((_, i) => <ListingCardSkeleton key={i} />)}</div>\n          ) : listings.length === 0 ? (\n            <TabEmptyState icon={ShoppingBag} heading=\"No active listings\" body=\"Works this creator lists for sale appear here.\" />\n          ) : (\n            <div className={GRID}>\n              {listings.map((o) => <ListingCard key={o.orderHash} order={o} onBuy={isOwner ? undefined : market.buy} usdValue={orderUsd(o.price, prices)} overflowMenu={<ListingCardMenu order={o} />} />)}\n            </div>\n          )}\n        </TabsContent>\n\n        <TabsContent value=\"activity\" className=\"mt-6 max-w-2xl px-6\">\n          {activitiesLoading ? (\n            <div className=\"space-y-5\">{Array.from({ length: 6 }).map((_, i) => <Skeleton key={i} className=\"h-10 w-full rounded-xl\" />)}</div>\n          ) : activities.length === 0 ? (\n            <TabEmptyState icon={Activity} heading=\"No activity yet\" body=\"This creator's activity appears here as it happens.\" />\n          ) : (\n            <div>{activities.map((a, i) => <ActivityTimelineRow key={i} event={a} isLast={i === activities.length - 1} />)}</div>\n          )}\n        </TabsContent>\n      </UnderlineTabs>\n\n      {actions.dialogs}\n      {market.dialogs}\n      {reportToken ? (\n        <ReportDialog\n          open={!!reportToken}\n          onOpenChange={(open) => { if (!open) setReportToken(null); }}\n          target={{ type: \"TOKEN\", contract: reportToken.contractAddress, tokenId: reportToken.tokenId, name: reportToken.metadata?.name ?? undefined }}\n        />\n      ) : null}\n      {address ? (\n        <ReportDialog open={reportOpen} onOpenChange={setReportOpen} target={{ type: \"CREATOR\", address, name: identity.name ?? identity.identity }} />\n      ) : null}\n    </div>\n  );\n}\n"],"mappings":"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","names":["useSWR","Link","ImageIcon"]}

package/dist/components/creator-page.d.cts

@@ -6,11 +6,10 @@ import '@medialane/sdk';
 import './gated-content.cjs';
 
 interface CreatorPageProps {
-    address?: string;
-    username?: string;
+    username: string;
     useAssetActions: UsePortfolioAssetActions;
     useMarketActions: () => CollectionMarketActions;
 }
-declare function CreatorPage({ address: addressProp, username, useAssetActions, useMarketActions }: CreatorPageProps): react_jsx_runtime.JSX.Element;
+declare function CreatorPage({ username, useAssetActions, useMarketActions }: CreatorPageProps): react_jsx_runtime.JSX.Element;
 
 export { CreatorPage, type CreatorPageProps };

package/dist/components/creator-page.d.ts

@@ -6,11 +6,10 @@ import '@medialane/sdk';
 import './gated-content.js';
 
 interface CreatorPageProps {
-    address?: string;
-    username?: string;
+    username: string;
     useAssetActions: UsePortfolioAssetActions;
     useMarketActions: () => CollectionMarketActions;
 }
-declare function CreatorPage({ address: addressProp, username, useAssetActions, useMarketActions }: CreatorPageProps): react_jsx_runtime.JSX.Element;
+declare function CreatorPage({ username, useAssetActions, useMarketActions }: CreatorPageProps): react_jsx_runtime.JSX.Element;
 
 export { CreatorPage, type CreatorPageProps };

package/dist/components/creator-page.js

@@ -6,7 +6,8 @@ import { Activity, Image as ImageIcon, LayoutGrid, ShoppingBag } from "lucide-re
 import Link from "./link.js";
 import { Button } from "./button.js";
 import { Skeleton } from "./skeleton.js";
-import { AddressDisplay } from "./address-display.js";
+import { TabsContent } from "./tabs.js";
+import { UnderlineTabs } from "./underline-tabs.js";
 import { CreatorHeader } from "./creator-header.js";
 import { HiddenContentBanner } from "./hidden-content-banner.js";
 import { TabEmptyState } from "./tab-empty-state.js";
@@ -30,16 +31,10 @@ import { useTokensByOwner } from "../utils/use-tokens.js";
 import { useCollectionsByOwner } from "../utils/use-collections.js";
 import { useUserOrders } from "../utils/use-orders.js";
 import { useActivitiesByAddress } from "../utils/use-activities.js";
-import { useCreatorByUsername, useCreatorProfile } from "../utils/use-profiles.js";
-const TABS = [
-  { id: "assets", label: "Assets", Icon: ImageIcon },
-  { id: "collections", label: "Collections", Icon: LayoutGrid },
-  { id: "listings", label: "Listings", Icon: ShoppingBag },
-  { id: "activity", label: "Activity", Icon: Activity }
-];
+import { useCreatorByUsername } from "../utils/use-profiles.js";
 const GRID = "grid grid-cols-2 sm:grid-cols-3 lg:grid-cols-4 xl:grid-cols-5 gap-4";
 const isNft = (itemType) => itemType === "ERC721" || itemType === "ERC1155";
-function CreatorPage({ address: addressProp, username, useAssetActions, useMarketActions }) {
+function CreatorPage({ username, useAssetActions, useMarketActions }) {
   const { walletAddress } = useMedialaneApp();
   const client = useMedialaneClient();
   const resolveImage = useImageUrl();
@@ -47,10 +42,8 @@ function CreatorPage({ address: addressProp, username, useAssetActions, useMarke
   const [activeTab, setActiveTab] = useState("assets");
   const [reportOpen, setReportOpen] = useState(false);
   const [reportToken, setReportToken] = useState(null);
-  const byName = useCreatorByUsername(username);
-  const byAddress = useCreatorProfile(username ? void 0 : addressProp);
-  const creator = username ? byName.creator : byAddress.profile;
-  const address = username ? creator?.walletAddress ?? null : addressProp ?? null;
+  const { creator, isLoading: creatorLoading } = useCreatorByUsername(username);
+  const address = creator?.walletAddress ?? null;
   const isOwner = !!address && !!walletAddress && isSameAddress(address, walletAddress);
   const { tokens, meta, isLoading: tokensLoading, mutate: refreshTokens } = useTokensByOwner(address, 1, 20);
   const { collections, isLoading: collectionsLoading } = useCollectionsByOwner(address);
@@ -61,13 +54,13 @@ function CreatorPage({ address: addressProp, username, useAssetActions, useMarke
   const market = useMarketActions();
   const listings = orders.filter((o) => o.status === "ACTIVE" && isNft(o.offer.itemType));
   const identity = profileIdentity({ username: creator?.username, name: creator?.name, walletAddress: address });
-  if (username && byName.isLoading) {
+  if (creatorLoading) {
     return /* @__PURE__ */ jsxs("div", { className: "min-h-screen pb-20", children: [
       /* @__PURE__ */ jsx("div", { className: "px-6 pt-20 pb-6", children: /* @__PURE__ */ jsx(CreatorHeader, { creator: null, image: null, stats: [], loading: true }) }),
       /* @__PURE__ */ jsx("div", { className: cn("px-6", GRID), children: Array.from({ length: 8 }).map((_, i) => /* @__PURE__ */ jsx(TokenCardSkeleton, {}, i)) })
     ] });
   }
-  if (username && !creator) {
+  if (!creator) {
     return /* @__PURE__ */ jsxs("div", { className: "mx-auto max-w-lg space-y-4 px-4 py-24 text-center", children: [
       /* @__PURE__ */ jsx("h1", { className: "text-2xl font-bold", children: "Creator not found" }),
       /* @__PURE__ */ jsxs("p", { className: "text-muted-foreground", children: [
@@ -80,14 +73,15 @@ function CreatorPage({ address: addressProp, username, useAssetActions, useMarke
       /* @__PURE__ */ jsx(Button, { variant: "outline", asChild: true, children: /* @__PURE__ */ jsx(Link, { href: "/creators", children: "Browse creators" }) })
     ] });
   }
-  const counts = {
-    assets: meta?.total ?? void 0,
-    collections: collectionsLoading ? void 0 : collections.length,
-    ...activeTab === "listings" && !ordersLoading ? { listings: listings.length } : {}
-  };
+  const tabs = [
+    { id: "assets", label: "Assets", icon: ImageIcon, count: meta?.total ?? void 0 },
+    { id: "collections", label: "Collections", icon: LayoutGrid, count: collectionsLoading ? void 0 : collections.length },
+    { id: "listings", label: "Listings", icon: ShoppingBag, count: activeTab === "listings" && !ordersLoading ? listings.length : void 0 },
+    { id: "activity", label: "Activity", icon: Activity }
+  ];
   return /* @__PURE__ */ jsxs("div", { className: "min-h-screen overflow-x-hidden pb-20", children: [
     hidden === true ? /* @__PURE__ */ jsx(HiddenContentBanner, {}) : null,
-    /* @__PURE__ */ jsx("div", { className: "px-6 pt-20 pb-6", children: creator ? /* @__PURE__ */ jsx(
+    /* @__PURE__ */ jsx("div", { className: "px-6 pt-20 pb-6", children: /* @__PURE__ */ jsx(
       CreatorHeader,
       {
         creator,
@@ -97,54 +91,39 @@ function CreatorPage({ address: addressProp, username, useAssetActions, useMarke
           { label: "Collections", value: collectionsLoading ? null : collections.length }
         ]
       }
-    ) : /* @__PURE__ */ jsx("div", { className: "flex flex-wrap items-center gap-2", children: /* @__PURE__ */ jsx(AddressDisplay, { address: address ?? "", chars: 10, className: "text-base font-semibold tabular-nums" }) }) }),
-    /* @__PURE__ */ jsxs("div", { className: "sticky top-0 z-20 mt-4 flex items-center gap-2 border-b border-border bg-background/95 px-6 backdrop-blur-sm", children: [
-      /* @__PURE__ */ jsx("div", { className: "-mb-px flex min-w-0 flex-1 items-center gap-0.5 overflow-x-auto scrollbar-none", children: TABS.map(({ id, label, Icon }) => {
-        const count = counts[id];
-        const active = activeTab === id;
-        return /* @__PURE__ */ jsxs(
-          "button",
-          {
-            onClick: () => setActiveTab(id),
-            className: cn(
-              "relative flex shrink-0 items-center gap-2 whitespace-nowrap px-4 py-3 text-sm font-medium transition-colors duration-200",
-              active ? "text-foreground" : "text-muted-foreground hover:text-foreground"
-            ),
-            children: [
-              /* @__PURE__ */ jsx(Icon, { className: "h-3.5 w-3.5" }),
-              label,
-              count ? /* @__PURE__ */ jsx("span", { className: cn("min-w-[18px] rounded-full px-1.5 py-px text-center text-2xs font-bold tabular-nums", active ? "bg-primary/15 text-primary" : "bg-muted text-muted-foreground"), children: count }) : null,
-              active ? /* @__PURE__ */ jsx("span", { className: "absolute inset-x-0 bottom-0 h-0.5 rounded-full bg-primary" }) : null
-            ]
-          },
-          id
-        );
-      }) }),
-      address ? /* @__PURE__ */ jsx(MoreMenu, { explorerHref: `${EXPLORER_URL}/contract/${address}`, shareTitle: identity.name ?? identity.identity, onReport: () => setReportOpen(true) }) : null
-    ] }),
-    /* @__PURE__ */ jsxs("div", { className: "mt-6 px-6", children: [
-      activeTab === "assets" && (tokensLoading ? /* @__PURE__ */ jsx("div", { className: GRID, children: Array.from({ length: 8 }).map((_, i) => /* @__PURE__ */ jsx(TokenCardSkeleton, {}, i)) }) : tokens.length === 0 ? /* @__PURE__ */ jsx(TabEmptyState, { icon: ImageIcon, heading: "No assets yet", body: "Works this creator makes on Medialane appear here." }) : /* @__PURE__ */ jsx("div", { className: GRID, children: tokens.map((t) => {
-        const listing = t.activeOrders?.find((o) => isNft(o.offer.itemType));
-        return /* @__PURE__ */ jsx(
-          TokenCard,
-          {
-            token: t,
-            isOwner,
-            usdValue: orderUsd(listing?.price, prices),
-            onList: isOwner ? actions.list : void 0,
-            onTransfer: isOwner ? actions.transfer : void 0,
-            onCancel: isOwner ? actions.cancel : void 0,
-            onBuy: !isOwner && listing ? () => market.buy(listing) : void 0,
-            onOffer: isOwner ? void 0 : market.offer,
-            onReport: setReportToken
-          },
-          `${t.contractAddress}-${t.tokenId}`
-        );
-      }) })),
-      activeTab === "collections" && (collectionsLoading ? /* @__PURE__ */ jsx("div", { className: "grid grid-cols-2 gap-4 lg:grid-cols-3", children: Array.from({ length: 6 }).map((_, i) => /* @__PURE__ */ jsx(CollectionCardSkeleton, {}, i)) }) : collections.length === 0 ? /* @__PURE__ */ jsx(TabEmptyState, { icon: LayoutGrid, heading: "No collections yet", body: "Collections this creator makes appear here." }) : /* @__PURE__ */ jsx("div", { className: "grid grid-cols-2 gap-4 lg:grid-cols-3", children: collections.map((c) => /* @__PURE__ */ jsx(CollectionCard, { collection: c }, c.contractAddress)) })),
-      activeTab === "listings" && (ordersLoading ? /* @__PURE__ */ jsx("div", { className: GRID, children: Array.from({ length: 4 }).map((_, i) => /* @__PURE__ */ jsx(ListingCardSkeleton, {}, i)) }) : listings.length === 0 ? /* @__PURE__ */ jsx(TabEmptyState, { icon: ShoppingBag, heading: "No active listings", body: "Works this creator lists for sale appear here." }) : /* @__PURE__ */ jsx("div", { className: GRID, children: listings.map((o) => /* @__PURE__ */ jsx(ListingCard, { order: o, onBuy: isOwner ? void 0 : market.buy, usdValue: orderUsd(o.price, prices), overflowMenu: /* @__PURE__ */ jsx(ListingCardMenu, { order: o }) }, o.orderHash)) })),
-      activeTab === "activity" && /* @__PURE__ */ jsx("div", { className: "max-w-2xl", children: activitiesLoading ? /* @__PURE__ */ jsx("div", { className: "space-y-5", children: Array.from({ length: 6 }).map((_, i) => /* @__PURE__ */ jsx(Skeleton, { className: "h-10 w-full rounded-xl" }, i)) }) : activities.length === 0 ? /* @__PURE__ */ jsx(TabEmptyState, { icon: Activity, heading: "No activity yet", body: "This creator's activity appears here as it happens." }) : /* @__PURE__ */ jsx("div", { children: activities.map((a, i) => /* @__PURE__ */ jsx(ActivityTimelineRow, { event: a, isLast: i === activities.length - 1 }, i)) }) })
-    ] }),
+    ) }),
+    /* @__PURE__ */ jsxs(
+      UnderlineTabs,
+      {
+        tabs,
+        value: activeTab,
+        onValueChange: (id) => setActiveTab(id),
+        trailing: address ? /* @__PURE__ */ jsx(MoreMenu, { explorerHref: `${EXPLORER_URL}/contract/${address}`, shareTitle: identity.name ?? identity.identity, onReport: () => setReportOpen(true) }) : null,
+        children: [
+          /* @__PURE__ */ jsx(TabsContent, { value: "assets", className: "mt-6 px-6", children: tokensLoading ? /* @__PURE__ */ jsx("div", { className: GRID, children: Array.from({ length: 8 }).map((_, i) => /* @__PURE__ */ jsx(TokenCardSkeleton, {}, i)) }) : tokens.length === 0 ? /* @__PURE__ */ jsx(TabEmptyState, { icon: ImageIcon, heading: "No assets yet", body: "Works this creator makes on Medialane appear here." }) : /* @__PURE__ */ jsx("div", { className: GRID, children: tokens.map((t) => {
+            const listing = t.activeOrders?.find((o) => isNft(o.offer.itemType));
+            return /* @__PURE__ */ jsx(
+              TokenCard,
+              {
+                token: t,
+                isOwner,
+                usdValue: orderUsd(listing?.price, prices),
+                onList: isOwner ? actions.list : void 0,
+                onTransfer: isOwner ? actions.transfer : void 0,
+                onCancel: isOwner ? actions.cancel : void 0,
+                onBuy: !isOwner && listing ? () => market.buy(listing) : void 0,
+                onOffer: isOwner ? void 0 : market.offer,
+                onReport: setReportToken
+              },
+              `${t.contractAddress}-${t.tokenId}`
+            );
+          }) }) }),
+          /* @__PURE__ */ jsx(TabsContent, { value: "collections", className: "mt-6 px-6", children: collectionsLoading ? /* @__PURE__ */ jsx("div", { className: "grid grid-cols-2 gap-4 lg:grid-cols-3", children: Array.from({ length: 6 }).map((_, i) => /* @__PURE__ */ jsx(CollectionCardSkeleton, {}, i)) }) : collections.length === 0 ? /* @__PURE__ */ jsx(TabEmptyState, { icon: LayoutGrid, heading: "No collections yet", body: "Collections this creator makes appear here." }) : /* @__PURE__ */ jsx("div", { className: "grid grid-cols-2 gap-4 lg:grid-cols-3", children: collections.map((c) => /* @__PURE__ */ jsx(CollectionCard, { collection: c }, c.contractAddress)) }) }),
+          /* @__PURE__ */ jsx(TabsContent, { value: "listings", className: "mt-6 px-6", children: ordersLoading ? /* @__PURE__ */ jsx("div", { className: GRID, children: Array.from({ length: 4 }).map((_, i) => /* @__PURE__ */ jsx(ListingCardSkeleton, {}, i)) }) : listings.length === 0 ? /* @__PURE__ */ jsx(TabEmptyState, { icon: ShoppingBag, heading: "No active listings", body: "Works this creator lists for sale appear here." }) : /* @__PURE__ */ jsx("div", { className: GRID, children: listings.map((o) => /* @__PURE__ */ jsx(ListingCard, { order: o, onBuy: isOwner ? void 0 : market.buy, usdValue: orderUsd(o.price, prices), overflowMenu: /* @__PURE__ */ jsx(ListingCardMenu, { order: o }) }, o.orderHash)) }) }),
+          /* @__PURE__ */ jsx(TabsContent, { value: "activity", className: "mt-6 max-w-2xl px-6", children: activitiesLoading ? /* @__PURE__ */ jsx("div", { className: "space-y-5", children: Array.from({ length: 6 }).map((_, i) => /* @__PURE__ */ jsx(Skeleton, { className: "h-10 w-full rounded-xl" }, i)) }) : activities.length === 0 ? /* @__PURE__ */ jsx(TabEmptyState, { icon: Activity, heading: "No activity yet", body: "This creator's activity appears here as it happens." }) : /* @__PURE__ */ jsx("div", { children: activities.map((a, i) => /* @__PURE__ */ jsx(ActivityTimelineRow, { event: a, isLast: i === activities.length - 1 }, i)) }) })
+        ]
+      }
+    ),
     actions.dialogs,
     market.dialogs,
     reportToken ? /* @__PURE__ */ jsx(