From c8a2104daebb17ca300287400a10fd579fe8cda7 Mon Sep 17 00:00:00 2001 From: DrMint Date: Tue, 29 Mar 2022 23:45:23 +0200 Subject: [PATCH] Removed some static text and use textui --- .github/workflows/node.js.yml | 37 ++-- src/components/AppLayout.tsx | 10 +- src/pages/contents/[slug]/index.tsx | 288 ++++++++++++++++++++++++---- src/pages/library/[slug]/index.tsx | 3 +- src/pages/library/[slug]/scans.tsx | 3 +- src/pages/news/[slug].tsx | 3 +- src/pages/wiki/chronology.tsx | 2 +- src/pages/wiki/index.tsx | 2 +- 8 files changed, 280 insertions(+), 68 deletions(-) diff --git a/.github/workflows/node.js.yml b/.github/workflows/node.js.yml index a5242e0..93b7b49 100644 --- a/.github/workflows/node.js.yml +++ b/.github/workflows/node.js.yml @@ -4,14 +4,13 @@ name: Node.js CI on: -# push: -# branches: [ main ] + # push: + # branches: [ main ] pull_request: - branches: [ main ] + branches: [main] jobs: build: - runs-on: ubuntu-latest strategy: @@ -20,18 +19,18 @@ jobs: # See supported Node.js release schedule at https://nodejs.org/en/about/releases/ steps: - - uses: actions/checkout@v2 - - name: Use Node.js ${{ matrix.node-version }} - uses: actions/setup-node@v2 - with: - node-version: ${{ matrix.node-version }} - cache: 'npm' - - run: npm ci - - run: npm run lint - - run: npm run build --if-present - env: - ACCESS_TOKEN: ${{ secrets.ACCESS_TOKEN }} - NEXT_PUBLIC_URL_CMS: ${{ secrets.NEXT_PUBLIC_URL_CMS }} - NEXT_PUBLIC_URL_IMG: ${{ secrets.NEXT_PUBLIC_URL_IMG }} - NEXT_PUBLIC_URL_SELF: ${{ secrets.NEXT_PUBLIC_URL_SELF }} - URL_GRAPHQL: ${{ secrets.URL_GRAPHQL }} + - uses: actions/checkout@v2 + - name: Use Node.js ${{ matrix.node-version }} + uses: actions/setup-node@v2 + with: + node-version: ${{ matrix.node-version }} + cache: "npm" + - run: npm ci + - run: npm run lint + - run: npm run build --if-present + env: + ACCESS_TOKEN: ${{ secrets.ACCESS_TOKEN }} + NEXT_PUBLIC_URL_CMS: ${{ secrets.NEXT_PUBLIC_URL_CMS }} + NEXT_PUBLIC_URL_IMG: ${{ secrets.NEXT_PUBLIC_URL_IMG }} + NEXT_PUBLIC_URL_SELF: ${{ secrets.NEXT_PUBLIC_URL_SELF }} + URL_GRAPHQL: ${{ secrets.URL_GRAPHQL }} diff --git a/src/components/AppLayout.tsx b/src/components/AppLayout.tsx index a2a68c7..fd73e7c 100644 --- a/src/components/AppLayout.tsx +++ b/src/components/AppLayout.tsx @@ -218,7 +218,15 @@ export default function AppLayout(props: AppLayoutProps): JSX.Element { > {appLayout.mainPanelOpen ? "close" : "menu"} -

{props.navTitle}

+

