Refactor activity feed cards for financial events and related-work API updates

app/activity/page.tsx

@@ -8,7 +8,7 @@
 import { HeroHeader } from '@/components/ui/HeroHeader';
 import { PillTabs } from '@/components/ui/PillTabs';
 import { ActivityCardFull } from '@/components/Activity/ActivityCardFull';
-import { ActivityCardSkeletonList } from '@/components/Activity/ActivityCardSkeleton';
+import { ActivityCardSkeleton } from '@/components/Activity/ActivityCardSkeleton';
 import { useActivityFeed, ActivityTab } from '@/hooks/useActivityFeed';
 import { ActivityScope } from '@/services/activity.service';
 import { GrantService } from '@/services/grant.service';
@@ -106,7 +106,8 @@
             <ActivityCardFull key={entry.id} entry={entry} />
           ))}
 
-          {(isLoading || isLoadingMore) && <ActivityCardSkeletonList />}
+          {(isLoading || isLoadingMore) &&
+            [...Array(6)].map((_, i) => <ActivityCardSkeleton key={i} />)}
 
           {!isLoading && !isLoadingMore && entries.length === 0 && (
             <div className="py-12 text-center">

app/fund/activity/FundActivityPageContent.tsx

@@ -0,0 +1,39 @@
+'use client';
+
+import { useInView } from 'react-intersection-observer';
+import { ActivityCardFull } from '@/components/Activity/ActivityCardFull';
+import { ActivityCardSkeleton } from '@/components/Activity/ActivityCardSkeleton';
+import { useActivityFeed } from '@/hooks/useActivityFeed';
+
+export function FundActivityPageContent() {
+  const { entries, isLoading, isLoadingMore, hasMore, loadMore } = useActivityFeed({});
+
+  const { ref: sentinelRef } = useInView({
+    threshold: 0,
+    rootMargin: '200px',
+    onChange: (inView) => {
+      if (inView && hasMore && !isLoading && !isLoadingMore) {
+        loadMore();
+      }
+    },
+  });
+
+  return (
+    <div>
+      {entries.map((entry) => (
+        <ActivityCardFull key={entry.id} entry={entry} />
+      ))}
+
+      {(isLoading || isLoadingMore) &&
+        [...Array(6)].map((_, i) => <ActivityCardSkeleton key={i} />)}
+
+      {!isLoading && !isLoadingMore && entries.length === 0 && (
+        <div className="py-12 text-center">
+          <p className="text-gray-500">No activity found</p>
+        </div>
+      )}
+
+      {!isLoading && !isLoadingMore && hasMore && <div ref={sentinelRef} className="h-10" />}
+    </div>
+  );
+}

app/fund/activity/loading.tsx

@@ -0,0 +1,16 @@
+import { PageLayout } from '@/app/layouts/PageLayout';
+import { FundingBannerSkeleton } from '@/components/Funding/FundingBannerSkeleton';
+import { ActivityCardSkeleton } from '@/components/Activity/ActivityCardSkeleton';
+import { FundSidebar } from '@/components/Funding/FundSidebar';
+
+export default function FundActivityLoading() {
+  return (
+    <PageLayout topBanner={<FundingBannerSkeleton showTabs />} rightSidebar={<FundSidebar />}>
+      <div>
+        {[...Array(6)].map((_, i) => (
+          <ActivityCardSkeleton key={i} />
+        ))}
+      </div>
+    </PageLayout>
+  );
+}

app/fund/activity/page.tsx

@@ -0,0 +1,39 @@
+import { Metadata } from 'next';
+import { buildOpenGraphMetadata } from '@/lib/metadata';
+import { PageLayout } from '@/app/layouts/PageLayout';
+import { HeroHeader } from '@/components/ui/HeroHeader';
+import { MarketplaceCards } from '@/components/Funding/MarketplaceCards';
+import { FundingHeroPanel } from '@/components/Funding/FundingHeroPanel';
+import { OpenFundingOpportunityCTA } from '../OpenFundingOpportunityCTA';
+import { FundActivityPageContent } from './FundActivityPageContent';
+import { FundSidebar } from '@/components/Funding/FundSidebar';
+
+export const metadata: Metadata = buildOpenGraphMetadata({
+  title: 'Activity',
+  description: 'Recent activity across funding opportunities and proposals.',
+  url: '/fund/activity',
+});
+
+export default async function FundActivityPage() {
+  return (
+    <PageLayout
+      topBanner={
+        <HeroHeader
+          title="Activity"
+          subtitle={
+            <p className="text-sm sm:text-base text-gray-500">
+              Recent activity across funding opportunities and proposals.
+            </p>
+          }
+          cta={<FundingHeroPanel primaryCta={<OpenFundingOpportunityCTA />} />}
+          alignTop
+        >
+          <MarketplaceCards selected="activity" />
+        </HeroHeader>
+      }
+      rightSidebar={<FundSidebar />}
+    >
+      <FundActivityPageContent />
+    </PageLayout>
+  );
+}

app/fund/loading.tsx

@@ -1,20 +1,16 @@
 import { PageLayout } from '@/app/layouts/PageLayout';
-import { ActivitySidebarSkeleton } from '@/components/Funding/ActivitySidebarSkeleton';
 import { FundingBannerSkeleton } from '@/components/Funding/FundingBannerSkeleton';
 import { FeedItemSkeleton } from '@/components/Feed/FeedItemSkeleton';
+import { FundSidebar } from '@/components/Funding/FundSidebar';
 
 export default function FundLoading() {
   return (
-    <PageLayout
-      topBanner={<FundingBannerSkeleton showTabs />}
-      rightSidebar={<ActivitySidebarSkeleton />}
-    >
+    <PageLayout topBanner={<FundingBannerSkeleton showTabs />} rightSidebar={<FundSidebar />}>
       <div>
         <div className="flex items-center justify-end mt-2 sm:mt-4 mb-2">
           <div className="h-5 w-24 rounded bg-gray-200 animate-pulse" />
         </div>
 
-        {/* Feed skeletons */}
         <div className="mt-4 space-y-8">
           {Array.from({ length: 3 }, (_, i) => (
             <FeedItemSkeleton key={i} variant="grant" />

app/fund/page.tsx

@@ -1,17 +1,15 @@
-import { Suspense } from 'react';
 import { Metadata } from 'next';
 import { buildOpenGraphMetadata } from '@/lib/metadata';
 import { PageLayout } from '@/app/layouts/PageLayout';
-import { FundingSidebarServer } from '@/components/Funding/FundingSidebarServer';
-import { ActivitySidebarSkeleton } from '@/components/Funding/ActivitySidebarSkeleton';
 import { HeroHeader } from '@/components/ui/HeroHeader';
 import { FundGrantsPageContent } from './FundGrantsPageContent';
 import { MarketplaceCards } from '@/components/Funding/MarketplaceCards';
 import { FundingHeroPanel } from '@/components/Funding/FundingHeroPanel';
 import { OpenFundingOpportunityCTA } from './OpenFundingOpportunityCTA';
+import { FundSidebar } from '@/components/Funding/FundSidebar';
 
 export const metadata: Metadata = buildOpenGraphMetadata({
-  title: 'Funding Opportunities',
+  title: 'Request for Proposals',
   description: 'Apply for funding opportunities via proposals.',
   url: '/fund',
 });
@@ -21,7 +19,7 @@ export default async function FundPage() {
     <PageLayout
       topBanner={
         <HeroHeader
-          title="Funding Opportunities"
+          title="Request for Proposals"
           subtitle={
             <p className="text-sm sm:text-base text-gray-500">
               Apply for funding opportunities via proposals.
@@ -33,11 +31,7 @@ export default async function FundPage() {
           <MarketplaceCards selected="grants" />
         </HeroHeader>
       }
-      rightSidebar={
-        <Suspense fallback={<ActivitySidebarSkeleton />}>
-          <FundingSidebarServer />
-        </Suspense>
-      }
+      rightSidebar={<FundSidebar />}
     >
       <section className="sr-only">
         <p>

app/fund/proposals/loading.tsx

@@ -1,14 +1,11 @@
 import { PageLayout } from '@/app/layouts/PageLayout';
-import { ActivitySidebarSkeleton } from '@/components/Funding/ActivitySidebarSkeleton';
 import { FundingBannerSkeleton } from '@/components/Funding/FundingBannerSkeleton';
 import { FeedItemSkeleton } from '@/components/Feed/FeedItemSkeleton';
+import { FundSidebar } from '@/components/Funding/FundSidebar';
 
 export default function FundProposalsLoading() {
   return (
-    <PageLayout
-      topBanner={<FundingBannerSkeleton showTabs />}
-      rightSidebar={<ActivitySidebarSkeleton />}
-    >
+    <PageLayout topBanner={<FundingBannerSkeleton showTabs />} rightSidebar={<FundSidebar />}>
       <div>
         <div className="flex items-center justify-end mt-2 sm:mt-4 mb-2">
           <div className="h-4 w-24 rounded bg-gray-200 animate-pulse" />

app/fund/proposals/page.tsx

@@ -1,18 +1,16 @@
-import { Suspense } from 'react';
 import { Metadata } from 'next';
 import Link from 'next/link';
 import { ArrowUpFromLine } from 'lucide-react';
 import { buildOpenGraphMetadata } from '@/lib/metadata';
 import { PageLayout } from '@/app/layouts/PageLayout';
 import { ProposalFeed } from '@/components/Funding/ProposalFeed';
 import { ProposalSortAndFilters } from '@/components/Funding/ProposalSortAndFilters';
-import { FundingSidebarServer } from '@/components/Funding/FundingSidebarServer';
-import { ActivitySidebarSkeleton } from '@/components/Funding/ActivitySidebarSkeleton';
 import { HeroHeader } from '@/components/ui/HeroHeader';
 import { Button } from '@/components/ui/Button';
 import { SubmitProposalTooltip } from '@/components/tooltips/SubmitProposalTooltip';
 import { MarketplaceCards } from '@/components/Funding/MarketplaceCards';
 import { FundingHeroPanel } from '@/components/Funding/FundingHeroPanel';
+import { FundSidebar } from '@/components/Funding/FundSidebar';
 
 export const metadata: Metadata = buildOpenGraphMetadata({
   title: 'Proposals',
@@ -54,11 +52,7 @@ export default async function FundProposalsPage() {
           <MarketplaceCards selected="proposals" />
         </HeroHeader>
       }
-      rightSidebar={
-        <Suspense fallback={<ActivitySidebarSkeleton />}>
-          <FundingSidebarServer />
-        </Suspense>
-      }
+      rightSidebar={<FundSidebar />}
     >
       <div>
         <ProposalSortAndFilters />

app/grant/[id]/[slug]/page.tsx

@@ -38,15 +38,10 @@
   const work = await getGrant(id);
 
   const grant = work.note?.post?.grant;
   const grantId = grant?.id ?? undefined;
 
   return (
-    <GrantContentSwitcher
-      content={work.previewContent}
-      imageUrl={work.image}
-      hasDescription={!!grant?.description}
-      grantId={grantId}
-    >
+    <GrantContentSwitcher content={work.previewContent} imageUrl={work.image}>
       {grant?.description && <ProposalSortAndFilters />}
       <ProposalFeed />
     </GrantContentSwitcher>

app/layouts/topbar/pageRoutes.tsx

@@ -28,6 +28,7 @@ export const ROOT_NAVIGATION_PATHS = new Set([
   '/earn',
   '/fund',
   '/fund/proposals',
+  '/fund/activity',
   '/journal',
   '/notebook',
   '/browse',

app/sitemap.ts

@@ -71,6 +71,7 @@ const STATIC_ROUTES: MetadataRoute.Sitemap = [
   { url: `${SITE_URL}/latest`, changeFrequency: 'hourly', priority: 0.8 },
   { url: `${SITE_URL}/fund`, changeFrequency: 'daily', priority: 0.8 },
   { url: `${SITE_URL}/fund/proposals`, changeFrequency: 'daily', priority: 0.7 },
+  { url: `${SITE_URL}/fund/activity`, changeFrequency: 'hourly', priority: 0.7 },
   { url: `${SITE_URL}/earn`, changeFrequency: 'daily', priority: 0.8 },
   { url: `${SITE_URL}/grants`, changeFrequency: 'daily', priority: 0.7 },
   { url: `${SITE_URL}/journal`, changeFrequency: 'daily', priority: 0.7 },