@medialane/ui 0.163.0 → 0.165.0

package/dist/components/activities-feed.cjs

@@ -0,0 +1,211 @@
+"use strict";
+"use client";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var activities_feed_exports = {};
+__export(activities_feed_exports, {
+  ActivitiesFeed: () => ActivitiesFeed
+});
+module.exports = __toCommonJS(activities_feed_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_react = require("react");
+var import_swr = __toESM(require("swr"), 1);
+var import_link = __toESM(require("next/link"), 1);
+var import_use_activities = require("../utils/use-activities.js");
+var import_use_rewards = require("../utils/use-rewards.js");
+var import_skeleton = require("./skeleton.js");
+var import_load_more_sentinel = require("./load-more-sentinel.js");
+var import_lucide_react = require("lucide-react");
+var import_activity = require("../data/activity.js");
+var import_activity_row = require("./activity-row.js");
+var import_cn = require("../utils/cn.js");
+async function fetchAnnouncements() {
+  const res = await fetch("/api/announcements");
+  if (!res.ok) return [];
+  return res.json();
+}
+function AnnouncementsBanner({ announcements }) {
+  const pinned = announcements.filter((a) => a.pinned);
+  if (pinned.length === 0) return null;
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "space-y-2", children: pinned.map((ann) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+    import_link.default,
+    {
+      href: ann.href,
+      className: "flex items-start gap-3 rounded-xl border border-brand-purple/20 bg-brand-purple/5 px-4 py-3 hover:bg-brand-purple/10 transition-colors group",
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "h-8 w-8 rounded-lg bg-brand-purple/10 flex items-center justify-center shrink-0 mt-0.5", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Megaphone, { className: "h-3.5 w-3.5 text-brand-purple" }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex-1 min-w-0", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center gap-1.5 mb-0.5", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Pin, { className: "h-2.5 w-2.5 text-brand-purple/60" }),
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "text-[10px] font-bold uppercase tracking-widest text-brand-purple/60", children: "Announcement" })
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-sm font-semibold leading-snug", children: ann.title }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-xs text-muted-foreground mt-0.5 truncate", children: ann.body })
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.ArrowRight, { className: "h-4 w-4 text-muted-foreground group-hover:text-foreground transition-colors shrink-0 mt-1" })
+      ]
+    },
+    ann.id
+  )) });
+}
+const PAGE_SIZE = 30;
+function ActivitiesFeed({ getClient }) {
+  const [page, setPage] = (0, import_react.useState)(1);
+  const [typeFilter, setTypeFilter] = (0, import_react.useState)("");
+  const [allActivities, setAllActivities] = (0, import_react.useState)([]);
+  const { data: announcements = [] } = (0, import_swr.default)(
+    "announcements",
+    fetchAnnouncements,
+    { revalidateOnFocus: false }
+  );
+  const prevType = (0, import_react.useRef)(typeFilter);
+  (0, import_react.useEffect)(() => {
+    if (prevType.current !== typeFilter) {
+      prevType.current = typeFilter;
+      setPage(1);
+      setAllActivities([]);
+    }
+  }, [typeFilter]);
+  const { activities, meta, isLoading } = (0, import_use_activities.useActivities)(getClient, {
+    limit: PAGE_SIZE,
+    page,
+    type: typeFilter || void 0
+  });
+  (0, import_react.useEffect)(() => {
+    if (isLoading) return;
+    if (page === 1) {
+      setAllActivities(activities);
+    } else {
+      setAllActivities((prev) => {
+        const existing = new Set(
+          prev.map((a) => `${a.txHash}-${a.type}-${a.nftTokenId ?? ""}`)
+        );
+        const newItems = activities.filter(
+          (a) => !existing.has(`${a.txHash}-${a.type}-${a.nftTokenId ?? ""}`)
+        );
+        return newItems.length > 0 ? [...prev, ...newItems] : prev;
+      });
+    }
+  }, [activities, isLoading, page]);
+  const pageActors = allActivities.map((a) => a.offerer ?? a.fulfiller ?? (a.type === "mint" ? a.to : a.from)).filter((a) => Boolean(a));
+  const { data: actorLevels } = (0, import_use_rewards.useRewardsBatch)(getClient, pageActors);
+  const isInitialLoading = isLoading && allActivities.length === 0;
+  const isLoadingMore = isLoading && allActivities.length > 0;
+  const hasMore = meta?.total != null ? allActivities.length < meta.total : false;
+  const total = meta?.total ?? null;
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "space-y-5", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(AnnouncementsBanner, { announcements }),
+    total != null && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center gap-2 text-sm text-muted-foreground", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: "flex items-center gap-1.5", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "h-1.5 w-1.5 rounded-full bg-emerald-500 animate-pulse" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "font-semibold text-foreground tabular-nums", children: total.toLocaleString() }),
+        typeFilter ? `${typeFilter} events` : "total events"
+      ] }),
+      typeFilter && allActivities.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "text-muted-foreground/40", children: "\xB7" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { children: [
+          allActivities.length.toLocaleString(),
+          " loaded"
+        ] })
+      ] })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "flex flex-wrap gap-2", children: import_activity.TYPE_FILTERS.map((f) => {
+      const typeConfig = f.value ? import_activity.ACTIVITY_TYPE_CONFIG[f.value] : null;
+      const Icon = typeConfig?.icon;
+      const isActive = typeFilter === f.value;
+      return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+        "button",
+        {
+          onClick: () => setTypeFilter(f.value),
+          className: (0, import_cn.cn)(
+            "flex items-center gap-1.5 text-xs px-3 py-1.5 rounded-full border transition-all font-medium",
+            isActive ? "border-primary bg-primary/10 text-primary shadow-sm" : "border-border text-muted-foreground hover:border-primary/40 hover:text-foreground hover:bg-muted/50"
+          ),
+          children: [
+            Icon && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+              Icon,
+              {
+                className: (0, import_cn.cn)(
+                  "h-3 w-3",
+                  isActive ? typeConfig?.colorClass : ""
+                )
+              }
+            ),
+            f.label
+          ]
+        },
+        f.value
+      );
+    }) }),
+    isInitialLoading ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "divide-y divide-border/50 rounded-xl border border-border overflow-hidden", children: Array.from({ length: 10 }).map((_, i) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center gap-3 px-4 py-3.5 bg-card", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_skeleton.Skeleton, { className: "h-8 w-8 rounded-lg shrink-0" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_skeleton.Skeleton, { className: "h-9 w-9 rounded-md shrink-0" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex-1 space-y-2", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_skeleton.Skeleton, { className: "h-3.5 w-40" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_skeleton.Skeleton, { className: "h-2.5 w-24" })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center gap-2.5", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "space-y-1 text-right", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_skeleton.Skeleton, { className: "h-4 w-16" }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_skeleton.Skeleton, { className: "h-2.5 w-8" })
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_skeleton.Skeleton, { className: "h-2.5 w-12 hidden sm:block" })
+      ] })
+    ] }, i)) }) : allActivities.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "py-20 flex flex-col items-center gap-3 text-center", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "h-12 w-12 rounded-full bg-muted flex items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Zap, { className: "h-5 w-5 text-muted-foreground" }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-muted-foreground", children: typeFilter ? `No ${typeFilter} events yet.` : "No activity yet." })
+    ] }) : /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "space-y-4", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "divide-y divide-border/50 rounded-xl border border-border overflow-hidden", children: allActivities.map((activity, i) => {
+        const actor = activity.offerer ?? activity.fulfiller ?? (activity.type === "mint" ? activity.to : activity.from);
+        return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          import_activity_row.ActivityRow,
+          {
+            activity,
+            showActor: true,
+            showExplorer: true,
+            actorLevel: actor ? actorLevels?.get(actor) : void 0
+          },
+          `${activity.txHash}-${activity.type}-${activity.nftTokenId ?? i}`
+        );
+      }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        import_load_more_sentinel.LoadMoreSentinel,
+        {
+          hasMore,
+          isLoading: isLoadingMore,
+          onLoadMore: () => setPage((p) => p + 1)
+        }
+      )
+    ] })
+  ] });
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  ActivitiesFeed
+});
+//# sourceMappingURL=activities-feed.cjs.map