30 + ? "text-xl max-h-14" + : "text-2xl max-h-16" + }`} + > + {props.navTitle} +

{ diff --git a/src/pages/contents/[slug]/index.tsx b/src/pages/contents/[slug]/index.tsx index 2307c27..8f4e6a3 100644 --- a/src/pages/contents/[slug]/index.tsx +++ b/src/pages/contents/[slug]/index.tsx @@ -1,44 +1,167 @@ import AppLayout from "components/AppLayout"; import Button from "components/Button"; +import Chip from "components/Chip"; import ThumbnailHeader from "components/Content/ThumbnailHeader"; import HorizontalLine from "components/HorizontalLine"; +import LanguageSwitcher from "components/LanguageSwitcher"; +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 { getContent, getContentsSlugs } from "graphql/operations"; -import { GetContentQuery } from "graphql/operations-types"; +import RecorderChip from "components/RecorderChip"; +import ToolTip from "components/ToolTip"; +import { getContentsSlugs, getContentText } from "graphql/operations"; +import { GetContentTextQuery } from "graphql/operations-types"; import { GetStaticPathsContext, GetStaticPathsResult, GetStaticPropsContext, } from "next"; +import { useRouter } from "next/router"; import { AppStaticProps, getAppStaticProps } from "queries/getAppStaticProps"; -import { prettyinlineTitle, prettySlug } from "queries/helpers"; +import { + getLocalesFromLanguages, + getStatusDescription, + prettyinlineTitle, + prettyLanguage, + prettySlug, + prettyTestError, + prettyTestWarning, +} from "queries/helpers"; -interface ContentIndexProps extends AppStaticProps { - content: GetContentQuery["contents"]["data"][number]["attributes"]; +interface Props extends AppStaticProps { + content: GetContentTextQuery["contents"]["data"][number]["attributes"]; + contentId: GetContentTextQuery["contents"]["data"][number]["id"]; } -export default function ContentIndex(props: ContentIndexProps): JSX.Element { - const { content, langui } = props; +export default function Content(props: Props): JSX.Element { + useTesting(props); + const { langui, content, languages } = props; + const router = useRouter(); + const locales = getLocalesFromLanguages(content.text_set_languages); + const subPanel = ( + + {content.text_set.length > 0 && content.text_set[0].source_language.data && ( +
+

+ {content.text_set[0].source_language.data.attributes.code === + router.locale + ? langui.transcript_notice + : langui.translation_notice} +

+ + {content.text_set[0].source_language.data.attributes.code !== + router.locale && ( +
+

{langui.source_language}:

+ +
+ )} + +
+

{langui.status}:

+ + + {content.text_set[0].status} + +
+ + {content.text_set[0].transcribers.data.length > 0 && ( +
+

{langui.transcribers}:

+
+ {content.text_set[0].transcribers.data.map((recorder) => ( + + ))} +
+
+ )} + + {content.text_set[0].translators.data.length > 0 && ( +
+

{langui.translators}:

+
+ {content.text_set[0].translators.data.map((recorder) => ( + + ))} +
+
+ )} + + {content.text_set[0].proofreaders.data.length > 0 && ( +
+

{langui.proofreaders}:

+
+ {content.text_set[0].proofreaders.data.map((recorder) => ( + + ))} +
+
+ )} +
+ )} + + {content.text_set.length > 0 && content.text_set[0].text && ( + <> + + 0 + ? prettyinlineTitle( + content.titles[0].pre_title, + content.titles[0].title, + content.titles[0].subtitle + ) + : prettySlug(content.slug) + } + /> + + )} ); const contentPanel = ( - {content.text_set.length > 0 && ( - - )} - - {content.audio_set.length > 0 && ( - - )} - - {content.video_set.length > 0 && ( - + {locales.includes(router.locale ?? "en") ? ( + + ) : ( + )} @@ -108,15 +223,9 @@ export default function ContentIndex(props: ContentIndexProps): JSX.Element { description += "\n"; } - if (content.titles.length > 0 && content.titles[0].description) { - description += "\n"; - description += content.titles[0].description; - } - return ( 0 ? prettyinlineTitle( content.titles[0].pre_title, @@ -136,17 +245,19 @@ export default function ContentIndex(props: ContentIndexProps): JSX.Element { export async function getStaticProps( context: GetStaticPropsContext -): Promise<{ notFound: boolean } | { props: ContentIndexProps }> { +): Promise<{ notFound: boolean } | { props: Props }> { + const slug = context.params?.slug?.toString() ?? ""; const content = ( - await getContent({ - slug: context.params?.slug?.toString() ?? "", + await getContentText({ + slug: slug, language_code: context.locale ?? "en", }) - ).contents.data[0].attributes; + ).contents.data[0]; if (!content) return { notFound: true }; - const props: ContentIndexProps = { + const props: Props = { ...(await getAppStaticProps(context)), - content: content, + content: content.attributes, + contentId: content.id, }; return { props: props, @@ -168,3 +279,100 @@ export async function getStaticPaths( fallback: "blocking", }; } + +function useTesting(props: Props) { + const router = useRouter(); + const { content, contentId } = props; + + const contentURL = `/admin/content-manager/collectionType/api::content.content/${contentId}`; + + if (router.locale === "en") { + if (content.categories.data.length === 0) { + prettyTestError(router, "Missing categories", ["content"], contentURL); + } + } + + if (content.ranged_contents.data.length === 0) { + prettyTestWarning( + router, + "Unconnected to any source", + ["content"], + contentURL + ); + } + + if (content.text_set.length === 0) { + prettyTestWarning( + router, + "Has no textset, nor audioset, nor videoset", + ["content"], + contentURL + ); + } + + if (content.text_set.length > 1) { + prettyTestError( + router, + "More than one textset for this language", + ["content", "text_set"], + contentURL + ); + } + + if (content.text_set.length === 1) { + const textset = content.text_set[0]; + + if (!textset.text) { + prettyTestError( + router, + "Missing text", + ["content", "text_set"], + contentURL + ); + } + if (!textset.source_language.data) { + prettyTestError( + router, + "Missing source language", + ["content", "text_set"], + contentURL + ); + } else if (textset.source_language.data.attributes.code === router.locale) { + // This is a transcript + if (textset.transcribers.data.length === 0) { + prettyTestError( + router, + "Missing transcribers attribution", + ["content", "text_set"], + contentURL + ); + } + if (textset.translators.data.length > 0) { + prettyTestError( + router, + "Transcripts shouldn't have translators", + ["content", "text_set"], + contentURL + ); + } + } else { + // This is a translation + if (textset.translators.data.length === 0) { + prettyTestError( + router, + "Missing translators attribution", + ["content", "text_set"], + contentURL + ); + } + if (textset.transcribers.data.length > 0) { + prettyTestError( + router, + "Translations shouldn't have transcribers", + ["content", "text_set"], + contentURL + ); + } + } + } +} diff --git a/src/pages/library/[slug]/index.tsx b/src/pages/library/[slug]/index.tsx index 521ef57..2b52d41 100644 --- a/src/pages/library/[slug]/index.tsx +++ b/src/pages/library/[slug]/index.tsx @@ -399,8 +399,7 @@ export default function LibrarySlug(props: LibrarySlugProps): JSX.Element { return ( 0 ? post.translations[0].title : prettySlug(post.slug) diff --git a/src/pages/wiki/chronology.tsx b/src/pages/wiki/chronology.tsx index 5235cf8..d865715 100644 --- a/src/pages/wiki/chronology.tsx +++ b/src/pages/wiki/chronology.tsx @@ -133,7 +133,7 @@ export default function Chronology(props: ChronologyProps): JSX.Element { return ( - + );