Improved About us section + message when content not available in a language #15
|
@ -0,0 +1,87 @@
|
|||
import AppLayout from "components/AppLayout";
|
||||
import Markdawn from "components/Markdown/Markdawn";
|
||||
import TOC from "components/Markdown/TOC";
|
||||
import ReturnButton, {
|
||||
ReturnButtonType,
|
||||
} from "components/PanelComponents/ReturnButton";
|
||||
import ContentPanel from "components/Panels/ContentPanel";
|
||||
import SubPanel from "components/Panels/SubPanel";
|
||||
import { getPost } from "graphql/operations";
|
||||
import { GetPostQuery } from "graphql/operations-types";
|
||||
import { GetStaticProps } from "next";
|
||||
import { useRouter } from "next/router";
|
||||
import { AppStaticProps, getAppStaticProps } from "queries/getAppStaticProps";
|
||||
import { prettySlug } from "queries/helpers";
|
||||
|
||||
interface AccordsHandbookProps extends AppStaticProps {
|
||||
post: GetPostQuery["posts"]["data"][number]["attributes"];
|
||||
}
|
||||
|
||||
export default function AccordsHandbook(
|
||||
props: AccordsHandbookProps
|
||||
): JSX.Element {
|
||||
const { langui, post } = props;
|
||||
const router = useRouter();
|
||||
|
||||
const subPanel = (
|
||||
<SubPanel>
|
||||
<ReturnButton
|
||||
href="/about-us"
|
||||
displayOn={ReturnButtonType.Desktop}
|
||||
langui={langui}
|
||||
title={langui.about_us}
|
||||
horizontalLine
|
||||
/>
|
||||
{post.translations.length > 0 && post.translations[0].body && (
|
||||
<TOC
|
||||
text={post.translations[0].body}
|
||||
router={router}
|
||||
title={post.translations[0].title}
|
||||
/>
|
||||
)}
|
||||
</SubPanel>
|
||||
);
|
||||
|
||||
const contentPanel = (
|
||||
<ContentPanel>
|
||||
<ReturnButton
|
||||
href="/about-us"
|
||||
displayOn={ReturnButtonType.Mobile}
|
||||
langui={langui}
|
||||
title={langui.about_us}
|
||||
className="mb-10"
|
||||
/>
|
||||
{post.translations.length > 0 && (
|
||||
<Markdawn router={router} text={post.translations[0].body} />
|
||||
)}
|
||||
</ContentPanel>
|
||||
);
|
||||
|
||||
return (
|
||||
<AppLayout
|
||||
navTitle={
|
||||
post.translations.length > 0
|
||||
? post.translations[0].title
|
||||
: prettySlug(post.slug)
|
||||
}
|
||||
subPanel={subPanel}
|
||||
contentPanel={contentPanel}
|
||||
{...props}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
export const getStaticProps: GetStaticProps = async (context) => {
|
||||
const props: AccordsHandbookProps = {
|
||||
...(await getAppStaticProps(context)),
|
||||
post: (
|
||||
await getPost({
|
||||
slug: "accords-handbook",
|
||||
language_code: context.locale || "en",
|
||||
})
|
||||
).posts.data[0].attributes,
|
||||
};
|
||||
return {
|
||||
props: props,
|
||||
};
|
||||
};
|
|
@ -16,13 +16,13 @@ export default function AboutUs(props: AboutUsProps): JSX.Element {
|
|||
title={langui.about_us}
|
||||
description={langui.about_us_description}
|
||||
/>
|
||||
<NavOption title="Accord’s Handbook" url="/about-us/handbook" border />
|
||||
<NavOption title="Accord’s Handbook" url="/about-us/accords-handbook" border />
|
||||
<NavOption
|
||||
title="Site information"
|
||||
url="/about-us/site-information"
|
||||
title="Legality"
|
||||
url="/about-us/legality"
|
||||
border
|
||||
/>
|
||||
<NavOption title="FAQ" url="/about-us/faq" border />
|
||||
<NavOption title="Members" url="/about-us/members" border />
|
||||
<NavOption title="Sharing Policy" url="/about-us/sharing-policy" border />
|
||||
<NavOption title="Contact us" url="/about-us/contact" border />
|
||||
</SubPanel>
|
||||
|
|
|
@ -1,12 +1,15 @@
|
|||
import AppLayout from "components/AppLayout";
|
||||
import Markdawn from "components/Markdown/Markdawn";
|
||||
import TOC from "components/Markdown/TOC";
|
||||
import ReturnButton, {
|
||||
ReturnButtonType,
|
||||
} from "components/PanelComponents/ReturnButton";
|
||||
import ContentPanel from "components/Panels/ContentPanel";
|
||||
import SubPanel from "components/Panels/SubPanel";
|
||||
import { getPost } from "graphql/operations";
|
||||
import { GetPostQuery } from "graphql/operations-types";
|
||||
import { GetStaticProps } from "next";
|
||||
import { useRouter } from "next/router";
|
||||
import { AppStaticProps, getAppStaticProps } from "queries/getAppStaticProps";
|
||||
import { prettySlug } from "queries/helpers";
|
||||
|
||||
|
@ -16,17 +19,38 @@ interface SiteInfoProps extends AppStaticProps {
|
|||
|
||||
export default function SiteInformation(props: SiteInfoProps): JSX.Element {
|
||||
const { langui, post } = props;
|
||||
const router = useRouter();
|
||||
|
||||
const subPanel = (
|
||||
<SubPanel>
|
||||
<ReturnButton
|
||||
href="/about-us"
|
||||
displayOn={ReturnButtonType.Desktop}
|
||||
langui={langui}
|
||||
title={langui.about_us}
|
||||
horizontalLine
|
||||
/>
|
||||
{post.translations.length > 0 && post.translations[0].body && (
|
||||
<TOC
|
||||
text={post.translations[0].body}
|
||||
router={router}
|
||||
title={post.translations[0].title}
|
||||
/>
|
||||
)}
|
||||
</SubPanel>
|
||||
);
|
||||
|
||||
const contentPanel = (
|
||||
<ContentPanel>
|
||||
<ReturnButton
|
||||
href="/about-us"
|
||||
displayOn={ReturnButtonType.Both}
|
||||
displayOn={ReturnButtonType.Mobile}
|
||||
langui={langui}
|
||||
title={langui.about_us}
|
||||
className="mb-10"
|
||||
/>
|
||||
{post.translations.length > 0 && (
|
||||
<Markdawn text={post.translations[0].body} />
|
||||
<Markdawn router={router} text={post.translations[0].body} />
|
||||
)}
|
||||
</ContentPanel>
|
||||
);
|
||||
|
@ -38,6 +62,7 @@ export default function SiteInformation(props: SiteInfoProps): JSX.Element {
|
|||
? post.translations[0].title
|
||||
: prettySlug(post.slug)
|
||||
}
|
||||
subPanel={subPanel}
|
||||
contentPanel={contentPanel}
|
||||
{...props}
|
||||
/>
|
||||
|
@ -49,7 +74,7 @@ export const getStaticProps: GetStaticProps = async (context) => {
|
|||
...(await getAppStaticProps(context)),
|
||||
post: (
|
||||
await getPost({
|
||||
slug: "site-information",
|
||||
slug: "legality",
|
||||
language_code: context.locale || "en",
|
||||
})
|
||||
).posts.data[0].attributes,
|
|
@ -0,0 +1,85 @@
|
|||
import AppLayout from "components/AppLayout";
|
||||
import Markdawn from "components/Markdown/Markdawn";
|
||||
import TOC from "components/Markdown/TOC";
|
||||
import ReturnButton, {
|
||||
ReturnButtonType,
|
||||
} from "components/PanelComponents/ReturnButton";
|
||||
import ContentPanel from "components/Panels/ContentPanel";
|
||||
import SubPanel from "components/Panels/SubPanel";
|
||||
import { getPost } from "graphql/operations";
|
||||
import { GetPostQuery } from "graphql/operations-types";
|
||||
import { GetStaticProps } from "next";
|
||||
import { useRouter } from "next/router";
|
||||
import { AppStaticProps, getAppStaticProps } from "queries/getAppStaticProps";
|
||||
import { prettySlug } from "queries/helpers";
|
||||
|
||||
interface SharingPolicyProps extends AppStaticProps {
|
||||
post: GetPostQuery["posts"]["data"][number]["attributes"];
|
||||
}
|
||||
|
||||
export default function SharingPolicy(props: SharingPolicyProps): JSX.Element {
|
||||
const { langui, post } = props;
|
||||
const router = useRouter();
|
||||
|
||||
const subPanel = (
|
||||
<SubPanel>
|
||||
<ReturnButton
|
||||
href="/about-us"
|
||||
displayOn={ReturnButtonType.Desktop}
|
||||
langui={langui}
|
||||
title={langui.about_us}
|
||||
horizontalLine
|
||||
/>
|
||||
{post.translations.length > 0 && post.translations[0].body && (
|
||||
<TOC
|
||||
text={post.translations[0].body}
|
||||
router={router}
|
||||
title={post.translations[0].title}
|
||||
/>
|
||||
)}
|
||||
</SubPanel>
|
||||
);
|
||||
|
||||
const contentPanel = (
|
||||
<ContentPanel>
|
||||
<ReturnButton
|
||||
href="/about-us"
|
||||
displayOn={ReturnButtonType.Mobile}
|
||||
langui={langui}
|
||||
title={langui.about_us}
|
||||
className="mb-10"
|
||||
/>
|
||||
{post.translations.length > 0 && (
|
||||
<Markdawn router={router} text={post.translations[0].body} />
|
||||
)}
|
||||
</ContentPanel>
|
||||
);
|
||||
|
||||
return (
|
||||
<AppLayout
|
||||
navTitle={
|
||||
post.translations.length > 0
|
||||
? post.translations[0].title
|
||||
: prettySlug(post.slug)
|
||||
}
|
||||
subPanel={subPanel}
|
||||
contentPanel={contentPanel}
|
||||
{...props}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
export const getStaticProps: GetStaticProps = async (context) => {
|
||||
const props: SharingPolicyProps = {
|
||||
...(await getAppStaticProps(context)),
|
||||
post: (
|
||||
await getPost({
|
||||
slug: "sharing-policy",
|
||||
language_code: context.locale || "en",
|
||||
})
|
||||
).posts.data[0].attributes,
|
||||
};
|
||||
return {
|
||||
props: props,
|
||||
};
|
||||
};
|
Loading…
Reference in New Issue