Made props types more consistent
This commit is contained in:
		
							parent
							
								
									572cbb57d5
								
							
						
					
					
						commit
						3f452c529a
					
				| @ -18,7 +18,7 @@ import MainPanel from "./Panels/MainPanel"; | ||||
| import Popup from "./Popup"; | ||||
| import Select from "./Select"; | ||||
| 
 | ||||
| interface AppLayoutProps extends AppStaticProps { | ||||
| interface Props extends AppStaticProps { | ||||
|   subPanel?: React.ReactNode; | ||||
|   subPanelIcon?: string; | ||||
|   contentPanel?: React.ReactNode; | ||||
| @ -28,7 +28,7 @@ interface AppLayoutProps extends AppStaticProps { | ||||
|   description?: string; | ||||
| } | ||||
| 
 | ||||
| export default function AppLayout(props: AppLayoutProps): JSX.Element { | ||||
| export default function AppLayout(props: Props): JSX.Element { | ||||
|   const { langui, currencies, languages, subPanel, contentPanel } = props; | ||||
|   const router = useRouter(); | ||||
|   const isMobile = useMediaMobile(); | ||||
|  | ||||
| @ -1,7 +1,7 @@ | ||||
| import { useRouter } from "next/router"; | ||||
| import { MouseEventHandler } from "react"; | ||||
| 
 | ||||
| type ButtonProps = { | ||||
| interface Props { | ||||
|   id?: string; | ||||
|   className?: string; | ||||
|   href?: string; | ||||
| @ -9,9 +9,9 @@ type ButtonProps = { | ||||
|   active?: boolean; | ||||
|   locale?: string; | ||||
|   onClick?: MouseEventHandler<HTMLDivElement>; | ||||
| }; | ||||
| } | ||||
| 
 | ||||
| export default function Button(props: ButtonProps): JSX.Element { | ||||
| export default function Button(props: Props): JSX.Element { | ||||
|   const router = useRouter(); | ||||
| 
 | ||||
|   const button = ( | ||||
|  | ||||
| @ -1,9 +1,9 @@ | ||||
| type ChipProps = { | ||||
| interface Props { | ||||
|   className?: string; | ||||
|   children: React.ReactNode; | ||||
| }; | ||||
| } | ||||
| 
 | ||||
| export default function Chip(props: ChipProps): JSX.Element { | ||||
| export default function Chip(props: Props): JSX.Element { | ||||
|   return ( | ||||
|     <div | ||||
|       className={`grid place-content-center place-items-center text-xs pb-[0.14rem] whitespace-nowrap px-1.5 border-[1px] rounded-full opacity-70 transition-[color,_opacity,_border-color] hover:opacity-100 ${props.className}`} | ||||
|  | ||||
| @ -7,18 +7,16 @@ import { | ||||
| import { AppStaticProps } from "queries/getAppStaticProps"; | ||||
| import { getStatusDescription } from "queries/helpers"; | ||||
| 
 | ||||
| export type ChronologyItemComponentProps = { | ||||
| interface Props { | ||||
|   item: Exclude< | ||||
|     GetChronologyItemsQuery["chronologyItems"], | ||||
|     null | undefined | ||||
|   >["data"][number]; | ||||
|   displayYear: boolean; | ||||
|   langui: AppStaticProps["langui"]; | ||||
| }; | ||||
| } | ||||
| 
 | ||||
| export default function ChronologyItemComponent( | ||||
|   props: ChronologyItemComponentProps | ||||
| ): JSX.Element { | ||||
| export default function ChronologyItemComponent(props: Props): JSX.Element { | ||||
|   const { langui } = props; | ||||
| 
 | ||||
|   function generateAnchor( | ||||
|  | ||||
| @ -2,18 +2,16 @@ import ChronologyItemComponent from "components/Chronology/ChronologyItemCompone | ||||
| import { GetChronologyItemsQuery } from "graphql/generated"; | ||||
| import { AppStaticProps } from "queries/getAppStaticProps"; | ||||
| 
 | ||||
| type ChronologyYearComponentProps = { | ||||
| interface Props { | ||||
|   year: number; | ||||
|   items: Exclude< | ||||
|     GetChronologyItemsQuery["chronologyItems"], | ||||
|     null | undefined | ||||
|   >["data"][number][]; | ||||
|   langui: AppStaticProps["langui"]; | ||||
| }; | ||||
| } | ||||
| 
 | ||||
| export default function ChronologyYearComponent( | ||||
|   props: ChronologyYearComponentProps | ||||
| ): JSX.Element { | ||||
| export default function ChronologyYearComponent(props: Props): JSX.Element { | ||||
|   const { langui } = props; | ||||
| 
 | ||||
|   return ( | ||||
|  | ||||
| @ -5,7 +5,7 @@ import { GetContentQuery, UploadImageFragment } from "graphql/generated"; | ||||
| import { AppStaticProps } from "queries/getAppStaticProps"; | ||||
| import { prettyinlineTitle, prettySlug, slugify } from "queries/helpers"; | ||||
| 
 | ||||
| export type ThumbnailHeaderProps = { | ||||
| interface Props { | ||||
|   pre_title?: string | null | undefined; | ||||
|   title: string | null | undefined; | ||||
|   subtitle?: string | null | undefined; | ||||
| @ -26,11 +26,9 @@ export type ThumbnailHeaderProps = { | ||||
|   >["categories"]; | ||||
|   thumbnail?: UploadImageFragment | null | undefined; | ||||
|   langui: AppStaticProps["langui"]; | ||||
| }; | ||||
| } | ||||
| 
 | ||||
| export default function ThumbnailHeader( | ||||
|   props: ThumbnailHeaderProps | ||||
| ): JSX.Element { | ||||
| export default function ThumbnailHeader(props: Props): JSX.Element { | ||||
|   const { | ||||
|     langui, | ||||
|     pre_title, | ||||
|  | ||||
| @ -1,10 +1,8 @@ | ||||
| type HorizontalLineProps = { | ||||
| interface Props { | ||||
|   className?: string; | ||||
| }; | ||||
| } | ||||
| 
 | ||||
| export default function HorizontalLine( | ||||
|   props: HorizontalLineProps | ||||
| ): JSX.Element { | ||||
| export default function HorizontalLine(props: Props): JSX.Element { | ||||
|   return ( | ||||
|     <div | ||||
|       className={`h-0 w-full my-8 border-t-[3px] border-dotted border-black ${props.className}`} | ||||
|  | ||||
| @ -1,6 +1,60 @@ | ||||
| import { UploadImageFragment } from "graphql/generated"; | ||||
| import Image, { ImageProps } from "next/image"; | ||||
| 
 | ||||
| interface Props { | ||||
|   className?: string; | ||||
|   image?: UploadImageFragment; | ||||
|   quality?: ImageQuality; | ||||
|   alt?: ImageProps["alt"]; | ||||
|   layout?: ImageProps["layout"]; | ||||
|   objectFit?: ImageProps["objectFit"]; | ||||
|   priority?: ImageProps["priority"]; | ||||
|   rawImg?: boolean; | ||||
| } | ||||
| 
 | ||||
| export default function Img(props: Props): JSX.Element { | ||||
|   if (props.image?.width && props.image?.height) { | ||||
|     const imgSize = getImgSizesByQuality( | ||||
|       props.image.width, | ||||
|       props.image.height, | ||||
|       props.quality ?? ImageQuality.Small | ||||
|     ); | ||||
| 
 | ||||
|     if (props.rawImg) { | ||||
|       return ( | ||||
|         // eslint-disable-next-line @next/next/no-img-element
 | ||||
|         <img | ||||
|           className={props.className} | ||||
|           src={getAssetURL( | ||||
|             props.image.url, | ||||
|             props.quality ?? ImageQuality.Small | ||||
|           )} | ||||
|           alt={props.alt ?? props.image.alternativeText ?? ""} | ||||
|           width={imgSize.width} | ||||
|           height={imgSize.height} | ||||
|         /> | ||||
|       ); | ||||
|     } | ||||
|     return ( | ||||
|       <Image | ||||
|         className={props.className} | ||||
|         src={getAssetURL( | ||||
|           props.image.url, | ||||
|           props.quality ? props.quality : ImageQuality.Small | ||||
|         )} | ||||
|         alt={props.alt ?? props.image.alternativeText ?? ""} | ||||
|         width={props.layout === "fill" ? undefined : imgSize.width} | ||||
|         height={props.layout === "fill" ? undefined : imgSize.height} | ||||
|         layout={props.layout} | ||||
|         objectFit={props.objectFit} | ||||
|         priority={props.priority} | ||||
|         unoptimized | ||||
|       /> | ||||
|     ); | ||||
|   } | ||||
|   return <></>; | ||||
| } | ||||
| 
 | ||||
| export enum ImageQuality { | ||||
|   Small = "small", | ||||
|   Medium = "medium", | ||||
| @ -48,57 +102,3 @@ export function getImgSizesByQuality( | ||||
|       return { width: 0, height: 0 }; | ||||
|   } | ||||
| } | ||||
| 
 | ||||
| type ImgProps = { | ||||
|   className?: string; | ||||
|   image?: UploadImageFragment; | ||||
|   quality?: ImageQuality; | ||||
|   alt?: ImageProps["alt"]; | ||||
|   layout?: ImageProps["layout"]; | ||||
|   objectFit?: ImageProps["objectFit"]; | ||||
|   priority?: ImageProps["priority"]; | ||||
|   rawImg?: boolean; | ||||
| }; | ||||
| 
 | ||||
| export default function Img(props: ImgProps): JSX.Element { | ||||
|   if (props.image?.width && props.image?.height) { | ||||
|     const imgSize = getImgSizesByQuality( | ||||
|       props.image.width, | ||||
|       props.image.height, | ||||
|       props.quality ?? ImageQuality.Small | ||||
|     ); | ||||
| 
 | ||||
|     if (props.rawImg) { | ||||
|       return ( | ||||
|         // eslint-disable-next-line @next/next/no-img-element
 | ||||
|         <img | ||||
|           className={props.className} | ||||
|           src={getAssetURL( | ||||
|             props.image.url, | ||||
|             props.quality ?? ImageQuality.Small | ||||
|           )} | ||||
|           alt={props.alt ?? props.image.alternativeText ?? ""} | ||||
|           width={imgSize.width} | ||||
|           height={imgSize.height} | ||||
|         /> | ||||
|       ); | ||||
|     } | ||||
|     return ( | ||||
|       <Image | ||||
|         className={props.className} | ||||
|         src={getAssetURL( | ||||
|           props.image.url, | ||||
|           props.quality ? props.quality : ImageQuality.Small | ||||
|         )} | ||||
|         alt={props.alt ?? props.image.alternativeText ?? ""} | ||||
|         width={props.layout === "fill" ? undefined : imgSize.width} | ||||
|         height={props.layout === "fill" ? undefined : imgSize.height} | ||||
|         layout={props.layout} | ||||
|         objectFit={props.objectFit} | ||||
|         priority={props.priority} | ||||
|         unoptimized | ||||
|       /> | ||||
|     ); | ||||
|   } | ||||
|   return <></>; | ||||
| } | ||||
|  | ||||
| @ -1,10 +1,10 @@ | ||||
| type InsetBoxProps = { | ||||
| interface Props { | ||||
|   className?: string; | ||||
|   children: React.ReactNode; | ||||
|   id?: string; | ||||
| }; | ||||
| } | ||||
| 
 | ||||
| export default function InsetBox(props: InsetBoxProps): JSX.Element { | ||||
| export default function InsetBox(props: Props): JSX.Element { | ||||
|   return ( | ||||
|     <div | ||||
|       id={props.id} | ||||
|  | ||||
| @ -3,13 +3,13 @@ import { AppStaticProps } from "queries/getAppStaticProps"; | ||||
| import { prettyLanguage } from "queries/helpers"; | ||||
| import Button from "./Button"; | ||||
| 
 | ||||
| type Props = { | ||||
| interface Props { | ||||
|   className?: string; | ||||
|   locales: (string | undefined)[]; | ||||
|   languages: AppStaticProps["languages"]; | ||||
|   langui: AppStaticProps["langui"]; | ||||
|   href?: string; | ||||
| }; | ||||
| } | ||||
| 
 | ||||
| export default function LanguageSwitcher(props: Props): JSX.Element { | ||||
|   const { locales, langui, href } = props; | ||||
|  | ||||
| @ -5,7 +5,7 @@ import { AppStaticProps } from "queries/getAppStaticProps"; | ||||
| import { prettyinlineTitle, prettySlug } from "queries/helpers"; | ||||
| import { useState } from "react"; | ||||
| 
 | ||||
| type ContentTOCLineProps = { | ||||
| interface Props { | ||||
|   content: Exclude< | ||||
|     Exclude< | ||||
|       Exclude< | ||||
| @ -18,11 +18,9 @@ type ContentTOCLineProps = { | ||||
|   >["data"][number]; | ||||
|   parentSlug: string; | ||||
|   langui: AppStaticProps["langui"]; | ||||
| }; | ||||
| } | ||||
| 
 | ||||
| export default function ContentTOCLine( | ||||
|   props: ContentTOCLineProps | ||||
| ): JSX.Element { | ||||
| export default function ContentTOCLine(props: Props): JSX.Element { | ||||
|   const { content, langui, parentSlug } = props; | ||||
| 
 | ||||
|   const [opened, setOpened] = useState(false); | ||||
|  | ||||
| @ -4,16 +4,14 @@ import { GetContentsQuery } from "graphql/generated"; | ||||
| import Link from "next/link"; | ||||
| import { prettySlug } from "queries/helpers"; | ||||
| 
 | ||||
| export type LibraryContentPreviewProps = { | ||||
| interface Props { | ||||
|   item: Exclude< | ||||
|     GetContentsQuery["contents"], | ||||
|     null | undefined | ||||
|   >["data"][number]["attributes"]; | ||||
| }; | ||||
| } | ||||
| 
 | ||||
| export default function LibraryContentPreview( | ||||
|   props: LibraryContentPreviewProps | ||||
| ): JSX.Element { | ||||
| export default function LibraryContentPreview(props: Props): JSX.Element { | ||||
|   const { item } = props; | ||||
| 
 | ||||
|   return ( | ||||
|  | ||||
| @ -9,7 +9,7 @@ import Link from "next/link"; | ||||
| import { AppStaticProps } from "queries/getAppStaticProps"; | ||||
| import { prettyDate, prettyItemSubType, prettyPrice } from "queries/helpers"; | ||||
| 
 | ||||
| export type LibraryItemsPreviewProps = { | ||||
| interface Props { | ||||
|   className?: string; | ||||
|   item: | ||||
|     | Exclude< | ||||
| @ -27,11 +27,9 @@ export type LibraryItemsPreviewProps = { | ||||
|         null | undefined | ||||
|       >["data"][number]["attributes"]; | ||||
|   currencies: AppStaticProps["currencies"]; | ||||
| }; | ||||
| } | ||||
| 
 | ||||
| export default function LibraryItemsPreview( | ||||
|   props: LibraryItemsPreviewProps | ||||
| ): JSX.Element { | ||||
| export default function LibraryItemsPreview(props: Props): JSX.Element { | ||||
|   const { item } = props; | ||||
|   const appLayout = useAppLayout(); | ||||
| 
 | ||||
|  | ||||
| @ -2,7 +2,7 @@ import { useMediaMobile } from "hooks/useMediaQuery"; | ||||
| import { Dispatch, SetStateAction } from "react"; | ||||
| import Lightbox from "react-image-lightbox"; | ||||
| 
 | ||||
| export type LightBoxProps = { | ||||
| interface Props { | ||||
|   setState: | ||||
|     | Dispatch<SetStateAction<boolean | undefined>> | ||||
|     | Dispatch<SetStateAction<boolean>>; | ||||
| @ -10,9 +10,9 @@ export type LightBoxProps = { | ||||
|   images: string[]; | ||||
|   index: number; | ||||
|   setIndex: Dispatch<SetStateAction<number>>; | ||||
| }; | ||||
| } | ||||
| 
 | ||||
| export default function LightBox(props: LightBoxProps): JSX.Element { | ||||
| export default function LightBox(props: Props): JSX.Element { | ||||
|   const { state, setState, images, index, setIndex } = props; | ||||
|   const mobile = useMediaMobile(); | ||||
| 
 | ||||
|  | ||||
| @ -10,12 +10,12 @@ import { slugify } from "queries/helpers"; | ||||
| import React, { useState } from "react"; | ||||
| import ReactDOMServer from "react-dom/server"; | ||||
| 
 | ||||
| type MarkdawnProps = { | ||||
| interface Props { | ||||
|   className?: string; | ||||
|   text: string; | ||||
| }; | ||||
| } | ||||
| 
 | ||||
| export default function Markdawn(props: MarkdawnProps): JSX.Element { | ||||
| export default function Markdawn(props: Props): JSX.Element { | ||||
|   const appLayout = useAppLayout(); | ||||
|   const text = preprocessMarkDawn(props.text); | ||||
| 
 | ||||
|  | ||||
| @ -2,12 +2,12 @@ import { useRouter } from "next/router"; | ||||
| import { slugify } from "queries/helpers"; | ||||
| import { preprocessMarkDawn } from "./Markdawn"; | ||||
| 
 | ||||
| type TOCProps = { | ||||
| interface Props { | ||||
|   text: string; | ||||
|   title?: string; | ||||
| }; | ||||
| } | ||||
| 
 | ||||
| export default function TOCComponent(props: TOCProps): JSX.Element { | ||||
| export default function TOCComponent(props: Props): JSX.Element { | ||||
|   const { text, title } = props; | ||||
|   const toc = getTocFromMarkdawn(preprocessMarkDawn(text), title); | ||||
|   const router = useRouter(); | ||||
| @ -27,12 +27,12 @@ export default function TOCComponent(props: TOCProps): JSX.Element { | ||||
|   ); | ||||
| } | ||||
| 
 | ||||
| type TOCLevelProps = { | ||||
| interface LevelProps { | ||||
|   tocchildren: TOC[]; | ||||
|   parentNumbering: string; | ||||
| }; | ||||
| } | ||||
| 
 | ||||
| function TOCLevel(props: TOCLevelProps): JSX.Element { | ||||
| function TOCLevel(props: LevelProps): JSX.Element { | ||||
|   const router = useRouter(); | ||||
|   const { tocchildren, parentNumbering } = props; | ||||
|   return ( | ||||
| @ -60,11 +60,11 @@ function TOCLevel(props: TOCLevelProps): JSX.Element { | ||||
|   ); | ||||
| } | ||||
| 
 | ||||
| export type TOC = { | ||||
| interface TOC { | ||||
|   title: string; | ||||
|   slug: string; | ||||
|   children: TOC[]; | ||||
| }; | ||||
| } | ||||
| 
 | ||||
| export function getTocFromMarkdawn(text: string, title?: string): TOC { | ||||
|   const toc: TOC = { | ||||
|  | ||||
| @ -4,14 +4,14 @@ import { GetPostsPreviewQuery } from "graphql/generated"; | ||||
| import Link from "next/link"; | ||||
| import { prettyDate, prettySlug } from "queries/helpers"; | ||||
| 
 | ||||
| export type PostPreviewProps = { | ||||
| interface Props { | ||||
|   post: Exclude< | ||||
|     GetPostsPreviewQuery["posts"], | ||||
|     null | undefined | ||||
|   >["data"][number]["attributes"]; | ||||
| }; | ||||
| } | ||||
| 
 | ||||
| export default function PostPreview(props: PostPreviewProps): JSX.Element { | ||||
| export default function PostPreview(props: Props): JSX.Element { | ||||
|   const { post } = props; | ||||
| 
 | ||||
|   return ( | ||||
|  | ||||
| @ -1,12 +1,12 @@ | ||||
| import { Dispatch, SetStateAction } from "react"; | ||||
| import Button from "./Button"; | ||||
| 
 | ||||
| type Props = { | ||||
| interface Props { | ||||
|   className?: string; | ||||
|   maxPage: number; | ||||
|   page: number; | ||||
|   setPage: Dispatch<SetStateAction<number>>; | ||||
| }; | ||||
| } | ||||
| 
 | ||||
| export default function PageSelector(props: Props): JSX.Element { | ||||
|   const { page, setPage, maxPage } = props; | ||||
|  | ||||
| @ -2,7 +2,7 @@ import ToolTip from "components/ToolTip"; | ||||
| import { useRouter } from "next/router"; | ||||
| import { MouseEventHandler } from "react"; | ||||
| 
 | ||||
| type NavOptionProps = { | ||||
| interface Props { | ||||
|   url: string; | ||||
|   icon?: string; | ||||
|   title: string | null | undefined; | ||||
| @ -10,9 +10,9 @@ type NavOptionProps = { | ||||
|   border?: boolean; | ||||
|   reduced?: boolean; | ||||
|   onClick?: MouseEventHandler<HTMLDivElement>; | ||||
| }; | ||||
| } | ||||
| 
 | ||||
| export default function NavOption(props: NavOptionProps): JSX.Element { | ||||
| export default function NavOption(props: Props): JSX.Element { | ||||
|   const router = useRouter(); | ||||
|   const isActive = router.asPath.startsWith(props.url); | ||||
|   const divActive = "bg-mid shadow-inner-sm shadow-shade"; | ||||
|  | ||||
| @ -1,12 +1,12 @@ | ||||
| import HorizontalLine from "components/HorizontalLine"; | ||||
| 
 | ||||
| type PanelHeaderProps = { | ||||
| interface Props { | ||||
|   icon?: string; | ||||
|   title: string | null | undefined; | ||||
|   description?: string | null | undefined; | ||||
| }; | ||||
| } | ||||
| 
 | ||||
| export default function PanelHeader(props: PanelHeaderProps): JSX.Element { | ||||
| export default function PanelHeader(props: Props): JSX.Element { | ||||
|   return ( | ||||
|     <> | ||||
|       <div className="w-full grid place-items-center"> | ||||
|  | ||||
| @ -3,14 +3,14 @@ import HorizontalLine from "components/HorizontalLine"; | ||||
| import { useAppLayout } from "contexts/AppLayoutContext"; | ||||
| import { AppStaticProps } from "queries/getAppStaticProps"; | ||||
| 
 | ||||
| type ReturnButtonProps = { | ||||
| interface Props { | ||||
|   href: string; | ||||
|   title: string | null | undefined; | ||||
|   langui: AppStaticProps["langui"]; | ||||
|   displayOn: ReturnButtonType; | ||||
|   horizontalLine?: boolean; | ||||
|   className?: string; | ||||
| }; | ||||
| } | ||||
| 
 | ||||
| export enum ReturnButtonType { | ||||
|   mobile = "mobile", | ||||
| @ -18,7 +18,7 @@ export enum ReturnButtonType { | ||||
|   both = "both", | ||||
| } | ||||
| 
 | ||||
| export default function ReturnButton(props: ReturnButtonProps): JSX.Element { | ||||
| export default function ReturnButton(props: Props): JSX.Element { | ||||
|   const appLayout = useAppLayout(); | ||||
| 
 | ||||
|   return ( | ||||
|  | ||||
| @ -1,15 +1,15 @@ | ||||
| type ContentPanelProps = { | ||||
| interface Props { | ||||
|   children: React.ReactNode; | ||||
|   autoformat?: boolean; | ||||
|   width?: ContentPanelWidthSizes; | ||||
| }; | ||||
| } | ||||
| 
 | ||||
| export enum ContentPanelWidthSizes { | ||||
|   default = "default", | ||||
|   large = "large", | ||||
| } | ||||
| 
 | ||||
| export default function ContentPanel(props: ContentPanelProps): JSX.Element { | ||||
| export default function ContentPanel(props: Props): JSX.Element { | ||||
|   const width = props.width ? props.width : ContentPanelWidthSizes.default; | ||||
|   const widthCSS = | ||||
|     width === ContentPanelWidthSizes.default ? "max-w-2xl" : "w-full"; | ||||
|  | ||||
| @ -9,11 +9,11 @@ import Link from "next/link"; | ||||
| import { useRouter } from "next/router"; | ||||
| import { AppStaticProps } from "queries/getAppStaticProps"; | ||||
| 
 | ||||
| type MainPanelProps = { | ||||
| interface Props { | ||||
|   langui: AppStaticProps["langui"]; | ||||
| }; | ||||
| } | ||||
| 
 | ||||
| export default function MainPanel(props: MainPanelProps): JSX.Element { | ||||
| export default function MainPanel(props: Props): JSX.Element { | ||||
|   const { langui } = props; | ||||
|   const router = useRouter(); | ||||
|   const isDesktop = useMediaDesktop(); | ||||
|  | ||||
| @ -1,8 +1,8 @@ | ||||
| type SubPanelProps = { | ||||
| interface Props { | ||||
|   children: React.ReactNode; | ||||
| }; | ||||
| } | ||||
| 
 | ||||
| export default function SubPanel(props: SubPanelProps): JSX.Element { | ||||
| export default function SubPanel(props: Props): JSX.Element { | ||||
|   return ( | ||||
|     <div className="grid pt-10 pb-20 px-6 desktop:py-8 desktop:px-10 gap-y-2 text-center"> | ||||
|       {props.children} | ||||
|  | ||||
| @ -1,7 +1,7 @@ | ||||
| import { Dispatch, SetStateAction } from "react"; | ||||
| import Button from "./Button"; | ||||
| 
 | ||||
| export type PopupProps = { | ||||
| interface Props { | ||||
|   setState: | ||||
|     | Dispatch<SetStateAction<boolean | undefined>> | ||||
|     | Dispatch<SetStateAction<boolean>>; | ||||
| @ -9,9 +9,9 @@ export type PopupProps = { | ||||
|   children: React.ReactNode; | ||||
|   fillViewport?: boolean; | ||||
|   hideBackground?: boolean; | ||||
| }; | ||||
| } | ||||
| 
 | ||||
| export default function Popup(props: PopupProps): JSX.Element { | ||||
| export default function Popup(props: Props): JSX.Element { | ||||
|   return ( | ||||
|     <div | ||||
|       className={`fixed inset-0 z-50 grid place-content-center transition-[backdrop-filter] duration-500 ${ | ||||
|  | ||||
| @ -5,13 +5,13 @@ import Button from "./Button"; | ||||
| import Img, { ImageQuality } from "./Img"; | ||||
| import ToolTip from "./ToolTip"; | ||||
| 
 | ||||
| type RecorderChipProps = { | ||||
| interface Props { | ||||
|   className?: string; | ||||
|   recorder: RecorderChipFragment; | ||||
|   langui: AppStaticProps["langui"]; | ||||
| }; | ||||
| } | ||||
| 
 | ||||
| export default function RecorderChip(props: RecorderChipProps): JSX.Element { | ||||
| export default function RecorderChip(props: Props): JSX.Element { | ||||
|   const { recorder, langui } = props; | ||||
|   return ( | ||||
|     <ToolTip | ||||
|  | ||||
| @ -1,12 +1,12 @@ | ||||
| import Image from "next/image"; | ||||
| 
 | ||||
| export type SVGProps = { | ||||
| interface Props { | ||||
|   src: string; | ||||
|   alt: string; | ||||
|   className?: string; | ||||
| }; | ||||
| } | ||||
| 
 | ||||
| export default function SVG(props: SVGProps): JSX.Element { | ||||
| export default function SVG(props: Props): JSX.Element { | ||||
|   return ( | ||||
|     <div className={props.className}> | ||||
|       <Image | ||||
|  | ||||
| @ -1,15 +1,15 @@ | ||||
| import { Dispatch, SetStateAction, useState } from "react"; | ||||
| 
 | ||||
| export type SelectProps = { | ||||
| interface Props { | ||||
|   setState: Dispatch<SetStateAction<number>>; | ||||
|   state: number; | ||||
|   options: string[]; | ||||
|   selected?: number; | ||||
|   allowEmpty?: boolean; | ||||
|   className?: string; | ||||
| }; | ||||
| } | ||||
| 
 | ||||
| export default function Select(props: SelectProps): JSX.Element { | ||||
| export default function Select(props: Props): JSX.Element { | ||||
|   const [opened, setOpened] = useState(false); | ||||
| 
 | ||||
|   return ( | ||||
|  | ||||
| @ -1,12 +1,12 @@ | ||||
| import { Dispatch, SetStateAction } from "react"; | ||||
| 
 | ||||
| export type SwitchProps = { | ||||
| interface Props { | ||||
|   setState: Dispatch<SetStateAction<boolean>>; | ||||
|   state: boolean; | ||||
|   className?: string; | ||||
| }; | ||||
| } | ||||
| 
 | ||||
| export default function Switch(props: SwitchProps): JSX.Element { | ||||
| export default function Switch(props: Props): JSX.Element { | ||||
|   return ( | ||||
|     <div | ||||
|       className={`h-6 w-12 rounded-full border-2 border-mid grid transition-colors relative cursor-pointer ${ | ||||
|  | ||||
| @ -1,9 +1,9 @@ | ||||
| import Tippy, { TippyProps } from "@tippyjs/react"; | ||||
| import "tippy.js/animations/scale-subtle.css"; | ||||
| 
 | ||||
| interface ToolTipProps extends TippyProps {} | ||||
| interface Props extends TippyProps {} | ||||
| 
 | ||||
| export default function ToolTip(props: ToolTipProps): JSX.Element { | ||||
| export default function ToolTip(props: Props): JSX.Element { | ||||
|   const newProps = { ...props }; | ||||
| 
 | ||||
|   // Set defaults
 | ||||
|  | ||||
| @ -8,7 +8,7 @@ import { | ||||
|   prettyShortenNumber, | ||||
| } from "queries/helpers"; | ||||
| 
 | ||||
| export type Props = { | ||||
| interface Props { | ||||
|   video: Exclude< | ||||
|     Exclude< | ||||
|       GetVideosPreviewQuery["videos"], | ||||
| @ -16,7 +16,7 @@ export type Props = { | ||||
|     >["data"][number]["attributes"], | ||||
|     null | undefined | ||||
|   >; | ||||
| }; | ||||
| } | ||||
| 
 | ||||
| export default function PostPreview(props: Props): JSX.Element { | ||||
|   const { video } = props; | ||||
|  | ||||
| @ -2,7 +2,7 @@ import useDarkMode from "hooks/useDarkMode"; | ||||
| import useStateWithLocalStorage from "hooks/useStateWithLocalStorage"; | ||||
| import React, { ReactNode, useContext } from "react"; | ||||
| 
 | ||||
| export interface AppLayoutState { | ||||
| interface AppLayoutState { | ||||
|   subPanelOpen: boolean | undefined; | ||||
|   languagePanelOpen: boolean | undefined; | ||||
|   configPanelOpen: boolean | undefined; | ||||
| @ -68,9 +68,9 @@ export function useAppLayout(): AppLayoutState { | ||||
|   return useContext(AppContext); | ||||
| } | ||||
| 
 | ||||
| type Props = { | ||||
| interface Props { | ||||
|   children: ReactNode; | ||||
| }; | ||||
| } | ||||
| 
 | ||||
| export function AppContextProvider(props: Props): JSX.Element { | ||||
|   const [subPanelOpen, setSubPanelOpen] = useStateWithLocalStorage< | ||||
|  | ||||
| @ -1,36 +1,36 @@ | ||||
| query getVideoChannel($channel: String) { | ||||
| 	videoChannels(filters: { uid: { eq: $channel } } ) { | ||||
| 		data { | ||||
| 			attributes { | ||||
| 				uid | ||||
| 				title | ||||
| 				subscribers | ||||
| 				videos (pagination:{limit: -1}) { | ||||
| 					data { | ||||
| 						id | ||||
| 						attributes { | ||||
| 							uid | ||||
| 							title | ||||
| 							views | ||||
| 							duration | ||||
| 							gone | ||||
| 							categories { | ||||
| 								data { | ||||
| 									id | ||||
| 									attributes { | ||||
| 										short | ||||
| 									} | ||||
| 								} | ||||
| 							} | ||||
| 							published_date { | ||||
| 								year | ||||
| 								month | ||||
| 								day | ||||
| 							} | ||||
| 						} | ||||
| 					} | ||||
| 				} | ||||
| 			} | ||||
| 		} | ||||
| 	} | ||||
|   videoChannels(filters: { uid: { eq: $channel } }) { | ||||
|     data { | ||||
|       attributes { | ||||
|         uid | ||||
|         title | ||||
|         subscribers | ||||
|         videos(pagination: { limit: -1 }) { | ||||
|           data { | ||||
|             id | ||||
|             attributes { | ||||
|               uid | ||||
|               title | ||||
|               views | ||||
|               duration | ||||
|               gone | ||||
|               categories { | ||||
|                 data { | ||||
|                   id | ||||
|                   attributes { | ||||
|                     short | ||||
|                   } | ||||
|                 } | ||||
|               } | ||||
|               published_date { | ||||
|                 year | ||||
|                 month | ||||
|                 day | ||||
|               } | ||||
|             } | ||||
|           } | ||||
|         } | ||||
|       } | ||||
|     } | ||||
|   } | ||||
| } | ||||
|  | ||||
| @ -1,9 +1,9 @@ | ||||
| query getVideoChannelsSlugs { | ||||
| 	videoChannels(pagination: {limit: -1}) { | ||||
| 		data { | ||||
| 			attributes { | ||||
|   videoChannels(pagination: { limit: -1 }) { | ||||
|     data { | ||||
|       attributes { | ||||
|         uid | ||||
|       } | ||||
| 		} | ||||
| 	} | ||||
|     } | ||||
|   } | ||||
| } | ||||
|  | ||||
| @ -6,9 +6,9 @@ import ContentPanel from "components/Panels/ContentPanel"; | ||||
| import { GetStaticPropsContext } from "next"; | ||||
| import { AppStaticProps, getAppStaticProps } from "queries/getAppStaticProps"; | ||||
| 
 | ||||
| interface FourOhFourProps extends AppStaticProps {} | ||||
| interface Props extends AppStaticProps {} | ||||
| 
 | ||||
| export default function FourOhFour(props: FourOhFourProps): JSX.Element { | ||||
| export default function FourOhFour(props: Props): JSX.Element { | ||||
|   const { langui } = props; | ||||
|   const contentPanel = ( | ||||
|     <ContentPanel> | ||||
| @ -26,8 +26,8 @@ export default function FourOhFour(props: FourOhFourProps): JSX.Element { | ||||
| 
 | ||||
| export async function getStaticProps( | ||||
|   context: GetStaticPropsContext | ||||
| ): Promise<{ notFound: boolean } | { props: FourOhFourProps }> { | ||||
|   const props: FourOhFourProps = { | ||||
| ): Promise<{ notFound: boolean } | { props: Props }> { | ||||
|   const props: Props = { | ||||
|     ...(await getAppStaticProps(context)), | ||||
|   }; | ||||
|   return { | ||||
|  | ||||
| @ -6,9 +6,9 @@ import ContentPanel from "components/Panels/ContentPanel"; | ||||
| import { GetStaticPropsContext } from "next"; | ||||
| import { AppStaticProps, getAppStaticProps } from "queries/getAppStaticProps"; | ||||
| 
 | ||||
| interface FiveHundredProps extends AppStaticProps {} | ||||
| interface Props extends AppStaticProps {} | ||||
| 
 | ||||
| export default function FiveHundred(props: FiveHundredProps): JSX.Element { | ||||
| export default function FiveHundred(props: Props): JSX.Element { | ||||
|   const { langui } = props; | ||||
|   const contentPanel = ( | ||||
|     <ContentPanel> | ||||
| @ -26,8 +26,8 @@ export default function FiveHundred(props: FiveHundredProps): JSX.Element { | ||||
| 
 | ||||
| export async function getStaticProps( | ||||
|   context: GetStaticPropsContext | ||||
| ): Promise<{ notFound: boolean } | { props: FiveHundredProps }> { | ||||
|   const props: FiveHundredProps = { | ||||
| ): Promise<{ notFound: boolean } | { props: Props }> { | ||||
|   const props: Props = { | ||||
|     ...(await getAppStaticProps(context)), | ||||
|   }; | ||||
|   return { | ||||
|  | ||||
| @ -2,17 +2,17 @@ import type { NextApiRequest, NextApiResponse } from "next"; | ||||
| import nodemailer from "nodemailer"; | ||||
| import { SMTPError } from "nodemailer/lib/smtp-connection"; | ||||
| 
 | ||||
| export type ResponseMailProps = { | ||||
| export interface ResponseMailProps { | ||||
|   code?: string; | ||||
|   message?: string; | ||||
| }; | ||||
| } | ||||
| 
 | ||||
| export type RequestMailProps = { | ||||
| export interface RequestMailProps { | ||||
|   name: string; | ||||
|   email: string; | ||||
|   message: string; | ||||
|   formName: string; | ||||
| }; | ||||
| } | ||||
| 
 | ||||
| export default async function Mail( | ||||
|   req: NextApiRequest, | ||||
|  | ||||
| @ -1,7 +1,7 @@ | ||||
| import type { NextApiRequest, NextApiResponse } from "next"; | ||||
| import getConfig from "next/config"; | ||||
| 
 | ||||
| export type RequestProps = | ||||
| type RequestProps = | ||||
|   | HookRangedContent | ||||
|   | HookPostContent | ||||
|   | HookLibraryItem | ||||
| @ -9,7 +9,7 @@ export type RequestProps = | ||||
|   | HookContent | ||||
|   | HookCustom; | ||||
| 
 | ||||
| export type HookRangedContent = { | ||||
| type HookRangedContent = { | ||||
|   event: "entry.update" | "entry.delete" | "entry.create"; | ||||
|   model: "ranged-content"; | ||||
|   entry: { | ||||
| @ -22,19 +22,19 @@ export type HookRangedContent = { | ||||
|   }; | ||||
| }; | ||||
| 
 | ||||
| export type HookCustom = { | ||||
| type HookCustom = { | ||||
|   model: "custom"; | ||||
|   url: string; | ||||
| }; | ||||
| 
 | ||||
| export type HookContent = { | ||||
| type HookContent = { | ||||
|   model: "content"; | ||||
|   entry: { | ||||
|     slug: string; | ||||
|   }; | ||||
| }; | ||||
| 
 | ||||
| export type HookPostContent = { | ||||
| type HookPostContent = { | ||||
|   event: "entry.update" | "entry.delete" | "entry.create"; | ||||
|   model: "post"; | ||||
|   entry: { | ||||
| @ -42,7 +42,7 @@ export type HookPostContent = { | ||||
|   }; | ||||
| }; | ||||
| 
 | ||||
| export type HookLibraryItem = { | ||||
| type HookLibraryItem = { | ||||
|   event: "entry.update" | "entry.delete" | "entry.create"; | ||||
|   model: "library-item"; | ||||
|   entry: { | ||||
| @ -50,12 +50,12 @@ export type HookLibraryItem = { | ||||
|   }; | ||||
| }; | ||||
| 
 | ||||
| export type HookChronology = { | ||||
| type HookChronology = { | ||||
|   event: "entry.update" | "entry.delete" | "entry.create"; | ||||
|   model: "chronology-era" | "chronology-item"; | ||||
| }; | ||||
| 
 | ||||
| export type ResponseMailProps = { | ||||
| type ResponseMailProps = { | ||||
|   message: string; | ||||
|   revalidated: boolean; | ||||
| }; | ||||
|  | ||||
| @ -5,9 +5,9 @@ import SubPanel from "components/Panels/SubPanel"; | ||||
| import { GetStaticPropsContext } from "next"; | ||||
| import { AppStaticProps, getAppStaticProps } from "queries/getAppStaticProps"; | ||||
| 
 | ||||
| interface ArchivesProps extends AppStaticProps {} | ||||
| interface Props extends AppStaticProps {} | ||||
| 
 | ||||
| export default function Archives(props: ArchivesProps): JSX.Element { | ||||
| export default function Archives(props: Props): JSX.Element { | ||||
|   const { langui } = props; | ||||
|   const subPanel = ( | ||||
|     <SubPanel> | ||||
| @ -26,8 +26,8 @@ export default function Archives(props: ArchivesProps): JSX.Element { | ||||
| 
 | ||||
| export async function getStaticProps( | ||||
|   context: GetStaticPropsContext | ||||
| ): Promise<{ notFound: boolean } | { props: ArchivesProps }> { | ||||
|   const props: ArchivesProps = { | ||||
| ): Promise<{ notFound: boolean } | { props: Props }> { | ||||
|   const props: Props = { | ||||
|     ...(await getAppStaticProps(context)), | ||||
|   }; | ||||
|   return { | ||||
|  | ||||
| @ -72,7 +72,7 @@ export default function Videos(props: Props): JSX.Element { | ||||
|         className="mb-12" | ||||
|       /> | ||||
| 
 | ||||
|       <div className="grid gap-8 items-start mobile:grid-cols-2 desktop:grid-cols-[repeat(auto-fill,_minmax(15rem,1fr))] pb-12 border-b-[3px] border-dotted last-of-type:border-0"> | ||||
|       <div className="grid gap-8 items-start thin:grid-cols-1 mobile:grid-cols-2 desktop:grid-cols-[repeat(auto-fill,_minmax(15rem,1fr))] pb-12 border-b-[3px] border-dotted last-of-type:border-0"> | ||||
|         {paginatedVideos[page].map((video) => ( | ||||
|           <> | ||||
|             {video.attributes && ( | ||||
|  | ||||
| @ -146,7 +146,9 @@ export default function Video(props: Props): JSX.Element { | ||||
|             <div className="w-[clamp(0px,100%,42rem)] grid place-items-center gap-4 text-center"> | ||||
|               <h2 className="text-2xl">{"Channel"}</h2> | ||||
|               <div> | ||||
|                 <Button href={`/archives/videos/c/${video.channel.data.attributes.uid}`}> | ||||
|                 <Button | ||||
|                   href={`/archives/videos/c/${video.channel.data.attributes.uid}`} | ||||
|                 > | ||||
|                   <h3>{video.channel.data.attributes.title}</h3> | ||||
|                 </Button> | ||||
| 
 | ||||
|  | ||||
| @ -4,9 +4,9 @@ import SubPanel from "components/Panels/SubPanel"; | ||||
| import { GetStaticPropsContext } from "next"; | ||||
| import { AppStaticProps, getAppStaticProps } from "queries/getAppStaticProps"; | ||||
| 
 | ||||
| interface ChroniclesProps extends AppStaticProps {} | ||||
| interface Props extends AppStaticProps {} | ||||
| 
 | ||||
| export default function Chronicles(props: ChroniclesProps): JSX.Element { | ||||
| export default function Chronicles(props: Props): JSX.Element { | ||||
|   const { langui } = props; | ||||
|   const subPanel = ( | ||||
|     <SubPanel> | ||||
| @ -24,8 +24,8 @@ export default function Chronicles(props: ChroniclesProps): JSX.Element { | ||||
| 
 | ||||
| export async function getStaticProps( | ||||
|   context: GetStaticPropsContext | ||||
| ): Promise<{ notFound: boolean } | { props: ChroniclesProps }> { | ||||
|   const props: ChroniclesProps = { | ||||
| ): Promise<{ notFound: boolean } | { props: Props }> { | ||||
|   const props: Props = { | ||||
|     ...(await getAppStaticProps(context)), | ||||
|   }; | ||||
|   return { | ||||
|  | ||||
| @ -14,13 +14,13 @@ import { AppStaticProps, getAppStaticProps } from "queries/getAppStaticProps"; | ||||
| import { prettyinlineTitle, prettySlug } from "queries/helpers"; | ||||
| import { useEffect, useState } from "react"; | ||||
| 
 | ||||
| interface ContentsProps extends AppStaticProps { | ||||
| interface Props extends AppStaticProps { | ||||
|   contents: Exclude<GetContentsQuery["contents"], null | undefined>["data"]; | ||||
| } | ||||
| 
 | ||||
| type GroupContentItems = Map<string, ContentsProps["contents"]>; | ||||
| type GroupContentItems = Map<string, Props["contents"]>; | ||||
| 
 | ||||
| export default function Contents(props: ContentsProps): JSX.Element { | ||||
| export default function Contents(props: Props): JSX.Element { | ||||
|   const { langui, contents } = props; | ||||
| 
 | ||||
|   const [groupingMethod, setGroupingMethod] = useState<number>(-1); | ||||
| @ -105,7 +105,7 @@ export default function Contents(props: ContentsProps): JSX.Element { | ||||
| 
 | ||||
| export async function getStaticProps( | ||||
|   context: GetStaticPropsContext | ||||
| ): Promise<{ notFound: boolean } | { props: ContentsProps }> { | ||||
| ): Promise<{ notFound: boolean } | { props: Props }> { | ||||
|   const sdk = getReadySdk(); | ||||
|   const contents = await sdk.getContents({ | ||||
|     language_code: context.locale ?? "en", | ||||
| @ -129,7 +129,7 @@ export async function getStaticProps( | ||||
|     return titleA.localeCompare(titleB); | ||||
|   }); | ||||
| 
 | ||||
|   const props: ContentsProps = { | ||||
|   const props: Props = { | ||||
|     ...(await getAppStaticProps(context)), | ||||
|     contents: contents.contents.data, | ||||
|   }; | ||||
| @ -141,7 +141,7 @@ export async function getStaticProps( | ||||
| function getGroups( | ||||
|   langui: AppStaticProps["langui"], | ||||
|   groupByType: number, | ||||
|   items: ContentsProps["contents"] | ||||
|   items: Props["contents"] | ||||
| ): GroupContentItems { | ||||
|   switch (groupByType) { | ||||
|     case 0: { | ||||
|  | ||||
| @ -9,9 +9,9 @@ import { AppStaticProps, getAppStaticProps } from "queries/getAppStaticProps"; | ||||
| import { useCallback, useState } from "react"; | ||||
| import { default as TurndownService } from "turndown"; | ||||
| 
 | ||||
| interface EditorProps extends AppStaticProps {} | ||||
| interface Props extends AppStaticProps {} | ||||
| 
 | ||||
| export default function Editor(props: EditorProps): JSX.Element { | ||||
| export default function Editor(props: Props): JSX.Element { | ||||
|   const handleInput = useCallback((event) => { | ||||
|     setMarkdown(event.target.value); | ||||
|   }, []); | ||||
| @ -91,8 +91,8 @@ export default function Editor(props: EditorProps): JSX.Element { | ||||
| 
 | ||||
| export async function getStaticProps( | ||||
|   context: GetStaticPropsContext | ||||
| ): Promise<{ notFound: boolean } | { props: EditorProps }> { | ||||
|   const props: EditorProps = { | ||||
| ): Promise<{ notFound: boolean } | { props: Props }> { | ||||
|   const props: Props = { | ||||
|     ...(await getAppStaticProps(context)), | ||||
|   }; | ||||
|   return { | ||||
|  | ||||
| @ -2,9 +2,9 @@ import AppLayout from "components/AppLayout"; | ||||
| import { GetStaticPropsContext } from "next"; | ||||
| import { AppStaticProps, getAppStaticProps } from "queries/getAppStaticProps"; | ||||
| 
 | ||||
| interface GalleryProps extends AppStaticProps {} | ||||
| interface Props extends AppStaticProps {} | ||||
| 
 | ||||
| export default function Gallery(props: GalleryProps): JSX.Element { | ||||
| export default function Gallery(props: Props): JSX.Element { | ||||
|   const { langui } = props; | ||||
|   const contentPanel = ( | ||||
|     <iframe | ||||
| @ -24,8 +24,8 @@ export default function Gallery(props: GalleryProps): JSX.Element { | ||||
| 
 | ||||
| export async function getStaticProps( | ||||
|   context: GetStaticPropsContext | ||||
| ): Promise<{ notFound: boolean } | { props: GalleryProps }> { | ||||
|   const props: GalleryProps = { | ||||
| ): Promise<{ notFound: boolean } | { props: Props }> { | ||||
|   const props: Props = { | ||||
|     ...(await getAppStaticProps(context)), | ||||
|   }; | ||||
|   return { | ||||
|  | ||||
| @ -4,8 +4,8 @@ import SubPanel from "components/Panels/SubPanel"; | ||||
| import { GetStaticPropsContext } from "next"; | ||||
| import { AppStaticProps, getAppStaticProps } from "queries/getAppStaticProps"; | ||||
| 
 | ||||
| interface MerchProps extends AppStaticProps {} | ||||
| export default function Merch(props: MerchProps): JSX.Element { | ||||
| interface Props extends AppStaticProps {} | ||||
| export default function Merch(props: Props): JSX.Element { | ||||
|   const { langui } = props; | ||||
|   const subPanel = ( | ||||
|     <SubPanel> | ||||
| @ -22,8 +22,8 @@ export default function Merch(props: MerchProps): JSX.Element { | ||||
| 
 | ||||
| export async function getStaticProps( | ||||
|   context: GetStaticPropsContext | ||||
| ): Promise<{ notFound: boolean } | { props: MerchProps }> { | ||||
|   const props: MerchProps = { | ||||
| ): Promise<{ notFound: boolean } | { props: Props }> { | ||||
|   const props: Props = { | ||||
|     ...(await getAppStaticProps(context)), | ||||
|   }; | ||||
|   return { | ||||
|  | ||||
| @ -27,7 +27,7 @@ import { | ||||
|   prettySlug, | ||||
| } from "queries/helpers"; | ||||
| 
 | ||||
| interface PostProps extends AppStaticProps { | ||||
| interface Props extends AppStaticProps { | ||||
|   post: Exclude< | ||||
|     GetPostQuery["posts"], | ||||
|     null | undefined | ||||
| @ -38,7 +38,7 @@ interface PostProps extends AppStaticProps { | ||||
|   >["data"][number]["id"]; | ||||
| } | ||||
| 
 | ||||
| export default function LibrarySlug(props: PostProps): JSX.Element { | ||||
| export default function LibrarySlug(props: Props): JSX.Element { | ||||
|   const { post, langui } = props; | ||||
|   const locales = getLocalesFromLanguages(post?.translations_languages); | ||||
|   const router = useRouter(); | ||||
| @ -145,7 +145,7 @@ export default function LibrarySlug(props: PostProps): JSX.Element { | ||||
| 
 | ||||
| export async function getStaticProps( | ||||
|   context: GetStaticPropsContext | ||||
| ): Promise<{ notFound: boolean } | { props: PostProps }> { | ||||
| ): Promise<{ notFound: boolean } | { props: Props }> { | ||||
|   const sdk = getReadySdk(); | ||||
|   const slug = context.params?.slug ? context.params.slug.toString() : ""; | ||||
|   const post = await sdk.getPost({ | ||||
| @ -153,7 +153,7 @@ export async function getStaticProps( | ||||
|     language_code: context.locale ?? "en", | ||||
|   }); | ||||
|   if (!post.posts?.data[0]) return { notFound: true }; | ||||
|   const props: PostProps = { | ||||
|   const props: Props = { | ||||
|     ...(await getAppStaticProps(context)), | ||||
|     post: post.posts.data[0].attributes, | ||||
|     postId: post.posts.data[0].id, | ||||
|  | ||||
| @ -5,9 +5,9 @@ import SubPanel from "components/Panels/SubPanel"; | ||||
| import { GetStaticPropsContext } from "next"; | ||||
| import { AppStaticProps, getAppStaticProps } from "queries/getAppStaticProps"; | ||||
| 
 | ||||
| interface WikiProps extends AppStaticProps {} | ||||
| interface Props extends AppStaticProps {} | ||||
| 
 | ||||
| export default function Wiki(props: WikiProps): JSX.Element { | ||||
| export default function Wiki(props: Props): JSX.Element { | ||||
|   const { langui } = props; | ||||
|   const subPanel = ( | ||||
|     <SubPanel> | ||||
| @ -25,8 +25,8 @@ export default function Wiki(props: WikiProps): JSX.Element { | ||||
| 
 | ||||
| export async function getStaticProps( | ||||
|   context: GetStaticPropsContext | ||||
| ): Promise<{ notFound: boolean } | { props: WikiProps }> { | ||||
|   const props: WikiProps = { | ||||
| ): Promise<{ notFound: boolean } | { props: Props }> { | ||||
|   const props: Props = { | ||||
|     ...(await getAppStaticProps(context)), | ||||
|   }; | ||||
|   return { | ||||
|  | ||||
| @ -336,12 +336,12 @@ export function convertMmToInch(mm: number | null | undefined): string { | ||||
|   return mm ? (mm * 0.03937008).toPrecision(3) : ""; | ||||
| } | ||||
| 
 | ||||
| export type OgImage = { | ||||
| export interface OgImage { | ||||
|   image: string; | ||||
|   width: number; | ||||
|   height: number; | ||||
|   alt: string; | ||||
| }; | ||||
| } | ||||
| 
 | ||||
| export function getOgImage( | ||||
|   quality: ImageQuality, | ||||
|  | ||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user
	 DrMint
						DrMint