From 5a4f43783ae2db54426f176fd6133ef5f71ffbd4 Mon Sep 17 00:00:00 2001
From: dc <eopoxf@gmail.com>
Date: Mon, 20 Jul 2026 12:54:44 +0530
Subject: [PATCH 1/2] feat(publications): add the Resource frontend (detail,
 listing, authoring, linking)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Read side:
- (user)/publications/[id]: detail page with inline PDF + YouTube and download
  cards for other file types; Explore listing at /publications; 'Resources'
  entry in the Explore nav.
- Unified search: publication type + detail redirect.

Authoring (dashboard):
- publications list + Create; create/edit shell (Metadata / Content / Publish
  tabs) with a shared typed metadata form (title, abstract, authors, date,
  license, Resource Type, sectors, geographies, external link — a normal form,
  not the dynamic-metadata renderer); block editor (YouTube + file dropzone,
  reorder, remove); publish toggle + 'linked to N' flag.
- Resources sidebar entry on the dashboard.

Linking:
- PublicationLinkPicker embedded in the Use Case & Collaborative assign pages
  (published resources only).

Infra: single RESOURCE_LABEL constant (UI says 'Resource', code says
publication); codegen documents glob widened to include components/. Verified:
codegen + tsc (zero new errors) + eslint clean.
---
 .../PublicationDetailsPage.tsx                | 139 ++++++++++
 .../[publicationId]/components/Blocks.tsx     | 113 ++++++++
 .../[publicationId]/components/Metadata.tsx   |  46 ++++
 .../components/PrimaryData.tsx                |  51 ++++
 .../publications/[publicationId]/page.tsx     |  41 +++
 app/[locale]/(user)/publications/page.tsx     |  56 ++++
 .../components/UnifiedListingComponent.tsx    |   6 +-
 .../collaboratives/edit/[id]/assign/page.tsx  |   2 +
 .../[entityType]/[entitySlug]/layout.tsx      |   7 +-
 .../[entitySlug]/publications/create/page.tsx |  76 ++++++
 .../publications/edit/[id]/blocks/page.tsx    | 231 ++++++++++++++++
 .../publications/edit/[id]/metadata/page.tsx  | 117 +++++++++
 .../publications/edit/[id]/page.tsx           |  22 ++
 .../publications/edit/[id]/publish/page.tsx   | 144 ++++++++++
 .../publications/edit/context.tsx             |  34 +++
 .../[entitySlug]/publications/edit/layout.tsx |  62 +++++
 .../[entitySlug]/publications/page.tsx        |  71 +++++
 .../usecases/edit/[id]/assign/page.tsx        |   2 +
 .../dashboard/components/main-nav.tsx         |   4 +
 components/publications/PublicationForm.tsx   | 246 ++++++++++++++++++
 .../publications/PublicationLinkPicker.tsx    | 177 +++++++++++++
 config/codegen.ts                             |   2 +-
 lib/constants/resourceLabel.ts                |  11 +
 23 files changed, 1655 insertions(+), 5 deletions(-)
 create mode 100644 app/[locale]/(user)/publications/[publicationId]/PublicationDetailsPage.tsx
 create mode 100644 app/[locale]/(user)/publications/[publicationId]/components/Blocks.tsx
 create mode 100644 app/[locale]/(user)/publications/[publicationId]/components/Metadata.tsx
 create mode 100644 app/[locale]/(user)/publications/[publicationId]/components/PrimaryData.tsx
 create mode 100644 app/[locale]/(user)/publications/[publicationId]/page.tsx
 create mode 100644 app/[locale]/(user)/publications/page.tsx
 create mode 100644 app/[locale]/dashboard/[entityType]/[entitySlug]/publications/create/page.tsx
 create mode 100644 app/[locale]/dashboard/[entityType]/[entitySlug]/publications/edit/[id]/blocks/page.tsx
 create mode 100644 app/[locale]/dashboard/[entityType]/[entitySlug]/publications/edit/[id]/metadata/page.tsx
 create mode 100644 app/[locale]/dashboard/[entityType]/[entitySlug]/publications/edit/[id]/page.tsx
 create mode 100644 app/[locale]/dashboard/[entityType]/[entitySlug]/publications/edit/[id]/publish/page.tsx
 create mode 100644 app/[locale]/dashboard/[entityType]/[entitySlug]/publications/edit/context.tsx
 create mode 100644 app/[locale]/dashboard/[entityType]/[entitySlug]/publications/edit/layout.tsx
 create mode 100644 app/[locale]/dashboard/[entityType]/[entitySlug]/publications/page.tsx
 create mode 100644 components/publications/PublicationForm.tsx
 create mode 100644 components/publications/PublicationLinkPicker.tsx
 create mode 100644 lib/constants/resourceLabel.ts

