Provider Flow Update

app/[locale]/(user)/collaboratives/[collaborativeSlug]/CollaborativeDetailsClient.tsx

@@ -16,6 +16,7 @@ import BreadCrumbs from '@/components/BreadCrumbs';
 import { Icons } from '@/components/icons';
 import JsonLd from '@/components/JsonLd';
 import { Loading } from '@/components/loading';
+import { getUseCaseSummaryExcerpt } from '@/app/[locale]/dashboard/[entityType]/[entitySlug]/usecases/edit/content-document';
 import { stripMarkdown } from '../../search/components/UnifiedListingComponent';
 import PrimaryDetails from '../components/Details';
 import Metadata from '../components/Metadata';
@@ -518,7 +519,7 @@ const CollaborativeDetailClient = () => {
 
                       const commonProps = {
                         title: useCase.title || '',
-                        description: stripMarkdown(useCase.summary || ''),
+                        description: getUseCaseSummaryExcerpt(useCase.summary),
                         metadataContent: MetadataContent,
                         tag: useCase.tags?.map((t) => t.value) || [],
                         leftFooterChips: LeftFooterChips,

app/[locale]/(user)/components/Content.tsx

@@ -121,7 +121,7 @@ export const Content = () => {
                     <Text
                       color="onBgDefault"
                       fontWeight="semibold"
-                      className="whitespace-nowrap text-xs uppercase text-textSurfaceStats"
+                      className="text-xs whitespace-nowrap uppercase text-textSurfaceStats"
                     >
                       {item.label}
                     </Text>

app/[locale]/(user)/components/Sectors.tsx

@@ -8,8 +8,8 @@ import { Button, Text } from 'opub-ui';
 
 import { GraphQL } from '@/lib/api';
 import { buildSectorSlugParam } from '@/lib/utils';
-import { SectorListingSkeleton } from '@/components/loading';
 import { Icons } from '@/components/icons';
+import { SectorListingSkeleton } from '@/components/loading';
 import { SectorCard } from '@/components/SectorCard';
 
 const sectorDetails = graphql(`
@@ -32,7 +32,7 @@ const Sectors = () => {
   const router = useRouter();
 
   return (
-    <div className="container pt-10 pb-12 md:px-8 lg:pt-20 lg:pb-24">
+    <div className="container pb-12 pt-10 md:px-8 lg:pb-24 lg:pt-20">
       <div className="flex flex-wrap items-center justify-between gap-4 px-4 md:px-12 lg:gap-2 lg:px-12 ">
         <div className="flex flex-col gap-2">
           <Text variant="headingXl">Explore Sectors</Text>
@@ -44,7 +44,7 @@ const Sectors = () => {
         <div className="mr-8 lg:mr-12">
           <Button
             kind="tertiary"
-            className="bg-transparent border-none shadow-none text-primaryText px-0 hover:underline outline-none focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[var(--border-interactive-focused)]"
+            className="shadow-none border-none bg-transparent px-0 text-primaryText outline-none hover:underline focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[var(--border-interactive-focused)]"
             onClick={() => {
               router.push('/sectors');
             }}

app/[locale]/(user)/components/UseCases.tsx

@@ -19,7 +19,7 @@ import { GraphQL } from '@/lib/api';
 import { cn, formatDate } from '@/lib/utils';
 import { Icons } from '@/components/icons';
 import { UseCaseListingSkeleton } from '@/components/loading';
-import { stripMarkdown } from '../search/components/UnifiedListingComponent';
+import { getUseCaseSummaryExcerpt } from '@/app/[locale]/dashboard/[entityType]/[entitySlug]/usecases/edit/content-document';
 import Styles from './datasets.module.scss';
 
 const useCasesListDoc = graphql(`
@@ -182,7 +182,7 @@ const UseCasesListingPage = () => {
                           },
                         ]}
                         imageUrl={`${process.env.NEXT_PUBLIC_BACKEND_URL}/${item.logo?.path.replace('/code/files/', '')}`}
-                        description={stripMarkdown(item.summary || '')}
+                        description={getUseCaseSummaryExcerpt(item.summary)}
                         iconColor="metadata"
                         variation={'collapsed'}
                         // type={[

app/[locale]/(user)/datasets/[datasetIdentifier]/components/Resources/index.tsx

@@ -2,7 +2,7 @@
 
 import Link from 'next/link';
 import { useParams } from 'next/navigation';
-import PdfPreview from '@/app/[locale]/(user)/components/PdfPreview';
+import { PdfPreview } from '@/components/file-preview';
 import { graphql } from '@/gql';
 import { DatasetResourcesQuery } from '@/gql/generated/graphql';
 import { useQuery } from '@tanstack/react-query';

app/[locale]/(user)/publishers/components/UseCases.tsx

@@ -11,7 +11,7 @@ import { Card, Icon, Spinner, Text } from 'opub-ui';
 import { GraphQL } from '@/lib/api';
 import { cn, extractPublisherId, formatDate } from '@/lib/utils';
 import { Icons } from '@/components/icons';
-import { stripMarkdown } from '../../search/components/UnifiedListingComponent';
+import { getUseCaseSummaryExcerpt } from '@/app/[locale]/dashboard/[entityType]/[entitySlug]/usecases/edit/content-document';
 
 const userPublishedUseCasesDoc = graphql(`
   query userPublishedUseCasesList($userId: ID!) {
@@ -209,7 +209,7 @@ const UseCases = ({ type }: { type: 'organization' | 'Publisher' }) => {
                   label: 'Published by',
                 },
               ]}
-              description={stripMarkdown(item.summary || '')}
+              description={getUseCaseSummaryExcerpt(item.summary)}
               iconColor="warning"
               variation={'collapsed'}
             />

app/[locale]/(user)/usecases/[useCaseSlug]/UsecaseDetailsClient.tsx

@@ -15,6 +15,7 @@ import BreadCrumbs from '@/components/BreadCrumbs';
 import { Icons } from '@/components/icons';
 import JsonLd from '@/components/JsonLd';
 import { Loading } from '@/components/loading';
+import { getUseCaseSummaryExcerpt } from '@/app/[locale]/dashboard/[entityType]/[entitySlug]/usecases/edit/content-document';
 import { stripMarkdown } from '../../search/components/UnifiedListingComponent';
 import PrimaryDetails from '../components/Details';
 import Metadata from '../components/Metadata';
@@ -217,7 +218,7 @@ const UseCaseDetailClient = () => {
     name: 'CivicDataLab',
     url: `${process.env.NEXT_PUBLIC_PLATFORM_URL}/usecases/${params.useCaseSlug}`,
     description:
-      UseCaseDetails?.useCase?.summary ||
+      getUseCaseSummaryExcerpt(UseCaseDetails?.useCase?.summary) ||
       `Explore open data and curated datasets in the ${UseCaseDetails?.useCase?.title} sector.`,
     publisher: {
       '@type': 'Organization',

app/[locale]/(user)/usecases/[useCaseSlug]/page.tsx

@@ -3,6 +3,7 @@ import { graphql } from '@/gql';
 
 import { GraphQLPublic } from '@/lib/api';
 import { generatePageMetadata } from '@/lib/utils';
+import { getUseCaseSummaryExcerpt } from '@/app/[locale]/dashboard/[entityType]/[entitySlug]/usecases/edit/content-document';
 import UseCaseDetailClient from './UsecaseDetailsClient';
 
 const UseCaseInfoQuery = graphql(`
@@ -36,7 +37,7 @@ export async function generateMetadata({
     return generatePageMetadata({
       title: `${UseCase?.title} | Sector Data | CivicDataSpace`,
       description:
-        UseCase?.summary ||
+        getUseCaseSummaryExcerpt(UseCase?.summary) ||
         `Explore open data and curated datasets in the ${UseCase?.title} sector.`,
       keywords: UseCase?.tags?.map((tag) => tag.value) || [],
       openGraph: {
@@ -45,7 +46,7 @@ export async function generateMetadata({
         url: `${process.env.NEXT_PUBLIC_PLATFORM_URL}/usecases/${useCaseSlug}`,
         title: `${UseCase?.title} | Sector Data | CivicDataSpace`,
         description:
-          UseCase?.summary ||
+          getUseCaseSummaryExcerpt(UseCase?.summary) ||
           `Explore open data and curated datasets in the ${UseCase?.title} sector.`,
         siteName: 'CivicDataSpace',
         image: `${process.env.NEXT_PUBLIC_PLATFORM_URL}/og.png`,

app/[locale]/(user)/usecases/components/Details.tsx

@@ -6,7 +6,8 @@ import { Button, Icon, Spinner, Tag, Text, Tray } from 'opub-ui';
 
 import { UseCasedetailsQuery } from '@/gql/generated/graphql';
 import { Icons } from '@/components/icons';
-import { RichTextRenderer } from '@/components/RichTextRenderer';
+import { ContentBlocksRenderer } from '@/app/[locale]/dashboard/[entityType]/[entitySlug]/usecases/edit/components/ContentBlocksRenderer';
+import { parseUseCaseContent } from '@/app/[locale]/dashboard/[entityType]/[entitySlug]/usecases/edit/content-document';
 import Metadata from './Metadata';
 
 interface PrimaryDetailsProps {
@@ -16,12 +17,20 @@ interface PrimaryDetailsProps {
 
 const PrimaryDetails = ({ data, isLoading }: PrimaryDetailsProps) => {
   const [open, setOpen] = useState(false);
+  const content = parseUseCaseContent(data.useCase.summary);
 
   return (
     <div>
       <div>
         <Text variant="heading2xl">{data.useCase.title}</Text>
       </div>
+      {content.subtitle ? (
+        <div className="mt-2">
+          <Text variant="bodyLg" color="subdued">
+            {content.subtitle}
+          </Text>
+        </div>
+      ) : null}
       <div className="mt-4 flex flex-wrap gap-2">
         {data.useCase.tags?.map((item, index: number) => (
           <div key={index}>
@@ -96,7 +105,7 @@ const PrimaryDetails = ({ data, isLoading }: PrimaryDetailsProps) => {
           </div>
         )}
         <div className="mt-6 lg:mt-10">
-          <RichTextRenderer content={data.useCase.summary ?? ''} />
+          <ContentBlocksRenderer summary={data.useCase.summary} />
         </div>
       </div>
     </div>