141 lines
4.1 KiB
TypeScript
141 lines
4.1 KiB
TypeScript
import axios from 'axios'
|
|
import { NextSeo } from 'next-seo'
|
|
import Image from 'next/image'
|
|
import Link from 'next/link'
|
|
import React, { useEffect, useState } from 'react'
|
|
import { GetServerSideProps } from 'next'
|
|
|
|
import Container from 'components/BlogContainer'
|
|
import CardContent from 'components/CardContent'
|
|
import CTA from 'components/Cta'
|
|
import Layout from 'components/Layout'
|
|
import SectionSeparator from 'components/SectionSeparator'
|
|
|
|
import HeaderImage from '../../components/Header/HeaderImage'
|
|
import { getStory } from 'pages/api/storypage'
|
|
|
|
export default function TheStory(props) {
|
|
const { loading, promos, settings, preview } = props
|
|
const [dat, setDat] = useState([])
|
|
const [dataHeader, setDataHeader] = useState({})
|
|
|
|
useEffect(() => {
|
|
const contentLoad = async function () {
|
|
let data = await axios.get('/api/storypage')
|
|
let dt = data.data
|
|
if (dt.contentpage != undefined) {
|
|
let yy = dt.contentpage.map(function (x, i) {
|
|
let c = {}
|
|
let dx = []
|
|
;(function deep(v, l) {
|
|
for (let i = 0; i < l; i++) {
|
|
Object.keys(v[i]).forEach(function (f) {
|
|
if (f == 'children') {
|
|
deep(v[i][f], v[i][f].length)
|
|
} else if (f == 'text') {
|
|
dx.push(v[i][f])
|
|
}
|
|
})
|
|
}
|
|
})(x.content, x.content.length)
|
|
c['text'] = dx
|
|
c['title'] = x.title
|
|
c['url'] = x.coverImage
|
|
return c
|
|
})
|
|
//console.log(yy)
|
|
setDat(yy)
|
|
}
|
|
let hD = {
|
|
title: dt.title,
|
|
subTitle: dt.subtitle,
|
|
imageUrl: dt.coverImage,
|
|
}
|
|
setDataHeader(hD)
|
|
}
|
|
if (dataHeader['title'] == undefined) {
|
|
contentLoad()
|
|
}
|
|
}, [dataHeader, dat])
|
|
|
|
return (
|
|
<>
|
|
<NextSeo
|
|
title="The Story - Beginning of An Epic Adventure | GWK Bali Cultural Park"
|
|
description="Beginning of An Epic Adventure of GWK Bali Cultural Park"
|
|
additionalLinkTags={[
|
|
{
|
|
rel: 'icon',
|
|
href: '../favicon/favicon.ico',
|
|
},
|
|
]}
|
|
openGraph={{
|
|
type: 'website',
|
|
url: 'https://www.gwkbali.com/pages/the-story',
|
|
title:
|
|
'The Story - Beginning of An Epic Adventure | GWK Bali Cultural Park',
|
|
description:
|
|
'Bali is known for its rich cultural heritage, and the GWK Cultural Park is one of the best places to experience it.',
|
|
images: [
|
|
{
|
|
url: '/images/a677de7dd8a0b9b1b3f1c3da6041147e528fd338-2150x1433.jpg',
|
|
//url: 'https://cdn.sanity.io/images/helyis1v/production/a677de7dd8a0b9b1b3f1c3da6041147e528fd338-2150x1433.jpg',
|
|
width: 800,
|
|
height: 600,
|
|
alt: 'The Story - Beginning of An Epic Adventure | GWK Bali Cultural Park',
|
|
},
|
|
{
|
|
url: '/images/a677de7dd8a0b9b1b3f1c3da6041147e528fd338-2150x1433.jpg',
|
|
//url: 'https://cdn.sanity.io/images/helyis1v/production/a677de7dd8a0b9b1b3f1c3da6041147e528fd338-2150x1433.jpg',
|
|
width: 800,
|
|
height: 600,
|
|
alt: 'The Story - Beginning of An Epic Adventure | GWK Bali Cultural Park',
|
|
},
|
|
],
|
|
}}
|
|
/>
|
|
<Layout loading={loading} preview={preview}>
|
|
<div>
|
|
<HeaderImage dat={props.dataHeader} />
|
|
|
|
<Container>
|
|
{dat.map((c, j) => {
|
|
return <CardContent key={j} props={c} />
|
|
})}
|
|
|
|
<div className="p-10">
|
|
<CTA key={1} />
|
|
</div>
|
|
</Container>
|
|
</div>
|
|
</Layout>
|
|
</>
|
|
)
|
|
}
|
|
|
|
export const getServerSideProps: GetServerSideProps = async () => {
|
|
try {
|
|
const data = await getStory()
|
|
let dt = data;
|
|
const hD = {
|
|
title: dt.title,
|
|
subTitle: dt.subtitle,
|
|
imageUrl: dt.coverImage,
|
|
};
|
|
|
|
return {
|
|
props: {
|
|
dataHeader: hD,
|
|
dataEvent: [],
|
|
},
|
|
};
|
|
} catch (error) {
|
|
console.error('Error fetching data:', error);
|
|
return {
|
|
props: {
|
|
dataHeader: null,
|
|
dataEvent: [],
|
|
},
|
|
};
|
|
}
|
|
}; |