From 22272e0a171231f9496158e91cb21fbbe2f4c745 Mon Sep 17 00:00:00 2001 From: Schneider Roland Date: Wed, 21 May 2025 22:28:12 +0200 Subject: [PATCH] add service detail page --- api.http | 6 ++- yoga-app/package-lock.json | 11 +++++ yoga-app/package.json | 1 + yoga-app/src/api/strapi/query/service.json | 25 ++++++++++ yoga-app/src/api/strapi/strapi-api.ts | 8 +++- yoga-app/src/app/services/[slug]/page.tsx | 20 ++++++-- .../api/article.ts | 8 ++-- .../api/yoga-single-service.ts | 8 ++-- .../api/yoga-single-service.ts | 8 ++-- .../yoga-single-service/schema.json | 7 +-- yoga-cms/types/generated/contentTypes.d.ts | 46 ++++++++++++++++--- 11 files changed, 118 insertions(+), 30 deletions(-) create mode 100644 yoga-app/src/api/strapi/query/service.json diff --git a/api.http b/api.http index 177f818..141dff6 100644 --- a/api.http +++ b/api.http @@ -26,4 +26,8 @@ Accept: application/json ### GET request with a header GET {{domain}}/api/yoga-single-services?filters[name][$eq]=service4 -Accept: application/json \ No newline at end of file +Accept: application/json + +### GET service page +GET {{domain}}/api/service-page?fields[0]=*&populate[subscribeNow][fields][0]=*&populate[footer][fields][0]=*&populate[footer][populate][links][fields][0]=*&populate[footer][populate][contactUsEmail][fields][0]=*&populate[footer][populate][contactUsLocation][fields][0]=*&populate[footer][populate][contactUsPhoneNumber][fields][0]=* +Accept: application/json diff --git a/yoga-app/package-lock.json b/yoga-app/package-lock.json index 74ee318..f1496f2 100644 --- a/yoga-app/package-lock.json +++ b/yoga-app/package-lock.json @@ -9,6 +9,7 @@ "version": "0.1.0", "dependencies": { "@fortawesome/fontawesome-free": "^6.7.2", + "@strapi/blocks-react-renderer": "^1.0.2", "@strapi/database": "^5.10.3", "@types/aos": "^3.0.7", "@types/bcrypt": "^5.0.2", @@ -1393,6 +1394,16 @@ "node": ">=8" } }, + "node_modules/@strapi/blocks-react-renderer": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/@strapi/blocks-react-renderer/-/blocks-react-renderer-1.0.2.tgz", + "integrity": "sha512-pRV/WMreo5wyrLg7J0pw1DM9lg8U8m+QA7Bd8CPN3beUBTdDhYrFTTNZh3XveEdnURZNJu1X0aWXAg4SzVg7QA==", + "hasInstallScript": true, + "peerDependencies": { + "react": "^18.0.0 || ^19.0.0", + "react-dom": "^18.0.0 || ^19.0.0" + } + }, "node_modules/@strapi/database": { "version": "5.10.3", "resolved": "https://registry.npmjs.org/@strapi/database/-/database-5.10.3.tgz", diff --git a/yoga-app/package.json b/yoga-app/package.json index 5752382..512e19e 100644 --- a/yoga-app/package.json +++ b/yoga-app/package.json @@ -11,6 +11,7 @@ }, "dependencies": { "@fortawesome/fontawesome-free": "^6.7.2", + "@strapi/blocks-react-renderer": "^1.0.2", "@strapi/database": "^5.10.3", "@types/aos": "^3.0.7", "@types/bcrypt": "^5.0.2", diff --git a/yoga-app/src/api/strapi/query/service.json b/yoga-app/src/api/strapi/query/service.json new file mode 100644 index 0000000..ab1330e --- /dev/null +++ b/yoga-app/src/api/strapi/query/service.json @@ -0,0 +1,25 @@ +{ + "fields": ["*"], + "populate": { + "subscribe": { + "fields": ["*"] + }, + "footer": { + "fields": ["*"], + "populate": { + "links": { + "fields": ["*"] + }, + "contactUsEmail": { + "fields": ["*"] + }, + "contactUsLocation": { + "fields": ["*"] + }, + "contactUsPhoneNumber": { + "fields": ["*"] + } + } + } + } +} diff --git a/yoga-app/src/api/strapi/strapi-api.ts b/yoga-app/src/api/strapi/strapi-api.ts index 4208309..49bd386 100644 --- a/yoga-app/src/api/strapi/strapi-api.ts +++ b/yoga-app/src/api/strapi/strapi-api.ts @@ -4,6 +4,7 @@ import qs from "qs"; import aboutQuery from "@/api/strapi/query/about.json"; import homeQuery from "@/api/strapi/query/home.json"; import servicesQuery from "@/api/strapi/query/services.json"; +import serviceQuery from "@/api/strapi/query/service.json"; import pricesQuery from "@/api/strapi/query/prices.json"; import faqQuery from "@/api/strapi/query/faq.json"; import contactQuery from "@/api/strapi/query/contact.json"; @@ -14,6 +15,7 @@ import {PricesPage_Plain} from "@/types/generated-strapi-interfaces/api/prices-p import {FaqPage_Plain} from "@/types/generated-strapi-interfaces/api/faq-page"; import {ContactPage_Plain} from "@/types/generated-strapi-interfaces/api/contact-page"; import {YogaSingleService_Plain} from "@/types/generated-strapi-interfaces/api/yoga-single-service"; +import {ServicePage_Plain} from "@/types/generated-strapi-interfaces/api/service-page"; class StrapiApi{ @@ -43,7 +45,11 @@ class StrapiApi{ return this.getJson("/api/services-page?",servicesQuery); } - public getServicePage(name: string): Promise{ + public getServicePage(): Promise{ + return this.getJson("/api/service-page?",serviceQuery); + } + + public getService(name: string): Promise{ return this.getJson("/api/yoga-single-services?", { filters: { name: { diff --git a/yoga-app/src/app/services/[slug]/page.tsx b/yoga-app/src/app/services/[slug]/page.tsx index c28afa2..c867876 100644 --- a/yoga-app/src/app/services/[slug]/page.tsx +++ b/yoga-app/src/app/services/[slug]/page.tsx @@ -1,9 +1,12 @@ import React from "react"; import strapiApi from "@/api/strapi/strapi-api"; +import {BlocksContent, BlocksRenderer} from "@strapi/blocks-react-renderer"; export default async function ServiceArticlePage({params}: { - params: { slug: string} + params: Promise<{ slug: string}> } ) { - const servicesByName = await strapiApi.getServicePage(params.slug); + const {slug} = await params + const {footer= undefined, subscribeNow = undefined} = await strapiApi.getServicePage(); + const servicesByName = await strapiApi.getService(slug); // return ( // <> // {header && description && } @@ -17,10 +20,19 @@ export default async function ServiceArticlePage({params}: { // // // ); - console.info("slug", params.slug); + console.info("slug", slug); console.info("servicesByName", servicesByName); + const selectedService = servicesByName[0]; + const article = selectedService.article; + console.info("article", article); + + selectedService.article return ( -
hello world {params.slug}
+ <> + + { subscribeNow && } + { footer && } + ); } diff --git a/yoga-app/src/types/generated-strapi-interfaces/api/article.ts b/yoga-app/src/types/generated-strapi-interfaces/api/article.ts index 4d334fe..0ed5302 100644 --- a/yoga-app/src/types/generated-strapi-interfaces/api/article.ts +++ b/yoga-app/src/types/generated-strapi-interfaces/api/article.ts @@ -17,7 +17,7 @@ export interface Article { cover?: { data: Media }; author?: { data: Author }; category?: { data: Category }; - blocks?: object; + blocks?: any; }; } export interface Article_Plain { @@ -28,7 +28,7 @@ export interface Article_Plain { cover?: Media_Plain; author?: Author_Plain; category?: Category_Plain; - blocks?: object; + blocks?: any; } export interface Article_NoRelations { @@ -39,7 +39,7 @@ export interface Article_NoRelations { cover?: number; author?: number; category?: number; - blocks?: object; + blocks?: any; } export interface Article_AdminPanelLifeCycle { @@ -50,5 +50,5 @@ export interface Article_AdminPanelLifeCycle { cover?: AdminPanelRelationPropertyModification; author?: AdminPanelRelationPropertyModification; category?: AdminPanelRelationPropertyModification; - blocks?: object; + blocks?: any; } diff --git a/yoga-app/src/types/generated-strapi-interfaces/api/yoga-single-service.ts b/yoga-app/src/types/generated-strapi-interfaces/api/yoga-single-service.ts index d09adba..7cf126e 100644 --- a/yoga-app/src/types/generated-strapi-interfaces/api/yoga-single-service.ts +++ b/yoga-app/src/types/generated-strapi-interfaces/api/yoga-single-service.ts @@ -13,7 +13,7 @@ export interface YogaSingleService { image?: { data: Media }; imageAlt?: string; name?: string; - article?: string; + article?: any; locale: string; localizations?: { data: YogaSingleService[] }; }; @@ -26,7 +26,7 @@ export interface YogaSingleService_Plain { image?: Media_Plain; imageAlt?: string; name?: string; - article?: string; + article?: any; locale: string; localizations?: YogaSingleService_Plain[]; } @@ -39,7 +39,7 @@ export interface YogaSingleService_NoRelations { image?: number; imageAlt?: string; name?: string; - article?: string; + article?: any; locale: string; localizations?: YogaSingleService[]; } @@ -52,7 +52,7 @@ export interface YogaSingleService_AdminPanelLifeCycle { image?: AdminPanelRelationPropertyModification; imageAlt?: string; name?: string; - article?: string; + article?: any; locale: string; localizations?: YogaSingleService[]; } diff --git a/yoga-cms/generated-strapi-interfaces/api/yoga-single-service.ts b/yoga-cms/generated-strapi-interfaces/api/yoga-single-service.ts index d09adba..7cf126e 100644 --- a/yoga-cms/generated-strapi-interfaces/api/yoga-single-service.ts +++ b/yoga-cms/generated-strapi-interfaces/api/yoga-single-service.ts @@ -13,7 +13,7 @@ export interface YogaSingleService { image?: { data: Media }; imageAlt?: string; name?: string; - article?: string; + article?: any; locale: string; localizations?: { data: YogaSingleService[] }; }; @@ -26,7 +26,7 @@ export interface YogaSingleService_Plain { image?: Media_Plain; imageAlt?: string; name?: string; - article?: string; + article?: any; locale: string; localizations?: YogaSingleService_Plain[]; } @@ -39,7 +39,7 @@ export interface YogaSingleService_NoRelations { image?: number; imageAlt?: string; name?: string; - article?: string; + article?: any; locale: string; localizations?: YogaSingleService[]; } @@ -52,7 +52,7 @@ export interface YogaSingleService_AdminPanelLifeCycle { image?: AdminPanelRelationPropertyModification; imageAlt?: string; name?: string; - article?: string; + article?: any; locale: string; localizations?: YogaSingleService[]; } diff --git a/yoga-cms/src/api/yoga-single-service/content-types/yoga-single-service/schema.json b/yoga-cms/src/api/yoga-single-service/content-types/yoga-single-service/schema.json index b6bbdfa..c5b54a8 100644 --- a/yoga-cms/src/api/yoga-single-service/content-types/yoga-single-service/schema.json +++ b/yoga-cms/src/api/yoga-single-service/content-types/yoga-single-service/schema.json @@ -73,12 +73,7 @@ "type": "string" }, "article": { - "pluginOptions": { - "i18n": { - "localized": true - } - }, - "type": "richtext" + "type": "blocks" } } } diff --git a/yoga-cms/types/generated/contentTypes.d.ts b/yoga-cms/types/generated/contentTypes.d.ts index 5481a63..732d7c5 100644 --- a/yoga-cms/types/generated/contentTypes.d.ts +++ b/yoga-cms/types/generated/contentTypes.d.ts @@ -849,6 +849,44 @@ export interface ApiPricesPagePricesPage extends Struct.SingleTypeSchema { }; } +export interface ApiServicePageServicePage extends Struct.SingleTypeSchema { + collectionName: 'service_pages'; + info: { + description: ''; + displayName: 'ServicePage'; + pluralName: 'service-pages'; + singularName: 'service-page'; + }; + options: { + draftAndPublish: true; + }; + attributes: { + createdAt: Schema.Attribute.DateTime; + createdBy: Schema.Attribute.Relation<'oneToOne', 'admin::user'> & + Schema.Attribute.Private; + description: Schema.Attribute.Text; + footer: Schema.Attribute.Relation< + 'oneToOne', + 'api::yoga-footer.yoga-footer' + >; + header: Schema.Attribute.String; + locale: Schema.Attribute.String & Schema.Attribute.Private; + localizations: Schema.Attribute.Relation< + 'oneToMany', + 'api::service-page.service-page' + > & + Schema.Attribute.Private; + publishedAt: Schema.Attribute.DateTime; + subscribeNow: Schema.Attribute.Relation< + 'oneToOne', + 'api::yoga-subscribe-now-component.yoga-subscribe-now-component' + >; + updatedAt: Schema.Attribute.DateTime; + updatedBy: Schema.Attribute.Relation<'oneToOne', 'admin::user'> & + Schema.Attribute.Private; + }; +} + export interface ApiServicesPageServicesPage extends Struct.SingleTypeSchema { collectionName: 'services_pages'; info: { @@ -1694,12 +1732,7 @@ export interface ApiYogaSingleServiceYogaSingleService }; }; attributes: { - article: Schema.Attribute.RichText & - Schema.Attribute.SetPluginOptions<{ - i18n: { - localized: true; - }; - }>; + article: Schema.Attribute.Blocks; buttonLink: Schema.Attribute.String & Schema.Attribute.SetPluginOptions<{ i18n: { @@ -2511,6 +2544,7 @@ declare module '@strapi/strapi' { 'api::page.page': ApiPagePage; 'api::person.person': ApiPersonPerson; 'api::prices-page.prices-page': ApiPricesPagePricesPage; + 'api::service-page.service-page': ApiServicePageServicePage; 'api::services-page.services-page': ApiServicesPageServicesPage; 'api::yoga-about-us-component.yoga-about-us-component': ApiYogaAboutUsComponentYogaAboutUsComponent; 'api::yoga-about-us-with-boxes-component.yoga-about-us-with-boxes-component': ApiYogaAboutUsWithBoxesComponentYogaAboutUsWithBoxesComponent;