package/dist/components/activities-feed.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/activities-feed.tsx"],"sourcesContent":["\"use client\";\n\nimport { useState, useEffect, useRef } from \"react\";\nimport useSWR from \"swr\";\nimport Link from \"next/link\";\nimport { useActivities } from \"../utils/use-activities.js\";\nimport { useRewardsBatch } from \"../utils/use-rewards.js\";\nimport type { ApiActivitiesQuery, ApiActivity } from \"@medialane/sdk\";\nimport type { MedialaneClient } from \"@medialane/sdk/starknet\";\nimport { Skeleton } from \"./skeleton.js\";\nimport { LoadMoreSentinel } from \"./load-more-sentinel.js\";\nimport { Zap, Megaphone, ArrowRight, Pin } from \"lucide-react\";\nimport { ACTIVITY_TYPE_CONFIG, TYPE_FILTERS } from \"../data/activity.js\";\nimport { ActivityRow } from \"./activity-row.js\";\nimport { cn } from \"../utils/cn.js\";\nimport type { Announcement } from \"../data/notification.js\";\n\nasync function fetchAnnouncements(): Promise<Announcement[]> {\n  const res = await fetch(\"/api/announcements\");\n  if (!res.ok) return [];\n  return res.json();\n}\n\nfunction AnnouncementsBanner({ announcements }: { announcements: Announcement[] }) {\n  const pinned = announcements.filter((a) => a.pinned);\n  if (pinned.length === 0) return null;\n  return (\n    <div className=\"space-y-2\">\n      {pinned.map((ann) => (\n        <Link\n          key={ann.id}\n          href={ann.href}\n          className=\"flex items-start gap-3 rounded-xl border border-brand-purple/20 bg-brand-purple/5 px-4 py-3 hover:bg-brand-purple/10 transition-colors group\"\n        >\n          <div className=\"h-8 w-8 rounded-lg bg-brand-purple/10 flex items-center justify-center shrink-0 mt-0.5\">\n            <Megaphone className=\"h-3.5 w-3.5 text-brand-purple\" />\n          </div>\n          <div className=\"flex-1 min-w-0\">\n            <div className=\"flex items-center gap-1.5 mb-0.5\">\n              <Pin className=\"h-2.5 w-2.5 text-brand-purple/60\" />\n              <span className=\"text-[10px] font-bold uppercase tracking-widest text-brand-purple/60\">Announcement</span>\n            </div>\n            <p className=\"text-sm font-semibold leading-snug\">{ann.title}</p>\n            <p className=\"text-xs text-muted-foreground mt-0.5 truncate\">{ann.body}</p>\n          </div>\n          <ArrowRight className=\"h-4 w-4 text-muted-foreground group-hover:text-foreground transition-colors shrink-0 mt-1\" />\n        </Link>\n      ))}\n    </div>\n  );\n}\n\nconst PAGE_SIZE = 30;\n\nexport interface ActivitiesFeedProps {\n  getClient: () => MedialaneClient;\n}\n\nexport function ActivitiesFeed({ getClient }: ActivitiesFeedProps) {\n  const [page, setPage] = useState(1);\n  const [typeFilter, setTypeFilter] = useState(\"\");\n  const [allActivities, setAllActivities] = useState<ApiActivity[]>([]);\n  const { data: announcements = [] } = useSWR<Announcement[]>(\n    \"announcements\",\n    fetchAnnouncements,\n    { revalidateOnFocus: false }\n  );\n\n  const prevType = useRef(typeFilter);\n  useEffect(() => {\n    if (prevType.current !== typeFilter) {\n      prevType.current = typeFilter;\n      setPage(1);\n      setAllActivities([]);\n    }\n  }, [typeFilter]);\n\n  const { activities, meta, isLoading } = useActivities(getClient, {\n    limit: PAGE_SIZE,\n    page,\n    type: (typeFilter as ApiActivitiesQuery[\"type\"]) || undefined,\n  });\n\n  useEffect(() => {\n    if (isLoading) return;\n    if (page === 1) {\n      setAllActivities(activities);\n    } else {\n      setAllActivities((prev) => {\n        const existing = new Set(\n          prev.map((a) => `${a.txHash}-${a.type}-${a.nftTokenId ?? \"\"}`)\n        );\n        const newItems = activities.filter(\n          (a) => !existing.has(`${a.txHash}-${a.type}-${a.nftTokenId ?? \"\"}`)\n        );\n        return newItems.length > 0 ? [...prev, ...newItems] : prev;\n      });\n    }\n  }, [activities, isLoading, page]);\n\n  const pageActors = allActivities\n    .map((a) => a.offerer ?? a.fulfiller ?? (a.type === \"mint\" ? a.to : a.from))\n    .filter((a): a is string => Boolean(a));\n  const { data: actorLevels } = useRewardsBatch(getClient, pageActors);\n\n  const isInitialLoading = isLoading && allActivities.length === 0;\n  const isLoadingMore = isLoading && allActivities.length > 0;\n  const hasMore = meta?.total != null ? allActivities.length < meta.total : false;\n  const total = meta?.total ?? null;\n\n  return (\n    <div className=\"space-y-5\">\n      <AnnouncementsBanner announcements={announcements} />\n\n      {total != null && (\n        <div className=\"flex items-center gap-2 text-sm text-muted-foreground\">\n          <span className=\"flex items-center gap-1.5\">\n            <span className=\"h-1.5 w-1.5 rounded-full bg-emerald-500 animate-pulse\" />\n            <span className=\"font-semibold text-foreground tabular-nums\">\n              {total.toLocaleString()}\n            </span>\n            {typeFilter ? `${typeFilter} events` : \"total events\"}\n          </span>\n          {typeFilter && allActivities.length > 0 && (\n            <>\n              <span className=\"text-muted-foreground/40\">·</span>\n              <span>{allActivities.length.toLocaleString()} loaded</span>\n            </>\n          )}\n        </div>\n      )}\n\n      <div className=\"flex flex-wrap gap-2\">\n        {TYPE_FILTERS.map((f) => {\n          const typeConfig = f.value ? ACTIVITY_TYPE_CONFIG[f.value] : null;\n          const Icon = typeConfig?.icon;\n          const isActive = typeFilter === f.value;\n          return (\n            <button\n              key={f.value}\n              onClick={() => setTypeFilter(f.value)}\n              className={cn(\n                \"flex items-center gap-1.5 text-xs px-3 py-1.5 rounded-full border transition-all font-medium\",\n                isActive\n                  ? \"border-primary bg-primary/10 text-primary shadow-sm\"\n                  : \"border-border text-muted-foreground hover:border-primary/40 hover:text-foreground hover:bg-muted/50\"\n              )}\n            >\n              {Icon && (\n                <Icon\n                  className={cn(\n                    \"h-3 w-3\",\n                    isActive ? typeConfig?.colorClass : \"\"\n                  )}\n                />\n              )}\n              {f.label}\n            </button>\n          );\n        })}\n      </div>\n\n      {isInitialLoading ? (\n        <div className=\"divide-y divide-border/50 rounded-xl border border-border overflow-hidden\">\n          {Array.from({ length: 10 }).map((_, i) => (\n            <div key={i} className=\"flex items-center gap-3 px-4 py-3.5 bg-card\">\n              <Skeleton className=\"h-8 w-8 rounded-lg shrink-0\" />\n              <Skeleton className=\"h-9 w-9 rounded-md shrink-0\" />\n              <div className=\"flex-1 space-y-2\">\n                <Skeleton className=\"h-3.5 w-40\" />\n                <Skeleton className=\"h-2.5 w-24\" />\n              </div>\n              <div className=\"flex items-center gap-2.5\">\n                <div className=\"space-y-1 text-right\">\n                  <Skeleton className=\"h-4 w-16\" />\n                  <Skeleton className=\"h-2.5 w-8\" />\n                </div>\n                <Skeleton className=\"h-2.5 w-12 hidden sm:block\" />\n              </div>\n            </div>\n          ))}\n        </div>\n      ) : allActivities.length === 0 ? (\n        <div className=\"py-20 flex flex-col items-center gap-3 text-center\">\n          <div className=\"h-12 w-12 rounded-full bg-muted flex items-center justify-center\">\n            <Zap className=\"h-5 w-5 text-muted-foreground\" />\n          </div>\n          <p className=\"text-muted-foreground\">\n            {typeFilter ? `No ${typeFilter} events yet.` : \"No activity yet.\"}\n          </p>\n        </div>\n      ) : (\n        <div className=\"space-y-4\">\n          <div className=\"divide-y divide-border/50 rounded-xl border border-border overflow-hidden\">\n            {allActivities.map((activity, i) => {\n              const actor = activity.offerer ?? activity.fulfiller ?? (activity.type === \"mint\" ? activity.to : activity.from);\n              return (\n                <ActivityRow\n                  key={`${activity.txHash}-${activity.type}-${activity.nftTokenId ?? i}`}\n                  activity={activity}\n                  showActor\n                  showExplorer\n                  actorLevel={actor ? actorLevels?.get(actor) : undefined}\n                />\n              );\n            })}\n          </div>\n\n          <LoadMoreSentinel\n            hasMore={hasMore}\n            isLoading={isLoadingMore}\n            onLoadMore={() => setPage((p) => p + 1)}\n          />\n        </div>\n      )}\n    </div>\n  );\n}\n"],"mappings":"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","names":["Link","useSWR"]}

