Permalink
Jun 24, 2022
Jun 24, 2022
Jun 24, 2022
Newer
100644
120 lines (95 sloc)
3.8 KB
1
import { EditablePage } from '@magnolia/react-editor';
2
import Navigation from '../templates/components/Navigation';
3
import Basic from '../templates/pages/Basic';
4
import Contact from '../templates/pages/Contact';
5
import Headline from '../templates/components/Headline';
6
import Image from '../templates/components/Image';
7
import Paragraph from '../templates/components/Paragraph';
8
import Expander from '../templates/components/Expander';
9
import List from '../templates/components/List';
10
import Item from '../templates/components/Item';
11
import { languages, getCurrentLanguage, setURLSearchParams } from '../utils';
12
13
const nodeName = '/nextjs-ssg-minimal';
14
const config = {
15
componentMappings: {
16
'nextjs-ssg-minimal-lm:pages/basic': Basic,
17
'nextjs-ssg-minimal-lm:pages/contact': Contact,
18
19
'spa-lm:components/headline': Headline,
20
'spa-lm:components/image': Image,
21
'spa-lm:components/paragraph': Paragraph,
22
'spa-lm:components/expander': Expander,
23
'spa-lm:components/list': List,
24
'spa-lm:components/listItem': Item,
25
},
26
};
27
28
const defaultBaseUrl = process.env.NEXT_PUBLIC_MGNL_HOST;
29
const pagesApi = defaultBaseUrl + '/.rest/delivery/pages/v1';
30
const templateAnnotationsApi = defaultBaseUrl + '/.rest/template-annotations/v1/website';
31
const pagenavApi = defaultBaseUrl + '/.rest/delivery/pagenav/v1';
32
33
function getStaticPath(node, paths) {
34
let pathname = node['@path'].replace(nodeName, '');
35
36
pathname = pathname.split('/');
37
38
pathname.shift();
39
40
languages.forEach((language, i) => {
41
let i18nPathname = JSON.parse(JSON.stringify(pathname));
42
43
if (i !== 0) i18nPathname.unshift(language);
44
45
paths.push({ params: { pathname: i18nPathname } });
46
});
47
48
node['@nodes'].forEach((nodeName) => getStaticPath(node[nodeName], paths));
49
}
50
51
export async function getStaticPaths() {
52
let paths = [];
53
54
const navRes = await fetch(pagenavApi + nodeName);
55
const nav = await navRes.json();
56
57
getStaticPath(nav, paths);
58
59
return {
60
paths,
61
fallback: false,
62
};
63
}
64
65
export async function getStaticProps(context) {
66
const resolvedUrl = context.preview
67
? context.previewData.query.slug
68
: context.params.pathname
69
? '/' + context.params.pathname.join('/')
70
: '';
71
const currentLanguage = getCurrentLanguage(resolvedUrl);
72
const isDefaultLanguage = currentLanguage === languages[0];
73
const isPagesApp = context.previewData?.query?.mgnlPreview || null;
74
let props = {
75
isPagesApp,
76
isPagesAppEdit: isPagesApp === 'false',
77
basename: isDefaultLanguage ? '' : '/' + currentLanguage,
78
};
79
80
global.mgnlInPageEditor = props.isPagesAppEdit;
81
82
// Find out page path in Magnolia
83
let pagePath = context.preview
84
? nodeName + resolvedUrl.replace(new RegExp('.*' + nodeName), '')
85
: nodeName + resolvedUrl;
86
87
if (!isDefaultLanguage) {
88
pagePath = pagePath.replace('/' + currentLanguage, '');
89
}
90
91
// Fetching page content
92
const pagesRes = await fetch(setURLSearchParams(pagesApi + pagePath, 'lang=' + currentLanguage));
93
props.page = await pagesRes.json();
94
95
// Fetching page navigation
96
const pagenavRes = await fetch(setURLSearchParams(pagenavApi + nodeName, 'lang=' + currentLanguage));
97
props.pagenav = await pagenavRes.json();
98
99
// Fetch template annotations only inside Magnolia WYSIWYG
100
if (isPagesApp) {
101
const templateAnnotationsRes = await fetch(templateAnnotationsApi + pagePath);
102
103
props.templateAnnotations = await templateAnnotationsRes.json();
104
}
105
106
return {
107
props,
108
};
109
}
110
111
export default function Pathname(props) {
112
const { page, templateAnnotations, pagenav, isPagesAppEdit, basename } = props;
113
114
return (
115
<div className={isPagesAppEdit ? 'disable-a-pointer-events' : ''}>
116
{pagenav && <Navigation content={pagenav} nodeName={nodeName} basename={basename} />}
117
{page && <EditablePage content={page} config={config} templateAnnotations={templateAnnotations} />}
118
</div>
119
);
120
}