From 5edc2d7f27d0cc13527db46c0110c6a0505b148a Mon Sep 17 00:00:00 2001 From: DrMint Date: Mon, 18 Jul 2022 02:04:13 +0200 Subject: [PATCH] Lots of things including Chronicles --- .eslintrc.js | 4 +- public/icons/twitter-brands.svg | 1 + .../Chronicles/ChroniclePreview.tsx | 65 +++++ src/components/Chronicles/ChroniclesList.tsx | 112 ++++++++ src/components/Inputs/Button.tsx | 7 +- src/components/Markdown/Markdawn.tsx | 4 +- src/components/Panels/MainPanel.tsx | 11 +- src/components/PreviewCard.tsx | 5 +- src/components/PreviewLine.tsx | 6 +- src/components/SmartList.tsx | 7 +- src/components/Translated.tsx | 103 ++++--- src/graphql/fragments/recorderChip.graphql | 2 +- src/graphql/operations/devGetContents.graphql | 12 +- .../operations/devGetLibraryItems.graphql | 16 +- src/graphql/operations/getChronicle.graphql | 165 +++++++++++ .../operations/getChroniclesChapters.graphql | 77 ++++++ .../operations/getChroniclesSlugs.graphql | 9 + .../operations/getChronologyItems.graphql | 8 +- src/graphql/operations/getContentText.graphql | 17 +- src/graphql/operations/getContents.graphql | 6 +- src/graphql/operations/getCurrencies.graphql | 2 +- src/graphql/operations/getEras.graphql | 6 +- src/graphql/operations/getLanguages.graphql | 2 +- src/graphql/operations/getLibraryItem.graphql | 24 +- .../operations/getLibraryItemScans.graphql | 18 +- .../operations/getLibraryItemsPreview.graphql | 4 +- src/graphql/operations/getPost.graphql | 6 +- .../operations/getPostsPreview.graphql | 4 +- src/graphql/operations/getVideo.graphql | 6 +- .../operations/getVideoChannel.graphql | 2 +- .../operations/getVideosPreview.graphql | 2 +- src/graphql/operations/getWikiPage.graphql | 18 +- .../operations/getWikiPagesPreviews.graphql | 8 +- src/helpers/date.ts | 10 + src/helpers/types.ts | 12 + src/helpers/types/Report.ts | 2 +- src/hooks/useSmartLanguage.ts | 4 +- src/pages/chronicles/[slug]/index.tsx | 258 ++++++++++++++++++ src/pages/chronicles/index.tsx | 41 ++- src/pages/contents/[slug]/index.tsx | 3 - src/pages/contents/index.tsx | 15 +- src/pages/library/[slug]/scans.tsx | 2 - src/pages/news/index.tsx | 11 +- src/pages/wiki/chronology.tsx | 8 +- src/pages/wiki/index.tsx | 11 +- src/tailwind.css | 2 +- 46 files changed, 945 insertions(+), 173 deletions(-) create mode 100644 public/icons/twitter-brands.svg create mode 100644 src/components/Chronicles/ChroniclePreview.tsx create mode 100644 src/components/Chronicles/ChroniclesList.tsx create mode 100644 src/graphql/operations/getChronicle.graphql create mode 100644 src/graphql/operations/getChroniclesChapters.graphql create mode 100644 src/graphql/operations/getChroniclesSlugs.graphql create mode 100644 src/helpers/date.ts create mode 100644 src/pages/chronicles/[slug]/index.tsx diff --git a/.eslintrc.js b/.eslintrc.js index 047db04..806a5e6 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -79,7 +79,7 @@ module.exports = { "no-lone-blocks": "warn", "no-lonely-if": "warn", // "no-magic-numbers": "warn", - "no-mixed-operators": "warn", + // "no-mixed-operators": "warn", "no-multi-assign": "warn", "no-multi-str": "warn", "no-negated-condition": "warn", @@ -228,7 +228,7 @@ module.exports = { // "import/no-internal-modules": "error", "import/no-webpack-loader-syntax": "error", "import/no-self-import": "error", - "import/no-cycle": "error", + // "import/no-cycle": "error", "import/no-useless-path-segments": "error", // "import/no-relative-parent-imports": "error", "import/no-relative-packages": "error", diff --git a/public/icons/twitter-brands.svg b/public/icons/twitter-brands.svg new file mode 100644 index 0000000..c13d476 --- /dev/null +++ b/public/icons/twitter-brands.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/components/Chronicles/ChroniclePreview.tsx b/src/components/Chronicles/ChroniclePreview.tsx new file mode 100644 index 0000000..bc65264 --- /dev/null +++ b/src/components/Chronicles/ChroniclePreview.tsx @@ -0,0 +1,65 @@ +import Link from "next/link"; +import { DatePickerFragment } from "graphql/generated"; +import { cIf, cJoin } from "helpers/className"; + +/* + * ╭─────────────╮ + * ───────────────────────────────────────╯ COMPONENT ╰─────────────────────────────────────────── + */ + +interface Props { + date: DatePickerFragment; + title: string; + url: string; + isActive?: boolean; +} + +export const ChroniclePreview = ({ + date, + url, + title, + isActive, +}: Props): JSX.Element => ( + +
+
+

{date.year}

+

+ {prettyMonthDay(date.month, date.day)} +

+
+

{title}

+
+ +); + +/* + * ╭───────────────────╮ + * ─────────────────────────────────────╯ PRIVATE METHODS ╰─────────────────────────────────────── + */ + +const prettyMonthDay = ( + month?: number | null | undefined, + day?: number | null | undefined +): string => { + let result = ""; + if (month) { + result += month.toString().padStart(2, "0"); + if (day) { + result += "/"; + result += day.toString().padStart(2, "0"); + } + } + return result; +}; diff --git a/src/components/Chronicles/ChroniclesList.tsx b/src/components/Chronicles/ChroniclesList.tsx new file mode 100644 index 0000000..47e40fc --- /dev/null +++ b/src/components/Chronicles/ChroniclesList.tsx @@ -0,0 +1,112 @@ +import { GetChroniclesChaptersQuery } from "graphql/generated"; +import { filterHasAttributes } from "helpers/others"; +import { TranslatedChroniclePreview } from "components/Translated"; +import { prettyinlineTitle, prettySlug } from "helpers/formatters"; +import { Ico, Icon } from "components/Ico"; +import { useBoolean } from "hooks/useBoolean"; +import { compareDate } from "helpers/date"; + +/* + * ╭─────────────╮ + * ───────────────────────────────────────╯ COMPONENT ╰─────────────────────────────────────────── + */ + +interface Props { + chronicles: NonNullable< + NonNullable< + NonNullable< + GetChroniclesChaptersQuery["chroniclesChapters"] + >["data"][number]["attributes"] + >["chronicles"] + >["data"]; + currentSlug?: string; + title: string; +} + +export const ChroniclesList = ({ + chronicles, + currentSlug, + title, +}: Props): JSX.Element => { + const { state: isOpen, toggleState: toggleOpen } = useBoolean(false); + + return ( +
+
+
+ +

{title}

+
+
+
+ {filterHasAttributes(chronicles, [ + "attributes.contents", + "attributes.translations", + ] as const) + .sort((a, b) => + compareDate(a.attributes.date_start, b.attributes.date_start) + ) + .map((chronicle) => ( +
+ {chronicle.attributes.translations.length === 0 && + chronicle.attributes.contents.data.length === 1 + ? filterHasAttributes(chronicle.attributes.contents.data, [ + "attributes.translations", + ] as const).map((content, index) => ( + ({ + title: prettyinlineTitle( + translation.pre_title, + translation.title, + translation.subtitle + ), + language: translation.language.data.attributes.code, + }))} + fallback={{ + title: prettySlug(chronicle.attributes.slug), + }} + url={`/chronicles/${chronicle.attributes.slug}/#chronicle-${chronicle.attributes.slug}`} + /> + )) + : chronicle.attributes.translations.length > 0 && ( + ({ + title: translation.title, + language: translation.language.data.attributes.code, + }))} + fallback={{ + title: prettySlug(chronicle.attributes.slug), + }} + url={`/chronicles/${chronicle.attributes.slug}/#chronicle-${chronicle.attributes.slug}`} + /> + )} +
+ ))} +
+
+ ); +}; diff --git a/src/components/Inputs/Button.tsx b/src/components/Inputs/Button.tsx index 3033c4b..28586c9 100644 --- a/src/components/Inputs/Button.tsx +++ b/src/components/Inputs/Button.tsx @@ -64,13 +64,14 @@ export const Button = ({ id={id} onClick={onClick} className={cJoin( - `group grid cursor-pointer select-none grid-flow-col - place-content-center place-items-center gap-2 rounded-full border-[1px] border-dark py-3 px-4 + `group grid cursor-pointer select-none grid-flow-col place-content-center + place-items-center gap-2 rounded-full border-[1px] border-dark py-3 px-4 leading-none text-dark transition-all`, cIf( active, "!border-black bg-black !text-light drop-shadow-black-lg", - "hover:bg-dark hover:text-light hover:drop-shadow-shade-lg" + `hover:bg-dark hover:text-light hover:drop-shadow-shade-lg active:hover:!border-black + active:hover:bg-black active:hover:!text-light active:hover:drop-shadow-black-lg` ), cIf(size === "small", "px-3 py-1 text-xs"), className diff --git a/src/components/Markdown/Markdawn.tsx b/src/components/Markdown/Markdawn.tsx index ee8f483..633552f 100644 --- a/src/components/Markdown/Markdawn.tsx +++ b/src/components/Markdown/Markdawn.tsx @@ -199,7 +199,7 @@ export const Markdawn = ({ Line: { component: (compProps) => ( <> - +

{compProps.children}

@@ -440,8 +440,6 @@ const preprocessMarkDawn = (text: string, playerName = ""): string => { : "(player)" ); - console.log(); - let scenebreakIndex = 0; const visitedSlugs: string[] = []; diff --git a/src/components/Panels/MainPanel.tsx b/src/components/Panels/MainPanel.tsx index 722500a..9f7ed8e 100644 --- a/src/components/Panels/MainPanel.tsx +++ b/src/components/Panels/MainPanel.tsx @@ -132,7 +132,6 @@ export const MainPanel = ({ langui }: Props): JSX.Element => { reduced={mainPanelReduced && isDesktop} /> - {/* { subtitle={langui.chronicles_short_description} reduced={mainPanelReduced && isDesktop} /> - */} @@ -232,6 +230,15 @@ export const MainPanel = ({ langui }: Props): JSX.Element => { target="_blank" rel="noopener noreferrer" > + +
{bottomChips.map((text, index) => ( ))} diff --git a/src/components/PreviewLine.tsx b/src/components/PreviewLine.tsx index cd8b3fb..e6ff745 100644 --- a/src/components/PreviewLine.tsx +++ b/src/components/PreviewLine.tsx @@ -39,7 +39,11 @@ export const PreviewLine = ({ > {thumbnail ? (
- +
) : (
diff --git a/src/components/SmartList.tsx b/src/components/SmartList.tsx index fd48cf9..1dccbbf 100644 --- a/src/components/SmartList.tsx +++ b/src/components/SmartList.tsx @@ -25,6 +25,7 @@ interface Props { // Grouping groupingFunction?: (item: T) => string[]; groupSortingFunction?: (a: string, b: string) => number; + groupCountingFunction?: (item: T) => number; // Filtering filteringFunction?: (item: T) => boolean; // Sorting @@ -48,6 +49,7 @@ export const SmartList = ({ searchingCaseInsensitive = true, groupingFunction = () => [""], groupSortingFunction = (a, b) => a.localeCompare(b), + groupCountingFunction = () => 1, filteringFunction = () => true, sortingFunction = () => 0, className, @@ -159,7 +161,10 @@ export const SmartList = ({ > {name} acc + groupCountingFunction(item), + 0 + )} ${ groupItems.length <= 1 ? langui.result?.toLowerCase() ?? "" : langui.results?.toLowerCase() ?? "" diff --git a/src/components/Translated.tsx b/src/components/Translated.tsx index 7ed535f..deb2c9e 100644 --- a/src/components/Translated.tsx +++ b/src/components/Translated.tsx @@ -2,13 +2,13 @@ import { PreviewCard } from "./PreviewCard"; import { PreviewLine } from "./PreviewLine"; import { ScanSet } from "./Library/ScanSet"; import { NavOption } from "./PanelComponents/NavOption"; -import { AppStaticProps } from "graphql/getAppStaticProps"; +import { ChroniclePreview } from "./Chronicles/ChroniclePreview"; +import { ChroniclesList } from "./Chronicles/ChroniclesList"; import { useSmartLanguage } from "hooks/useSmartLanguage"; type TranslatedProps = Omit & { translations: (Pick & { language: string })[]; fallback: Pick; - languages: AppStaticProps["languages"]; }; // ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ @@ -18,18 +18,18 @@ type TranslatedPreviewCardProps = TranslatedProps< "description" | "pre_title" | "subtitle" | "title" >; +const languageExtractor = (item: { language: string }): string => item.language; + // ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ export const TranslatedPreviewCard = ({ translations, - languages, fallback, ...otherProps }: TranslatedPreviewCardProps): JSX.Element => { const [selectedTranslation] = useSmartLanguage({ items: translations, - languages: languages, - languageExtractor: (item) => item.language, + languageExtractor, }); return ( @@ -45,23 +45,18 @@ export const TranslatedPreviewCard = ({ // ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ -type TranslatedPreviewLineProps = TranslatedProps< - Parameters[0], - "pre_title" | "subtitle" | "title" ->; - -// ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ - export const TranslatedPreviewLine = ({ translations, - languages, fallback, ...otherProps -}: TranslatedPreviewLineProps): JSX.Element => { +}: TranslatedProps< + Parameters[0], + "pre_title" | "subtitle" | "title" +>): JSX.Element => { const [selectedTranslation] = useSmartLanguage({ items: translations, - languages: languages, - languageExtractor: (item) => item.language, + + languageExtractor, }); return ( @@ -76,29 +71,19 @@ export const TranslatedPreviewLine = ({ // ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ -type TranslatedScanSetProps = TranslatedProps< - Parameters[0], - "title" ->; - -// ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ - export const TranslatedScanSet = ({ translations, - languages, fallback, ...otherProps -}: TranslatedScanSetProps): JSX.Element => { +}: TranslatedProps[0], "title">): JSX.Element => { const [selectedTranslation] = useSmartLanguage({ items: translations, - languages: languages, - languageExtractor: (item) => item.language, + languageExtractor, }); return ( ); @@ -106,23 +91,17 @@ export const TranslatedScanSet = ({ // ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ -type TranslatedNavOptionProps = TranslatedProps< - Parameters[0], - "subtitle" | "title" ->; - -// ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ - export const TranslatedNavOption = ({ translations, - languages, fallback, ...otherProps -}: TranslatedNavOptionProps): JSX.Element => { +}: TranslatedProps< + Parameters[0], + "subtitle" | "title" +>): JSX.Element => { const [selectedTranslation] = useSmartLanguage({ items: translations, - languages: languages, - languageExtractor: (item) => item.language, + languageExtractor, }); return ( @@ -133,3 +112,49 @@ export const TranslatedNavOption = ({ /> ); }; + +// ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ + +export const TranslatedChroniclePreview = ({ + translations, + fallback, + ...otherProps +}: TranslatedProps< + Parameters[0], + "title" +>): JSX.Element => { + const [selectedTranslation] = useSmartLanguage({ + items: translations, + languageExtractor, + }); + + return ( + + ); +}; + +// ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ + +export const TranslatedChroniclesList = ({ + translations, + fallback, + ...otherProps +}: TranslatedProps< + Parameters[0], + "title" +>): JSX.Element => { + const [selectedTranslation] = useSmartLanguage({ + items: translations, + languageExtractor, + }); + + return ( + + ); +}; diff --git a/src/graphql/fragments/recorderChip.graphql b/src/graphql/fragments/recorderChip.graphql index 41d3a23..8255a81 100644 --- a/src/graphql/fragments/recorderChip.graphql +++ b/src/graphql/fragments/recorderChip.graphql @@ -6,7 +6,7 @@ fragment recorderChip on Recorder { bio(filters: { language: { code: { eq: $language_code } } }) { bio } - languages { + languages(pagination: { limit: -1 }) { data { attributes { code diff --git a/src/graphql/operations/devGetContents.graphql b/src/graphql/operations/devGetContents.graphql index 33070b0..78e1c94 100644 --- a/src/graphql/operations/devGetContents.graphql +++ b/src/graphql/operations/devGetContents.graphql @@ -4,7 +4,7 @@ query devGetContents { id attributes { slug - categories { + categories(pagination: { limit: -1 }) { data { id } @@ -15,12 +15,12 @@ query devGetContents { } } - ranged_contents { + ranged_contents(pagination: { limit: -1 }) { data { id } } - translations { + translations(pagination: { limit: -1 }) { language { data { id @@ -41,17 +41,17 @@ query devGetContents { } } status - transcribers { + transcribers(pagination: { limit: -1 }) { data { id } } - translators { + translators(pagination: { limit: -1 }) { data { id } } - proofreaders { + proofreaders(pagination: { limit: -1 }) { data { id } diff --git a/src/graphql/operations/devGetLibraryItems.graphql b/src/graphql/operations/devGetLibraryItems.graphql index e6fecfd..b7dfed7 100644 --- a/src/graphql/operations/devGetLibraryItems.graphql +++ b/src/graphql/operations/devGetLibraryItems.graphql @@ -9,7 +9,7 @@ query devGetLibraryItems { id } } - subitems { + subitems(pagination: { limit: -1 }) { data { id } @@ -41,7 +41,7 @@ query devGetLibraryItems { month day } - descriptions { + descriptions(pagination: { limit: -1 }) { description language { data { @@ -49,13 +49,13 @@ query devGetLibraryItems { } } } - contents { + contents(pagination: { limit: -1 }) { data { id } } digital - categories { + categories(pagination: { limit: -1 }) { data { id } @@ -63,7 +63,7 @@ query devGetLibraryItems { urls { url } - images { + images(pagination: { limit: -1 }) { language { data { id @@ -75,17 +75,17 @@ query devGetLibraryItems { } } status - scanners { + scanners(pagination: { limit: -1 }) { data { id } } - cleaners { + cleaners(pagination: { limit: -1 }) { data { id } } - typesetters { + typesetters(pagination: { limit: -1 }) { data { id } diff --git a/src/graphql/operations/getChronicle.graphql b/src/graphql/operations/getChronicle.graphql new file mode 100644 index 0000000..6faf112 --- /dev/null +++ b/src/graphql/operations/getChronicle.graphql @@ -0,0 +1,165 @@ +query getChronicle($slug: String, $language_code: String) { + chronicles(filters: { slug: { eq: $slug } }) { + data { + attributes { + slug + date_start { + year + month + day + } + date_end { + year + month + day + } + chapter { + data { + attributes { + slug + titles { + title + language { + data { + attributes { + code + } + } + } + } + } + } + } + translations { + title + summary + language { + data { + attributes { + code + } + } + } + body { + source_language { + data { + attributes { + code + } + } + } + status + body + authors { + data { + attributes { + ...recorderChip + } + } + } + translators { + data { + attributes { + ...recorderChip + } + } + } + proofreaders { + data { + attributes { + ...recorderChip + } + } + } + } + } + contents { + data { + id + attributes { + slug + categories(pagination: { limit: -1 }) { + data { + id + attributes { + name + short + } + } + } + type { + data { + attributes { + slug + titles( + filters: { language: { code: { eq: $language_code } } } + ) { + title + } + } + } + } + translations(pagination: { limit: -1 }) { + language { + data { + attributes { + code + } + } + } + pre_title + title + subtitle + description + text_set { + status + text + source_language { + data { + attributes { + code + } + } + } + transcribers(pagination: { limit: -1 }) { + data { + id + attributes { + ...recorderChip + } + } + } + translators(pagination: { limit: -1 }) { + data { + id + attributes { + ...recorderChip + } + } + } + proofreaders(pagination: { limit: -1 }) { + data { + id + attributes { + ...recorderChip + } + } + } + notes + } + } + + thumbnail { + data { + attributes { + ...uploadImage + } + } + } + } + } + } + } + } + } +} diff --git a/src/graphql/operations/getChroniclesChapters.graphql b/src/graphql/operations/getChroniclesChapters.graphql new file mode 100644 index 0000000..1744a94 --- /dev/null +++ b/src/graphql/operations/getChroniclesChapters.graphql @@ -0,0 +1,77 @@ +query getChroniclesChapters { + chroniclesChapters(pagination: { limit: -1 }) { + data { + id + attributes { + slug + titles(pagination: { limit: -1 }) { + title + language { + data { + attributes { + code + } + } + } + } + chronicles(pagination: { limit: -1 }) { + data { + id + attributes { + slug + contents(pagination: { limit: -1 }) { + data { + attributes { + translations(pagination: { limit: -1 }) { + pre_title + title + subtitle + language { + data { + attributes { + code + } + } + } + } + } + } + } + translations(pagination: { limit: -1 }) { + title + language { + data { + attributes { + code + } + } + } + } + date_start { + year + month + day + } + chapter { + data { + attributes { + titles(pagination: { limit: -1 }) { + title + language { + data { + attributes { + code + } + } + } + } + } + } + } + } + } + } + } + } + } +} diff --git a/src/graphql/operations/getChroniclesSlugs.graphql b/src/graphql/operations/getChroniclesSlugs.graphql new file mode 100644 index 0000000..ae76363 --- /dev/null +++ b/src/graphql/operations/getChroniclesSlugs.graphql @@ -0,0 +1,9 @@ +query getChroniclesSlugs { + chronicles(pagination: { limit: -1 }) { + data { + attributes { + slug + } + } + } +} diff --git a/src/graphql/operations/getChronologyItems.graphql b/src/graphql/operations/getChronologyItems.graphql index daef501..fb8ff20 100644 --- a/src/graphql/operations/getChronologyItems.graphql +++ b/src/graphql/operations/getChronologyItems.graphql @@ -1,4 +1,4 @@ -query getChronologyItems($language_code: String) { +query getChronologyItems { chronologyItems( pagination: { limit: -1 } sort: ["year:asc", "month:asc", "day:asc"] @@ -10,7 +10,7 @@ query getChronologyItems($language_code: String) { month day displayed_date - events { + events(pagination: { limit: -1 }) { id source { data { @@ -19,9 +19,7 @@ query getChronologyItems($language_code: String) { } } } - translations( - filters: { language: { code: { eq: $language_code } } } - ) { + translations(pagination: { limit: -1 }) { title description note diff --git a/src/graphql/operations/getContentText.graphql b/src/graphql/operations/getContentText.graphql index 5b186c5..de192ba 100644 --- a/src/graphql/operations/getContentText.graphql +++ b/src/graphql/operations/getContentText.graphql @@ -4,8 +4,7 @@ query getContentText($slug: String, $language_code: String) { id attributes { slug - - categories { + categories(pagination: { limit: -1 }) { data { id attributes { @@ -52,7 +51,7 @@ query getContentText($slug: String, $language_code: String) { price { ...pricePicker } - categories { + categories(pagination: { limit: -1 }) { data { id attributes { @@ -80,7 +79,7 @@ query getContentText($slug: String, $language_code: String) { } } ... on ComponentMetadataGame { - platforms { + platforms(pagination: { limit: -1 }) { data { id attributes { @@ -180,7 +179,7 @@ query getContentText($slug: String, $language_code: String) { } } } - transcribers { + transcribers(pagination: { limit: -1 }) { data { id attributes { @@ -188,7 +187,7 @@ query getContentText($slug: String, $language_code: String) { } } } - translators { + translators(pagination: { limit: -1 }) { data { id attributes { @@ -196,7 +195,7 @@ query getContentText($slug: String, $language_code: String) { } } } - proofreaders { + proofreaders(pagination: { limit: -1 }) { data { id attributes { @@ -222,7 +221,7 @@ query getContentText($slug: String, $language_code: String) { data { attributes { slug - translations { + translations(pagination: { limit: -1 }) { pre_title title subtitle @@ -234,7 +233,7 @@ query getContentText($slug: String, $language_code: String) { } } } - categories { + categories(pagination: { limit: -1 }) { data { id attributes { diff --git a/src/graphql/operations/getContents.graphql b/src/graphql/operations/getContents.graphql index 21b1657..46a7a6d 100644 --- a/src/graphql/operations/getContents.graphql +++ b/src/graphql/operations/getContents.graphql @@ -4,7 +4,7 @@ query getContents($language_code: String) { id attributes { slug - translations { + translations(pagination: { limit: -1 }) { pre_title title subtitle @@ -16,7 +16,7 @@ query getContents($language_code: String) { } } } - categories { + categories(pagination: { limit: -1 }) { data { id attributes { @@ -35,7 +35,7 @@ query getContents($language_code: String) { } } } - ranged_contents { + ranged_contents(pagination: { limit: -1 }) { data { id attributes { diff --git a/src/graphql/operations/getCurrencies.graphql b/src/graphql/operations/getCurrencies.graphql index 87f50dc..d34c90e 100644 --- a/src/graphql/operations/getCurrencies.graphql +++ b/src/graphql/operations/getCurrencies.graphql @@ -1,5 +1,5 @@ query getCurrencies { - currencies { + currencies(pagination: { limit: -1 }) { data { id attributes { diff --git a/src/graphql/operations/getEras.graphql b/src/graphql/operations/getEras.graphql index 949276e..f2a0f36 100644 --- a/src/graphql/operations/getEras.graphql +++ b/src/graphql/operations/getEras.graphql @@ -1,12 +1,12 @@ -query getEras($language_code: String) { - chronologyEras(sort: "starting_year") { +query getEras { + chronologyEras(pagination: { limit: -1 }, sort: "starting_year") { data { id attributes { slug starting_year ending_year - title(filters: { language: { code: { eq: $language_code } } }) { + title(pagination: { limit: -1 }) { title description } diff --git a/src/graphql/operations/getLanguages.graphql b/src/graphql/operations/getLanguages.graphql index 8398650..bc820ff 100644 --- a/src/graphql/operations/getLanguages.graphql +++ b/src/graphql/operations/getLanguages.graphql @@ -1,5 +1,5 @@ query getLanguages { - languages { + languages(pagination: { limit: -1 }) { data { id attributes { diff --git a/src/graphql/operations/getLibraryItem.graphql b/src/graphql/operations/getLibraryItem.graphql index 5f588d6..800677d 100644 --- a/src/graphql/operations/getLibraryItem.graphql +++ b/src/graphql/operations/getLibraryItem.graphql @@ -30,7 +30,7 @@ query getLibraryItem($slug: String, $language_code: String) { price { ...pricePicker } - categories { + categories(pagination: { limit: -1 }) { data { id attributes { @@ -39,7 +39,7 @@ query getLibraryItem($slug: String, $language_code: String) { } } } - urls { + urls(pagination: { limit: -1 }) { url } size { @@ -47,7 +47,7 @@ query getLibraryItem($slug: String, $language_code: String) { height thickness } - descriptions(filters: { language: { code: { eq: $language_code } } }) { + descriptions(pagination: { limit: -1 }) { description } metadata { @@ -68,7 +68,7 @@ query getLibraryItem($slug: String, $language_code: String) { binding_type page_count page_order - languages { + languages(pagination: { limit: -1 }) { data { attributes { code @@ -92,7 +92,7 @@ query getLibraryItem($slug: String, $language_code: String) { } } ... on ComponentMetadataGame { - platforms { + platforms(pagination: { limit: -1 }) { data { id attributes { @@ -100,7 +100,7 @@ query getLibraryItem($slug: String, $language_code: String) { } } } - audio_languages { + audio_languages(pagination: { limit: -1 }) { data { attributes { code @@ -108,7 +108,7 @@ query getLibraryItem($slug: String, $language_code: String) { } } } - sub_languages { + sub_languages(pagination: { limit: -1 }) { data { attributes { code @@ -116,7 +116,7 @@ query getLibraryItem($slug: String, $language_code: String) { } } } - interface_languages { + interface_languages(pagination: { limit: -1 }) { data { attributes { code @@ -196,7 +196,7 @@ query getLibraryItem($slug: String, $language_code: String) { price { ...pricePicker } - categories { + categories(pagination: { limit: -1 }) { data { id attributes { @@ -299,7 +299,7 @@ query getLibraryItem($slug: String, $language_code: String) { } } } - submerchs { + submerchs(pagination: { limit: -1 }) { data { id attributes { @@ -339,7 +339,7 @@ query getLibraryItem($slug: String, $language_code: String) { data { attributes { slug - categories { + categories(pagination: { limit: -1 }) { data { id attributes { @@ -362,7 +362,7 @@ query getLibraryItem($slug: String, $language_code: String) { } } } - translations { + translations(pagination: { limit: -1 }) { language { data { attributes { diff --git a/src/graphql/operations/getLibraryItemScans.graphql b/src/graphql/operations/getLibraryItemScans.graphql index ab96195..fc41edb 100644 --- a/src/graphql/operations/getLibraryItemScans.graphql +++ b/src/graphql/operations/getLibraryItemScans.graphql @@ -6,7 +6,7 @@ query getLibraryItemScans($slug: String, $language_code: String) { slug title subtitle - images { + images(pagination: { limit: -1 }) { status language { data { @@ -22,7 +22,7 @@ query getLibraryItemScans($slug: String, $language_code: String) { } } } - scanners { + scanners(pagination: { limit: -1 }) { data { id attributes { @@ -30,7 +30,7 @@ query getLibraryItemScans($slug: String, $language_code: String) { } } } - cleaners { + cleaners(pagination: { limit: -1 }) { data { id attributes { @@ -38,7 +38,7 @@ query getLibraryItemScans($slug: String, $language_code: String) { } } } - typesetters { + typesetters(pagination: { limit: -1 }) { data { id attributes { @@ -108,7 +108,7 @@ query getLibraryItemScans($slug: String, $language_code: String) { price { ...pricePicker } - categories { + categories(pagination: { limit: -1 }) { data { id attributes { @@ -218,7 +218,7 @@ query getLibraryItemScans($slug: String, $language_code: String) { data { attributes { slug - translations { + translations(pagination: { limit: -1 }) { pre_title title subtitle @@ -249,7 +249,7 @@ query getLibraryItemScans($slug: String, $language_code: String) { } } } - scanners { + scanners(pagination: { limit: -1 }) { data { id attributes { @@ -257,7 +257,7 @@ query getLibraryItemScans($slug: String, $language_code: String) { } } } - cleaners { + cleaners(pagination: { limit: -1 }) { data { id attributes { @@ -265,7 +265,7 @@ query getLibraryItemScans($slug: String, $language_code: String) { } } } - typesetters { + typesetters(pagination: { limit: -1 }) { data { id attributes { diff --git a/src/graphql/operations/getLibraryItemsPreview.graphql b/src/graphql/operations/getLibraryItemsPreview.graphql index 0637914..f3e52af 100644 --- a/src/graphql/operations/getLibraryItemsPreview.graphql +++ b/src/graphql/operations/getLibraryItemsPreview.graphql @@ -21,7 +21,7 @@ query getLibraryItemsPreview($language_code: String) { price { ...pricePicker } - categories { + categories(pagination: { limit: -1 }) { data { id attributes { @@ -47,7 +47,7 @@ query getLibraryItemsPreview($language_code: String) { } } ... on ComponentMetadataGame { - platforms { + platforms(pagination: { limit: -1 }) { data { id attributes { diff --git a/src/graphql/operations/getPost.graphql b/src/graphql/operations/getPost.graphql index 89b5066..7bd861a 100644 --- a/src/graphql/operations/getPost.graphql +++ b/src/graphql/operations/getPost.graphql @@ -8,7 +8,7 @@ query getPost($slug: String, $language_code: String) { date { ...datePicker } - authors { + authors(pagination: { limit: -1 }) { data { id attributes { @@ -16,7 +16,7 @@ query getPost($slug: String, $language_code: String) { } } } - categories { + categories(pagination: { limit: -1 }) { data { id attributes { @@ -33,7 +33,7 @@ query getPost($slug: String, $language_code: String) { } } } - translations { + translations(pagination: { limit: -1 }) { language { data { attributes { diff --git a/src/graphql/operations/getPostsPreview.graphql b/src/graphql/operations/getPostsPreview.graphql index c9db9eb..9793db7 100644 --- a/src/graphql/operations/getPostsPreview.graphql +++ b/src/graphql/operations/getPostsPreview.graphql @@ -7,7 +7,7 @@ query getPostsPreview { date { ...datePicker } - categories { + categories(pagination: { limit: -1 }) { data { id attributes { @@ -22,7 +22,7 @@ query getPostsPreview { } } } - translations { + translations(pagination: { limit: -1 }) { language { data { attributes { diff --git a/src/graphql/operations/getVideo.graphql b/src/graphql/operations/getVideo.graphql index d06493d..06270a0 100644 --- a/src/graphql/operations/getVideo.graphql +++ b/src/graphql/operations/getVideo.graphql @@ -21,7 +21,7 @@ query getVideo($uid: String) { } } } - categories { + categories(pagination: { limit: -1 }) { data { id attributes { @@ -32,7 +32,7 @@ query getVideo($uid: String) { views likes source - audio_languages { + audio_languages(pagination: { limit: -1 }) { data { id attributes { @@ -40,7 +40,7 @@ query getVideo($uid: String) { } } } - sub_languages { + sub_languages(pagination: { limit: -1 }) { data { id attributes { diff --git a/src/graphql/operations/getVideoChannel.graphql b/src/graphql/operations/getVideoChannel.graphql index 17e6072..b3f9cbd 100644 --- a/src/graphql/operations/getVideoChannel.graphql +++ b/src/graphql/operations/getVideoChannel.graphql @@ -14,7 +14,7 @@ query getVideoChannel($channel: String) { views duration gone - categories { + categories(pagination: { limit: -1 }) { data { id attributes { diff --git a/src/graphql/operations/getVideosPreview.graphql b/src/graphql/operations/getVideosPreview.graphql index 5f1d4c0..9576eac 100644 --- a/src/graphql/operations/getVideosPreview.graphql +++ b/src/graphql/operations/getVideosPreview.graphql @@ -8,7 +8,7 @@ query getVideosPreview { views duration gone - categories { + categories(pagination: { limit: -1 }) { data { id attributes { diff --git a/src/graphql/operations/getWikiPage.graphql b/src/graphql/operations/getWikiPage.graphql index b22db19..ebb945b 100644 --- a/src/graphql/operations/getWikiPage.graphql +++ b/src/graphql/operations/getWikiPage.graphql @@ -11,7 +11,7 @@ query getWikiPage($slug: String, $language_code: String) { } } } - categories { + categories(pagination: { limit: -1 }) { data { id attributes { @@ -20,7 +20,7 @@ query getWikiPage($slug: String, $language_code: String) { } } } - tags { + tags(pagination: { limit: -1 }) { data { id attributes { @@ -38,7 +38,7 @@ query getWikiPage($slug: String, $language_code: String) { } } } - translations { + translations(pagination: { limit: -1 }) { title aliases { alias @@ -61,7 +61,7 @@ query getWikiPage($slug: String, $language_code: String) { } status body - authors { + authors(pagination: { limit: -1 }) { data { id attributes { @@ -69,7 +69,7 @@ query getWikiPage($slug: String, $language_code: String) { } } } - translators { + translators(pagination: { limit: -1 }) { data { id attributes { @@ -77,7 +77,7 @@ query getWikiPage($slug: String, $language_code: String) { } } } - proofreaders { + proofreaders(pagination: { limit: -1 }) { data { id attributes { @@ -87,7 +87,7 @@ query getWikiPage($slug: String, $language_code: String) { } } } - definitions { + definitions(pagination: { limit: -1 }) { source { data { attributes { @@ -95,7 +95,7 @@ query getWikiPage($slug: String, $language_code: String) { } } } - categories { + categories(pagination: { limit: -1 }) { data { id attributes { @@ -104,7 +104,7 @@ query getWikiPage($slug: String, $language_code: String) { } } } - translations { + translations(pagination: { limit: -1 }) { language { data { attributes { diff --git a/src/graphql/operations/getWikiPagesPreviews.graphql b/src/graphql/operations/getWikiPagesPreviews.graphql index 9925e99..85f142e 100644 --- a/src/graphql/operations/getWikiPagesPreviews.graphql +++ b/src/graphql/operations/getWikiPagesPreviews.graphql @@ -11,7 +11,7 @@ query getWikiPagesPreviews($language_code: String) { } } } - categories { + categories(pagination: { limit: -1 }) { data { id attributes { @@ -20,7 +20,7 @@ query getWikiPagesPreviews($language_code: String) { } } } - tags { + tags(pagination: { limit: -1 }) { data { id attributes { @@ -38,9 +38,9 @@ query getWikiPagesPreviews($language_code: String) { } } } - translations { + translations(pagination: { limit: -1 }) { title - aliases { + aliases(pagination: { limit: -1 }) { alias } summary diff --git a/src/helpers/date.ts b/src/helpers/date.ts new file mode 100644 index 0000000..b6fd86d --- /dev/null +++ b/src/helpers/date.ts @@ -0,0 +1,10 @@ +import { DatePickerFragment } from "graphql/generated"; + +export const compareDate = ( + a: DatePickerFragment, + b: DatePickerFragment +): number => { + const dateA = (a.year ?? 99999) * 365 + (a.month ?? 12) * 31 + (a.day ?? 31); + const dateB = (b.year ?? 99999) * 365 + (b.month ?? 12) * 31 + (b.day ?? 31); + return dateA - dateB; +}; diff --git a/src/helpers/types.ts b/src/helpers/types.ts index e164625..47b2ce3 100644 --- a/src/helpers/types.ts +++ b/src/helpers/types.ts @@ -1,4 +1,5 @@ import { + GetChronicleQuery, GetContentTextQuery, GetPostQuery, GetWikiPageQuery, @@ -37,6 +38,17 @@ export interface WikiPageWithTranslations // ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ +type Chronicle = NonNullable< + NonNullable["data"][number]["attributes"] +>; + +export interface ChronicleWithTranslations + extends Omit { + translations: NonNullable; +} + +// ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ + export type RequiredNonNullable = { [P in keyof T]-?: NonNullable; }; diff --git a/src/helpers/types/Report.ts b/src/helpers/types/Report.ts index 07a5816..33dd820 100644 --- a/src/helpers/types/Report.ts +++ b/src/helpers/types/Report.ts @@ -3,7 +3,7 @@ export type Report = { lines: ReportLine[]; }; -export type ReportLine = { +type ReportLine = { subitems: string[]; name: string; type: "Error" | "Improvement" | "Missing"; diff --git a/src/hooks/useSmartLanguage.ts b/src/hooks/useSmartLanguage.ts index 392a7f4..9984440 100644 --- a/src/hooks/useSmartLanguage.ts +++ b/src/hooks/useSmartLanguage.ts @@ -7,7 +7,7 @@ import { filterDefined, isDefined } from "helpers/others"; interface Props { items: T[]; - languages: AppStaticProps["languages"]; + languages?: AppStaticProps["languages"]; languageExtractor: (item: NonNullable) => string | undefined; transform?: (item: NonNullable) => NonNullable; } @@ -27,7 +27,7 @@ const getPreferredLanguage = ( export const useSmartLanguage = ({ items, languageExtractor, - languages, + languages = [], transform = (item) => item, }: Props): [ T | undefined, diff --git a/src/pages/chronicles/[slug]/index.tsx b/src/pages/chronicles/[slug]/index.tsx new file mode 100644 index 0000000..ed2fa36 --- /dev/null +++ b/src/pages/chronicles/[slug]/index.tsx @@ -0,0 +1,258 @@ +import { GetStaticProps, GetStaticPaths, GetStaticPathsResult } from "next"; +import { useCallback, useMemo } from "react"; +import { AppStaticProps, getAppStaticProps } from "graphql/getAppStaticProps"; +import { getReadySdk } from "graphql/sdk"; +import { isDefined, filterHasAttributes } from "helpers/others"; +import { ChronicleWithTranslations } from "helpers/types"; +import { AppLayout } from "components/AppLayout"; +import { useSmartLanguage } from "hooks/useSmartLanguage"; +import { ContentPanel } from "components/Panels/ContentPanel"; +import { Markdawn } from "components/Markdown/Markdawn"; +import { SubPanel } from "components/Panels/SubPanel"; +import { ThumbnailHeader } from "components/ThumbnailHeader"; +import { HorizontalLine } from "components/HorizontalLine"; +import { GetChroniclesChaptersQuery } from "graphql/generated"; +import { prettySlug } from "helpers/formatters"; +import { + ReturnButton, + ReturnButtonType, +} from "components/PanelComponents/ReturnButton"; +import { TranslatedChroniclesList } from "components/Translated"; +import { Icon } from "components/Ico"; + +/* + * ╭────────╮ + * ──────────────────────────────────────────╯ PAGE ╰───────────────────────────────────────────── + */ + +interface Props extends AppStaticProps { + chronicle: ChronicleWithTranslations; + chapters: NonNullable< + GetChroniclesChaptersQuery["chroniclesChapters"] + >["data"]; +} + +const Chronicle = ({ + chronicle, + chapters, + langui, + languages, + ...otherProps +}: Props): JSX.Element => { + const [selectedTranslation, LanguageSwitcher, languageSwitcherProps] = + useSmartLanguage({ + items: chronicle.translations, + languages: languages, + languageExtractor: useCallback( + (item: ChronicleWithTranslations["translations"][number]) => + item?.language?.data?.attributes?.code, + [] + ), + }); + + const primaryContent = useMemo< + NonNullable< + ChronicleWithTranslations["contents"] + >["data"][number]["attributes"] + >( + () => + filterHasAttributes(chronicle.contents?.data, [ + "attributes.translations", + ] as const)[0]?.attributes, + [chronicle.contents?.data] + ); + + const [ + selectedContentTranslation, + ContentLanguageSwitcher, + ContentLanguageSwitcherProps, + ] = useSmartLanguage({ + items: primaryContent?.translations ?? [], + languages: languages, + languageExtractor: useCallback( + ( + item: NonNullable< + NonNullable< + NonNullable< + ChronicleWithTranslations["contents"] + >["data"][number]["attributes"] + >["translations"] + >[number] + ) => item?.language?.data?.attributes?.code, + [] + ), + }); + + const contentPanel = useMemo( + () => ( + + + + {isDefined(selectedTranslation) ? ( + <> +

+ {selectedTranslation.title} +

+ + {languageSwitcherProps.locales.size > 1 && ( + + )} + + {isDefined(selectedTranslation.body) && ( + + )} + + ) : ( + <> + {selectedContentTranslation && ( + <> + 1 ? ( + + ) : undefined + } + categories={primaryContent?.categories} + type={primaryContent?.type} + description={selectedContentTranslation.description} + thumbnail={primaryContent?.thumbnail?.data?.attributes} + langui={langui} + /> + + + + {selectedContentTranslation.text_set?.text && ( + + )} + + )} + + )} + + ), + [ + selectedTranslation, + languageSwitcherProps, + LanguageSwitcher, + selectedContentTranslation, + ContentLanguageSwitcherProps, + ContentLanguageSwitcher, + primaryContent?.categories, + primaryContent?.type, + primaryContent?.thumbnail?.data?.attributes, + langui, + ] + ); + + const subPanel = useMemo( + () => ( + + +
+ {filterHasAttributes(chapters, [ + "attributes.chronicles", + "id", + ] as const).map((chapter) => ( + ({ + title: translation.title, + language: translation.language.data.attributes.code, + }))} + fallback={{ title: prettySlug(chapter.attributes.slug) }} + currentSlug={chronicle.slug} + /> + ))} +
+ + ), + [chapters, chronicle.slug, langui] + ); + + return ( + + ); +}; +export default Chronicle; + +/* + * ╭──────────────────────╮ + * ───────────────────────────────────╯ NEXT DATA FETCHING ╰────────────────────────────────────── + */ + +export const getStaticProps: GetStaticProps = async (context) => { + const sdk = getReadySdk(); + const slug = + context.params && isDefined(context.params.slug) + ? context.params.slug.toString() + : ""; + const chronicle = await sdk.getChronicle({ + language_code: context.locale ?? "en", + slug: slug, + }); + const chronicles = await sdk.getChroniclesChapters(); + if ( + !chronicle.chronicles?.data[0].attributes?.translations || + !chronicles.chroniclesChapters?.data + ) + return { notFound: true }; + const props: Props = { + ...(await getAppStaticProps(context)), + chronicle: chronicle.chronicles.data[0] + .attributes as ChronicleWithTranslations, + chapters: chronicles.chroniclesChapters.data, + }; + return { + props: props, + }; +}; + +// ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ + +export const getStaticPaths: GetStaticPaths = async (context) => { + const sdk = getReadySdk(); + const contents = await sdk.getChroniclesSlugs(); + const paths: GetStaticPathsResult["paths"] = []; + filterHasAttributes(contents.chronicles?.data, ["attributes"] as const).map( + (wikiPage) => { + context.locales?.map((local) => + paths.push({ + params: { slug: wikiPage.attributes.slug }, + locale: local, + }) + ); + } + ); + return { + paths, + fallback: "blocking", + }; +}; diff --git a/src/pages/chronicles/index.tsx b/src/pages/chronicles/index.tsx index 3aaadb9..afcc5f2 100644 --- a/src/pages/chronicles/index.tsx +++ b/src/pages/chronicles/index.tsx @@ -5,15 +5,28 @@ import { PanelHeader } from "components/PanelComponents/PanelHeader"; import { SubPanel } from "components/Panels/SubPanel"; import { AppStaticProps, getAppStaticProps } from "graphql/getAppStaticProps"; import { Icon } from "components/Ico"; +import { getReadySdk } from "graphql/sdk"; +import { GetChroniclesChaptersQuery } from "graphql/generated"; +import { filterHasAttributes } from "helpers/others"; +import { prettySlug } from "helpers/formatters"; +import { TranslatedChroniclesList } from "components/Translated"; /* * ╭────────╮ * ──────────────────────────────────────────╯ PAGE ╰───────────────────────────────────────────── */ -interface Props extends AppStaticProps {} +interface Props extends AppStaticProps { + chapters: NonNullable< + GetChroniclesChaptersQuery["chroniclesChapters"] + >["data"]; +} -const Chronicles = ({ langui, ...otherProps }: Props): JSX.Element => { +const Chronicles = ({ + langui, + chapters, + ...otherProps +}: Props): JSX.Element => { const subPanel = useMemo( () => ( @@ -22,9 +35,27 @@ const Chronicles = ({ langui, ...otherProps }: Props): JSX.Element => { title={langui.chronicles} description={langui.chronicles_description} /> +
+ {filterHasAttributes(chapters, [ + "attributes.chronicles", + "id", + ] as const).map((chapter) => ( + ({ + title: translation.title, + language: translation.language.data.attributes.code, + }))} + fallback={{ title: prettySlug(chapter.attributes.slug) }} + /> + ))} +
), - [langui] + [chapters, langui] ); return ( @@ -44,8 +75,12 @@ export default Chronicles; */ export const getStaticProps: GetStaticProps = async (context) => { + const sdk = getReadySdk(); + const chronicles = await sdk.getChroniclesChapters(); + if (!chronicles.chroniclesChapters?.data) return { notFound: true }; const props: Props = { ...(await getAppStaticProps(context)), + chapters: chronicles.chroniclesChapters.data, }; return { props: props, diff --git a/src/pages/contents/[slug]/index.tsx b/src/pages/contents/[slug]/index.tsx index 4257496..8525b1a 100644 --- a/src/pages/contents/[slug]/index.tsx +++ b/src/pages/contents/[slug]/index.tsx @@ -355,7 +355,6 @@ const Content = ({ fallback={{ title: prettySlug(previousContent.attributes.slug), }} - languages={languages} thumbnail={ previousContent.attributes.thumbnail?.data?.attributes } @@ -409,7 +408,6 @@ const Content = ({ language: translation.language.data.attributes.code, }))} fallback={{ title: nextContent.attributes.slug }} - languages={languages} thumbnail={nextContent.attributes.thumbnail?.data?.attributes} thumbnailAspectRatio="3/2" topChips={ @@ -446,7 +444,6 @@ const Content = ({ content.type, isMobile, languageSwitcherProps, - languages, langui, nextContent?.attributes, previousContent?.attributes, diff --git a/src/pages/contents/index.tsx b/src/pages/contents/index.tsx index 1d7d149..38e7ccd 100644 --- a/src/pages/contents/index.tsx +++ b/src/pages/contents/index.tsx @@ -142,6 +142,17 @@ const Contents = ({ [effectiveCombineRelatedContent, searchName] ); + const groupCountingFunction = useCallback( + ( + item: SelectiveNonNullable + ) => + item.attributes.group?.data?.attributes?.combine && + effectiveCombineRelatedContent + ? item.attributes.group.data.attributes.contents?.data.length ?? 1 + : 1, + [effectiveCombineRelatedContent] + ); + const subPanel = useMemo( () => ( @@ -246,7 +257,6 @@ const Contents = ({ language: translation.language.data.attributes.code, }))} fallback={{ title: prettySlug(item.attributes.slug) }} - languages={languages} thumbnail={item.attributes.thumbnail?.data?.attributes} thumbnailAspectRatio="3/2" thumbnailForceAspectRatio @@ -273,6 +283,7 @@ const Contents = ({ )} className="grid-cols-2 desktop:grid-cols-[repeat(auto-fill,_minmax(15rem,1fr))]" groupingFunction={groupingFunction} + groupCountingFunction={groupCountingFunction} filteringFunction={filteringFunction} searchingTerm={searchName} searchingBy={(item) => @@ -296,9 +307,9 @@ const Contents = ({ contents, effectiveCombineRelatedContent, filteringFunction, + groupCountingFunction, groupingFunction, keepInfoVisible, - languages, langui, searchName, ] diff --git a/src/pages/library/[slug]/scans.tsx b/src/pages/library/[slug]/scans.tsx index f22d2b6..e03af1b 100644 --- a/src/pages/library/[slug]/scans.tsx +++ b/src/pages/library/[slug]/scans.tsx @@ -144,7 +144,6 @@ const LibrarySlug = ({ : undefined, }} border - languages={languages} /> )} @@ -164,7 +163,6 @@ const LibrarySlug = ({ item.thumbnail?.data?.attributes, item.title, itemId, - languages, langui, ] ); diff --git a/src/pages/news/index.tsx b/src/pages/news/index.tsx index 6299f3e..9954ab4 100644 --- a/src/pages/news/index.tsx +++ b/src/pages/news/index.tsx @@ -41,12 +41,7 @@ interface Props extends AppStaticProps { posts: NonNullable["data"]; } -const News = ({ - langui, - posts, - languages, - ...otherProps -}: Props): JSX.Element => { +const News = ({ langui, posts, ...otherProps }: Props): JSX.Element => { const hoverable = useMediaHoverable(); const [searchName, setSearchName] = useState( DEFAULT_FILTERS_STATE.searchName @@ -121,7 +116,6 @@ const News = ({ description: translation.excerpt, }))} fallback={{ title: prettySlug(post.attributes.slug) }} - languages={languages} thumbnail={post.attributes.thumbnail?.data?.attributes} thumbnailAspectRatio="3/2" thumbnailForceAspectRatio @@ -145,7 +139,7 @@ const News = ({ /> ), - [keepInfoVisible, languages, langui, posts, searchName] + [keepInfoVisible, langui, posts, searchName] ); return ( @@ -155,7 +149,6 @@ const News = ({ contentPanel={contentPanel} subPanelIcon={Icon.Search} langui={langui} - languages={languages} {...otherProps} /> ); diff --git a/src/pages/wiki/chronology.tsx b/src/pages/wiki/chronology.tsx index 54fa089..f033ad3 100644 --- a/src/pages/wiki/chronology.tsx +++ b/src/pages/wiki/chronology.tsx @@ -162,12 +162,8 @@ export default Chronology; export const getStaticProps: GetStaticProps = async (context) => { const sdk = getReadySdk(); - const chronologyItems = await sdk.getChronologyItems({ - language_code: context.locale ?? "en", - }); - const chronologyEras = await sdk.getEras({ - language_code: context.locale ?? "en", - }); + const chronologyItems = await sdk.getChronologyItems(); + const chronologyEras = await sdk.getEras(); if (!chronologyItems.chronologyItems || !chronologyEras.chronologyEras) return { notFound: true }; const props: Props = { diff --git a/src/pages/wiki/index.tsx b/src/pages/wiki/index.tsx index 9d88884..aa2cf08 100644 --- a/src/pages/wiki/index.tsx +++ b/src/pages/wiki/index.tsx @@ -46,12 +46,7 @@ interface Props extends AppStaticProps { pages: NonNullable["data"]; } -const Wiki = ({ - langui, - languages, - pages, - ...otherProps -}: Props): JSX.Element => { +const Wiki = ({ langui, pages, ...otherProps }: Props): JSX.Element => { const hoverable = useMediaHoverable(); const [searchName, setSearchName] = useState( @@ -188,7 +183,6 @@ const Wiki = ({ thumbnailAspectRatio={"4/3"} thumbnailRounded thumbnailForceAspectRatio - languages={languages} keepInfoVisible={keepInfoVisible} topChips={filterHasAttributes(item.attributes.tags?.data, [ "attributes", @@ -220,7 +214,7 @@ const Wiki = ({ /> ), - [groupingFunction, keepInfoVisible, languages, langui, pages, searchName] + [groupingFunction, keepInfoVisible, langui, pages, searchName] ); return ( @@ -229,7 +223,6 @@ const Wiki = ({ subPanel={subPanel} contentPanel={contentPanel} subPanelIcon={Icon.Search} - languages={languages} langui={langui} {...otherProps} /> diff --git a/src/tailwind.css b/src/tailwind.css index 9f19a97..e220cb9 100644 --- a/src/tailwind.css +++ b/src/tailwind.css @@ -119,7 +119,7 @@ mark { } .formatted pre > code { - @apply block whitespace-pre; + @apply block whitespace-pre-line; } .formatted ul {