rschneider/yogastic
1
0
Fork 0
Code Issues 28 Pull Requests Actions Packages Projects 1 Releases Wiki Activity

[yoga-20] subscribe.component.tsx: make image editable

Browse Source
This commit is contained in:
Roland Schneider 2025-08-27 09:21:20 +02:00
parent 917918d742
commit 622f2a7686
18 changed files with 166 additions and 41 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
api.http
View File

@ -29,7 +29,7 @@ GET {{domain}}/api/yoga-single-services?filters[name][$eq]=service4
Accept: application/json
### GET service page
GET {{domain}}/api/service-list-page?fields[0]=*&populate[services][fields][0]=*&populate[services][populate][image][fields][0]=name&populate[services][populate][image][fields][1]=mime&populate[services][populate][image][fields][2]=url&populate[common][fields][0]=*&populate[common][populate][logoImage][fields][0]=name&populate[common][populate][logoImage][fields][1]=mime&populate[common][populate][logoImage][fields][2]=url&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]=*
GET {{domain}}/api/service-list-page?fields[0]=*&populate[services][fields][0]=*&populate[services][populate][image][fields][0]=name&populate[services][populate][image][fields][1]=mime&populate[services][populate][image][fields][2]=url&populate[common][fields][0]=*&populate[common][populate][logoImage][fields][0]=name&populate[common][populate][logoImage][fields][1]=mime&populate[common][populate][logoImage][fields][2]=url&populate[subscribeNow][fields][0]=*&populate[subscribeNow][populate][image][fields][0]=name&populate[subscribeNow][populate][image][fields][1]=mime&populate[subscribeNow][populate][image][fields][2]=url&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]=*&populate[footer][populate][logo][fields][0]=name&populate[footer][populate][logo][fields][1]=mime&populate[footer][populate][logo][fields][2]=url
Accept: application/json

11
yoga-app/src/api/strapi/query/about.json
View File

