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

Post lack of attribute now send a 404

This commit is contained in:
DrMint 2022-05-07 11:19:28 +02:00
parent 85106d1735
commit 349f53ea27
7 changed files with 23 additions and 231 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

182
src/components/Post.tsx
View File

@ -1,182 +0,0 @@
import { GetPostQuery } from "graphql/generated";
import useSmartLanguage from "hooks/useSmartLanguage";
import { AppStaticProps } from "queries/getAppStaticProps";
import { getStatusDescription, prettySlug } from "queries/helpers";
import AppLayout from "./AppLayout";
import Chip from "./Chip";
import HorizontalLine from "./HorizontalLine";
import Markdawn from "./Markdown/Markdawn";
import TOC from "./Markdown/TOC";
import ReturnButton, { ReturnButtonType } from "./PanelComponents/ReturnButton";
import ContentPanel from "./Panels/ContentPanel";
import SubPanel from "./Panels/SubPanel";
import RecorderChip from "./RecorderChip";
import ThumbnailHeader from "./ThumbnailHeader";
import ToolTip from "./ToolTip";
interface Props {
post: Exclude<
Exclude<
GetPostQuery["posts"],
null | undefined
>["data"][number]["attributes"],
null | undefined
>;
langui: AppStaticProps["langui"];
languages: AppStaticProps["languages"];
currencies: AppStaticProps["currencies"];
returnHref?: string;
returnTitle?: string | null | undefined;
displayCredits?: boolean;
displayToc?: boolean;
displayThumbnailHeader?: boolean;
displayTitle?: boolean;
displayLanguageSwitcher?: boolean;
prependBody?: JSX.Element;
appendBody?: JSX.Element;
}
export default function Post(props: Props): JSX.Element {
const {
post,
langui,
languages,
returnHref,
returnTitle,
displayCredits,
displayToc,
displayThumbnailHeader,
displayLanguageSwitcher,
appendBody,
prependBody,
} = props;
const displayTitle = props.displayTitle ?? true;
const [selectedTranslation, LanguageSwitcher] = useSmartLanguage({
items: post.translations,
languages: languages,
languageExtractor: (item) => item?.language?.data?.attributes?.code,
});
const thumbnail =
selectedTranslation?.thumbnail?.data?.attributes ??
post.thumbnail?.data?.attributes;
const body = selectedTranslation?.body ?? "";
const title = selectedTranslation?.title ?? prettySlug(post.slug);
const except = selectedTranslation?.excerpt ?? "";
const subPanel =
returnHref || returnTitle || displayCredits || displayToc ? (
<SubPanel>
{returnHref && returnTitle && (
<ReturnButton
href={returnHref}
title={returnTitle}
langui={langui}
displayOn={ReturnButtonType.desktop}
horizontalLine
/>
)}
{displayCredits && (
<>
{selectedTranslation && (
<div className="grid grid-flow-col place-items-center place-content-center gap-2">
<p className="font-headers">{langui.status}:</p>
<ToolTip
content={getStatusDescription(
selectedTranslation.status,
langui
)}
maxWidth={"20rem"}
>
<Chip>{selectedTranslation.status}</Chip>
</ToolTip>
</div>
)}
{post.authors && post.authors.data.length > 0 && (
<div>
<p className="font-headers">{"Authors"}:</p>
<div className="grid place-items-center place-content-center gap-2">
{post.authors.data.map((author) => (
<>
{author.attributes && (
<RecorderChip
key={author.id}
langui={langui}
recorder={author.attributes}
/>
)}
</>
))}
</div>
</div>
)}
<HorizontalLine />
</>
)}
{displayToc && <TOC text={body} title={title} />}
</SubPanel>
) : undefined;
const contentPanel = (
<ContentPanel>
{returnHref && returnTitle && (
<ReturnButton
href={returnHref}
title={returnTitle}
langui={langui}
displayOn={ReturnButtonType.mobile}
horizontalLine
/>
)}
{displayThumbnailHeader ? (
<>
<ThumbnailHeader
thumbnail={thumbnail}
title={title}
description={except}
langui={langui}
categories={post.categories}
languageSwitcher={<LanguageSwitcher />}
/>
<HorizontalLine />
</>
) : (
<>
{displayLanguageSwitcher && (
<div className="grid place-content-end place-items-start">
<LanguageSwitcher />
</div>
)}
{displayTitle && (
<h1 className="text-center flex gap-3 justify-center text-4xl my-16">
{title}
</h1>
)}
</>
)}
{prependBody}
<Markdawn text={body} />
{appendBody}
</ContentPanel>
);
return (
<AppLayout
navTitle={title}
contentPanel={contentPanel}
subPanel={subPanel}
thumbnail={thumbnail ?? undefined}
{...props}
/>
);
}