diff --git a/app/[locale]/(user)/publications/[publicationId]/PublicationDetailsPage.tsx b/app/[locale]/(user)/publications/[publicationId]/PublicationDetailsPage.tsx
new file mode 100644
index 00000000..368a2655
--- /dev/null
+++ b/app/[locale]/(user)/publications/[publicationId]/PublicationDetailsPage.tsx
@@ -0,0 +1,139 @@
+'use client';
+
+import { graphql } from '@/gql';
+import { useQuery } from '@tanstack/react-query';
+import { Spinner, Text } from 'opub-ui';
+
+import BreadCrumbs from '@/components/BreadCrumbs';
+import JsonLd from '@/components/JsonLd';
+import { RESOURCE_LABEL, RESOURCE_PATH } from '@/lib/constants/resourceLabel';
+import { GraphQL } from '@/lib/api';
+import { generateJsonLd } from '@/lib/utils';
+import { Blocks } from './components/Blocks';
+import { Metadata } from './components/Metadata';
+import { PrimaryData } from './components/PrimaryData';
+
+const publicationQuery = graphql(`
+  query getPublication($publicationId: UUID!) {
+    getPublication(publicationId: $publicationId) {
+      id
+      title
+      description
+      slug
+      status
+      authors
+      publicationDate
+      license
+      externalSourceLink
+      downloadCount
+      created
+      modified
+      resourceType {
+        id
+        name
+      }
+      organization {
+        id
+        name
+        logo {
+          url
+        }
+      }
+      user {
+        id
+        fullName
+        profilePicture {
+          url
+        }
+      }
+      sectors {
+        id
+        name
+      }
+      geographies {
+        id
+        name
+      }
+      blocks {
+        id
+        position
+        blockType
+        fileName
+        fileFormat
+        fileSize
+        youtubeUrl
+        youtubeVideoId
+      }
+    }
+  }
+`);
+
+export default function PublicationDetailsPage({
+  publicationId,
+}: {
+  publicationId: string;
+}) {
+  const { data, isLoading, error } = useQuery(
+    ['publication_details', publicationId],
+    () => GraphQL(publicationQuery, {}, { publicationId }),
+    { retry: false }
+  );
+
+  const publication = data?.getPublication;
+
+  const jsonLd = generateJsonLd({
+    '@context': 'https://schema.org',
+    '@type': 'CreativeWork',
+    name: publication?.title,
+    url: `${process.env.NEXT_PUBLIC_PLATFORM_URL}${RESOURCE_PATH}/${publicationId}`,
+    description: publication?.description,
+    publisher: {
+      '@type': 'Organization',
+      name: 'CivicDataSpace',
+      url: `${process.env.NEXT_PUBLIC_PLATFORM_URL}`,
+    },
+  });
+
+  return (
+    <>
+      <JsonLd json={jsonLd} />
+      <main className="bg-surfaceDefault">
+        <BreadCrumbs
+          data={[
+            { href: '/', label: 'Home' },
+            { href: RESOURCE_PATH, label: RESOURCE_LABEL + 's' },
+            { href: '#', label: `${RESOURCE_LABEL} Details` },
+          ]}
+        />
+        <div className="flex">
+          <div className="w-full gap-10 border-r-2 border-solid border-greyExtralight p-6 lg:w-3/4 lg:p-10">
+            {isLoading ? (
+              <div className="mt-8 flex justify-center">
+                <Spinner />
+              </div>
+            ) : error ? (
+              <div className="mt-8 flex flex-col items-center gap-4">
+                <Text variant="heading2xl">Error loading {RESOURCE_LABEL}</Text>
+                <Text variant="bodyMd" className="text-textSubdued">
+                  {error instanceof Error ? error.message : 'Failed to fetch'}
+                </Text>
+              </div>
+            ) : publication ? (
+              <>
+                <PrimaryData data={publication} />
+                <Blocks blocks={publication.blocks} />
+              </>
+            ) : (
+              <div className="mt-8 flex justify-center">
+                <Text variant="heading2xl">{RESOURCE_LABEL} not found</Text>
+              </div>
+            )}
+          </div>
+          <div className="hidden w-1/4 gap-10 px-7 py-10 lg:block">
+            {!isLoading && publication && <Metadata data={publication} />}
+          </div>
+        </div>
+      </main>
+    </>
+  );
+}
diff --git a/app/[locale]/(user)/publications/[publicationId]/components/Blocks.tsx b/app/[locale]/(user)/publications/[publicationId]/components/Blocks.tsx
new file mode 100644
index 00000000..257a0176
--- /dev/null
+++ b/app/[locale]/(user)/publications/[publicationId]/components/Blocks.tsx
@@ -0,0 +1,113 @@
+'use client';
+
+import { Button, Text } from 'opub-ui';
+
+import { RESOURCE_LABEL } from '@/lib/constants/resourceLabel';
+
+type Block = {
+  id: string;
+  position: number;
+  blockType: string;
+  fileName: string;
+  fileFormat: string;
+  fileSize?: number | null;
+  youtubeUrl?: string | null;
+  youtubeVideoId: string;
+};
+
+/** The gated download URL for a block's file (draft files are access-checked). */
+function blockDownloadUrl(blockId: string): string {
+  return `${process.env.NEXT_PUBLIC_BACKEND_URL}/api/publications/blocks/${blockId}/download/`;
+}
+
+/** Human-readable file size. */
+function formatSize(bytes?: number | null): string {
+  if (!bytes) return '';
+  const mb = bytes / (1024 * 1024);
+  if (mb >= 1) return `${mb.toFixed(1)} MB`;
+  return `${Math.max(1, Math.round(bytes / 1024))} KB`;
+}
+
+function YoutubeBlock({ videoId }: { videoId: string }) {
+  return (
+    <div className="relative w-full overflow-hidden rounded-md" style={{ paddingTop: '56.25%' }}>
+      <iframe
+        className="absolute left-0 top-0 h-full w-full"
+        src={`https://www.youtube.com/embed/${videoId}`}
+        title="YouTube video"
+        allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
+        allowFullScreen
+      />
+    </div>
+  );
+}
+
+function PdfBlock({ blockId, fileName }: { blockId: string; fileName: string }) {
+  return (
+    <div className="flex flex-col gap-2">
+      <iframe
+        className="h-[600px] w-full rounded-md border border-solid border-greyExtralight"
+        src={blockDownloadUrl(blockId)}
+        title={fileName}
+      />
+      <a href={blockDownloadUrl(blockId)} download>
+        <Button variant="basic">Download {fileName}</Button>
+      </a>
+    </div>
+  );
+}
+
+function FileCard({ block }: { block: Block }) {
+  return (
+    <div className="flex items-center justify-between rounded-md border border-solid border-greyExtralight p-4">
+      <div className="flex flex-col">
+        <Text variant="bodyMd" fontWeight="medium">
+          {block.fileName}
+        </Text>
+        <Text variant="bodySm" className="text-textSubdued">
+          {block.fileFormat.toUpperCase()} {formatSize(block.fileSize)}
+        </Text>
+      </div>
+      <a href={blockDownloadUrl(block.id)} download>
+        <Button variant="basic">Download</Button>
+      </a>
+    </div>
+  );
+}
+
+function BlockView({ block }: { block: Block }) {
+  if (block.blockType === 'YOUTUBE') {
+    return <YoutubeBlock videoId={block.youtubeVideoId} />;
+  }
+  if (block.fileFormat.toLowerCase() === 'pdf') {
+    return <PdfBlock blockId={block.id} fileName={block.fileName} />;
+  }
+  return <FileCard block={block} />;
+}
+
+/**
+ * Renders a resource's ordered content blocks. PDFs and YouTube videos play
+ * inline; every other file type shows a download card. A resource with no
+ * blocks renders an empty section (zero-block publish is allowed).
+ */
+export function Blocks({ blocks }: { blocks: Block[] }) {
+  const ordered = [...(blocks ?? [])].sort((a, b) => a.position - b.position);
+
+  if (ordered.length === 0) {
+    return (
+      <div className="mt-8">
+        <Text variant="bodyMd" className="text-textSubdued">
+          This {RESOURCE_LABEL} has no content yet.
+        </Text>
+      </div>
+    );
+  }
+
+  return (
+    <div className="mt-8 flex flex-col gap-6">
+      {ordered.map((block) => (
+        <BlockView key={block.id} block={block} />
+      ))}
+    </div>
+  );
+}
diff --git a/app/[locale]/(user)/publications/[publicationId]/components/Metadata.tsx b/app/[locale]/(user)/publications/[publicationId]/components/Metadata.tsx
new file mode 100644
index 00000000..e6688270
--- /dev/null
+++ b/app/[locale]/(user)/publications/[publicationId]/components/Metadata.tsx
@@ -0,0 +1,46 @@
+'use client';
+
+import { Text } from 'opub-ui';
+
+type Tag = { id: string; name: string };
+type PublicationMeta = {
+  license: string;
+  downloadCount: number;
+  sectors: Tag[];
+  geographies: Tag[];
+  organization?: { name: string } | null;
+  user?: { fullName?: string | null } | null;
+};
+
+function Row({ label, value }: { label: string; value: React.ReactNode }) {
+  return (
+    <div className="flex flex-col gap-1 border-b border-solid border-greyExtralight py-3">
+      <Text variant="bodySm" className="uppercase text-textSubdued">
+        {label}
+      </Text>
+      <Text variant="bodyMd">{value}</Text>
+    </div>
+  );
+}
+
+/** The right-rail metadata panel: owner, license, tags and download count. */
+export function Metadata({ data }: { data: PublicationMeta }) {
+  const owner = data.organization?.name || data.user?.fullName || 'Individual';
+
+  return (
+    <div className="flex flex-col">
+      <Row label="Published by" value={owner} />
+      <Row label="License" value={data.license} />
+      {data.sectors?.length > 0 && (
+        <Row label="Sectors" value={data.sectors.map((s) => s.name).join(', ')} />
+      )}
+      {data.geographies?.length > 0 && (
+        <Row
+          label="Geographies"
+          value={data.geographies.map((g) => g.name).join(', ')}
+        />
+      )}
+      <Row label="Downloads" value={data.downloadCount} />
+    </div>
+  );
+}
diff --git a/app/[locale]/(user)/publications/[publicationId]/components/PrimaryData.tsx b/app/[locale]/(user)/publications/[publicationId]/components/PrimaryData.tsx
new file mode 100644
index 00000000..2db4c239
--- /dev/null
+++ b/app/[locale]/(user)/publications/[publicationId]/components/PrimaryData.tsx
@@ -0,0 +1,51 @@
+'use client';
+
+import { Text } from 'opub-ui';
+
+type PublicationData = {
+  title: string;
+  description?: string | null;
+  authors: string[];
+  publicationDate?: string | null;
+  externalSourceLink?: string | null;
+  resourceType?: { name: string } | null;
+};
+
+/** Title, abstract, authors and the external source link — the resource's headline. */
+export function PrimaryData({ data }: { data: PublicationData }) {
+  return (
+    <div className="flex flex-col gap-4">
+      {data.resourceType?.name && (
+        <Text variant="bodySm" className="uppercase text-textSubdued">
+          {data.resourceType.name}
+        </Text>
+      )}
+      <Text variant="heading2xl">{data.title}</Text>
+      {data.authors?.length > 0 && (
+        <Text variant="bodyMd" className="text-textSubdued">
+          By {data.authors.join(', ')}
+        </Text>
+      )}
+      {data.publicationDate && (
+        <Text variant="bodySm" className="text-textSubdued">
+          {data.publicationDate}
+        </Text>
+      )}
+      {data.description && (
+        <Text variant="bodyMd" className="whitespace-pre-line">
+          {data.description}
+        </Text>
+      )}
+      {data.externalSourceLink && (
+        <a
+          href={data.externalSourceLink}
+          target="_blank"
+          rel="noreferrer"
+          className="text-actionPrimaryDefault underline"
+        >
+          External source
+        </a>
+      )}
+    </div>
+  );
+}
diff --git a/app/[locale]/(user)/publications/[publicationId]/page.tsx b/app/[locale]/(user)/publications/[publicationId]/page.tsx
new file mode 100644
index 00000000..e64eb607
--- /dev/null
+++ b/app/[locale]/(user)/publications/[publicationId]/page.tsx
@@ -0,0 +1,41 @@
+import { use } from 'react';
+
+import { RESOURCE_LABEL, RESOURCE_PATH } from '@/lib/constants/resourceLabel';
+import { generatePageMetadata } from '@/lib/utils';
+import PublicationDetailsPage from './PublicationDetailsPage';
+
+export async function generateMetadata({
+  params,
+}: {
+  params: Promise<{ publicationId: string }>;
+}) {
+  try {
+    const { publicationId } = await params;
+    return generatePageMetadata({
+      title: `${RESOURCE_LABEL} Details | CivicDataSpace`,
+      description: `Explore a ${RESOURCE_LABEL.toLowerCase()} — reports, research and findings.`,
+      keywords: [RESOURCE_LABEL, 'Report', 'Research', 'Publication'],
+      openGraph: {
+        type: 'website',
+        locale: 'en_US',
+        url: `${process.env.NEXT_PUBLIC_PLATFORM_URL}${RESOURCE_PATH}/${publicationId}`,
+        title: `${RESOURCE_LABEL} Details`,
+        description: `Explore a ${RESOURCE_LABEL.toLowerCase()}.`,
+        siteName: 'CivicDataSpace',
+        image: `${process.env.NEXT_PUBLIC_PLATFORM_URL}/og.png`,
+      },
+    });
+  } catch (e) {
+    console.error('Metadata fetch error', e);
+    return generatePageMetadata({ title: `${RESOURCE_LABEL} Details` });
+  }
+}
+
+export default function Page({
+  params,
+}: {
+  params: Promise<{ publicationId: string }>;
+}) {
+  const { publicationId } = use(params);
+  return <PublicationDetailsPage publicationId={publicationId} />;
+}
diff --git a/app/[locale]/(user)/publications/page.tsx b/app/[locale]/(user)/publications/page.tsx
new file mode 100644
index 00000000..5f5ccb9a
--- /dev/null
+++ b/app/[locale]/(user)/publications/page.tsx
@@ -0,0 +1,56 @@
+import React from 'react';
+
+import JsonLd from '@/components/JsonLd';
+import { RESOURCE_LABEL, RESOURCE_LABEL_PLURAL, RESOURCE_PATH } from '@/lib/constants/resourceLabel';
+import { generateJsonLd, generatePageMetadata } from '@/lib/utils';
+import ListingComponent from '../components/ListingComponent';
+
+export const generateMetadata = () =>
+  generatePageMetadata({
+    title: `Browse ${RESOURCE_LABEL_PLURAL} | CivicDataSpace`,
+    description: `Discover reports, research and findings published as ${RESOURCE_LABEL_PLURAL}. Filter by ${RESOURCE_LABEL} Type, sector and geography.`,
+    keywords: [RESOURCE_LABEL_PLURAL, 'Reports', 'Research', 'Findings', 'Publications'],
+    openGraph: {
+      type: 'website',
+      locale: 'en_US',
+      url: `${process.env.NEXT_PUBLIC_PLATFORM_URL}${RESOURCE_PATH}`,
+      title: `Browse ${RESOURCE_LABEL_PLURAL} | CivicDataSpace`,
+      description: `Explore reports, research and findings on CivicDataSpace.`,
+      siteName: 'CivicDataSpace',
+      image: `${process.env.NEXT_PUBLIC_PLATFORM_URL}/og.png`,
+    },
+  });
+
+const PublicationsListing = () => {
+  const breadcrumbData = [
+    { href: '/', label: 'Home' },
+    { href: '#', label: `${RESOURCE_LABEL} Listing` },
+  ];
+
+  const jsonLd = generateJsonLd({
+    '@context': 'https://schema.org',
+    '@type': 'CollectionPage',
+    name: `Browse ${RESOURCE_LABEL_PLURAL} | CivicDataSpace`,
+    url: `${process.env.NEXT_PUBLIC_PLATFORM_URL}${RESOURCE_PATH}`,
+    description: `Explore reports, research and findings published as ${RESOURCE_LABEL_PLURAL}.`,
+    publisher: {
+      '@type': 'Organization',
+      name: 'CivicDataSpace',
+      url: `${process.env.NEXT_PUBLIC_PLATFORM_URL}${RESOURCE_PATH}`,
+    },
+  });
+
+  return (
+    <>
+      <JsonLd json={jsonLd} />
+      <ListingComponent
+        type="publication"
+        breadcrumbData={breadcrumbData}
+        redirectionURL={RESOURCE_PATH}
+        placeholder={`Start typing to search for any ${RESOURCE_LABEL}`}
+      />
+    </>
+  );
+};
+
+export default PublicationsListing;
diff --git a/app/[locale]/(user)/search/components/UnifiedListingComponent.tsx b/app/[locale]/(user)/search/components/UnifiedListingComponent.tsx
index d143ff3e..1363a52d 100644
--- a/app/[locale]/(user)/search/components/UnifiedListingComponent.tsx
+++ b/app/[locale]/(user)/search/components/UnifiedListingComponent.tsx
@@ -16,8 +16,8 @@ import {
   Tray,
 } from 'opub-ui';
 