@ -72,7 +72,16 @@
}
},
"subscribeNow": {
"fields": ["*"]
"fields": ["*"],
"populate": {
"image": {
"fields": [
"name",
"mime",
"url"
]
}
}
},
"footer": {
"fields": ["*"],

11
yoga-app/src/api/strapi/query/contact.json
View File

@ -16,7 +16,16 @@
"fields": ["*"]
},
"subscribe": {
"fields": ["*"]
"fields": ["*"],
"populate": {
"image": {
"fields": [
"name",
"mime",
"url"
]
}
}
},
"footer": {
"fields": ["*"],

11
yoga-app/src/api/strapi/query/faq.json
View File

@ -51,7 +51,16 @@
}
},
"subscribe": {
"fields": ["*"]
"fields": ["*"],
"populate": {
"image": {
"fields": [
"name",
"mime",
"url"
]
}
}
},
"footer": {
"fields": ["*"],

11
yoga-app/src/api/strapi/query/home.json
View File

@ -43,7 +43,16 @@
}
},
"subscribeNow": {
"fields": ["*"]
"fields": ["*"],
"populate": {
"image": {
"fields": [
"name",
"mime",
"url"
]
}
}
},
"blogs": {
"fields": ["*"],

11
yoga-app/src/api/strapi/query/prices.json
View File

@ -48,7 +48,16 @@
}
},
"subscribe": {
"fields": ["*"]
"fields": ["*"],
"populate": {
"image": {
"fields": [
"name",
"mime",
"url"
]
}
}
},
"footer": {
"fields": ["*"],

11
yoga-app/src/api/strapi/query/service-list.json
View File

@ -18,7 +18,16 @@
}
},
"subscribeNow": {
"fields": ["*"]
"fields": ["*"],
"populate": {
"image": {
"fields": [
"name",
"mime",
"url"
]
}
}
},
"footer": {
"fields": ["*"],

11
yoga-app/src/api/strapi/query/service.json
View File

@ -10,7 +10,16 @@
}
},
"subscribeNow": {
"fields": ["*"]
"fields": ["*"],
"populate": {
"image": {
"fields": [
"name",
"mime",
"url"
]
}
}
},
"footer": {
"fields": ["*"],

11
yoga-app/src/api/strapi/query/services.json
View File

@ -90,7 +90,16 @@
}
},
"subscribe": {
"fields": ["*"]
"fields": ["*"],
"populate": {
"image": {
"fields": [
"name",
"mime",
"url"
]
}
}
},
"footer": {
"fields": ["*"],

46
yoga-app/src/api/strapi/strapi-client.ts
View File

@ -3,42 +3,56 @@ import {Payload} from "@/types/generated-strapi-interfaces/common/Payload";
const STRAPI_URL = process.env.STRAPI_URL;
class StrapiClient{
class StrapiClient {
constructor(private strapiUrl: string = "http://localhost:1337") {
}
public getImageUrl(imagePath: string){
if ( !imagePath ){
public getImageUrl(imagePath: string) {
if (!imagePath) {
return "dummy.png"
}
return '/image/'+ imagePath;
return '/image/' + imagePath;
}
public async httpGet(path: string){
console.info("httpGet", path);
return await httpClient.httpGet(this.strapiUrl + path);
public async httpGet(path: string) {
let result = undefined;
try {
const absoluteUrl = this.strapiUrl + path;
console.info("httpGet", {path,absoluteUrl});
result = await httpClient.httpGet(this.strapiUrl + path);
} catch (e) {
console.log("httpGet error", e);
throw e;
}
public async httpGetJson<T>(url: string): Promise<Payload<T>>{
if (!result.ok) {
console.info("httpGet not ok", result);
throw new Error(result.statusText);
}
return result;
}
public async httpGetJson<T>(url: string): Promise<Payload<T>> {
const response = await this.httpGet(url);
return await response.json();
}
public async findContentType<T>(contentType: string,options?: FindContentOptions): Promise<Payload<T>>{
public async findContentType<T>(contentType: string, options?: FindContentOptions): Promise<Payload<T>> {
const searchParams = new URLSearchParams();
if ( options?.populateAll ){
searchParams.append("populate","*");
if (options?.populateAll) {
searchParams.append("populate", "*");
}
if (options?.localeAll){
searchParams.append("_locale","all");
if (options?.localeAll) {
searchParams.append("_locale", "all");
}
const response = await this.httpGet("/api/"+contentType+"?"+searchParams.toString());
const response = await this.httpGet("/api/" + contentType + "?" + searchParams.toString());
return await response.json();
}
}
export interface FindContentOptions{
export interface FindContentOptions {
populateAll?: boolean;
localeAll?: boolean;
}

2
yoga-app/src/app/page.tsx
View File

@ -39,7 +39,7 @@ export default async function Home() {
{ contactUs && <ContactUsComponent contactUs={contactUs} /> }
{ prices && <PricingComponent config={prices}/> }
{ feedbacks && <FeedbackComponent config={feedbacks} /> }
{ blogs && <BlogPostsComponent config={blogs} /> }
{ blogs && blogs.posts?.length && <BlogPostsComponent config={blogs} /> }
{ subscribeNow && <SubscribeComponent config={subscribeNow} /> }
{ footer && <FooterComponent config={footer} /> }
<AosComponent />

4
yoga-app/src/app/services/page.tsx
View File

@ -12,7 +12,7 @@ import SubHeaderComponent from "@/components/subHeader.component";
export default async function Services() {
const {
header,
header = undefined,
description,
ourServices,
contactUs,
@ -22,7 +22,7 @@ export default async function Services() {
footer,
subscribe,
common
} = await strapiApi.getServicesPage();
} = await strapiApi.getServicesPage()
return (
<>
<SubHeaderComponent header={{header1:header,description}} common={common}/>

4
yoga-app/src/components/subscribe.component.module.css Normal file
View File

@ -0,0 +1,4 @@
.roundedImage img{
border-bottom-right-radius: 60px;
}

16
yoga-app/src/components/subscribe.component.tsx
View File

@ -3,14 +3,22 @@ import {
YogaSubscribeNowComponent_Plain
} from "@/types/generated-strapi-interfaces/api/yoga-subscribe-now-component";
import clsx from "clsx";
import {StrapiFile} from "@/types/types";
import strapiApi from "@/api/strapi/strapi-api";
import styles from './subscribe.component.module.css'
export interface Props{
config: YogaSubscribeNowComponent_Plain,
styleClass?: string
styleClass?: string,
}
const SubscribeComponent = ({
config: {title,header,placeHolderEmail,buttonSubscribeLabel},
config: {title,header,placeHolderEmail,buttonSubscribeLabel, image = undefined},
styleClass
}: Props) => {
const imageFile: StrapiFile = image as StrapiFile;
if (!imageFile || !imageFile.url) {
return null
}
return (
<section className={clsx("subscribe_section",styleClass)}>
<div className="container">
@ -32,8 +40,8 @@ const SubscribeComponent = ({
</div>
</div>
<div className="col-lg-5 col-md-5 col-sm-6 col-xs-12">
<figure className="subscribe_image mb-0">
<YogaImageComponent src="/assets/images/subscribe_image.png" alt=""/>
<figure className={clsx(styles.roundedImage,"subscribe_image","mb-0",)}>
<YogaImageComponent src={strapiApi.getImageUrl(imageFile.url)} alt=""/>
</figure>
</div>
</div>

8
yoga-app/src/types/generated-strapi-interfaces/api/yoga-subscribe-now-component.ts
View File

@ -1,5 +1,9 @@
// Interface automatically generated by schemas-to-ts
import { Media } from '../components/shared/Media';
import { Media_Plain } from '../components/shared/Media';
import { AdminPanelRelationPropertyModification } from '../common/AdminPanelRelationPropertyModification';
export interface YogaSubscribeNowComponent {
id: number;
attributes: {
@ -7,6 +11,7 @@ export interface YogaSubscribeNowComponent {
header?: string;
placeHolderEmail?: string;
buttonSubscribeLabel?: string;
image?: { data: Media };
};
}
export interface YogaSubscribeNowComponent_Plain {
@ -15,6 +20,7 @@ export interface YogaSubscribeNowComponent_Plain {
header?: string;
placeHolderEmail?: string;
buttonSubscribeLabel?: string;
image?: Media_Plain;
}
export interface YogaSubscribeNowComponent_NoRelations {
@ -23,6 +29,7 @@ export interface YogaSubscribeNowComponent_NoRelations {
header?: string;
placeHolderEmail?: string;
buttonSubscribeLabel?: string;
image?: number;
}
export interface YogaSubscribeNowComponent_AdminPanelLifeCycle {
@ -31,4 +38,5 @@ export interface YogaSubscribeNowComponent_AdminPanelLifeCycle {
header?: string;
placeHolderEmail?: string;
buttonSubscribeLabel?: string;
image?: AdminPanelRelationPropertyModification<Media_Plain>;
}

8
yoga-cms/generated-strapi-interfaces/api/yoga-subscribe-now-component.ts
View File

@ -1,5 +1,9 @@
// Interface automatically generated by schemas-to-ts
import { Media } from '../components/shared/Media';
import { Media_Plain } from '../components/shared/Media';
import { AdminPanelRelationPropertyModification } from '../common/AdminPanelRelationPropertyModification';
export interface YogaSubscribeNowComponent {
id: number;
attributes: {
@ -7,6 +11,7 @@ export interface YogaSubscribeNowComponent {
header?: string;
placeHolderEmail?: string;
buttonSubscribeLabel?: string;
image?: { data: Media };
};
}
export interface YogaSubscribeNowComponent_Plain {
@ -15,6 +20,7 @@ export interface YogaSubscribeNowComponent_Plain {
header?: string;
placeHolderEmail?: string;
buttonSubscribeLabel?: string;
image?: Media_Plain;
}
export interface YogaSubscribeNowComponent_NoRelations {
@ -23,6 +29,7 @@ export interface YogaSubscribeNowComponent_NoRelations {
header?: string;
placeHolderEmail?: string;
buttonSubscribeLabel?: string;
image?: number;
}
export interface YogaSubscribeNowComponent_AdminPanelLifeCycle {
@ -31,4 +38,5 @@ export interface YogaSubscribeNowComponent_AdminPanelLifeCycle {
header?: string;
placeHolderEmail?: string;
buttonSubscribeLabel?: string;
image?: AdminPanelRelationPropertyModification<Media_Plain>;
}

11
yoga-cms/src/api/yoga-subscribe-now-component/content-types/yoga-subscribe-now-component/schema.json
View File

@ -4,7 +4,8 @@
"info": {
"singularName": "yoga-subscribe-now-component",
"pluralName": "yoga-subscribe-now-components",
"displayName": "YogaSubscribeNowComponent"
"displayName": "YogaSubscribeNowComponent",
"description": ""
},
"options": {
"draftAndPublish": true
@ -22,6 +23,14 @@
},
"buttonSubscribeLabel": {
"type": "string"
},
"image": {
"allowedTypes": [
"images",
"files"
],
"type": "media",
"multiple": false
}
}
}

2
yoga-cms/types/generated/contentTypes.d.ts vendored
View File

@ -2038,6 +2038,7 @@ export interface ApiYogaSubscribeNowComponentYogaSubscribeNowComponent
extends Struct.CollectionTypeSchema {
collectionName: 'yoga_subscribe_now_components';
info: {
description: '';
displayName: 'YogaSubscribeNowComponent';
pluralName: 'yoga-subscribe-now-components';
singularName: 'yoga-subscribe-now-component';
@ -2051,6 +2052,7 @@ export interface ApiYogaSubscribeNowComponentYogaSubscribeNowComponent
createdBy: Schema.Attribute.Relation<'oneToOne', 'admin::user'> &
Schema.Attribute.Private;
header: Schema.Attribute.String;
image: Schema.Attribute.Media<'images' | 'files'>;
locale: Schema.Attribute.String & Schema.Attribute.Private;
localizations: Schema.Attribute.Relation<
'oneToMany',