-
Notifications
You must be signed in to change notification settings - Fork 72
/
_app.tsx
94 lines (82 loc) · 3.09 KB
/
_app.tsx
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
import type { AppProps } from 'next/app';
// DEMO TEAM CUSTOMIZATION - Upgrade to next.js 11. Encapsulate router event handlers in useEffect.
import { useEffect } from 'react';
// END CUSTOMIZATION
import { I18nProvider } from 'next-localization';
import Head from 'next/head';
import Script from 'next/script';
import NProgress from 'nprogress';
import {
isCdpConfigured,
CDP_API_TARGET_ENDPOINT,
CDP_CLIENT_KEY,
} from 'src/services/BoxeverService';
// Using nprogress are completely optional.
// nprogress provides a loading indicator on page/route changes.
// Remove it in package.json as well if removed here.
import 'nprogress/nprogress.css';
import 'assets/css/main.css';
NProgress.configure({ showSpinner: false, trickleSpeed: 100 });
function App({ Component, pageProps, router }: AppProps): JSX.Element {
// DEMO TEAM CUSTOMIZATION - Upgrade to next.js 11. Encapsulate router event handlers in useEffect.
useEffect(() => {
const nProgressStart = () => {
NProgress.start();
};
const nProgressDone = () => {
NProgress.done();
};
router.events.on('routeChangeStart', nProgressStart);
router.events.on('routeChangeComplete', nProgressDone);
router.events.on('routeChangeError', nProgressDone);
// If the component is unmounted, unsubscribe
// from the events with the `off` method:
return () => {
router.events.off('routeChangeStart', nProgressStart);
router.events.off('routeChangeComplete', nProgressDone);
router.events.off('routeChangeError', nProgressDone);
};
}, [router]);
// END CUSTOMIZATION
const { dictionary, ...rest } = pageProps;
// DEMO TEAM CUSTOMIZATION - CDP integration
const cdpScripts = isCdpConfigured ? (
<>
<Script id="cdpSettings">{`
// Define the Boxever queue
var _boxeverq = _boxeverq || [];
// Define the Boxever settings
_boxever_settings = {
client_key: '${CDP_CLIENT_KEY}',
target: '${CDP_API_TARGET_ENDPOINT}',
cookie_domain: '.edge.localhost',
};`}</Script>
<Script src="https://d1mj578wat5n4o.cloudfront.net/boxever-1.4.8.min.js"></Script>
</>
) : undefined;
// END CUSTOMIZATION
// DEMO TEAM CUSTOMIZATION - Add head section
return (
<>
<Head>
<meta charSet="UTF-8"></meta>
<meta httpEquiv="X-UA-Compatible" content="IE=edge"></meta>
<meta name="viewport" content="width=device-width, initial-scale=1.0"></meta>
<meta name="description" content="Play! Summit" />
</Head>
{/*
Use the next-localization (w/ rosetta) library to provide our translation dictionary to the app.
Note Next.js does not (currently) provide anything for translation, only i18n routing.
If your app is not multilingual, next-localization and references to it can be removed.
*/}
<I18nProvider lngDict={dictionary} locale={pageProps.locale}>
<Component {...rest} />
</I18nProvider>
{/* DEMO TEAM CUSTOMIZATION - CDP integration */}
{cdpScripts}
{/* END CUSTOMIZATION*/}
</>
);
// END CUSTOMIZATION
}
export default App;