package/dist/components/activities-feed.d.cts

@@ -0,0 +1,9 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { MedialaneClient } from '@medialane/sdk/starknet';
+
+interface ActivitiesFeedProps {
+    getClient: () => MedialaneClient;
+}
+declare function ActivitiesFeed({ getClient }: ActivitiesFeedProps): react_jsx_runtime.JSX.Element;
+
+export { ActivitiesFeed, type ActivitiesFeedProps };

package/dist/components/activities-feed.d.ts

@@ -0,0 +1,9 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { MedialaneClient } from '@medialane/sdk/starknet';
+
+interface ActivitiesFeedProps {
+    getClient: () => MedialaneClient;
+}
+declare function ActivitiesFeed({ getClient }: ActivitiesFeedProps): react_jsx_runtime.JSX.Element;
+
+export { ActivitiesFeed, type ActivitiesFeedProps };

package/dist/components/activities-feed.js

@@ -0,0 +1,177 @@
+"use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useState, useEffect, useRef } from "react";
+import useSWR from "swr";
+import Link from "next/link";
+import { useActivities } from "../utils/use-activities.js";
+import { useRewardsBatch } from "../utils/use-rewards.js";
+import { Skeleton } from "./skeleton.js";
+import { LoadMoreSentinel } from "./load-more-sentinel.js";
+import { Zap, Megaphone, ArrowRight, Pin } from "lucide-react";
+import { ACTIVITY_TYPE_CONFIG, TYPE_FILTERS } from "../data/activity.js";
+import { ActivityRow } from "./activity-row.js";
+import { cn } from "../utils/cn.js";
+async function fetchAnnouncements() {
+  const res = await fetch("/api/announcements");
+  if (!res.ok) return [];
+  return res.json();
+}
+function AnnouncementsBanner({ announcements }) {
+  const pinned = announcements.filter((a) => a.pinned);
+  if (pinned.length === 0) return null;
+  return /* @__PURE__ */ jsx("div", { className: "space-y-2", children: pinned.map((ann) => /* @__PURE__ */ jsxs(
+    Link,
+    {
+      href: ann.href,
+      className: "flex items-start gap-3 rounded-xl border border-brand-purple/20 bg-brand-purple/5 px-4 py-3 hover:bg-brand-purple/10 transition-colors group",
+      children: [
+        /* @__PURE__ */ jsx("div", { className: "h-8 w-8 rounded-lg bg-brand-purple/10 flex items-center justify-center shrink-0 mt-0.5", children: /* @__PURE__ */ jsx(Megaphone, { className: "h-3.5 w-3.5 text-brand-purple" }) }),
+        /* @__PURE__ */ jsxs("div", { className: "flex-1 min-w-0", children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5 mb-0.5", children: [
+            /* @__PURE__ */ jsx(Pin, { className: "h-2.5 w-2.5 text-brand-purple/60" }),
+            /* @__PURE__ */ jsx("span", { className: "text-[10px] font-bold uppercase tracking-widest text-brand-purple/60", children: "Announcement" })
+          ] }),
+          /* @__PURE__ */ jsx("p", { className: "text-sm font-semibold leading-snug", children: ann.title }),
+          /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground mt-0.5 truncate", children: ann.body })
+        ] }),
+        /* @__PURE__ */ jsx(ArrowRight, { className: "h-4 w-4 text-muted-foreground group-hover:text-foreground transition-colors shrink-0 mt-1" })
+      ]
+    },
+    ann.id
+  )) });
+}
+const PAGE_SIZE = 30;
+function ActivitiesFeed({ getClient }) {
+  const [page, setPage] = useState(1);
+  const [typeFilter, setTypeFilter] = useState("");
+  const [allActivities, setAllActivities] = useState([]);
+  const { data: announcements = [] } = useSWR(
+    "announcements",
+    fetchAnnouncements,
+    { revalidateOnFocus: false }
+  );
+  const prevType = useRef(typeFilter);
+  useEffect(() => {
+    if (prevType.current !== typeFilter) {
+      prevType.current = typeFilter;
+      setPage(1);
+      setAllActivities([]);
+    }
+  }, [typeFilter]);
+  const { activities, meta, isLoading } = useActivities(getClient, {
+    limit: PAGE_SIZE,
+    page,
+    type: typeFilter || void 0
+  });
+  useEffect(() => {
+    if (isLoading) return;
+    if (page === 1) {
+      setAllActivities(activities);
+    } else {
+      setAllActivities((prev) => {
+        const existing = new Set(
+          prev.map((a) => `${a.txHash}-${a.type}-${a.nftTokenId ?? ""}`)
+        );
+        const newItems = activities.filter(
+          (a) => !existing.has(`${a.txHash}-${a.type}-${a.nftTokenId ?? ""}`)
+        );
+        return newItems.length > 0 ? [...prev, ...newItems] : prev;
+      });
+    }
+  }, [activities, isLoading, page]);
+  const pageActors = allActivities.map((a) => a.offerer ?? a.fulfiller ?? (a.type === "mint" ? a.to : a.from)).filter((a) => Boolean(a));
+  const { data: actorLevels } = useRewardsBatch(getClient, pageActors);
+  const isInitialLoading = isLoading && allActivities.length === 0;
+  const isLoadingMore = isLoading && allActivities.length > 0;
+  const hasMore = meta?.total != null ? allActivities.length < meta.total : false;
+  const total = meta?.total ?? null;
+  return /* @__PURE__ */ jsxs("div", { className: "space-y-5", children: [
+    /* @__PURE__ */ jsx(AnnouncementsBanner, { announcements }),
+    total != null && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 text-sm text-muted-foreground", children: [
+      /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-1.5", children: [
+        /* @__PURE__ */ jsx("span", { className: "h-1.5 w-1.5 rounded-full bg-emerald-500 animate-pulse" }),
+        /* @__PURE__ */ jsx("span", { className: "font-semibold text-foreground tabular-nums", children: total.toLocaleString() }),
+        typeFilter ? `${typeFilter} events` : "total events"
+      ] }),
+      typeFilter && allActivities.length > 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx("span", { className: "text-muted-foreground/40", children: "\xB7" }),
+        /* @__PURE__ */ jsxs("span", { children: [
+          allActivities.length.toLocaleString(),
+          " loaded"
+        ] })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: "flex flex-wrap gap-2", children: TYPE_FILTERS.map((f) => {
+      const typeConfig = f.value ? ACTIVITY_TYPE_CONFIG[f.value] : null;
+      const Icon = typeConfig?.icon;
+      const isActive = typeFilter === f.value;
+      return /* @__PURE__ */ jsxs(
+        "button",
+        {
+          onClick: () => setTypeFilter(f.value),
+          className: cn(
+            "flex items-center gap-1.5 text-xs px-3 py-1.5 rounded-full border transition-all font-medium",
+            isActive ? "border-primary bg-primary/10 text-primary shadow-sm" : "border-border text-muted-foreground hover:border-primary/40 hover:text-foreground hover:bg-muted/50"
+          ),
+          children: [
+            Icon && /* @__PURE__ */ jsx(
+              Icon,
+              {
+                className: cn(
+                  "h-3 w-3",
+                  isActive ? typeConfig?.colorClass : ""
+                )
+              }
+            ),
+            f.label
+          ]
+        },
+        f.value
+      );
+    }) }),
+    isInitialLoading ? /* @__PURE__ */ jsx("div", { className: "divide-y divide-border/50 rounded-xl border border-border overflow-hidden", children: Array.from({ length: 10 }).map((_, i) => /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 px-4 py-3.5 bg-card", children: [
+      /* @__PURE__ */ jsx(Skeleton, { className: "h-8 w-8 rounded-lg shrink-0" }),
+      /* @__PURE__ */ jsx(Skeleton, { className: "h-9 w-9 rounded-md shrink-0" }),
+      /* @__PURE__ */ jsxs("div", { className: "flex-1 space-y-2", children: [
+        /* @__PURE__ */ jsx(Skeleton, { className: "h-3.5 w-40" }),
+        /* @__PURE__ */ jsx(Skeleton, { className: "h-2.5 w-24" })
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2.5", children: [
+        /* @__PURE__ */ jsxs("div", { className: "space-y-1 text-right", children: [
+          /* @__PURE__ */ jsx(Skeleton, { className: "h-4 w-16" }),
+          /* @__PURE__ */ jsx(Skeleton, { className: "h-2.5 w-8" })
+        ] }),
+        /* @__PURE__ */ jsx(Skeleton, { className: "h-2.5 w-12 hidden sm:block" })
+      ] })
+    ] }, i)) }) : allActivities.length === 0 ? /* @__PURE__ */ jsxs("div", { className: "py-20 flex flex-col items-center gap-3 text-center", children: [
+      /* @__PURE__ */ jsx("div", { className: "h-12 w-12 rounded-full bg-muted flex items-center justify-center", children: /* @__PURE__ */ jsx(Zap, { className: "h-5 w-5 text-muted-foreground" }) }),
+      /* @__PURE__ */ jsx("p", { className: "text-muted-foreground", children: typeFilter ? `No ${typeFilter} events yet.` : "No activity yet." })
+    ] }) : /* @__PURE__ */ jsxs("div", { className: "space-y-4", children: [
+      /* @__PURE__ */ jsx("div", { className: "divide-y divide-border/50 rounded-xl border border-border overflow-hidden", children: allActivities.map((activity, i) => {
+        const actor = activity.offerer ?? activity.fulfiller ?? (activity.type === "mint" ? activity.to : activity.from);
+        return /* @__PURE__ */ jsx(
+          ActivityRow,
+          {
+            activity,
+            showActor: true,
+            showExplorer: true,
+            actorLevel: actor ? actorLevels?.get(actor) : void 0
+          },
+          `${activity.txHash}-${activity.type}-${activity.nftTokenId ?? i}`
+        );
+      }) }),
+      /* @__PURE__ */ jsx(
+        LoadMoreSentinel,
+        {
+          hasMore,
+          isLoading: isLoadingMore,
+          onLoadMore: () => setPage((p) => p + 1)
+        }
+      )
+    ] })
+  ] });
+}
+export {
+  ActivitiesFeed
+};
+//# sourceMappingURL=activities-feed.js.map