12
src/pages/about-us/accords-handbook.tsx
View File

@ -1,20 +1,16 @@
import Post from "components/Post"; import PostPage, { Post } from "components/PostPage";
import { GetPostQuery } from "graphql/generated";
import { getReadySdk } from "graphql/sdk"; import { getReadySdk } from "graphql/sdk";
import { GetStaticPropsContext } from "next"; import { GetStaticPropsContext } from "next";
import { AppStaticProps, getAppStaticProps } from "queries/getAppStaticProps"; import { AppStaticProps, getAppStaticProps } from "queries/getAppStaticProps";
interface Props extends AppStaticProps { interface Props extends AppStaticProps {
post: Exclude< post: Post;
GetPostQuery["posts"],
null | undefined
>["data"][number]["attributes"];
} }
export default function AccordsHandbook(props: Props): JSX.Element { export default function AccordsHandbook(props: Props): JSX.Element {
const { post, langui, languages, currencies } = props; const { post, langui, languages, currencies } = props;
return ( return (
<Post <PostPage
currencies={currencies} currencies={currencies}
languages={languages} languages={languages}
langui={langui} langui={langui}
@ -36,7 +32,7 @@ export async function getStaticProps(
slug: slug, slug: slug,
language_code: context.locale ?? "en", language_code: context.locale ?? "en",
}); });
if (!post.posts) return { notFound: true }; if (!post.posts?.data[0].attributes) return { notFound: true };
const props: Props = { const props: Props = {
...(await getAppStaticProps(context)), ...(await getAppStaticProps(context)),
post: post.posts.data[0].attributes, post: post.posts.data[0].attributes,

12
src/pages/about-us/contact.tsx
View File

@ -1,6 +1,5 @@
import InsetBox from "components/InsetBox"; import InsetBox from "components/InsetBox";
import Post from "components/Post"; import PostPage, { Post } from "components/PostPage";
import { GetPostQuery } from "graphql/generated";
import { getReadySdk } from "graphql/sdk"; import { getReadySdk } from "graphql/sdk";
import { GetStaticPropsContext } from "next"; import { GetStaticPropsContext } from "next";
import { useRouter } from "next/router"; import { useRouter } from "next/router";
@ -10,10 +9,7 @@ import { randomInt } from "queries/helpers";
import { useState } from "react"; import { useState } from "react";
interface Props extends AppStaticProps { interface Props extends AppStaticProps {
post: Exclude< post: Post;
GetPostQuery["posts"],
null | undefined
>["data"][number]["attributes"];
} }
export default function AboutUs(props: Props): JSX.Element { export default function AboutUs(props: Props): JSX.Element {
@ -171,7 +167,7 @@ export default function AboutUs(props: Props): JSX.Element {
); );
return ( return (
<Post <PostPage
currencies={currencies} currencies={currencies}
languages={languages} languages={languages}
langui={langui} langui={langui}
@ -194,7 +190,7 @@ export async function getStaticProps(
slug: slug, slug: slug,
language_code: context.locale ?? "en", language_code: context.locale ?? "en",
}); });
if (!post.posts) return { notFound: true }; if (!post.posts?.data[0].attributes) return { notFound: true };
const props: Props = { const props: Props = {
...(await getAppStaticProps(context)), ...(await getAppStaticProps(context)),
post: post.posts.data[0].attributes, post: post.posts.data[0].attributes,

12
src/pages/about-us/legality.tsx
View File

@ -1,20 +1,16 @@
import Post from "components/Post"; import PostPage, { Post } from "components/PostPage";
import { GetPostQuery } from "graphql/generated";
import { getReadySdk } from "graphql/sdk"; import { getReadySdk } from "graphql/sdk";
import { GetStaticPropsContext } from "next"; import { GetStaticPropsContext } from "next";
import { AppStaticProps, getAppStaticProps } from "queries/getAppStaticProps"; import { AppStaticProps, getAppStaticProps } from "queries/getAppStaticProps";
interface Props extends AppStaticProps { interface Props extends AppStaticProps {
post: Exclude< post: Post;
GetPostQuery["posts"],
null | undefined
>["data"][number]["attributes"];
} }
export default function SiteInformation(props: Props): JSX.Element { export default function SiteInformation(props: Props): JSX.Element {
const { post, langui, languages, currencies } = props; const { post, langui, languages, currencies } = props;
return ( return (
<Post <PostPage
currencies={currencies} currencies={currencies}
languages={languages} languages={languages}
langui={langui} langui={langui}
@ -36,7 +32,7 @@ export async function getStaticProps(
slug: slug, slug: slug,
language_code: context.locale ?? "en", language_code: context.locale ?? "en",
}); });
if (!post.posts) return { notFound: true }; if (!post.posts?.data[0].attributes) return { notFound: true };
const props: Props = { const props: Props = {
...(await getAppStaticProps(context)), ...(await getAppStaticProps(context)),
post: post.posts.data[0].attributes, post: post.posts.data[0].attributes,

12
src/pages/about-us/sharing-policy.tsx
View File

@ -1,19 +1,15 @@
import Post from "components/Post"; import PostPage, { Post } from "components/PostPage";
import { GetPostQuery } from "graphql/generated";
import { getReadySdk } from "graphql/sdk"; import { getReadySdk } from "graphql/sdk";
import { GetStaticPropsContext } from "next"; import { GetStaticPropsContext } from "next";
import { AppStaticProps, getAppStaticProps } from "queries/getAppStaticProps"; import { AppStaticProps, getAppStaticProps } from "queries/getAppStaticProps";
interface Props extends AppStaticProps { interface Props extends AppStaticProps {
post: Exclude< post: Post;
GetPostQuery["posts"],
null | undefined
>["data"][number]["attributes"];
} }
export default function SharingPolicy(props: Props): JSX.Element { export default function SharingPolicy(props: Props): JSX.Element {
const { post, langui, languages, currencies } = props; const { post, langui, languages, currencies } = props;
return ( return (
<Post <PostPage
currencies={currencies} currencies={currencies}
languages={languages} languages={languages}
langui={langui} langui={langui}
@ -35,7 +31,7 @@ export async function getStaticProps(
slug: slug, slug: slug,
language_code: context.locale ?? "en", language_code: context.locale ?? "en",
}); });
if (!post.posts) return { notFound: true }; if (!post.posts?.data[0].attributes) return { notFound: true };
const props: Props = { const props: Props = {
...(await getAppStaticProps(context)), ...(await getAppStaticProps(context)),
post: post.posts.data[0].attributes, post: post.posts.data[0].attributes,

12
src/pages/index.tsx
View File

@ -1,20 +1,16 @@
import Post from "components/Post"; import PostPage, { Post } from "components/PostPage";
import { GetPostQuery } from "graphql/generated";
import { getReadySdk } from "graphql/sdk"; import { getReadySdk } from "graphql/sdk";
import { GetStaticPropsContext } from "next"; import { GetStaticPropsContext } from "next";
import { AppStaticProps, getAppStaticProps } from "queries/getAppStaticProps"; import { AppStaticProps, getAppStaticProps } from "queries/getAppStaticProps";
interface Props extends AppStaticProps { interface Props extends AppStaticProps {
post: Exclude< post: Post;
GetPostQuery["posts"],
null | undefined
>["data"][number]["attributes"];
} }
export default function Home(props: Props): JSX.Element { export default function Home(props: Props): JSX.Element {
const { post, langui, languages, currencies } = props; const { post, langui, languages, currencies } = props;
return ( return (
<Post <PostPage
currencies={currencies} currencies={currencies}
languages={languages} languages={languages}
langui={langui} langui={langui}
@ -43,7 +39,7 @@ export async function getStaticProps(
slug: slug, slug: slug,
language_code: context.locale ?? "en", language_code: context.locale ?? "en",
}); });
if (!post.posts) return { notFound: true }; if (!post.posts?.data[0].attributes) return { notFound: true };
const props: Props = { const props: Props = {
...(await getAppStaticProps(context)), ...(await getAppStaticProps(context)),
post: post.posts.data[0].attributes, post: post.posts.data[0].attributes,

12
src/pages/news/[slug].tsx
View File

@ -1,4 +1,4 @@
import Post from "components/Post"; import PostPage, { Post } from "components/PostPage";
import { GetPostQuery } from "graphql/generated"; import { GetPostQuery } from "graphql/generated";
import { getReadySdk } from "graphql/sdk"; import { getReadySdk } from "graphql/sdk";
import { import {
@ -9,13 +9,7 @@ import {
import { AppStaticProps, getAppStaticProps } from "queries/getAppStaticProps"; import { AppStaticProps, getAppStaticProps } from "queries/getAppStaticProps";
interface Props extends AppStaticProps { interface Props extends AppStaticProps {
post: Exclude< post: Post;
Exclude<
GetPostQuery["posts"],
null | undefined
>["data"][number]["attributes"],
null | undefined
>;
postId: Exclude< postId: Exclude<
GetPostQuery["posts"], GetPostQuery["posts"],
null | undefined null | undefined
@ -25,7 +19,7 @@ interface Props extends AppStaticProps {
export default function LibrarySlug(props: Props): JSX.Element { export default function LibrarySlug(props: Props): JSX.Element {
const { post, langui, languages, currencies } = props; const { post, langui, languages, currencies } = props;
return ( return (
<Post <PostPage
currencies={currencies} currencies={currencies}
languages={languages} languages={languages}
langui={langui} langui={langui}