diff --git a/components/layout.js b/components/layout.tsx
similarity index 84%
rename from components/layout.js
rename to components/layout.tsx
index c99f8c83..c9b18b14 100644
--- a/components/layout.js
+++ b/components/layout.tsx
@@ -5,7 +5,7 @@ import Head from 'next/head';
import styled from 'styled-components';
import PlanContext from 'context/plan';
-import SiteContext from 'context/site';
+import { useSite } from 'context/site';
import EmbedContext from 'context/embed';
import ThemedGlobalStyles from 'common/ThemedGlobalStyles';
import { useTheme } from 'common/theme';
@@ -20,7 +20,7 @@ const Content = styled.main`
function Layout({ children }) {
const plan = useContext(PlanContext);
- const site = useContext(SiteContext);
+ const site = useSite();
const embed = useContext(EmbedContext);
const theme = useTheme();
const iconBase = theme.name
@@ -45,6 +45,13 @@ function Layout({ children }) {
//const displayTitle = plan.parent ? plan.parent.name : siteTitle;
//const rootLink = plan.parent ? plan.parent.viewUrl : '/';
+ const websiteJson = `{
+ "@context" : "https://schema.org",
+ "@type" : "WebSite",
+ "name" : "${displaySite.title}",
+ "url" : "${site.baseURL}"
+ }`;
+
return (
<>
@@ -53,7 +60,10 @@ function Layout({ children }) {
{site.baseURL && (
-
+ <>
+
+
+
)}
{iconBase && (
@@ -76,6 +86,10 @@ function Layout({ children }) {
content={googleSiteVerificationTag}
/>
)}
+
{!embed.active && }
@@ -92,9 +106,14 @@ Layout.propTypes = {
export default Layout;
-export function Meta(props) {
+type MetaProps = {
+ title?: string;
+ shareImageUrl?: string;
+ description?: string;
+};
+
+export function Meta({ title, shareImageUrl, description }: MetaProps) {
const plan = React.useContext(PlanContext);
- const { title, shareImageUrl, description } = props;
const parentPlanTitle = plan.parent
? `${plan.parent.name}/${plan.shortName || plan.name}`
: null;
@@ -106,7 +125,7 @@ export function Meta(props) {
const ogTitle = title || siteTitle;
const ogDescription = description || generalContent.siteDescription;
const ogImage =
- shareImageUrl || plan.image?.social?.src || plan.image?.rendition.src;
+ shareImageUrl || plan.image?.social?.src || plan.image?.rendition?.src;
return (
@@ -125,15 +144,3 @@ export function Meta(props) {
);
}
-
-Meta.defaultProps = {
- title: null,
- shareImageUrl: null,
- description: null,
-};
-
-Meta.propTypes = {
- title: PropTypes.string,
- shareImageUrl: PropTypes.string,
- description: PropTypes.string,
-};
diff --git a/context/site.tsx b/context/site.tsx
index fc9e878f..362eeddf 100644
--- a/context/site.tsx
+++ b/context/site.tsx
@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useContext } from 'react';
type SiteContextProps = {
deploymentType: string;
@@ -12,4 +12,5 @@ const SiteContext = React.createContext>({
deploymentType: 'development',
});
+export const useSite = () => useContext(SiteContext);
export default SiteContext;
diff --git a/pages/_app.tsx b/pages/_app.tsx
index 1b74403e..475d2c21 100644
--- a/pages/_app.tsx
+++ b/pages/_app.tsx
@@ -184,11 +184,11 @@ async function getPlan(ctx) {
function getSiteContext(ctx) {
const { currentURL } = ctx.req;
const { deploymentType } = publicRuntimeConfig;
-
return {
deploymentType,
hostname: currentURL.hostname,
path: currentURL.path,
+ baseURL: currentURL.baseURL,
};
}