package/dist/components/activities-feed.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/activities-feed.tsx"],"sourcesContent":["\"use client\";\n\nimport { useState, useEffect, useRef } from \"react\";\nimport useSWR from \"swr\";\nimport Link from \"next/link\";\nimport { useActivities } from \"../utils/use-activities.js\";\nimport { useRewardsBatch } from \"../utils/use-rewards.js\";\nimport type { ApiActivitiesQuery, ApiActivity } from \"@medialane/sdk\";\nimport type { MedialaneClient } from \"@medialane/sdk/starknet\";\nimport { Skeleton } from \"./skeleton.js\";\nimport { LoadMoreSentinel } from \"./load-more-sentinel.js\";\nimport { Zap, Megaphone, ArrowRight, Pin } from \"lucide-react\";\nimport { ACTIVITY_TYPE_CONFIG, TYPE_FILTERS } from \"../data/activity.js\";\nimport { ActivityRow } from \"./activity-row.js\";\nimport { cn } from \"../utils/cn.js\";\nimport type { Announcement } from \"../data/notification.js\";\n\nasync function fetchAnnouncements(): Promise<Announcement[]> {\n  const res = await fetch(\"/api/announcements\");\n  if (!res.ok) return [];\n  return res.json();\n}\n\nfunction AnnouncementsBanner({ announcements }: { announcements: Announcement[] }) {\n  const pinned = announcements.filter((a) => a.pinned);\n  if (pinned.length === 0) return null;\n  return (\n    <div className=\"space-y-2\">\n      {pinned.map((ann) => (\n        <Link\n          key={ann.id}\n          href={ann.href}\n          className=\"flex items-start gap-3 rounded-xl border border-brand-purple/20 bg-brand-purple/5 px-4 py-3 hover:bg-brand-purple/10 transition-colors group\"\n        >\n          <div className=\"h-8 w-8 rounded-lg bg-brand-purple/10 flex items-center justify-center shrink-0 mt-0.5\">\n            <Megaphone className=\"h-3.5 w-3.5 text-brand-purple\" />\n          </div>\n          <div className=\"flex-1 min-w-0\">\n            <div className=\"flex items-center gap-1.5 mb-0.5\">\n              <Pin className=\"h-2.5 w-2.5 text-brand-purple/60\" />\n              <span className=\"text-[10px] font-bold uppercase tracking-widest text-brand-purple/60\">Announcement</span>\n            </div>\n            <p className=\"text-sm font-semibold leading-snug\">{ann.title}</p>\n            <p className=\"text-xs text-muted-foreground mt-0.5 truncate\">{ann.body}</p>\n          </div>\n          <ArrowRight className=\"h-4 w-4 text-muted-foreground group-hover:text-foreground transition-colors shrink-0 mt-1\" />\n        </Link>\n      ))}\n    </div>\n  );\n}\n\nconst PAGE_SIZE = 30;\n\nexport interface ActivitiesFeedProps {\n  getClient: () => MedialaneClient;\n}\n\nexport function ActivitiesFeed({ getClient }: ActivitiesFeedProps) {\n  const [page, setPage] = useState(1);\n  const [typeFilter, setTypeFilter] = useState(\"\");\n  const [allActivities, setAllActivities] = useState<ApiActivity[]>([]);\n  const { data: announcements = [] } = useSWR<Announcement[]>(\n    \"announcements\",\n    fetchAnnouncements,\n    { revalidateOnFocus: false }\n  );\n\n  const prevType = useRef(typeFilter);\n  useEffect(() => {\n    if (prevType.current !== typeFilter) {\n      prevType.current = typeFilter;\n      setPage(1);\n      setAllActivities([]);\n    }\n  }, [typeFilter]);\n\n  const { activities, meta, isLoading } = useActivities(getClient, {\n    limit: PAGE_SIZE,\n    page,\n    type: (typeFilter as ApiActivitiesQuery[\"type\"]) || undefined,\n  });\n\n  useEffect(() => {\n    if (isLoading) return;\n    if (page === 1) {\n      setAllActivities(activities);\n    } else {\n      setAllActivities((prev) => {\n        const existing = new Set(\n          prev.map((a) => `${a.txHash}-${a.type}-${a.nftTokenId ?? \"\"}`)\n        );\n        const newItems = activities.filter(\n          (a) => !existing.has(`${a.txHash}-${a.type}-${a.nftTokenId ?? \"\"}`)\n        );\n        return newItems.length > 0 ? [...prev, ...newItems] : prev;\n      });\n    }\n  }, [activities, isLoading, page]);\n\n  const pageActors = allActivities\n    .map((a) => a.offerer ?? a.fulfiller ?? (a.type === \"mint\" ? a.to : a.from))\n    .filter((a): a is string => Boolean(a));\n  const { data: actorLevels } = useRewardsBatch(getClient, pageActors);\n\n  const isInitialLoading = isLoading && allActivities.length === 0;\n  const isLoadingMore = isLoading && allActivities.length > 0;\n  const hasMore = meta?.total != null ? allActivities.length < meta.total : false;\n  const total = meta?.total ?? null;\n\n  return (\n    <div className=\"space-y-5\">\n      <AnnouncementsBanner announcements={announcements} />\n\n      {total != null && (\n        <div className=\"flex items-center gap-2 text-sm text-muted-foreground\">\n          <span className=\"flex items-center gap-1.5\">\n            <span className=\"h-1.5 w-1.5 rounded-full bg-emerald-500 animate-pulse\" />\n            <span className=\"font-semibold text-foreground tabular-nums\">\n              {total.toLocaleString()}\n            </span>\n            {typeFilter ? `${typeFilter} events` : \"total events\"}\n          </span>\n          {typeFilter && allActivities.length > 0 && (\n            <>\n              <span className=\"text-muted-foreground/40\">·</span>\n              <span>{allActivities.length.toLocaleString()} loaded</span>\n            </>\n          )}\n        </div>\n      )}\n\n      <div className=\"flex flex-wrap gap-2\">\n        {TYPE_FILTERS.map((f) => {\n          const typeConfig = f.value ? ACTIVITY_TYPE_CONFIG[f.value] : null;\n          const Icon = typeConfig?.icon;\n          const isActive = typeFilter === f.value;\n          return (\n            <button\n              key={f.value}\n              onClick={() => setTypeFilter(f.value)}\n              className={cn(\n                \"flex items-center gap-1.5 text-xs px-3 py-1.5 rounded-full border transition-all font-medium\",\n                isActive\n                  ? \"border-primary bg-primary/10 text-primary shadow-sm\"\n                  : \"border-border text-muted-foreground hover:border-primary/40 hover:text-foreground hover:bg-muted/50\"\n              )}\n            >\n              {Icon && (\n                <Icon\n                  className={cn(\n                    \"h-3 w-3\",\n                    isActive ? typeConfig?.colorClass : \"\"\n                  )}\n                />\n              )}\n              {f.label}\n            </button>\n          );\n        })}\n      </div>\n\n      {isInitialLoading ? (\n        <div className=\"divide-y divide-border/50 rounded-xl border border-border overflow-hidden\">\n          {Array.from({ length: 10 }).map((_, i) => (\n            <div key={i} className=\"flex items-center gap-3 px-4 py-3.5 bg-card\">\n              <Skeleton className=\"h-8 w-8 rounded-lg shrink-0\" />\n              <Skeleton className=\"h-9 w-9 rounded-md shrink-0\" />\n              <div className=\"flex-1 space-y-2\">\n                <Skeleton className=\"h-3.5 w-40\" />\n                <Skeleton className=\"h-2.5 w-24\" />\n              </div>\n              <div className=\"flex items-center gap-2.5\">\n                <div className=\"space-y-1 text-right\">\n                  <Skeleton className=\"h-4 w-16\" />\n                  <Skeleton className=\"h-2.5 w-8\" />\n                </div>\n                <Skeleton className=\"h-2.5 w-12 hidden sm:block\" />\n              </div>\n            </div>\n          ))}\n        </div>\n      ) : allActivities.length === 0 ? (\n        <div className=\"py-20 flex flex-col items-center gap-3 text-center\">\n          <div className=\"h-12 w-12 rounded-full bg-muted flex items-center justify-center\">\n            <Zap className=\"h-5 w-5 text-muted-foreground\" />\n          </div>\n          <p className=\"text-muted-foreground\">\n            {typeFilter ? `No ${typeFilter} events yet.` : \"No activity yet.\"}\n          </p>\n        </div>\n      ) : (\n        <div className=\"space-y-4\">\n          <div className=\"divide-y divide-border/50 rounded-xl border border-border overflow-hidden\">\n            {allActivities.map((activity, i) => {\n              const actor = activity.offerer ?? activity.fulfiller ?? (activity.type === \"mint\" ? activity.to : activity.from);\n              return (\n                <ActivityRow\n                  key={`${activity.txHash}-${activity.type}-${activity.nftTokenId ?? i}`}\n                  activity={activity}\n                  showActor\n                  showExplorer\n                  actorLevel={actor ? actorLevels?.get(actor) : undefined}\n                />\n              );\n            })}\n          </div>\n\n          <LoadMoreSentinel\n            hasMore={hasMore}\n            isLoading={isLoadingMore}\n            onLoadMore={() => setPage((p) => p + 1)}\n          />\n        </div>\n      )}\n    </div>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/components/button.d.cts

