Accords-Library-Archive
/
accords-library.com
1
0
Fork 0
Code Issues Pull Requests 5 Packages Projects Releases Wiki Activity

Improved About us section + message when content not available in a language #15

Merged
DrMint merged 10 commits from develop into main 2022-03-20 13:51:52 +00:00
Conversation 0 Commits 10 Files Changed 25 +204 -7
4 changed files with 204 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit 76a44457e4 - Show all commits

87
src/pages/about-us/accords-handbook.tsx Normal file
View File

@ -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,
};
};

8
src/pages/about-us/index.tsx
View File

@ -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>

31
src/pages/about-us/site-information.tsx → src/pages/about-us/legality.tsx
View File

@ -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,

85
src/pages/about-us/sharing-policy.tsx Normal file
View File

@ -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,
};
};