-import { cn, formatDate } from '@/lib/utils';
 import { getCollaborativeDetailUrl } from '@/lib/collaborativesRouting';
+import { cn, formatDate } from '@/lib/utils';
 import BreadCrumbs from '@/components/BreadCrumbs';
 import { Icons } from '@/components/icons';
 import { Loading } from '@/components/loading';
@@ -109,7 +109,7 @@ interface QueryParams {
   types?: string; // New: comma-separated list of types to search
 }
 
-const ALL_LISTING_TYPES = 'dataset,usecase,aimodel,publisher';
+const ALL_LISTING_TYPES = 'dataset,usecase,aimodel,publication,publisher';
 
 type Action =
   | { type: 'SET_PAGE_SIZE'; payload: number }
@@ -489,6 +489,8 @@ const UnifiedListingComponent: React.FC<UnifiedListingProps> = ({
         return `/usecases/${item.id}`;
       case 'aimodel':
         return `/aimodels/${item.id}`;
+      case 'publication':
+        return `/publications/${item.id}`;
       case 'collaborative':
         return getCollaborativeDetailUrl(item.slug);
       case 'publisher':
diff --git a/app/[locale]/dashboard/[entityType]/[entitySlug]/collaboratives/edit/[id]/assign/page.tsx b/app/[locale]/dashboard/[entityType]/[entitySlug]/collaboratives/edit/[id]/assign/page.tsx
index 6b5a7784..a49b15f8 100644
--- a/app/[locale]/dashboard/[entityType]/[entitySlug]/collaboratives/edit/[id]/assign/page.tsx
+++ b/app/[locale]/dashboard/[entityType]/[entitySlug]/collaboratives/edit/[id]/assign/page.tsx
@@ -10,6 +10,7 @@ import { Button, DataTable, Text, toast } from 'opub-ui';
 import { GraphQL } from '@/lib/api';
 import { formatDate } from '@/lib/utils';
 import { Loading } from '@/components/loading';
+import { PublicationLinkPicker } from '@/components/publications/PublicationLinkPicker';
 
 // prettier-ignore
 const FetchCollaborativeDetails: any = graphql(`
@@ -183,6 +184,7 @@ const Assign = () => {
               setSelectedRows(Array.isArray(selected) ? selected : []); // Ensure selected is always an array
             }}
           />
+          <PublicationLinkPicker entityKind="collaborative" />
         </>
       ) : (
         <Loading />
diff --git a/app/[locale]/dashboard/[entityType]/[entitySlug]/layout.tsx b/app/[locale]/dashboard/[entityType]/[entitySlug]/layout.tsx
index 862d89fb..3e5131cd 100644
--- a/app/[locale]/dashboard/[entityType]/[entitySlug]/layout.tsx
+++ b/app/[locale]/dashboard/[entityType]/[entitySlug]/layout.tsx
@@ -38,12 +38,10 @@ export default function OrgDashboardLayout({ children }: DashboardLayoutProps) {
     )
   );
 
-
   useEffect(() => {
     EntityDetailsQryRes.refetch();
   }, []);
 
-
   useEffect(() => {
     if (EntityDetailsQryRes.data) {
       setEntityDetails(EntityDetailsQryRes.data);
@@ -83,6 +81,11 @@ export default function OrgDashboardLayout({ children }: DashboardLayoutProps) {
       href: `/dashboard/${params.entityType}/${params.entitySlug}/aimodels`,
       icon: 'light',
     },
+    {
+      title: 'Resources',
+      href: `/dashboard/${params.entityType}/${params.entitySlug}/publications`,
+      icon: 'light',
+    },
     {
       title: 'Collaboratives',
       href: `/dashboard/${params.entityType}/${params.entitySlug}/collaboratives`,
diff --git a/app/[locale]/dashboard/[entityType]/[entitySlug]/publications/create/page.tsx b/app/[locale]/dashboard/[entityType]/[entitySlug]/publications/create/page.tsx
new file mode 100644
index 00000000..d149dc1b
--- /dev/null
+++ b/app/[locale]/dashboard/[entityType]/[entitySlug]/publications/create/page.tsx
@@ -0,0 +1,76 @@
+'use client';
+
+import { graphql } from '@/gql';
+import { useMutation } from '@tanstack/react-query';
+import { useParams, useRouter } from 'next/navigation';
+import { Text, toast } from 'opub-ui';
+
+import {
+  PublicationForm,
+  PublicationFormInput,
+} from '@/components/publications/PublicationForm';
+import { GraphQL } from '@/lib/api';
+import { RESOURCE_LABEL } from '@/lib/constants/resourceLabel';
+
+const createPublicationMutation = graphql(`
+  mutation createPublication($input: CreatePublicationInput!) {
+    createPublication(input: $input) {
+      success
+      errors {
+        fieldErrors {
+          field
+          messages
+        }
+        nonFieldErrors
+      }
+      data {
+        id
+      }
+    }
+  }
+`);
+
+export default function CreatePublicationPage() {
+  const router = useRouter();
+  const params = useParams<{ entityType: string; entitySlug: string }>();
+
+  const { mutate, isLoading } = useMutation(
+    (input: PublicationFormInput) =>
+      GraphQL(
+        createPublicationMutation,
+        { [params.entityType]: params.entitySlug },
+        { input }
+      ),
+    {
+      onSuccess: (res) => {
+        const payload = res?.createPublication;
+        if (!payload?.success || !payload.data?.id) {
+          const message =
+            payload?.errors?.nonFieldErrors?.[0] ||
+            payload?.errors?.fieldErrors?.[0]?.messages?.[0] ||
+            'Please fill in all required fields.';
+          toast(message);
+          return;
+        }
+        toast(`${RESOURCE_LABEL} created`);
+        router.push(
+          `/dashboard/${params.entityType}/${params.entitySlug}/publications/edit/${payload.data.id}/blocks`
+        );
+      },
+      onError: (error: unknown) => {
+        toast(error instanceof Error ? error.message : 'Failed to create');
+      },
+    }
+  );
+
+  return (
+    <div className="mt-8 flex flex-col gap-4">
+      <Text variant="headingLg">Create a {RESOURCE_LABEL}</Text>
+      <PublicationForm
+        onSubmit={(input) => mutate(input)}
+        submitLabel={`Create ${RESOURCE_LABEL}`}
+        isSubmitting={isLoading}
+      />
+    </div>
+  );
+}
diff --git a/app/[locale]/dashboard/[entityType]/[entitySlug]/publications/edit/[id]/blocks/page.tsx b/app/[locale]/dashboard/[entityType]/[entitySlug]/publications/edit/[id]/blocks/page.tsx
new file mode 100644
index 00000000..f15e35c5
--- /dev/null
+++ b/app/[locale]/dashboard/[entityType]/[entitySlug]/publications/edit/[id]/blocks/page.tsx
@@ -0,0 +1,231 @@
+'use client';
+
+import { graphql } from '@/gql';
+import { useMutation, useQuery } from '@tanstack/react-query';
+import { useParams } from 'next/navigation';
+import { Button, DropZone, Spinner, Text, TextField, toast } from 'opub-ui';
+import React from 'react';
+
+import { GraphQL } from '@/lib/api';
+
+const blocksQuery = graphql(`
+  query publicationBlocks($publicationId: UUID!) {
+    getPublication(publicationId: $publicationId) {
+      id
+      blocks {
+        id
+        position
+        blockType
+        fileName
+        youtubeUrl
+      }
+    }
+  }
+`);
+
+const addYoutube = graphql(`
+  mutation addPublicationYoutubeBlock($publicationId: UUID!, $youtubeUrl: String!) {
+    addPublicationYoutubeBlock(publicationId: $publicationId, youtubeUrl: $youtubeUrl) {
+      success
+      errors {
+        nonFieldErrors
+      }
+    }
+  }
+`);
+
+const addFile = graphql(`
+  mutation addPublicationFileBlock($publicationId: UUID!, $file: Upload!) {
+    addPublicationFileBlock(publicationId: $publicationId, file: $file) {
+      success
+      errors {
+        nonFieldErrors
+      }
+    }
+  }
+`);
+
+const removeBlockMutation = graphql(`
+  mutation removePublicationBlock($blockId: UUID!) {
+    removePublicationBlock(blockId: $blockId) {
+      success
+    }
+  }
+`);
+
+const reorderMutation = graphql(`
+  mutation reorderPublicationBlocks($publicationId: UUID!, $blockIds: [UUID!]!) {
+    reorderPublicationBlocks(publicationId: $publicationId, blockIds: $blockIds) {
+      success
+    }
+  }
+`);
+
+const ACCEPT = '.pdf,.doc,.docx,.ppt,.pptx,.odp,.odt,.key';
+
+type Block = {
+  id: string;
+  position: number;
+  blockType: string;
+  fileName: string;
+  youtubeUrl?: string | null;
+};
+
+export default function BlocksPage() {
+  const params = useParams<{
+    entityType: string;
+    entitySlug: string;
+    id: string;
+  }>();
+  const headers = { [params.entityType]: params.entitySlug };
+  const [youtubeUrl, setYoutubeUrl] = React.useState('');
+
+  const { data, isLoading, refetch } = useQuery(
+    ['publication_blocks', params.id],
+    () => GraphQL(blocksQuery, headers, { publicationId: params.id })
+  );
+
+  const onError = (e: unknown) =>
+    toast(e instanceof Error ? e.message : 'Something went wrong');
+
+  const youtubeMutation = useMutation(
+    () => GraphQL(addYoutube, headers, { publicationId: params.id, youtubeUrl }),
+    {
+      onSuccess: (res) => {
+        if (!res?.addPublicationYoutubeBlock?.success) {
+          toast(
+            res?.addPublicationYoutubeBlock?.errors?.nonFieldErrors?.[0] ||
+              'Enter a valid YouTube URL'
+          );
+          return;
+        }
+        setYoutubeUrl('');
+        refetch();
+      },
+      onError,
+    }
+  );
+
+  const fileMutation = useMutation(
+    (file: File) =>
+      GraphQL(addFile, headers, { publicationId: params.id, file }),
+    {
+      onSuccess: (res) => {
+        if (!res?.addPublicationFileBlock?.success) {
+          toast(
+            res?.addPublicationFileBlock?.errors?.nonFieldErrors?.[0] ||
+              'File could not be uploaded'
+          );
+          return;
+        }
+        refetch();
+      },
+      onError,
+    }
+  );
+
+  const removeMutation = useMutation(
+    (blockId: string) => GraphQL(removeBlockMutation, headers, { blockId }),
+    { onSuccess: () => refetch(), onError }
+  );
+
+  const reorder = useMutation(
+    (blockIds: string[]) =>
+      GraphQL(reorderMutation, headers, {
+        publicationId: params.id,
+        blockIds,
+      }),
+    { onSuccess: () => refetch(), onError }
+  );
+
+  const blocks: Block[] = [...(data?.getPublication?.blocks ?? [])].sort(
+    (a, b) => a.position - b.position
+  );
+
+  const move = (index: number, direction: -1 | 1) => {
+    const next = index + direction;
+    if (next < 0 || next >= blocks.length) return;
+    const ids = blocks.map((b) => b.id);
+    [ids[index], ids[next]] = [ids[next], ids[index]];
+    reorder.mutate(ids);
+  };
+
+  if (isLoading) {
+    return (
+      <div className="mt-8 flex justify-center">
+        <Spinner />
+      </div>
+    );
+  }
+
+  return (
+    <div className="flex flex-col gap-6 py-6">
+      <div className="flex items-end gap-2">
+        <div className="flex-1">
+          <TextField
+            name="youtubeUrl"
+            label="Add a YouTube video"
+            value={youtubeUrl}
+            onChange={setYoutubeUrl}
+            placeholder="https://youtu.be/..."
+          />
+        </div>
+        <Button
+          variant="interactive"
+          loading={youtubeMutation.isLoading}
+          onClick={() => youtubeUrl && youtubeMutation.mutate()}
+        >
+          Add video
+        </Button>
+      </div>
+
+      <DropZone
+        accept={ACCEPT}
+        name="publication_block_file"
+        label="Upload a file (PDF, Word, slides — max 50 MB)"
+        allowMultiple={false}
+        onDrop={(_all: File[], accepted: File[]) => {
+          if (accepted[0]) fileMutation.mutate(accepted[0]);
+        }}
+      >
+        <DropZone.FileUpload
+          actionHint={
+            <Button kind="secondary" variant="interactive">
+              Choose a file to upload
+            </Button>
+          }
+        />
+      </DropZone>
+
+      <div className="flex flex-col gap-2">
+        <Text variant="headingSm">Content ({blocks.length})</Text>
+        {blocks.map((block, index) => (
+          <div
+            key={block.id}
+            className="flex items-center justify-between rounded-md border border-solid border-greyExtralight p-3"
+          >
+            <Text variant="bodyMd">
+              {block.blockType === 'YOUTUBE'
+                ? block.youtubeUrl
+                : block.fileName}
+            </Text>
+            <div className="flex gap-2">
+              <Button variant="basic" onClick={() => move(index, -1)}>
+                ↑
+              </Button>
+              <Button variant="basic" onClick={() => move(index, 1)}>
+                ↓
+              </Button>
+              <Button
+                variant="critical"
+                onClick={() => removeMutation.mutate(block.id)}
+              >
+                Remove
+              </Button>
+            </div>
+          </div>
+        ))}
+      </div>
+    </div>
+  );
+}
diff --git a/app/[locale]/dashboard/[entityType]/[entitySlug]/publications/edit/[id]/metadata/page.tsx b/app/[locale]/dashboard/[entityType]/[entitySlug]/publications/edit/[id]/metadata/page.tsx
new file mode 100644
index 00000000..49a5a023
--- /dev/null
+++ b/app/[locale]/dashboard/[entityType]/[entitySlug]/publications/edit/[id]/metadata/page.tsx
@@ -0,0 +1,117 @@
+'use client';
+
+import { graphql } from '@/gql';
+import { useMutation, useQuery } from '@tanstack/react-query';
+import { useParams } from 'next/navigation';
+import { Spinner, toast } from 'opub-ui';
+
+import {
+  PublicationForm,
+  PublicationFormInput,
+} from '@/components/publications/PublicationForm';
+import { GraphQL } from '@/lib/api';
+import { RESOURCE_LABEL } from '@/lib/constants/resourceLabel';
+
+const fetchPublication = graphql(`
+  query editPublication($publicationId: UUID!) {
+    getPublication(publicationId: $publicationId) {
+      id
+      title
+      description
+      authors
+      publicationDate
+      license
+      externalSourceLink
+      resourceType {
+        id
+      }
+      sectors {
+        id
+      }
+      geographies {
+        id
+      }
+    }
+  }
+`);
+
+const updatePublicationMutation = graphql(`
+  mutation updatePublicationMetadata($input: UpdatePublicationInput!) {
+    updatePublication(input: $input) {
+      success
+      errors {
+        nonFieldErrors
+        fieldErrors {
+          field
+          messages
+        }
+      }
+    }
+  }
+`);
+
+export default function EditMetadataPage() {
+  const params = useParams<{
+    entityType: string;
+    entitySlug: string;
+    id: string;
+  }>();
+  const headers = { [params.entityType]: params.entitySlug };
+
+  const { data, isLoading } = useQuery(['edit_publication', params.id], () =>
+    GraphQL(fetchPublication, headers, { publicationId: params.id })
+  );
+
+  const { mutate, isLoading: isSaving } = useMutation(
+    (input: PublicationFormInput) =>
+      GraphQL(
+        updatePublicationMutation,
+        headers,
+        { input: { id: params.id, ...input } }
+      ),
+    {
+      onSuccess: (res) => {
+        const payload = res?.updatePublication;
+        if (!payload?.success) {
+          toast(payload?.errors?.nonFieldErrors?.[0] || 'Could not save changes.');
+          return;
+        }
+        toast('Saved');
+      },
+      onError: (e: unknown) =>
+        toast(e instanceof Error ? e.message : 'Failed to save'),
+    }
+  );
+
+  if (isLoading) {
+    return (
+      <div className="mt-8 flex justify-center">
+        <Spinner />
+      </div>
+    );
+  }
+
+  const pub = data?.getPublication;
+  if (!pub) {
+    return <div className="mt-8">{RESOURCE_LABEL} not found.</div>;
+  }
+
+  return (
+    <PublicationForm
+      initialValues={{
+        title: pub.title,
+        description: pub.description ?? '',
+        authors: (pub.authors ?? []).join(', '),
+        publicationDate: pub.publicationDate ?? '',
+        license: pub.license,
+        resourceTypeId: pub.resourceType?.id ?? '',
+        sectorIds: (pub.sectors ?? []).map((s) => s.id),
+        geographyIds: (pub.geographies ?? []).map((g) => String(g.id)),
+        externalSourceLink: pub.externalSourceLink ?? '',
+      }}
+      onSubmit={(input) => mutate(input)}
+      submitLabel="Save changes"
+      isSubmitting={isSaving}
+    />
+  );
+}
diff --git a/app/[locale]/dashboard/[entityType]/[entitySlug]/publications/edit/[id]/page.tsx b/app/[locale]/dashboard/[entityType]/[entitySlug]/publications/edit/[id]/page.tsx
new file mode 100644
index 00000000..e1f176e1
--- /dev/null
+++ b/app/[locale]/dashboard/[entityType]/[entitySlug]/publications/edit/[id]/page.tsx
@@ -0,0 +1,22 @@
+'use client';
+
+import { useParams, useRouter } from 'next/navigation';
+import { useEffect } from 'react';
+
+/** Bare edit route → land on the Metadata tab. */
+export default function EditIndex() {
+  const router = useRouter();
+  const params = useParams<{
+    entityType: string;
+    entitySlug: string;
+    id: string;
+  }>();
+
+  useEffect(() => {
+    router.replace(
+      `/dashboard/${params.entityType}/${params.entitySlug}/publications/edit/${params.id}/metadata`
+    );
+  }, [router, params]);
+
+  return null;
+}
diff --git a/app/[locale]/dashboard/[entityType]/[entitySlug]/publications/edit/[id]/publish/page.tsx b/app/[locale]/dashboard/[entityType]/[entitySlug]/publications/edit/[id]/publish/page.tsx
new file mode 100644
index 00000000..ffe33223
--- /dev/null
+++ b/app/[locale]/dashboard/[entityType]/[entitySlug]/publications/edit/[id]/publish/page.tsx
@@ -0,0 +1,144 @@
+'use client';
+
+import { graphql } from '@/gql';
+import { useMutation, useQuery } from '@tanstack/react-query';
+import { useParams } from 'next/navigation';
+import { Button, Spinner, Text, toast } from 'opub-ui';
+
+import { GraphQL } from '@/lib/api';
+import { RESOURCE_LABEL } from '@/lib/constants/resourceLabel';
+
+const publishStatusQuery = graphql(`
+  query publicationPublishState($publicationId: UUID!) {
+    getPublication(publicationId: $publicationId) {
+      id
+      title
+      status
+      linkedCount
+      linkedUsecases {
+        id
+        title
+      }
+      linkedCollaboratives {
+        id
+        title
+      }
+    }
+  }
+`);
+
+const publishMutation = graphql(`
+  mutation publishPublication($publicationId: UUID!) {
+    publishPublication(publicationId: $publicationId) {
+      success
+      data {
+        status
+      }
+    }
+  }
+`);
+
+const unpublishMutation = graphql(`
+  mutation unpublishPublication($publicationId: UUID!) {
+    unpublishPublication(publicationId: $publicationId) {
+      success
+      data {
+        status
+      }
+    }
+  }
+`);
+
+export default function PublishPage() {
+  const params = useParams<{
+    entityType: string;
+    entitySlug: string;
+    id: string;
+  }>();
+  const headers = { [params.entityType]: params.entitySlug };
+
+  const { data, isLoading, refetch } = useQuery(
+    ['publication_publish', params.id],
+    () => GraphQL(publishStatusQuery, headers, { publicationId: params.id })
+  );
+
+  const publish = useMutation(
+    () => GraphQL(publishMutation, headers, { publicationId: params.id }),
+    {
+      onSuccess: () => {
+        toast(`${RESOURCE_LABEL} published`);
+        refetch();
+      },
+    }
+  );
+  const unpublish = useMutation(
+    () => GraphQL(unpublishMutation, headers, { publicationId: params.id }),
+    {
+      onSuccess: () => {
+        toast(`${RESOURCE_LABEL} unpublished`);
+        refetch();
+      },
+    }
+  );
+
+  if (isLoading) {
+    return (
+      <div className="mt-8 flex justify-center">
+        <Spinner />
+      </div>
+    );
+  }
+
+  const pub = data?.getPublication;
+  if (!pub) return <div className="mt-8">{RESOURCE_LABEL} not found.</div>;
+
+  const isPublished = pub.status === 'PUBLISHED';
+
+  return (
+    <div className="flex flex-col gap-6 py-6">
+      <div className="flex flex-col gap-2">
+        <Text variant="headingMd">{pub.title}</Text>
+        <Text variant="bodyMd" className="text-textSubdued">
+          Status: {isPublished ? 'Published' : 'Draft'}
+        </Text>
+      </div>
+
+      {isPublished ? (
+        <Button
+          variant="basic"
+          loading={unpublish.isLoading}
+          onClick={() => unpublish.mutate()}
+        >
+          Unpublish
+        </Button>
+      ) : (
+        <Button
+          variant="interactive"
+          loading={publish.isLoading}
+          onClick={() => publish.mutate()}
+        >
+          Publish {RESOURCE_LABEL}
+        </Button>
+      )}
+
+      {pub.linkedCount > 0 && (
+        <div className="flex flex-col gap-1 rounded-md border border-solid border-greyExtralight p-4">
+          <Text variant="bodyMd" fontWeight="medium">
+            Linked into {pub.linkedCount} Use Case
+            {pub.linkedCount === 1 ? '' : 's'} / Collaboratives
+          </Text>
+          {pub.linkedUsecases.map((uc) => (
+            <Text key={uc.id} variant="bodySm" className="text-textSubdued">
+              Use Case: {uc.title}
+            </Text>
+          ))}
+          {pub.linkedCollaboratives.map((c) => (
+            <Text key={c.id} variant="bodySm" className="text-textSubdued">
+              Collaborative: {c.title}
+            </Text>
+          ))}
+        </div>
+      )}
+    </div>
+  );
+}
diff --git a/app/[locale]/dashboard/[entityType]/[entitySlug]/publications/edit/context.tsx b/app/[locale]/dashboard/[entityType]/[entitySlug]/publications/edit/context.tsx
new file mode 100644
index 00000000..2747111d
--- /dev/null
+++ b/app/[locale]/dashboard/[entityType]/[entitySlug]/publications/edit/context.tsx
@@ -0,0 +1,34 @@
+'use client';
+
+import React, { createContext, useContext, useState } from 'react';
+
+type EditStatusContextType = {
+  status: 'saved' | 'unsaved' | 'saving';
+  setStatus: (status: 'saved' | 'unsaved' | 'saving') => void;
+};
+
+const EditStatusContext = createContext<EditStatusContextType | undefined>(
+  undefined
+);
+
+export const EditStatusProvider = ({
+  children,
+}: {
+  children: React.ReactNode;
+}) => {
+  const [status, setStatus] = useState<'saved' | 'unsaved' | 'saving'>('saved');
+
+  return (
+    <EditStatusContext.Provider value={{ status, setStatus }}>
+      {children}
+    </EditStatusContext.Provider>
+  );
+};
+
+export const useEditStatus = () => {
+  const context = useContext(EditStatusContext);
+  if (!context) {
+    throw new Error('useEditStatus must be used within EditStatusProvider');
+  }
+  return context;
+};
diff --git a/app/[locale]/dashboard/[entityType]/[entitySlug]/publications/edit/layout.tsx b/app/[locale]/dashboard/[entityType]/[entitySlug]/publications/edit/layout.tsx
new file mode 100644
index 00000000..7a1a4190
--- /dev/null
+++ b/app/[locale]/dashboard/[entityType]/[entitySlug]/publications/edit/layout.tsx
@@ -0,0 +1,62 @@
+'use client';
+
+import { useParams, usePathname, useRouter } from 'next/navigation';
+import { Tab, TabList, Tabs } from 'opub-ui';
+
+import { EditStatusProvider } from './context';
+
+const TabsAndChildren = ({ children }: { children: React.ReactNode }) => {
+  const router = useRouter();
+  const pathName = usePathname();
+  const params = useParams<{
+    entityType: string;
+    entitySlug: string;
+    id: string;
+  }>();
+
+  const base = `/dashboard/${params.entityType}/${params.entitySlug}/publications/edit/${params.id}`;
+  const links = [
+    { label: 'Metadata', url: `${base}/metadata`, key: 'metadata' },
+    { label: 'Content', url: `${base}/blocks`, key: 'blocks' },
+    { label: 'Publish', url: `${base}/publish`, key: 'publish' },
+  ];
+
+  const current =
+    links.find((l) => pathName.indexOf(l.key) >= 0)?.label || 'Metadata';
+
+  return (
+    <div className="mt-8 flex h-full flex-col gap-6">
+      <Tabs
+        value={current}
+        onValueChange={(newValue) =>
+          router.replace(links.find((l) => l.label === newValue)?.url || '')
+        }
+      >
+        <TabList fitted border>
+          {links.map((item) => (
+            <Tab
+              theme="dataSpace"
+              value={item.label}
+              key={item.key}
+              onClick={() => router.replace(item.url)}
+              className="uppercase"
+            >
+              {item.label}
+            </Tab>
+          ))}
+        </TabList>
+      </Tabs>
+      <div>{children}</div>
+    </div>
+  );
+};
+
+const EditPublication = ({ children }: { children: React.ReactNode }) => {
+  return (
+    <EditStatusProvider>
+      <TabsAndChildren>{children}</TabsAndChildren>
+    </EditStatusProvider>
+  );
+};
+
+export default EditPublication;
diff --git a/app/[locale]/dashboard/[entityType]/[entitySlug]/publications/page.tsx b/app/[locale]/dashboard/[entityType]/[entitySlug]/publications/page.tsx
new file mode 100644
index 00000000..270f7b08
--- /dev/null
+++ b/app/[locale]/dashboard/[entityType]/[entitySlug]/publications/page.tsx
@@ -0,0 +1,71 @@
+'use client';
+
+import Link from 'next/link';
+import { useParams } from 'next/navigation';
+import { graphql } from '@/gql';
+import { useQuery } from '@tanstack/react-query';
+import { Button, Spinner, Tag, Text } from 'opub-ui';
+
+import { GraphQL } from '@/lib/api';
+import {
+  RESOURCE_LABEL,
+  RESOURCE_LABEL_PLURAL,
+} from '@/lib/constants/resourceLabel';
+
+const dashboardListQuery = graphql(`
+  query dashboardPublications {
+    publications {
+      id
+      title
+      status
+      modified
+    }
+  }
+`);
+
+export default function DashboardPublicationsPage() {
+  const params = useParams<{ entityType: string; entitySlug: string }>();
+  const base = `/dashboard/${params.entityType}/${params.entitySlug}/publications`;
+
+  const { data, isLoading } = useQuery(
+    ['dashboard_publications', params.entitySlug],
+    () =>
+      GraphQL(dashboardListQuery, { [params.entityType]: params.entitySlug })
+  );
+
+  const publications = data?.publications ?? [];
+
+  return (
+    <div className="mt-8 flex flex-col gap-4">
+      <div className="flex items-center justify-between">
+        <Text variant="headingLg">{RESOURCE_LABEL_PLURAL}</Text>
+        <Link href={`${base}/create`}>
+          <Button variant="interactive">Create {RESOURCE_LABEL}</Button>
+        </Link>
+      </div>
+
+      {isLoading ? (
+        <div className="mt-8 flex justify-center">
+          <Spinner />
+        </div>
+      ) : publications.length === 0 ? (
+        <Text variant="bodyMd" className="text-textSubdued">
+          You have no {RESOURCE_LABEL_PLURAL.toLowerCase()} yet.
+        </Text>
+      ) : (
+        <div className="flex flex-col gap-2">
+          {publications.map((pub) => (
+            <Link
+              key={pub.id}
+              href={`${base}/edit/${pub.id}/metadata`}
+              className="rounded-md border flex items-center justify-between border-solid border-greyExtralight p-3"
+            >
+              <Text variant="bodyMd">{pub.title || 'Untitled'}</Text>
+              <Tag>{pub.status}</Tag>
+            </Link>
+          ))}
+        </div>
+      )}
+    </div>
+  );
+}
diff --git a/app/[locale]/dashboard/[entityType]/[entitySlug]/usecases/edit/[id]/assign/page.tsx b/app/[locale]/dashboard/[entityType]/[entitySlug]/usecases/edit/[id]/assign/page.tsx
index 25351dcc..0ba6284e 100644
--- a/app/[locale]/dashboard/[entityType]/[entitySlug]/usecases/edit/[id]/assign/page.tsx
+++ b/app/[locale]/dashboard/[entityType]/[entitySlug]/usecases/edit/[id]/assign/page.tsx
@@ -10,6 +10,7 @@ import { Button, DataTable, Text, toast } from 'opub-ui';
 import { GraphQL } from '@/lib/api';
 import { formatDate } from '@/lib/utils';
 import { Loading } from '@/components/loading';
+import { PublicationLinkPicker } from '@/components/publications/PublicationLinkPicker';
 
 const FetchUseCaseDetails: any = graphql(`
   query UseCaseDetails($filters: UseCaseFilter) {
@@ -178,6 +179,7 @@ const Assign = () => {
               setSelectedRows(Array.isArray(selected) ? selected : []); // Ensure selected is always an array
             }}
           />
+          <PublicationLinkPicker entityKind="usecase" />
         </>
       ) : (
         <Loading />
diff --git a/app/[locale]/dashboard/components/main-nav.tsx b/app/[locale]/dashboard/components/main-nav.tsx
index 1c87263a..22bb66fe 100644
--- a/app/[locale]/dashboard/components/main-nav.tsx
+++ b/app/[locale]/dashboard/components/main-nav.tsx
@@ -105,6 +105,10 @@ export function MainNav({ hideSearch = false }) {
       title: 'Prompts',
       href: '/datasets?dataset_type=PROMPT',
     },
+    {
+      title: 'Resources',
+      href: '/publications',
+    },
   ];
 
   const Navigation = [
diff --git a/components/publications/PublicationForm.tsx b/components/publications/PublicationForm.tsx
new file mode 100644
index 00000000..17251ab3
--- /dev/null
+++ b/components/publications/PublicationForm.tsx
@@ -0,0 +1,246 @@
+'use client';
+
+import React, { useState } from 'react';
+import { graphql } from '@/gql';
+import { DatasetLicense } from '@/gql/generated/graphql';
+import { useQuery } from '@tanstack/react-query';
+import { Button, Combobox, FormLayout, Select, TextField } from 'opub-ui';
+
+import { GraphQL } from '@/lib/api';
+import { RESOURCE_LABEL } from '@/lib/constants/resourceLabel';
+
+// The controlled license vocabulary, shared with datasets.
+const LICENSE_OPTIONS = [
+  { label: 'CC BY 4.0 (Attribution)', value: 'CC_BY_4_0_ATTRIBUTION' },
+  {
+    label: 'CC BY-SA 4.0 (Attribution, ShareAlike)',
+    value: 'CC_BY_SA_4_0_ATTRIBUTION_SHARE_ALIKE',
+  },
+  {
+    label: 'Government Open Data License',
+    value: 'GOVERNMENT_OPEN_DATA_LICENSE',
+  },
+  {
+    label: 'Open Data Commons (Attribution)',
+    value: 'OPEN_DATA_COMMONS_BY_ATTRIBUTION',
+  },
+  { label: 'Open Database License', value: 'OPEN_DATABASE_LICENSE' },
+];
+
+const referenceQuery = graphql(`
+  query publicationFormReferenceData {
+    resourceTypes {
+      id
+      name
+    }
+    sectors {
+      id
+      name
+    }
+    geographies {
+      id
+      name
+    }
+  }
+`);
+
+export type PublicationFormValues = {
+  title: string;
+  description: string;
+  authors: string;
+  publicationDate: string;
+  license: string;
+  resourceTypeId: string;
+  sectorIds: string[];
+  geographyIds: string[];
+  externalSourceLink: string;
+};
+
+export type PublicationFormInput = {
+  title: string;
+  description: string;
+  authors: string[];
+  publicationDate: string;
+  license: DatasetLicense;
+  resourceTypeId: string;
+  sectorIds: string[];
+  geographyIds: number[];
+  externalSourceLink?: string;
+};
+
+const EMPTY: PublicationFormValues = {
+  title: '',
+  description: '',
+  authors: '',
+  publicationDate: '',
+  license: 'CC_BY_4_0_ATTRIBUTION',
+  resourceTypeId: '',
+  sectorIds: [],
+  geographyIds: [],
+  externalSourceLink: '',
+};
+
+/** Turn the form's string fields into the GraphQL input shape. */
+function toInput(values: PublicationFormValues): PublicationFormInput {
+  return {
+    title: values.title.trim(),
+    description: values.description.trim(),
+    authors: values.authors
+      .split(',')
+      .map((a) => a.trim())
+      .filter(Boolean),
+    publicationDate: values.publicationDate,
+    license: values.license as DatasetLicense,
+    resourceTypeId: values.resourceTypeId,
+    sectorIds: values.sectorIds,
+    geographyIds: values.geographyIds.map((id) => parseInt(id, 10)),
+    externalSourceLink: values.externalSourceLink.trim() || undefined,
+  };
+}
+
+/**
+ * The typed metadata form for a Resource — used by both create and edit. It's a
+ * normal form (title, abstract, authors, date, license, resource type, sectors,
+ * geographies, external link), NOT the dynamic-metadata renderer datasets use.
+ */
+export function PublicationForm({
+  initialValues,
+  onSubmit,
+  submitLabel,
+  isSubmitting,
+}: {
+  initialValues?: Partial<PublicationFormValues>;
+  onSubmit: (input: PublicationFormInput) => void;
+  submitLabel: string;
+  isSubmitting?: boolean;
+}) {
+  const [values, setValues] = useState<PublicationFormValues>({
+    ...EMPTY,
+    ...initialValues,
+  });
+
+  const { data } = useQuery(['publication_form_reference'], () =>
+    GraphQL(referenceQuery, {})
+  );
+
+  const set = <K extends keyof PublicationFormValues>(
+    key: K,
+    value: PublicationFormValues[K]
+  ) => setValues((prev) => ({ ...prev, [key]: value }));
+
+  const resourceTypeOptions =
+    data?.resourceTypes?.map((t) => ({ label: t.name, value: t.id })) ?? [];
+  const sectorList =
+    data?.sectors?.map((s) => ({ label: s.name, value: s.id })) ?? [];
+  const geographyList =
+    data?.geographies?.map((g) => ({ label: g.name, value: String(g.id) })) ??
+    [];
+
+  return (
+    <div className="flex flex-col gap-4 py-6">
+      <TextField
+        name="title"
+        label={`${RESOURCE_LABEL} Title`}
+        value={values.title}
+        onChange={(v) => set('title', v)}
+        required
+        requiredIndicator
+      />
+
+      <Select
+        name="resourceType"
+        label={`${RESOURCE_LABEL} Type`}
+        options={resourceTypeOptions}
+        value={values.resourceTypeId}
+        onChange={(v) => set('resourceTypeId', v)}
+        required
+        requiredIndicator
+      />
+
+      <TextField
+        name="description"
+        label="Abstract"
+        value={values.description}
+        onChange={(v) => set('description', v)}
+        multiline={4}
+        required
+        requiredIndicator
+      />
+
+      <FormLayout>
+        <FormLayout.Group>
+          <TextField
+            name="authors"
+            label="Author(s)"
+            helpText="Separate multiple authors with commas"
+            value={values.authors}
+            onChange={(v) => set('authors', v)}
+            required
+            requiredIndicator
+          />
+          <TextField
+            name="publicationDate"
+            label="Publication Date"
+            type="date"
+            value={values.publicationDate}
+            onChange={(v) => set('publicationDate', v)}
+            required
+            requiredIndicator
+          />
+        </FormLayout.Group>
+      </FormLayout>
+
+      {/* opub-ui's Combobox multi-select passes/returns value-string arrays at
+          runtime, but its declared types say string; cast at the boundary (the
+          rest of the app uses `any` here). */}
+      <Combobox
+        displaySelected
+        name="sectors"
+        label="Sectors"
+        list={sectorList}
+        selectedValue={values.sectorIds as unknown as string}
+        onChange={(v) => set('sectorIds', v as unknown as string[])}
+        required
+        requiredIndicator
+      />
+
+      <Combobox
+        displaySelected
+        name="geographies"
+        label="Geographies"
+        list={geographyList}
+        selectedValue={values.geographyIds as unknown as string}
+        onChange={(v) => set('geographyIds', v as unknown as string[])}
+        required
+        requiredIndicator
+      />
+
+      <Select
+        name="license"
+        label="Usage Rights (License)"
+        options={LICENSE_OPTIONS}
+        value={values.license}
+        onChange={(v) => set('license', v)}
+        required
+        requiredIndicator
+      />
+
+      <TextField
+        name="externalSourceLink"
+        label="External Source Link (optional)"
+        value={values.externalSourceLink}
+        onChange={(v) => set('externalSourceLink', v)}
+      />
+
+      <div>
+        <Button
+          variant="interactive"
+          loading={isSubmitting}
+          onClick={() => onSubmit(toInput(values))}
+        >
+          {submitLabel}
+        </Button>
+      </div>
+    </div>
+  );
+}
diff --git a/components/publications/PublicationLinkPicker.tsx b/components/publications/PublicationLinkPicker.tsx
new file mode 100644
index 00000000..584ec4ba
--- /dev/null
+++ b/components/publications/PublicationLinkPicker.tsx
@@ -0,0 +1,177 @@
+'use client';
+
+import React from 'react';
+import { useParams } from 'next/navigation';
+import { fetchData } from '@/fetch';
+import { graphql } from '@/gql';
+import { useMutation, useQuery } from '@tanstack/react-query';
+import { Button, DataTable, Spinner, Text, toast } from 'opub-ui';
+
+import { GraphQL } from '@/lib/api';
+import { RESOURCE_LABEL_PLURAL } from '@/lib/constants/resourceLabel';
+
+const usecaseLinksQuery = graphql(`
+  query useCasePublicationLinks($filters: UseCaseFilter) {
+    useCases(filters: $filters) {
+      id
+      publications {
+        id
+        title
+      }
+    }
+  }
+`);
+
+const collaborativeLinksQuery = graphql(`
+  query collaborativePublicationLinks($filters: CollaborativeFilter) {
+    collaboratives(filters: $filters) {
+      id
+      publications {
+        id
+        title
+      }
+    }
+  }
+`);
+
+const updateUsecasePublications = graphql(`
+  mutation updateUsecasePublications(
+    $useCaseId: String!
+    $publicationIds: [UUID!]!
+  ) {
+    updateUsecasePublications(
+      useCaseId: $useCaseId
+      publicationIds: $publicationIds
+    ) {
+      ... on TypeUseCase {
+        id
+      }
+    }
+  }
+`);
+
+const updateCollaborativePublications = graphql(`
+  mutation updateCollaborativePublications(
+    $collaborativeId: String!
+    $publicationIds: [UUID!]!
+  ) {
+    updateCollaborativePublications(
+      collaborativeId: $collaborativeId
+      publicationIds: $publicationIds
+    ) {
+      ... on TypeCollaborative {
+        id
+      }
+    }
+  }
+`);
+
+type Row = { id: string; title: string };
+
+/**
+ * Lets a Use Case / Collaborative owner pull PUBLISHED Resources into their
+ * work — like a public library. Only published resources are searchable here
+ * (the backend won't attach a draft), and unlinking is just deselecting.
+ */
+export function PublicationLinkPicker({
+  entityKind,
+}: {
+  entityKind: 'usecase' | 'collaborative';
+}) {
+  const params = useParams<{
+    entityType: string;
+    entitySlug: string;
+    id: string;
+  }>();
+  const headers = { [params.entityType]: params.entitySlug };
+
+  const [available, setAvailable] = React.useState<Row[]>([]);
+  const [selected, setSelected] = React.useState<Row[]>([]);
+
+  // Published resources are discoverable through the same REST search endpoint.
+  React.useEffect(() => {
+    fetchData('publication', '?size=1000&page=1')
+      .then((res) => setAvailable(res.results ?? []))
+      .catch((err) => console.error(err));
+  }, []);
+
+  const linksQuery = useQuery<Row[]>(
+    ['publication_links', entityKind, params.id],
+    async () => {
+      if (entityKind === 'usecase') {
+        const res = await GraphQL(usecaseLinksQuery, headers, {
+          filters: { id: params.id },
+        });
+        return res.useCases?.[0]?.publications ?? [];
+      }
+      const res = await GraphQL(collaborativeLinksQuery, headers, {
+        filters: { id: params.id },
+      });
+      return res.collaboratives?.[0]?.publications ?? [];
+    }
+  );
+
+  const currentLinks: Row[] = linksQuery.data ?? [];
+
+  const { mutate, isLoading: isSaving } = useMutation(
+    async () => {
+      const publicationIds = selected.map((row) => row.id);
+      if (entityKind === 'usecase') {
+        await GraphQL(updateUsecasePublications, headers, {
+          useCaseId: params.id,
+          publicationIds,
+        });
+      } else {
+        await GraphQL(updateCollaborativePublications, headers, {
+          collaborativeId: params.id,
+          publicationIds,
+        });
+      }
+    },
+    {
+      onSuccess: () => {
+        toast(`${RESOURCE_LABEL_PLURAL} linked`);
+        linksQuery.refetch();
+      },
+      onError: (err: unknown) =>
+        toast(err instanceof Error ? err.message : 'Failed to link'),
+    }
+  );
+
+  const columns = [{ accessorKey: 'title', header: 'Title' }];
+  const rows = available.map((item) => ({ id: item.id, title: item.title }));
+
+  if (linksQuery.isLoading) {
+    return (
+      <div className="mt-8 flex justify-center">
+        <Spinner />
+      </div>
+    );
+  }
+
+  return (
+    <div className="mt-8 flex flex-col gap-4">
+      <div className="flex items-center justify-between">
+        <Text variant="headingSm">Link {RESOURCE_LABEL_PLURAL}</Text>
+        <Button
+          variant="interactive"
+          loading={isSaving}
+          onClick={() => mutate()}
+        >
+          Save linked {RESOURCE_LABEL_PLURAL.toLowerCase()}
+        </Button>
+      </div>
+      <DataTable
+        columns={columns}
+        rows={rows}
+        defaultSelectedRows={currentLinks.map((p) => ({
+          id: p.id,
+          title: p.title,
+        }))}
+        onRowSelectionChange={(sel) =>
+          setSelected(Array.isArray(sel) ? (sel as Row[]) : [])
+        }
+      />
+    </div>
+  );
+}
diff --git a/config/codegen.ts b/config/codegen.ts
index 5eb04f56..fb261f5f 100644
--- a/config/codegen.ts
+++ b/config/codegen.ts
@@ -5,7 +5,7 @@ loadEnvConfig(process.cwd());
 
 const config: CodegenConfig = {
   schema: process.env.BACKEND_GRAPHQL_URL,
-  documents: 'app/**/*.ts*',
+  documents: ['app/**/*.ts*', 'components/**/*.ts*'],
   ignoreNoDocuments: true,
   generates: {
     './gql/generated/': {
diff --git a/lib/constants/resourceLabel.ts b/lib/constants/resourceLabel.ts
new file mode 100644
index 00000000..7efdef2f
--- /dev/null
+++ b/lib/constants/resourceLabel.ts
@@ -0,0 +1,11 @@
+/**
+ * The single source of truth for the user-facing label of the Publication
+ * entity. The backend calls it "Publication" (the code name `Resource` was
+ * already taken by the file-inside-a-dataset), but users only ever see
+ * "Resource". Import from here — never hard-code the word in a component.
+ */
+export const RESOURCE_LABEL = 'Resource';
+export const RESOURCE_LABEL_PLURAL = 'Resources';
+
+/** The Explore / dashboard URL path for resources. */
+export const RESOURCE_PATH = '/publications';

From 7528034284eaedbb56eebad8554164c69056afd6 Mon Sep 17 00:00:00 2001
From: dc <eopoxf@gmail.com>
Date: Mon, 20 Jul 2026 12:55:44 +0530
Subject: [PATCH 2/2] docs(publications): add frontend architecture doc

---
 .../(user)/publications/architecture.md       | 84 +++++++++++++++++++
 1 file changed, 84 insertions(+)
 create mode 100644 app/[locale]/(user)/publications/architecture.md

diff --git a/app/[locale]/(user)/publications/architecture.md b/app/[locale]/(user)/publications/architecture.md
new file mode 100644
index 00000000..6beb0452
--- /dev/null
+++ b/app/[locale]/(user)/publications/architecture.md
@@ -0,0 +1,84 @@
+# Resources (Publication) — frontend
+
+> Part of feature: **resources** · sibling (primary): `DataExBackend/api/schema/publication_architecture.md` — see it for the cross-repo overview, data model, security and API contract.
+
+## Overview
+
+The frontend for the Resource entity (backend name **Publication**). Users only ever see the word **"Resource"** — the single source for that label is `lib/constants/resourceLabel.ts` (`RESOURCE_LABEL`, `RESOURCE_LABEL_PLURAL`, `RESOURCE_PATH = '/publications'`). The FE has two halves: a public **read** side (Explore listing, detail page, global-search presence) and a dashboard **authoring** side (create / edit / publish, block editor, and a Resource picker inside the Use Case / Collaborative editors).
+
+All data goes through the shared GraphQL clients in `lib/api.ts` (`GraphQL` session-aware, entity-header scoped) and the REST search helper `fetchData(type, …)` (`@/fetch`) which hits `/api/search/publication/`. Block files download through the gated REST route `${NEXT_PUBLIC_BACKEND_URL}/api/publications/blocks/<id>/download/`. GraphQL documents are inline `graphql()` tags typed by codegen; the codegen `documents` glob was widened to include `components/**` so the shared components' docs are typed.
+
+## Submodule map
+
+| Submodule | Route / entry |
+|---|---|
+| Detail page | `app/[locale]/(user)/publications/[publicationId]/` |
+| Explore listing | `app/[locale]/(user)/publications/page.tsx` (reuses `ListingComponent type="publication"`) |
+| Explore nav entry | `app/[locale]/dashboard/components/main-nav.tsx` (`exploreLinks`) |
+| Unified search | `app/[locale]/(user)/search/components/UnifiedListingComponent.tsx` (`publication` type + redirect) |
+| Dashboard list + create | `app/[locale]/dashboard/[entityType]/[entitySlug]/publications/` |
+| Create / edit / publish shell | `…/publications/edit/` (context + layout + `[id]/{metadata,blocks,publish}`) |
+| Shared metadata form | `components/publications/PublicationForm.tsx` |
+| Link picker | `components/publications/PublicationLinkPicker.tsx` (embedded in UC & Collab assign pages) |
+| Dashboard sidebar entry | `app/[locale]/dashboard/[entityType]/[entitySlug]/layout.tsx` (`orgSidebarNav`) |
+
+---
+
+## Submodule: Detail page
+
+### Trigger
+Route `/publications/[publicationId]` → `PublicationDetailsPage` runs the `getPublication` query.
+
+### Flow
+Fetch → loading/error/not-found branches → two-column layout: left renders `PrimaryData` (title, abstract, authors, external link) + `Blocks`; right rail renders `Metadata` (owner, license, tags, download count). `Blocks` sorts by `position` and renders each: **PDF** → inline `<iframe>` of the gated download URL + a download button; **YouTube** → responsive 16:9 embed from `youtubeVideoId`; **any other file** → a download card (name, format, size). Zero blocks → an empty-content message (zero-block publish is allowed).
+
+### States
+Loading (spinner), error, not-found, published-with-blocks, published-empty.
+
+---
+
+## Submodule: Authoring (create / edit / publish)
+
+### Trigger
+Dashboard: `…/publications` (list + Create) → `…/publications/create` (metadata form → `createPublication` → redirect to the block editor) → `…/publications/edit/[id]/{metadata,blocks,publish}`.
+
+### Flow
+- **Create:** the shared `PublicationForm` collects the full metadata (create requires all required fields server-side), submits `createPublication`; on success routes to the new resource's block editor. On a validation failure it surfaces the backend's field / non-field error.
+- **Edit shell:** `layout.tsx` renders three tabs (Metadata / Content / Publish); `context.tsx` is the save-status provider (cloned from the AI Model edit shell).
+- **Metadata tab:** pre-fills `PublicationForm` from `getPublication` and saves via `updatePublication`.
+- **Content tab (block editor):** YouTube URL input → `addPublicationYoutubeBlock`; opub-ui `DropZone` (accept `.pdf .doc .docx .ppt .pptx .odp .odt .key`) → `addPublicationFileBlock` (multipart, file passed in variables); per-block up/down → `reorderPublicationBlocks`; remove → `removePublicationBlock`.
+- **Publish tab:** shows status, a Publish/Unpublish button (`publishPublication` / `unpublishPublication`), and the owner-only **"linked to N"** flag from `linkedCount` / `linkedUsecases` / `linkedCollaboratives`.
+
+### Helpers / components
+- `PublicationForm` (Tier-2, `components/publications/`) — the typed metadata form used by both create and edit; a normal form (Select for Resource Type from the `resourceTypes` query and for license from the shared vocabulary, Combobox for sectors/geographies, TextField for the rest), NOT the datasets' dynamic-metadata renderer. `toInput` maps the string form fields to the GraphQL input (authors split on commas, geography ids → ints).
+- `PublicationLinkPicker` (Tier-2) — fetches published resources via REST search, shows a `DataTable` with the currently-linked set pre-selected, and saves via `updateUsecasePublications` / `updateCollaborativePublications`.
+
+### Known opub-ui type note
+opub-ui's `Combobox` declares `onChange: (val: string)` / `selectedValue: string` but at runtime passes/returns value-string **arrays** for multi-select (the rest of the app uses `any` here); `PublicationForm` casts at that single boundary rather than typing the whole component `any`. `Button` variants are `success | basic | interactive | critical` (there is no `primary`/`secondary`).
+
+## Data — reads/writes
+Queries: `getPublication`, `publications` (dashboard list), `resourceTypes`, `sectors`, `geographies`, UC/Collab publication-link queries. Mutations: create/update/publish/unpublish, block add(file/youtube)/remove/reorder, `updateUsecasePublications`, `updateCollaborativePublications`. No local persistence beyond TanStack Query cache.
+
+## Security
+Read: the detail query is gated server-side (drafts only to owner/org); the listing and search only return the caller's own or published resources. Write: every mutation carries the entity header (`{ [entityType]: entitySlug }`) and is authorized server-side. The link picker only lists published resources and the backend refuses to attach a draft.
+
+## SDK impact
+n/a (frontend slice) — the SDK client lives in the backend repo.
+
+## Tests
+
+### Layer 6 — Browser e2e (on-demand)
+Highest-value flows: create-from-org-dashboard end to end (metadata → blocks → publish, save-state persists across tabs); create-from-individual-dashboard; block editor (add PDF + deck + YouTube in any order, reorder, remove, invalid-YouTube inline error, over-cap file toast); edit round-trips all metadata (no silent erasure); detail (inline PDF, inline YouTube, download card for other types, zero-block); Explore listing with Resource Type/Geography/Sector filters and no owner filter; unified search returns a Resource result linking to its detail; UC/Collab assign links a published Resource (unpublished not selectable) and the linked-count flag shows on the publish tab.
+
+Layers 1–5: n/a — this is the FE slice; deterministic + journey tests live in the backend repo. FE has no unit runner; the deterministic gate is `npm run generate` + `npx tsc --noEmit` + `npm run lint` (all green: zero new tsc errors over baseline, lint clean).
+
+### Visual checklist (manual, on request)
+Empty / loading / populated / error listing; card matching the Dataset card; detail with 0 blocks and with many; long author list wrap; inline PDF at mobile width; responsive 16:9 YouTube; dark mode; "linked to N" as text (not a warning banner); download card shows format + size; **"Resource" everywhere, never "Publication"** — spot-check nav, card, detail, dashboard, search.
+
+### LLM-judge points
+n/a — all assertions deterministic.
+
+## Limitations & future work
+- The detail/listing **card** reuses the generic `ListingComponent`/detail composition; a bespoke "3 files + 1 video" multi-block indicator is a design follow-up.
+- `PublicationForm` uses a comma-separated authors field and a native date input rather than a dynamic multi-author widget / styled date-picker — functional, polish deferred.
+- Visual/browser (Layer 6) verification is written here but not yet walked — run on request.