@@ -3,7 +3,7 @@ import * as React from 'react';
 import { VariantProps } from 'class-variance-authority';
 
 declare const buttonVariants: (props?: ({
-    variant?: "ghost" | "link" | "default" | "destructive" | "outline" | "secondary" | "premium" | "tonal" | "gradient-border" | "gradient-fill" | null | undefined;
+    variant?: "link" | "default" | "destructive" | "outline" | "ghost" | "secondary" | "premium" | "tonal" | "gradient-border" | "gradient-fill" | null | undefined;
     size?: "icon" | "default" | "sm" | "lg" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {

package/dist/components/button.d.ts

@@ -3,7 +3,7 @@ import * as React from 'react';
 import { VariantProps } from 'class-variance-authority';
 
 declare const buttonVariants: (props?: ({
-    variant?: "ghost" | "link" | "default" | "destructive" | "outline" | "secondary" | "premium" | "tonal" | "gradient-border" | "gradient-fill" | null | undefined;
+    variant?: "link" | "default" | "destructive" | "outline" | "ghost" | "secondary" | "premium" | "tonal" | "gradient-border" | "gradient-fill" | null | undefined;
     size?: "icon" | "default" | "sm" | "lg" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {

package/dist/index.cjs

@@ -23,6 +23,7 @@ __export(index_exports, {
   AI_POLICIES: () => import_ip.AI_POLICIES,
   ActionButton: () => import_action_button.ActionButton,
   ActionDialog: () => import_action_dialog.ActionDialog,
+  ActivitiesFeed: () => import_activities_feed.ActivitiesFeed,
   ActivityCard: () => import_activity_card.ActivityCard,
   ActivityCardSkeleton: () => import_activity_card.ActivityCardSkeleton,
   ActivityFeedShell: () => import_activity_feed_shell.ActivityFeedShell,
@@ -153,6 +154,7 @@ __export(index_exports, {
   FormMessage: () => import_form.FormMessage,
   GATED_CONTENT_TYPES: () => import_gated_content_types.GATED_CONTENT_TYPES,
   GATED_CONTENT_TYPE_FALLBACK: () => import_gated_content_types.GATED_CONTENT_TYPE_FALLBACK,
+  GENERIC: () => import_describe_error.GENERIC,
   GEOGRAPHIC_SCOPES: () => import_ip.GEOGRAPHIC_SCOPES,
   GradientButton: () => import_gradient_button.GradientButton,
   HelpIcon: () => import_help_icon.HelpIcon,
@@ -204,9 +206,11 @@ __export(index_exports, {
   MedialaneCollectionCard: () => import_medialane_collection_card.MedialaneCollectionCard,
   MedialaneLogoFull: () => import_brand_logo.MedialaneLogoFull,
   MotionCard: () => import_motion_primitives.MotionCard,
+  NETWORK_BUSY: () => import_describe_error.NETWORK_BUSY,
   NOTIFICATION_COLOR: () => import_notification_meta.NOTIFICATION_COLOR,
   NOTIFICATION_ICON: () => import_notification_meta.NOTIFICATION_ICON,
   NOTIFICATION_LABEL: () => import_notification_meta.NOTIFICATION_LABEL,
+  NOT_SUBMITTED: () => import_describe_error.NOT_SUBMITTED,
   NavAccountSheet: () => import_nav_shell.NavAccountSheet,
   NavBrandButton: () => import_nav_shell.NavBrandButton,
   NavCommandMenu: () => import_nav_command_menu.NavCommandMenu,
@@ -285,6 +289,7 @@ __export(index_exports, {
   TokenCard: () => import_token_card.TokenCard,
   TokenCardSkeleton: () => import_token_card.TokenCardSkeleton,
   TokenGlyph: () => import_token_glyph.TokenGlyph,
+  UserFacingError: () => import_describe_error.UserFacingError,
   WrongNetworkError: () => import_wallet_error.WrongNetworkError,
   XpEarned: () => import_xp_earned.XpEarned,
   XpProgress: () => import_xp_progress.XpProgress,
@@ -302,6 +307,7 @@ __export(index_exports, {
   coinSupply: () => import_coins.coinSupply,
   createRewardEarned: () => import_reward_earned.createRewardEarned,
   derivePortfolioCounts: () => import_portfolio_counts.derivePortfolioCounts,
+  describeError: () => import_describe_error.describeError,
   dropCreateSchema: () => import_drop_create_schema.dropCreateSchema,
   fdvUsd: () => import_coins.fdvUsd,
   feeLabelFor: () => import_self_fund_consent_dialog.feeLabelFor,
@@ -318,7 +324,6 @@ __export(index_exports, {
   getDefaultClaimWindow: () => import_launchpad_defaults.getDefaultClaimWindow,
   getDefaultDropSchedule: () => import_launchpad_defaults.getDefaultDropSchedule,
   getDropStatus: () => import_drop_status.getDropStatus,
-  getFriendlyWalletError: () => import_wallet_error.getFriendlyWalletError,
   getReadIds: () => import_notification_storage.getReadIds,
   ipfsToHttp: () => import_ipfs.ipfsToHttp,
   isBareExecuteFailure: () => import_wallet_error.isBareExecuteFailure,
@@ -400,6 +405,7 @@ var import_use_intersection_active = require("./utils/use-intersection-active.js
 var import_notification_storage = require("./utils/notification-storage.js");
 var import_license_summary = require("./utils/license-summary.js");
 var import_wallet_error = require("./utils/wallet-error.js");
+var import_describe_error = require("./utils/describe-error.js");
 var import_ip_types = require("./data/ip-types.js");
 var import_ip = require("./data/ip.js");
 var import_ip_templates = require("./data/ip-templates.js");
@@ -495,6 +501,7 @@ var import_badge_catalog = require("./components/rewards/badge-catalog.js");
 var import_xp_earned = require("./components/rewards/xp-earned.js");
 var import_reward_earned = require("./components/rewards/reward-earned.js");
 var import_load_more_sentinel = require("./components/load-more-sentinel.js");
+var import_activities_feed = require("./components/activities-feed.js");
 var import_rewards_section = require("./components/rewards-section.js");
 var import_action_button = require("./components/action-button.js");
 var import_gradient_button = require("./components/gradient-button.js");
@@ -572,6 +579,7 @@ var import_export_key_section = require("./components/wallet/export-key-section.
   AI_POLICIES,
   ActionButton,
   ActionDialog,
+  ActivitiesFeed,
   ActivityCard,
   ActivityCardSkeleton,
   ActivityFeedShell,
@@ -702,6 +710,7 @@ var import_export_key_section = require("./components/wallet/export-key-section.
   FormMessage,
   GATED_CONTENT_TYPES,
   GATED_CONTENT_TYPE_FALLBACK,
+  GENERIC,
   GEOGRAPHIC_SCOPES,
   GradientButton,
   HelpIcon,
@@ -753,9 +762,11 @@ var import_export_key_section = require("./components/wallet/export-key-section.
   MedialaneCollectionCard,
   MedialaneLogoFull,
   MotionCard,
+  NETWORK_BUSY,
   NOTIFICATION_COLOR,
   NOTIFICATION_ICON,
   NOTIFICATION_LABEL,
+  NOT_SUBMITTED,
   NavAccountSheet,
   NavBrandButton,
   NavCommandMenu,
@@ -834,6 +845,7 @@ var import_export_key_section = require("./components/wallet/export-key-section.
   TokenCard,
   TokenCardSkeleton,
   TokenGlyph,
+  UserFacingError,
   WrongNetworkError,
   XpEarned,
   XpProgress,
@@ -851,6 +863,7 @@ var import_export_key_section = require("./components/wallet/export-key-section.
   coinSupply,
   createRewardEarned,
   derivePortfolioCounts,
+  describeError,
   dropCreateSchema,
   fdvUsd,
   feeLabelFor,
@@ -867,7 +880,6 @@ var import_export_key_section = require("./components/wallet/export-key-section.
   getDefaultClaimWindow,
   getDefaultDropSchedule,
   getDropStatus,
-  getFriendlyWalletError,
   getReadIds,
   ipfsToHttp,
   isBareExecuteFailure,