From 8fdc59552fc3ab59549265e6a06fc22a538ad2e7 Mon Sep 17 00:00:00 2001 From: Roland Schneider Date: Fri, 18 Jul 2025 16:22:02 +0200 Subject: [PATCH] [yoga-13] add listing component to text-with-image components --- yoga-app/src/app/page.tsx | 1 - yoga-app/src/app/seed/route.ts | 2 - .../src/components/achievements.component.tsx | 1 - yoga-app/src/components/listing.component.tsx | 69 +++++++++++++++++++ .../src/components/mainHeaderComponent.tsx | 3 - .../src/components/our.services.component.tsx | 1 - .../src/components/price.item.component.tsx | 1 - .../src/components/subHeader.component.tsx | 2 - .../components/text.with.image.component.tsx | 2 +- ...tsx => text.with.left.image.component.tsx} | 3 +- .../text.with.right.image.component.tsx | 3 +- 11 files changed, 74 insertions(+), 14 deletions(-) create mode 100644 yoga-app/src/components/listing.component.tsx rename yoga-app/src/components/{text.with.right.left.component.tsx => text.with.left.image.component.tsx} (93%) diff --git a/yoga-app/src/app/page.tsx b/yoga-app/src/app/page.tsx index b464a98..c24146b 100644 --- a/yoga-app/src/app/page.tsx +++ b/yoga-app/src/app/page.tsx @@ -30,7 +30,6 @@ export default async function Home() { feedbacks } = pageData; - console.info("Home page data", pageData); return ( <> { header && } diff --git a/yoga-app/src/app/seed/route.ts b/yoga-app/src/app/seed/route.ts index 87c21c6..8742257 100644 --- a/yoga-app/src/app/seed/route.ts +++ b/yoga-app/src/app/seed/route.ts @@ -110,10 +110,8 @@ export async function GET() { // 'Uncomment this file and remove this line. You can delete this file when you are finished.', // }); try { - console.info("get request") strapiApi.getHomePage(); - console.info("begin") await connectionPool.query(`BEGIN`); await seedUsers(); await seedCustomers(); diff --git a/yoga-app/src/components/achievements.component.tsx b/yoga-app/src/components/achievements.component.tsx index 829843d..d8e4f82 100644 --- a/yoga-app/src/components/achievements.component.tsx +++ b/yoga-app/src/components/achievements.component.tsx @@ -10,7 +10,6 @@ export default function AchievementsComponent({ title,header,description } }: Props){ - console.info("achievements",achievements) return (
diff --git a/yoga-app/src/components/listing.component.tsx b/yoga-app/src/components/listing.component.tsx new file mode 100644 index 0000000..9cf7c2c --- /dev/null +++ b/yoga-app/src/components/listing.component.tsx @@ -0,0 +1,69 @@ +import React from 'react'; + +interface ListingComponentProps { + text?: string; +} + +const ListingComponent: React.FC = ({ text }) => { + if (!text) { + return null; + } + + const lines = text.split('\n'); + const elements: React.ReactNode[] = []; + let currentParagraph: string[] = []; + let currentList: React.ReactNode[] = []; + + const flushParagraph = () => { + if (currentParagraph.length > 0) { + elements.push(

{currentParagraph.join('\n')}

); + currentParagraph = []; + } + }; + + const flushList = () => { + if (currentList.length > 0) { + elements.push(
    {currentList}
); + currentList = []; + } + }; + + let currentListItemContent: string[] = []; + + const flushListItem = () => { + if(currentListItemContent.length > 0) { + currentList.push(
  • {currentListItemContent.join('\n')}
    • ); + currentListItemContent = []; + } + } + + for (const line of lines) { + const trimmedLine = line.trim(); + + if (trimmedLine.startsWith('- ') || trimmedLine.startsWith('* ')) { + flushParagraph(); // End any ongoing paragraph + flushListItem(); // End previous list item + currentListItemContent.push(trimmedLine.substring(2)); + } else if (trimmedLine === '') { + flushListItem(); + flushList(); // An empty line ends the list + } else { + if (currentList.length > 0 || currentListItemContent.length > 0) { + // This line belongs to the current list item + currentListItemContent.push(line); + } else { + // This is a paragraph line + flushList(); + currentParagraph.push(line); + } + } + } + + flushListItem(); + flushList(); + flushParagraph(); + + return <>{elements}; +}; + +export default ListingComponent; \ No newline at end of file diff --git a/yoga-app/src/components/mainHeaderComponent.tsx b/yoga-app/src/components/mainHeaderComponent.tsx index 1f0c5ba..01922ea 100644 --- a/yoga-app/src/components/mainHeaderComponent.tsx +++ b/yoga-app/src/components/mainHeaderComponent.tsx @@ -24,9 +24,6 @@ const MainHeaderComponent = ({ config: { const logoImageFile: StrapiFile = (common?.logoImage) as StrapiFile; const logoImageSrc = logoImageFile ? strapiApi.getImageUrl(logoImageFile.url) : undefined; - console.info("MainHeaderComponent imageSrc",image, imageSrc); - // console.info("MainHeaderComponent logoImgSrc",image, logoImageSrc); - return (
    diff --git a/yoga-app/src/components/our.services.component.tsx b/yoga-app/src/components/our.services.component.tsx index 5ad6f74..703c622 100644 --- a/yoga-app/src/components/our.services.component.tsx +++ b/yoga-app/src/components/our.services.component.tsx @@ -67,7 +67,6 @@ const OurServiceComponent = ({config: {title,header,description,services}}: Prop } ] }; - console.info(settings) return (
    diff --git a/yoga-app/src/components/price.item.component.tsx b/yoga-app/src/components/price.item.component.tsx index cc6c343..4e64e10 100644 --- a/yoga-app/src/components/price.item.component.tsx +++ b/yoga-app/src/components/price.item.component.tsx @@ -11,7 +11,6 @@ export function PriceItemComponent({config: {header, description, option1,option // there are some issues with the strapi generated types const iconFile: StrapiFile = icon as StrapiFile; const imageFile: StrapiFile = image as StrapiFile; - console.info("image:",strapiApi.getImageUrl(imageFile?.url)); return (
    diff --git a/yoga-app/src/components/subHeader.component.tsx b/yoga-app/src/components/subHeader.component.tsx index f1e9567..4279c4a 100644 --- a/yoga-app/src/components/subHeader.component.tsx +++ b/yoga-app/src/components/subHeader.component.tsx @@ -25,8 +25,6 @@ const SubHeaderComponent = ( { logoImageSrc = strapiApi.getImageUrl(logoImageFile?.url) ; } - console.info("image", logoImageSrc); - return (