diff --git a/components/Code.tsx b/components/Code.tsx index 7460fa4e8..a4051ca46 100644 --- a/components/Code.tsx +++ b/components/Code.tsx @@ -1,9 +1,8 @@ -import React, { useContext } from 'react'; +import React, { useContext, ReactNode } from 'react'; import classnames from 'classnames'; import { BlockContext, BlockContextValue } from '~/context'; -export default function Code({ children }: { children: any }) { - // eslint-disable-next-line react-hooks/rules-of-hooks +export default function Code({ children }: { children: ReactNode }) { const blockContext = useContext(BlockContext); return ( <code diff --git a/components/DocTable.tsx b/components/DocTable.tsx index 770a660ca..d876a0a21 100644 --- a/components/DocTable.tsx +++ b/components/DocTable.tsx @@ -1,7 +1,14 @@ import React from 'react'; import Link from 'next/link'; -const DocTable = ({ frontmatter }: any) => { +type Frontmatter = { + Specification: string; + Published: string; + authors: string[]; + Metaschema: string; +}; + +const DocTable = ({ frontmatter }: { frontmatter: Frontmatter }) => { return ( <> <div className='max-w-full mx-auto overflow-auto'> @@ -30,21 +37,21 @@ const DocTable = ({ frontmatter }: any) => { {frontmatter.Published} </td> </tr> - <tr className='dark:hover:bg-slate-950 hover:bg-slate-300 '> + <tr className='dark:hover:bg-slate-950 hover:bg-slate-300'> <td className='border border-slate-400 dark:border-slate-500 p-2 text-center font-semibold'> Authors </td> <td className='border border-slate-400 dark:border-slate-500 p-2'> - {frontmatter.authors.map((author: string, index: number) => { - return <div key={index}>{author}</div>; - })} + {frontmatter.authors.map((author, index) => ( + <div key={index}>{author}</div> + ))} </td> </tr> <tr className='dark:hover:bg-slate-950 hover:bg-slate-300'> <td className='border border-slate-400 dark:border-slate-500 p-2 text-center font-semibold'> Metaschema </td> - <td className='border border-slate-400 dark:border-slate-500 p-2 '> + <td className='border border-slate-400 dark:border-slate-500 p-2'> <Link href={frontmatter.Metaschema} className='text-linkBlue' diff --git a/components/GettingStarted.tsx b/components/GettingStarted.tsx index 16c43c54b..55631a2aa 100644 --- a/components/GettingStarted.tsx +++ b/components/GettingStarted.tsx @@ -4,19 +4,54 @@ import Highlight from 'react-syntax-highlighter'; import JSZip from 'jszip'; import { saveAs } from 'file-saver'; +interface SchemaOption { + file: string; + name: string; + instances: InstanceOption[]; + default?: boolean; +} + +interface InstanceOption { + file: string; + details: string; + valid: string; + name: string; + default?: boolean; +} + +interface SchemaData { + id: string; + title: string; + description: string; +} + +interface InstanceData { + id: string; + title: string; + description: string; +} + async function fetchData() { const response = await fetch('/data/getting-started-examples.json'); - const data = await response.json(); + const data: SchemaOption[] = await response.json(); - const defaultSchemaData = data.find((data: any) => data.default === true); + const defaultSchemaData = data.find((schema) => schema.default === true); + + if (!defaultSchemaData) { + throw new Error('Default schema not found'); + } const schemaResp = await fetch(defaultSchemaData.file); const schemaData = await schemaResp.json(); const defaultInstanceData = defaultSchemaData.instances.find( - (instance: any) => instance.default === true, + (instance) => instance.default === true, ); + if (!defaultInstanceData) { + throw new Error('Default instance not found'); + } + const instanceResp = await fetch(defaultInstanceData.file); const instanceData = await instanceResp.json(); @@ -29,17 +64,6 @@ async function fetchData() { }; } -interface SchemaOption { - file: string; - instances: InstanceOption[]; -} - -interface InstanceOption { - file: string; - details: string; - valid: string; -} - const GettingStarted = () => { useEffect(() => { fetchData() @@ -64,8 +88,10 @@ const GettingStarted = () => { const [options, setOptions] = useState<SchemaOption[]>([]); const [instances, setInstances] = useState<InstanceOption[]>([]); const [details, setDetails] = useState<string[]>(['', '']); - const [fetchedSchema, setFetchedSchema] = useState(); - const [fetchedInstance, setFetchedInstance] = useState(); + const [fetchedSchema, setFetchedSchema] = useState<SchemaData | null>(null); + const [fetchedInstance, setFetchedInstance] = useState<InstanceData | null>( + null, + ); const handleSchemaChange = async ( e: React.ChangeEvent<HTMLSelectElement>, @@ -86,7 +112,7 @@ const GettingStarted = () => { setFetchedInstance(instData); } else { setInstances([]); - setFetchedSchema(null!); + setFetchedSchema(null); } }; @@ -104,7 +130,7 @@ const GettingStarted = () => { setFetchedInstance(instanceData); setDetails([selectedInstance.details, selectedInstance.valid]); } else { - setFetchedInstance(undefined); + setFetchedInstance(null); } }; @@ -125,6 +151,7 @@ const GettingStarted = () => { return ( <> <div className='relative'> + {/* Schema Select and Display */} <div className='flex flex-col'> <div className='flex items-end flex-row justify-between mt-5 mb-3 '> <h2 className='text-h6 font-semibold mb-1'>JSON Schema</h2> @@ -138,7 +165,7 @@ const GettingStarted = () => { id='Examples' onChange={handleSchemaChange} > - {options.map((option: any, id: number) => ( + {options.map((option, id) => ( <option key={id} value={option.file}> {option.name} </option> @@ -180,6 +207,7 @@ const GettingStarted = () => { </div> </div> + {/* Instance Select and Display */} <div className='flex flex-col'> <div className='flex items-end flex-row justify-between mt-5 mb-3 '> <h2 className='text-h6 font-semibold mb-1'>JSON Instance</h2> @@ -193,7 +221,7 @@ const GettingStarted = () => { id='Examples' onChange={handleInstanceChange} > - {instances.map((instance: any, id: number) => ( + {instances.map((instance, id) => ( <option key={id} value={instance.file}> {instance.name} </option> @@ -244,6 +272,7 @@ const GettingStarted = () => { </div> </div> + {/* Download Button */} <button className='absolute right-0 my-4 text-[17px] bg-startBlue text-white px-3 py-1 rounded' onClick={createZip} diff --git a/components/Headlines.tsx b/components/Headlines.tsx index ed27e02b5..d18e40c9c 100644 --- a/components/Headlines.tsx +++ b/components/Headlines.tsx @@ -4,11 +4,27 @@ import slugifyMarkdownHeadline from '~/lib/slugifyMarkdownHeadline'; import { useRouter } from 'next/router'; import { HOST } from '~/lib/config'; +type Attributes = { + slug?: string; + className?: string; + onClick?: () => void; + id?: string; + 'data-test'?: string; +}; + type HeadlineProps = { children: string | React.ReactNode[]; - attributes?: Record<string, any>; + attributes?: Attributes; +}; + +type HeadlineTagProps = { + children: string | React.ReactNode[]; + Tag: React.FunctionComponent<TagProps>; + attributes?: Attributes; }; +type TagProps = { children: React.ReactNode; attributes: Attributes }; + export const Headline1 = ({ children, attributes }: HeadlineProps) => ( <Headline Tag={Headline1Tag} attributes={attributes}> {children} @@ -34,15 +50,11 @@ const Headline = ({ children, Tag, attributes: propAttributes, -}: { - children: string | React.ReactNode[]; - Tag: React.FunctionComponent<TagProps>; - attributes?: Record<string, any>; -}) => { +}: HeadlineTagProps) => { const router = useRouter(); const [isActive, setIsActive] = useState<boolean>(false); const asPath = router.asPath; - const slug = slugifyMarkdownHeadline(children as any[]); + const slug = slugifyMarkdownHeadline(children as string[]); useEffect(() => { const hashIndex = asPath.indexOf('#'); @@ -72,6 +84,7 @@ const Headline = ({ onClick: handleHeadingClick, 'data-test': 'headline', }; + const childredWithoutFragment = filterFragment(children); return ( <Tag attributes={attributes}> @@ -92,8 +105,6 @@ const filterFragment = (children: string | React.ReactNode[]) => { }); }; -type TagProps = { children: React.ReactNode; attributes: Record<string, any> }; - const Headline1Tag = ({ children, attributes }: TagProps) => ( <h1 {...attributes} diff --git a/components/Layout.tsx b/components/Layout.tsx index d2e5287d7..f5a84c877 100644 --- a/components/Layout.tsx +++ b/components/Layout.tsx @@ -17,6 +17,18 @@ type Props = { metaTitle?: string; whiteBg?: boolean; }; + +type StoreState = { + overlayNavigation: string | null; +}; + +type MainNavLinkProps = { + uri: string; + label: string; + className?: string; + isActive: boolean; +}; + // apiKey and appId are set in the .env.local file const algoliaAppId: string = process.env.NEXT_PUBLIC_ALGOLIA_APP_ID as string; const algoliaApiKey: string = process.env.NEXT_PUBLIC_ALGOLIA_API_KEY as string; @@ -29,7 +41,9 @@ export default function Layout({ metaTitle, whiteBg, }: Props) { - const showMobileNav = useStore((s: any) => s.overlayNavigation === 'docs'); + const showMobileNav = useStore( + (s: StoreState) => s.overlayNavigation === 'docs', + ); const router = useRouter(); @@ -57,7 +71,7 @@ export default function Layout({ const handleCloseNavbar = (event: MouseEvent) => { if ( mobileNavRef.current && - (mobileNavRef.current as any).contains(event.target) + mobileNavRef.current.contains(event.target as Node) ) { useStore.setState({ overlayNavigation: null }); } @@ -124,18 +138,8 @@ export const Search = () => { /> ); }; -/* eslint-disable @typescript-eslint/no-unused-vars */ -const MainNavLink = ({ - uri, - label, - className, - isActive, -}: { - uri: string; - label: string; - isActive: boolean; - className?: string; -}) => { + +const MainNavLink = ({ uri, label, className }: MainNavLinkProps) => { const router = useRouter(); return ( <Link @@ -158,7 +162,9 @@ const MainNavLink = ({ const MainNavigation = () => { const section = useContext(SectionContext); - const showMobileNav = useStore((s: any) => s.overlayNavigation === 'docs'); + const showMobileNav = useStore( + (s: StoreState) => s.overlayNavigation === 'docs', + ); const { resolvedTheme, theme } = useTheme(); const [icon, setIcon] = useState(''); diff --git a/components/NextPrevButton.tsx b/components/NextPrevButton.tsx index 6c88b641c..1619be85f 100644 --- a/components/NextPrevButton.tsx +++ b/components/NextPrevButton.tsx @@ -2,36 +2,19 @@ import Image from 'next/image'; import React from 'react'; import Link from 'next/link'; -/* -To use this component: -1) Add prev and next metadata to the markdown page following this format: - ---- -title: Creating your first schema -section: docs -prev: - label: prev - url: '#1' -next: - label: Miscellaneous examples - url: '#2' ---- - -2) Add the component to the typescript page: - -import NextPrevButton from '~/components/NextPrevButton'; - -3) Add the component to the body of the page: - -<NextPrevButton prevLabel={frontmatter.prev.label} prevURL={frontmatter.prev.url} nextLabel={frontmatter.next.label} nextURL={frontmatter.next.url} /> -*/ +type NextPrevButtonProps = { + prevLabel: string; + prevURL: string; + nextLabel: string; + nextURL: string; +}; export default function NextPrevButton({ prevLabel, prevURL, nextLabel, nextURL, -}: any) { +}: NextPrevButtonProps) { return ( <div className='mb-4 flex flex-row gap-4'> <div className='h-auto w-1/2'> @@ -60,12 +43,12 @@ export default function NextPrevButton({ <div className='h-auto w-1/2'> <div className='h-full cursor-pointer rounded border border-gray-200 p-4 text-center shadow-md transition-all duration-300 ease-in-out hover:border-gray-300 hover:shadow-lg dark:shadow-xl dark:drop-shadow-lg dark:hover:shadow-2xl lg:text-right'> <Link href={nextURL}> - <div className='text-primary dark:text-slate-300 flex flex-row-reverse gap-5 text-[18px]'> + <div className='text-primary dark:text-slate-300 flex flex-row-reverse gap-5 text-[18px]'> <Image src={'/icons/arrow.svg'} height={10} width={10} - alt='next icon ' + alt='next icon' className='w-5' /> <div className='my-auto inline font-bold uppercase '>Up Next</div> diff --git a/pages/[slug].page.tsx b/pages/[slug].page.tsx index 4bd646418..9d7c1e48f 100644 --- a/pages/[slug].page.tsx +++ b/pages/[slug].page.tsx @@ -8,22 +8,49 @@ import { Headline1 } from '~/components/Headlines'; import { SectionContext } from '~/context'; import { DocsHelp } from '~/components/DocsHelp'; +interface StaticPropsArgs { + params: { + slug: string; + }; +} + +interface Frontmatter { + title: string; + section?: + | 'learn' + | 'docs' + | 'implementers' + | 'tools' + | 'implementations' + | 'blog' + | 'community' + | 'specification' + | 'overview' + | 'getting-started' + | 'reference' + | null; +} + +interface StaticMarkdownPageProps { + frontmatter: Frontmatter; + content: string; +} + export async function getStaticPaths() { return getStaticMarkdownPaths('pages'); } -export async function getStaticProps(args: any) { + +export async function getStaticProps(args: StaticPropsArgs) { return getStaticMarkdownProps(args, 'pages'); } export default function StaticMarkdownPage({ frontmatter, content, -}: { - frontmatter: any; - content: any; -}) { +}: StaticMarkdownPageProps) { const markdownFile = '_index'; - const newTitle = 'JSON Schema - ' + frontmatter.title; + const newTitle = `JSON Schema - ${frontmatter.title}`; + return ( <SectionContext.Provider value={frontmatter.section || null}> <Head> @@ -35,4 +62,5 @@ export default function StaticMarkdownPage({ </SectionContext.Provider> ); } + StaticMarkdownPage.getLayout = getLayout; diff --git a/pages/blog/posts/[slug].page.tsx b/pages/blog/posts/[slug].page.tsx index 5f9615ffd..a3fd392b6 100644 --- a/pages/blog/posts/[slug].page.tsx +++ b/pages/blog/posts/[slug].page.tsx @@ -13,20 +13,42 @@ import { Headline1 } from '~/components/Headlines'; import { SectionContext } from '~/context'; import CarbonAds from '~/components/CarbonsAds'; +interface Author { + name: string; + twitter?: string; + photo: string; +} + +interface Frontmatter { + title: string; + date: string; + cover: string; + authors: Author[]; +} + +interface StaticMarkdownPageProps { + frontmatter: Frontmatter; + content: string; +} + +interface StaticPropsArgs { + params: { + slug: string; + }; +} + export async function getStaticPaths() { return getStaticMarkdownPaths('pages/blog/posts'); } -export async function getStaticProps(args: any) { + +export async function getStaticProps(args: StaticPropsArgs) { return getStaticMarkdownProps(args, 'pages/blog/posts'); } export default function StaticMarkdownPage({ frontmatter, content, -}: { - frontmatter: any; - content: any; -}) { +}: StaticMarkdownPageProps) { const date = new Date(frontmatter.date); const timeToRead = Math.ceil(readingTime(content).minutes); @@ -64,34 +86,30 @@ export default function StaticMarkdownPage({ Go back to blog </Link> <div className='pt-4 lg:border-t border-none lg:border-r border-slate-100'> - {(frontmatter.authors || []).map( - (author: any, index: number) => { - return ( - <div - key={index} - className='flex flex-row items-center mb-3 w-full' - > - <div - className='bg-slate-50 h-[44px] w-[44px] rounded-full bg-cover bg-center' - style={{ backgroundImage: `url(${author.photo})` }} - /> - <div> - <div className='text-sm font-semibold pl-2'> - {author.name} - </div> - {author.twitter && ( - <a - className='block text-sm text-blue-500 font-medium' - href={`https://x.com/${author.twitter}`} - > - @{author.twitter} - </a> - )} - </div> + {(frontmatter.authors || []).map((author, index) => ( + <div + key={index} + className='flex flex-row items-center mb-3 w-full' + > + <div + className='bg-slate-50 h-[44px] w-[44px] rounded-full bg-cover bg-center' + style={{ backgroundImage: `url(${author.photo})` }} + /> + <div> + <div className='text-sm font-semibold pl-2'> + {author.name} </div> - ); - }, - )} + {author.twitter && ( + <a + className='block text-sm text-blue-500 font-medium' + href={`https://twitter.com/${author.twitter}`} + > + @{author.twitter} + </a> + )} + </div> + </div> + ))} </div> <div className='pt-4 pr-4 hidden lg:block w-full'> <div className='uppercase text-xs text-slate-400 mb-4'> diff --git a/pages/draft-05/index.page.tsx b/pages/draft-05/index.page.tsx index 1d619e0b4..8b2047159 100644 --- a/pages/draft-05/index.page.tsx +++ b/pages/draft-05/index.page.tsx @@ -8,6 +8,21 @@ import DocTable from '~/components/DocTable'; import { Headline1 } from '~/components/Headlines'; import { DocsHelp } from '~/components/DocsHelp'; +interface ImplementationsPagesProps { + blocks: { + index: string; + body: string; + }; + frontmatter: { + title: string; + type: string; + Specification: string; + Published: string; + authors: string[]; + Metaschema: string; + }; +} + export async function getStaticProps() { const index = fs.readFileSync('pages/draft-05/index.md', 'utf-8'); const main = fs.readFileSync('pages/draft-05/release-notes.md', 'utf-8'); @@ -29,10 +44,7 @@ export async function getStaticProps() { export default function ImplementationsPages({ blocks, frontmatter, -}: { - blocks: any; - frontmatter: any; -}) { +}: ImplementationsPagesProps) { return ( <SectionContext.Provider value={null}> <Headline1>{frontmatter.title}</Headline1> diff --git a/pages/draft-06/[slug].page.tsx b/pages/draft-06/[slug].page.tsx index fc447db63..af47972b6 100644 --- a/pages/draft-06/[slug].page.tsx +++ b/pages/draft-06/[slug].page.tsx @@ -8,20 +8,46 @@ import { Headline1 } from '~/components/Headlines'; import { SectionContext } from '~/context'; import { DocsHelp } from '~/components/DocsHelp'; +interface Frontmatter { + title: string; + section?: + | 'learn' + | 'docs' + | 'implementers' + | 'tools' + | 'implementations' + | 'blog' + | 'community' + | 'specification' + | 'overview' + | 'getting-started' + | 'reference' + | null; +} + +interface StaticMarkdownPageProps { + frontmatter: Frontmatter; + content: string; +} + +interface StaticPropsArgs { + params: { + slug: string; + }; +} + export async function getStaticPaths() { return getStaticMarkdownPaths('pages/draft-06'); } -export async function getStaticProps(args: any) { + +export async function getStaticProps(args: StaticPropsArgs) { return getStaticMarkdownProps(args, 'pages/draft-06'); } export default function StaticMarkdownPage({ frontmatter, content, -}: { - frontmatter: any; - content: any; -}) { +}: StaticMarkdownPageProps) { const markdownFile = '_index'; const newTitle = 'JSON Schema - ' + frontmatter.title; diff --git a/pages/draft-06/index.page.tsx b/pages/draft-06/index.page.tsx index 12127285b..9ef68205d 100644 --- a/pages/draft-06/index.page.tsx +++ b/pages/draft-06/index.page.tsx @@ -8,6 +8,19 @@ import DocTable from '~/components/DocTable'; import { Headline1 } from '~/components/Headlines'; import { DocsHelp } from '~/components/DocsHelp'; +interface ImplementationsPagesProps { + blocks: { + index: string; + }; + frontmatter: { + title: string; + Specification: string; + Published: string; + authors: string[]; + Metaschema: string; + }; +} + export async function getStaticProps() { const index = fs.readFileSync('pages/draft-06/index.md', 'utf-8'); @@ -27,10 +40,7 @@ export async function getStaticProps() { export default function ImplementationsPages({ blocks, frontmatter, -}: { - blocks: any; - frontmatter: any; -}) { +}: ImplementationsPagesProps) { return ( <SectionContext.Provider value={null}> <Headline1>{frontmatter.title}</Headline1> diff --git a/pages/draft-07/[slug].page.tsx b/pages/draft-07/[slug].page.tsx index be10dfdba..a6aab6f2b 100644 --- a/pages/draft-07/[slug].page.tsx +++ b/pages/draft-07/[slug].page.tsx @@ -8,20 +8,46 @@ import { Headline1 } from '~/components/Headlines'; import { SectionContext } from '~/context'; import { DocsHelp } from '~/components/DocsHelp'; +interface Frontmatter { + title: string; + section?: + | 'learn' + | 'docs' + | 'implementers' + | 'tools' + | 'implementations' + | 'blog' + | 'community' + | 'specification' + | 'overview' + | 'getting-started' + | 'reference' + | null; +} + +interface StaticMarkdownPageProps { + frontmatter: Frontmatter; + content: string; +} + +interface StaticPropsArgs { + params: { + slug: string; + }; +} + export async function getStaticPaths() { return getStaticMarkdownPaths('pages/draft-07'); } -export async function getStaticProps(args: any) { + +export async function getStaticProps(args: StaticPropsArgs) { return getStaticMarkdownProps(args, 'pages/draft-07'); } export default function StaticMarkdownPage({ frontmatter, content, -}: { - frontmatter: any; - content: any; -}) { +}: StaticMarkdownPageProps) { const markdownFile = '_index'; const newTitle = 'JSON Schema - ' + frontmatter.title; diff --git a/pages/draft-07/index.page.tsx b/pages/draft-07/index.page.tsx index 91d52a981..8a2d6ea6a 100644 --- a/pages/draft-07/index.page.tsx +++ b/pages/draft-07/index.page.tsx @@ -8,6 +8,19 @@ import DocTable from '~/components/DocTable'; import { Headline1 } from '~/components/Headlines'; import { DocsHelp } from '~/components/DocsHelp'; +interface ImplementationsPagesProps { + blocks: { + index: string; + }; + frontmatter: { + title: string; + Specification: string; + Published: string; + authors: string[]; + Metaschema: string; + }; +} + export async function getStaticProps() { const index = fs.readFileSync('pages/draft-07/index.md', 'utf-8'); @@ -27,10 +40,7 @@ export async function getStaticProps() { export default function ImplementationsPages({ blocks, frontmatter, -}: { - blocks: any; - frontmatter: any; -}) { +}: ImplementationsPagesProps) { return ( <SectionContext.Provider value={null}> <Headline1>{frontmatter.title}</Headline1> diff --git a/pages/draft/2019-09/[slug].page.tsx b/pages/draft/2019-09/[slug].page.tsx index d7d289a2e..803b1cca3 100644 --- a/pages/draft/2019-09/[slug].page.tsx +++ b/pages/draft/2019-09/[slug].page.tsx @@ -8,20 +8,46 @@ import { Headline1 } from '~/components/Headlines'; import { SectionContext } from '~/context'; import { DocsHelp } from '~/components/DocsHelp'; +interface StaticPropsArgs { + params: { + slug: string; + }; +} + +interface Frontmatter { + title: string; + section?: + | 'learn' + | 'docs' + | 'implementers' + | 'tools' + | 'implementations' + | 'blog' + | 'community' + | 'specification' + | 'overview' + | 'getting-started' + | 'reference' + | null; +} + +interface StaticMarkdownPageProps { + frontmatter: Frontmatter; + content: string; +} + export async function getStaticPaths() { return getStaticMarkdownPaths('pages/draft/2019-09'); } -export async function getStaticProps(args: any) { + +export async function getStaticProps(args: StaticPropsArgs) { return getStaticMarkdownProps(args, 'pages/draft/2019-09'); } export default function StaticMarkdownPage({ frontmatter, content, -}: { - frontmatter: any; - content: any; -}) { +}: StaticMarkdownPageProps) { const markdownFile = '_index'; const newTitle = 'JSON Schema - ' + frontmatter.title; diff --git a/pages/draft/2019-09/index.page.tsx b/pages/draft/2019-09/index.page.tsx index 14fb022f2..f05180650 100644 --- a/pages/draft/2019-09/index.page.tsx +++ b/pages/draft/2019-09/index.page.tsx @@ -8,6 +8,19 @@ import DocTable from '~/components/DocTable'; import { Headline1 } from '~/components/Headlines'; import { DocsHelp } from '~/components/DocsHelp'; +interface ImplementationsPagesProps { + blocks: { + index: string; + }; + frontmatter: { + title: string; + Specification: string; + Published: string; + authors: string[]; + Metaschema: string; + }; +} + export async function getStaticProps() { const index = fs.readFileSync('pages/draft/2019-09/index.md', 'utf-8'); const { content: indexContent, data: indexData } = matter(index); @@ -26,10 +39,7 @@ export async function getStaticProps() { export default function ImplementationsPages({ blocks, frontmatter, -}: { - blocks: any; - frontmatter: any; -}) { +}: ImplementationsPagesProps) { return ( <SectionContext.Provider value={null}> <Headline1>{frontmatter.title}</Headline1> diff --git a/pages/draft/2020-12/[slug].page.tsx b/pages/draft/2020-12/[slug].page.tsx index 52734da09..31b880484 100644 --- a/pages/draft/2020-12/[slug].page.tsx +++ b/pages/draft/2020-12/[slug].page.tsx @@ -8,20 +8,46 @@ import { Headline1 } from '~/components/Headlines'; import { SectionContext } from '~/context'; import { DocsHelp } from '~/components/DocsHelp'; +interface StaticPropsArgs { + params: { + slug: string; + }; +} + +interface Frontmatter { + title: string; + section?: + | 'learn' + | 'docs' + | 'implementers' + | 'tools' + | 'implementations' + | 'blog' + | 'community' + | 'specification' + | 'overview' + | 'getting-started' + | 'reference' + | null; +} + +interface StaticMarkdownPageProps { + frontmatter: Frontmatter; + content: string; +} + export async function getStaticPaths() { return getStaticMarkdownPaths('pages/draft/2020-12'); } -export async function getStaticProps(args: any) { + +export async function getStaticProps(args: StaticPropsArgs) { return getStaticMarkdownProps(args, 'pages/draft/2020-12'); } export default function StaticMarkdownPage({ frontmatter, content, -}: { - frontmatter: any; - content: any; -}) { +}: StaticMarkdownPageProps) { const markdownFile = '_index'; const newTitle = 'JSON Schema - ' + frontmatter.title; diff --git a/pages/draft/2020-12/index.page.tsx b/pages/draft/2020-12/index.page.tsx index 4446b9c1b..447d32578 100644 --- a/pages/draft/2020-12/index.page.tsx +++ b/pages/draft/2020-12/index.page.tsx @@ -8,6 +8,19 @@ import DocTable from '~/components/DocTable'; import { Headline1 } from '~/components/Headlines'; import { DocsHelp } from '~/components/DocsHelp'; +interface ImplementationsPagesProps { + blocks: { + index: string; + }; + frontmatter: { + title: string; + Specification: string; + Published: string; + authors: string[]; + Metaschema: string; + }; +} + export async function getStaticProps() { const index = fs.readFileSync('pages/draft/2020-12/index.md', 'utf-8'); const { content: indexContent, data: indexData } = matter(index); @@ -26,10 +39,7 @@ export async function getStaticProps() { export default function ImplementationsPages({ blocks, frontmatter, -}: { - blocks: any; - frontmatter: any; -}) { +}: ImplementationsPagesProps) { return ( <SectionContext.Provider value={null}> <Headline1>{frontmatter.title}</Headline1> diff --git a/pages/implementers/[slug].page.tsx b/pages/implementers/[slug].page.tsx index c86202c00..93decfe47 100644 --- a/pages/implementers/[slug].page.tsx +++ b/pages/implementers/[slug].page.tsx @@ -8,20 +8,46 @@ import { Headline1 } from '~/components/Headlines'; import { SectionContext } from '~/context'; import { DocsHelp } from '~/components/DocsHelp'; +interface Frontmatter { + title: string; + section?: + | 'learn' + | 'docs' + | 'implementers' + | 'tools' + | 'implementations' + | 'blog' + | 'community' + | 'specification' + | 'overview' + | 'getting-started' + | 'reference' + | null; +} + +interface StaticMarkdownPageProps { + frontmatter: Frontmatter; + content: string; +} + +interface StaticPropsArgs { + params: { + slug: string; + }; +} + export async function getStaticPaths() { return getStaticMarkdownPaths('pages/implementers'); } -export async function getStaticProps(args: any) { + +export async function getStaticProps(args: StaticPropsArgs) { return getStaticMarkdownProps(args, 'pages/implementers'); } export default function StaticMarkdownPage({ frontmatter, content, -}: { - frontmatter: any; - content: any; -}) { +}: StaticMarkdownPageProps) { const markdownFile = '_index'; const newTitle = 'JSON Schema - ' + frontmatter.title; return ( diff --git a/pages/implementers/index.page.tsx b/pages/implementers/index.page.tsx index 425d1f4c9..895344d0c 100644 --- a/pages/implementers/index.page.tsx +++ b/pages/implementers/index.page.tsx @@ -7,6 +7,10 @@ import { DocsHelp } from '~/components/DocsHelp'; import { SectionContext } from '~/context'; import Card from '~/components/Card'; +interface ContentExampleProps { + blocks: string[]; +} + export async function getStaticProps() { const block1 = fs.readFileSync('pages/implementers/_index.md', 'utf-8'); const { content: block1Content } = matter(block1); @@ -17,7 +21,7 @@ export async function getStaticProps() { }; } -export default function ContentExample({ blocks }: { blocks: any[] }) { +export default function ContentExample({ blocks }: ContentExampleProps) { const markdownFile = '_indexPage'; return ( diff --git a/pages/learn/[slug].page.tsx b/pages/learn/[slug].page.tsx index f110ff75d..aa737db3c 100644 --- a/pages/learn/[slug].page.tsx +++ b/pages/learn/[slug].page.tsx @@ -8,10 +8,34 @@ import { Headline1 } from '~/components/Headlines'; import { SectionContext } from '~/context'; import { DocsHelp } from '~/components/DocsHelp'; +interface StaticPropsArgs { + params: { + slug: string; + }; +} + +interface Frontmatter { + title: string; + section?: + | 'learn' + | 'docs' + | 'implementers' + | 'tools' + | 'implementations' + | 'blog' + | 'community' + | 'specification' + | 'overview' + | 'getting-started' + | 'reference' + | null; +} + export async function getStaticPaths() { return getStaticMarkdownPaths('pages/learn'); } -export async function getStaticProps(args: any) { + +export async function getStaticProps(args: StaticPropsArgs) { return getStaticMarkdownProps(args, 'pages/learn'); } @@ -19,8 +43,8 @@ export default function StaticMarkdownPage({ frontmatter, content, }: { - frontmatter: any; - content: any; + frontmatter: Frontmatter; + content: string; }) { const markdownFile = '_index'; const newTitle = 'JSON Schema - ' + frontmatter.title; @@ -35,4 +59,5 @@ export default function StaticMarkdownPage({ </SectionContext.Provider> ); } + StaticMarkdownPage.getLayout = getLayout; diff --git a/pages/learn/getting-started-step-by-step/index.page.tsx b/pages/learn/getting-started-step-by-step/index.page.tsx index b1b8b7eb2..d8382eff8 100644 --- a/pages/learn/getting-started-step-by-step/index.page.tsx +++ b/pages/learn/getting-started-step-by-step/index.page.tsx @@ -10,7 +10,15 @@ import { SectionContext } from '~/context'; import { DocsHelp } from '~/components/DocsHelp'; import GettingStarted from '~/components/GettingStarted'; -export async function getStaticProps() { +interface StaticProps { + blocks: string[]; +} + +interface StyledValidatorProps { + blocks: string[]; +} + +export async function getStaticProps(): Promise<{ props: StaticProps }> { const block1 = fs.readFileSync( 'pages/learn/getting-started-step-by-step/getting-started-step-by-step.md', 'utf-8', @@ -28,7 +36,7 @@ export async function getStaticProps() { }; } -export default function StyledValidator({ blocks }: { blocks: any[] }) { +export default function StyledValidator({ blocks }: StyledValidatorProps) { const newTitle = 'Creating your first schema'; return ( @@ -44,4 +52,5 @@ export default function StyledValidator({ blocks }: { blocks: any[] }) { </SectionContext.Provider> ); } + StyledValidator.getLayout = getLayout; diff --git a/pages/obsolete-implementations/index.page.tsx b/pages/obsolete-implementations/index.page.tsx index f63b7a20f..642810503 100644 --- a/pages/obsolete-implementations/index.page.tsx +++ b/pages/obsolete-implementations/index.page.tsx @@ -9,11 +9,35 @@ import slugify from 'slugify'; import { useRouter } from 'next/router'; import classnames from 'classnames'; import { SectionContext } from '~/context'; -import { DRAFT_ORDER } from '~/lib/config'; +import { DRAFT_ORDER, JSONSchemaDraft } from '~/lib/config'; // @ts-ignore import zeroFill from 'zero-fill'; +type Implementation = { + name: string; + url: string; + notes: string; + 'date-draft'?: (string | number)[]; + draft?: (string | number)[]; + license: string; +}; + +type ImplementationByLanguage = { + name: string; + implementations: Implementation[]; +}; + +interface ImplementationsPagesProps { + blocks: { + intro: string; + main: string; + main2: string; + }; + validators: ImplementationByLanguage[]; + hyperLibaries: ImplementationByLanguage[]; +} + export async function getStaticProps() { const validators = yaml.load( fs.readFileSync('data/validator-libraries-obsolete.yml', 'utf-8'), @@ -34,9 +58,11 @@ export async function getStaticProps() { 'pages/obsolete-implementations/main2.md', 'utf-8', ); + const { content: introContent } = matter(intro); const { content: mainContent } = matter(main); const { content: main2Content } = matter(main2); + return { props: { blocks: { @@ -50,17 +76,11 @@ export async function getStaticProps() { }; } -type ImplementationByLanguage = { name: string }; - export default function ImplementationsPages({ blocks, validators, hyperLibaries, -}: { - blocks: any; - validators: ImplementationByLanguage[]; - hyperLibaries: ImplementationByLanguage[]; -}) { +}: ImplementationsPagesProps) { return ( <SectionContext.Provider value='tools'> <div className='w-5/6 mx-auto mt-12 dark:text-slate-200'> @@ -81,44 +101,44 @@ export default function ImplementationsPages({ </SectionContext.Provider> ); } + ImplementationsPages.getLayout = getLayout; + +interface ImplementationTableProps { + implementationsByLanguage: ImplementationByLanguage[]; + prefix: string; +} + function ImplementationTable({ implementationsByLanguage, prefix, -}: { - implementationsByLanguage: any; - prefix: string; -}) { +}: ImplementationTableProps) { const router = useRouter(); + return ( <> - <div className='flex-row flex-wrap grid dark:bg-slate-700 grid-cols-3 text-sm md:grid-cols-5 md:text-base lg:grid-cols-6'> - {implementationsByLanguage.map( - (implementationByLanguage: any, index: number) => { - const slug = - prefix + - slugify(implementationByLanguage.name, { - lower: true, - trim: true, - }); - const isActive = router.query.language === slug; - return ( - <a - key={index} - href={`#${slug}`} - className={classnames( - 'text-white rounded p-3 cursor-pointer flex items-center justify-center m-1', - { - 'bg-blue-800': isActive, - 'bg-blue-500 hover:bg-blue-600': !isActive, - }, - )} - > - {implementationByLanguage.name} - </a> - ); - }, - )} + <div className='flex-row flex-wrap grid dark:bg-slate-700 grid-cols-3 text-sm md:grid-cols-5 md:text-base lg:grid-cols-6'> + {implementationsByLanguage.map((implementationByLanguage, index) => { + const slug = + prefix + + slugify(implementationByLanguage.name, { lower: true, trim: true }); + const isActive = router.query.language === slug; + return ( + <a + key={index} + href={`#${slug}`} + className={classnames( + 'text-white rounded p-3 cursor-pointer flex items-center justify-center m-1', + { + 'bg-blue-800': isActive, + 'bg-blue-500 hover:bg-blue-600': !isActive, + }, + )} + > + {implementationByLanguage.name} + </a> + ); + })} </div> <div className='bg-blue-50 rounded-xl py-2 sm:p-6 p-6 mt-4 pb-6 pt-0.5 dark:bg-slate-900 overflow-x-auto'> <table> @@ -138,7 +158,7 @@ function ImplementationTable({ </thead> <tbody> {implementationsByLanguage.map( - (implementationByLanguage: any, index: number) => { + (implementationByLanguage, index) => { const slug = prefix + slugify(implementationByLanguage.name, { @@ -158,7 +178,7 @@ function ImplementationTable({ </td> </tr> {implementationByLanguage.implementations.map( - (implementation: any, index: number) => { + (implementation, index) => { const allDrafts = [ ...(implementation['date-draft'] || []), ...(implementation['draft'] || []), @@ -166,7 +186,7 @@ function ImplementationTable({ return ( <tr key={index} - className='pl-4 list-disc list-inside pl-2 separation-line' + className='pl-4 list-disc list-inside separation-line' > <td className='text-sm sm:text-base'> <a @@ -181,13 +201,12 @@ function ImplementationTable({ </td> <td className='w-1/4 pl-3 sm:pl-6 pb-2 pt-2'> {allDrafts - ?.sort((a, b) => - DRAFT_ORDER.indexOf(a.toString()) < - DRAFT_ORDER.indexOf(b.toString()) - ? -1 - : 1, + .sort( + (a, b) => + DRAFT_ORDER.indexOf(a as JSONSchemaDraft) - + DRAFT_ORDER.indexOf(b as JSONSchemaDraft), ) - ?.map((draft: string | number) => ( + .map((draft) => ( <span className='bg-blue-400 dark:bg-blue-600 inline-block mr-1 mb-1 text-white rounded px-1 text-sm sm:text-base' key={draft} diff --git a/pages/overview/[slug].page.tsx b/pages/overview/[slug].page.tsx index e4d5476d7..d9fe41aa1 100644 --- a/pages/overview/[slug].page.tsx +++ b/pages/overview/[slug].page.tsx @@ -8,20 +8,46 @@ import { Headline1 } from '~/components/Headlines'; import { SectionContext } from '~/context'; import { DocsHelp } from '~/components/DocsHelp'; +interface StaticPropsArgs { + params: { + slug: string; + }; +} + +interface Frontmatter { + title: string; + section?: + | 'learn' + | 'docs' + | 'implementers' + | 'tools' + | 'implementations' + | 'blog' + | 'community' + | 'specification' + | 'overview' + | 'getting-started' + | 'reference' + | null; +} + +interface StaticMarkdownPageProps { + frontmatter: Frontmatter; + content: string; +} + export async function getStaticPaths() { return getStaticMarkdownPaths('pages/overview'); } -export async function getStaticProps(args: any) { + +export async function getStaticProps(args: StaticPropsArgs) { return getStaticMarkdownProps(args, 'pages/overview'); } export default function StaticMarkdownPage({ frontmatter, content, -}: { - frontmatter: any; - content: any; -}) { +}: StaticMarkdownPageProps) { const markdownFile = '_index'; const newTitle = 'JSON Schema - ' + frontmatter.title; @@ -36,4 +62,5 @@ export default function StaticMarkdownPage({ </SectionContext.Provider> ); } + StaticMarkdownPage.getLayout = getLayout; diff --git a/pages/overview/code-of-conduct/index.page.tsx b/pages/overview/code-of-conduct/index.page.tsx index c4d74033e..35b5ad2ba 100644 --- a/pages/overview/code-of-conduct/index.page.tsx +++ b/pages/overview/code-of-conduct/index.page.tsx @@ -7,6 +7,10 @@ import StyledMarkdown from '~/components/StyledMarkdown'; import { SectionContext } from '~/context'; import { DocsHelp } from '~/components/DocsHelp'; +interface ContentProps { + blocks: string[]; +} + export async function getStaticProps() { const block = fs.readFileSync( 'pages/overview/code-of-conduct/_index.md', @@ -20,7 +24,7 @@ export async function getStaticProps() { }; } -export default function Content({ blocks }: { blocks: any[] }) { +export default function Content({ blocks }: ContentProps) { const newTitle = 'Code of Conduct'; return ( diff --git a/pages/overview/sponsors/index.page.tsx b/pages/overview/sponsors/index.page.tsx index a26f1dfe7..41d7ed757 100644 --- a/pages/overview/sponsors/index.page.tsx +++ b/pages/overview/sponsors/index.page.tsx @@ -8,6 +8,10 @@ import StyledMarkdown from '~/components/StyledMarkdown'; import { SectionContext } from '~/context'; import { DocsHelp } from '~/components/DocsHelp'; +interface ContentExampleProps { + blocks: string[]; +} + export async function getStaticProps() { const block1 = fs.readFileSync('pages/overview/sponsors/_index.md', 'utf-8'); const { content: block1Content } = matter(block1); @@ -18,7 +22,7 @@ export async function getStaticProps() { }; } -export default function ContentExample({ blocks }: { blocks: any[] }) { +export default function ContentExample({ blocks }: ContentExampleProps) { const newTitle = 'Sponsors'; return ( diff --git a/pages/specification/json-hyper-schema/index.page.tsx b/pages/specification/json-hyper-schema/index.page.tsx index b1ce3264f..1a73b9704 100644 --- a/pages/specification/json-hyper-schema/index.page.tsx +++ b/pages/specification/json-hyper-schema/index.page.tsx @@ -7,6 +7,17 @@ import { SectionContext } from '~/context'; import { Headline1 } from '~/components/Headlines'; import { DocsHelp } from '~/components/DocsHelp'; +interface ImplementationsPagesProps { + blocks: { + index: string; + }; + frontmatter: { + title: string; + type: string; + Specification: string; + }; +} + export async function getStaticProps() { const index = fs.readFileSync( 'pages/specification/json-hyper-schema/_index.md', @@ -31,10 +42,7 @@ export async function getStaticProps() { export default function ImplementationsPages({ blocks, frontmatter, -}: { - blocks: any; - frontmatter: any; -}) { +}: ImplementationsPagesProps) { const markdownFile = '_indexPage'; return ( <SectionContext.Provider value={null}> @@ -43,7 +51,6 @@ export default function ImplementationsPages({ <h2>{frontmatter.Specification}</h2> <StyledMarkdown markdown={blocks.index} /> - <StyledMarkdown markdown={blocks.body} /> <DocsHelp markdownFile={markdownFile} /> </SectionContext.Provider> ); diff --git a/pages/specification/migration/index.page.tsx b/pages/specification/migration/index.page.tsx index fbba9bd33..032639cf6 100644 --- a/pages/specification/migration/index.page.tsx +++ b/pages/specification/migration/index.page.tsx @@ -8,6 +8,16 @@ import { SectionContext } from '~/context'; import Card from '~/components/Card'; import { DocsHelp } from '~/components/DocsHelp'; +interface ImplementationsPagesProps { + blocks: { + index: string; + body: string; + }; + frontmatter: { + title: string; + }; +} + export async function getStaticProps() { const index = fs.readFileSync( 'pages/specification/migration/_index.md', @@ -32,11 +42,9 @@ export async function getStaticProps() { export default function ImplementationsPages({ blocks, frontmatter, -}: { - blocks: any; - frontmatter: any; -}) { +}: ImplementationsPagesProps) { const markdownFile = '_indexPage'; + return ( <SectionContext.Provider value={null}> <Headline1>{frontmatter.title}</Headline1> @@ -76,4 +84,5 @@ export default function ImplementationsPages({ </SectionContext.Provider> ); } + ImplementationsPages.getLayout = getLayout; diff --git a/pages/specification/release-notes/index.page.tsx b/pages/specification/release-notes/index.page.tsx index 50ea7f7d5..ad2c1af8d 100644 --- a/pages/specification/release-notes/index.page.tsx +++ b/pages/specification/release-notes/index.page.tsx @@ -8,7 +8,25 @@ import { SectionContext } from '~/context'; import Card from '~/components/Card'; import { DocsHelp } from '~/components/DocsHelp'; -export async function getStaticProps() { +interface StaticProps { + blocks: { + index: string; + body?: string; + }; + frontmatter: { + title: string; + }; +} + +interface CardProps { + title: string; + body: string; + headerSize: 'small'; + bodyTextSize: 'small'; + link: string; +} + +export async function getStaticProps(): Promise<{ props: StaticProps }> { const index = fs.readFileSync( 'pages/specification/release-notes/_index.md', 'utf-8', @@ -17,7 +35,7 @@ export async function getStaticProps() { const { content: indexContent, data: indexData } = matter(index); // const { content: bodyContent } = matter(main); - const frontmatter = { ...indexData }; + const frontmatter = { ...indexData, title: indexData.title || '' }; return { props: { blocks: { @@ -29,13 +47,48 @@ export async function getStaticProps() { }; } +const releaseNotes: CardProps[] = [ + { + title: 'Draft 2020-12', + body: 'Draft 2020-12 release notes.', + headerSize: 'small', + bodyTextSize: 'small', + link: '/draft/2020-12/release-notes', + }, + { + title: 'Draft 2019-09', + body: 'Draft 2019-09 release notes.', + headerSize: 'small', + bodyTextSize: 'small', + link: '/draft/2019-09/release-notes', + }, + { + title: 'Draft 07', + body: 'Draft 07 release notes.', + headerSize: 'small', + bodyTextSize: 'small', + link: '/draft-07/json-schema-release-notes', + }, + { + title: 'Draft 06', + body: 'Draft 06 release notes.', + headerSize: 'small', + bodyTextSize: 'small', + link: '/draft-06/json-schema-release-notes', + }, + { + title: 'Draft 05', + body: 'Draft 05 release notes.', + headerSize: 'small', + bodyTextSize: 'small', + link: '/draft-05#explanation-for-lack-of-draft-05-meta-schema', + }, +]; + export default function ImplementationsPages({ blocks, frontmatter, -}: { - blocks: any; - frontmatter: any; -}) { +}: StaticProps) { const markdownFile = '_indexPage'; return ( <SectionContext.Provider value={null}> @@ -43,44 +96,20 @@ export default function ImplementationsPages({ <StyledMarkdown markdown={blocks.index} /> <StyledMarkdown markdown={blocks.body} /> <div className='w-full lg:w-full grid grid-cols-1 sm:grid-cols-2 gap-6 my-[10px] mx-auto mt-8'> - <Card - title='Draft 2020-12' - body='Draft 2020-12 release notes.' - headerSize='small' - bodyTextSize='small' - link='/draft/2020-12/release-notes' - /> - <Card - title='Draft 2019-09' - body='Draft 2019-09 release notes.' - headerSize='small' - bodyTextSize='small' - link='/draft/2019-09/release-notes' - /> - <Card - title='Draft 07' - body='Draft 07 release notes.' - headerSize='small' - bodyTextSize='small' - link='/draft-07/json-schema-release-notes' - /> - <Card - title='Draft 06' - body='Draft 06 release notes.' - headerSize='small' - bodyTextSize='small' - link='/draft-06/json-schema-release-notes' - /> - <Card - title='Draft 05' - body='Draft 05 release notes.' - headerSize='small' - bodyTextSize='small' - link='/draft-05#explanation-for-lack-of-draft-05-meta-schema' - /> + {releaseNotes.map((note, index) => ( + <Card + key={index} + title={note.title} + body={note.body} + headerSize={note.headerSize} + bodyTextSize={note.bodyTextSize} + link={note.link} + /> + ))} </div> <DocsHelp markdownFile={markdownFile} /> </SectionContext.Provider> ); } + ImplementationsPages.getLayout = getLayout; diff --git a/pages/tools/components/ToolingTable.tsx b/pages/tools/components/ToolingTable.tsx index 16b549013..58f65b5e0 100644 --- a/pages/tools/components/ToolingTable.tsx +++ b/pages/tools/components/ToolingTable.tsx @@ -25,6 +25,28 @@ interface ToolingTableProps { setTransform: Dispatch<SetStateAction<Transform>>; } +interface TableCellAttributes + extends React.HTMLAttributes<HTMLTableCellElement> { + style?: React.CSSProperties; + title?: string; +} + +interface TableColumnHeaderProps { + children: ReactNode | ReactNode[]; + attributes?: React.ThHTMLAttributes<HTMLTableCellElement>; +} + +interface TableSortableColumnHeaderProps extends TableColumnHeaderProps { + sortBy: Transform['sortBy']; + transform: Transform; + setTransform: Dispatch<SetStateAction<Transform>>; +} + +interface TableCellProps { + children: ReactNode | ReactNode[]; + attributes?: TableCellAttributes; +} + const ToolingTable = ({ toolsByGroup, transform, @@ -267,10 +289,7 @@ const ToolingTable = ({ const TableColumnHeader = ({ children, attributes: propAttributes, -}: { - children: ReactNode | ReactNode[]; - attributes?: Record<string, any>; -}) => { +}: TableColumnHeaderProps) => { return ( <th {...propAttributes} @@ -290,13 +309,7 @@ const TableSortableColumnHeader = ({ setTransform, children, attributes: propAttributes, -}: { - sortBy: Transform['sortBy']; - transform: Transform; - setTransform: Dispatch<SetStateAction<Transform>>; - children: ReactNode; - attributes?: Record<string, any>; -}) => { +}: TableSortableColumnHeaderProps) => { const [isSortedBy, setIsSortedBy] = useState(transform.sortBy === sortBy); useEffect(() => { @@ -355,10 +368,7 @@ const TableSortableColumnHeader = ({ const TableCell = ({ children, attributes: propAttributes, -}: { - children: ReactNode | ReactNode[]; - attributes?: Record<string, any>; -}) => { +}: TableCellProps) => { return ( <td {...propAttributes} diff --git a/pages/understanding-json-schema/[slug].page.tsx b/pages/understanding-json-schema/[slug].page.tsx index 6174f5ea1..81143890e 100644 --- a/pages/understanding-json-schema/[slug].page.tsx +++ b/pages/understanding-json-schema/[slug].page.tsx @@ -8,22 +8,49 @@ import { Headline1 } from '~/components/Headlines'; import { DocsHelp } from '~/components/DocsHelp'; import { SectionContext } from '~/context'; +interface StaticPropsArgs { + params: { + slug: string; + }; +} + +interface Frontmatter { + title: string; + section?: + | 'learn' + | 'docs' + | 'implementers' + | 'tools' + | 'implementations' + | 'blog' + | 'community' + | 'specification' + | 'overview' + | 'getting-started' + | 'reference' + | null; +} + +interface StaticMarkdownPageProps { + frontmatter: Frontmatter; + content: string; +} + export async function getStaticPaths() { return getStaticMarkdownPaths('pages/understanding-json-schema'); } -export async function getStaticProps(args: any) { + +export async function getStaticProps(args: StaticPropsArgs) { return getStaticMarkdownProps(args, 'pages/understanding-json-schema'); } export default function StaticMarkdownPage({ frontmatter, content, -}: { - frontmatter: any; - content: any; -}) { +}: StaticMarkdownPageProps) { const markdownFile = '_index'; - const newTitle = 'JSON Schema - ' + frontmatter.title; + const newTitle = `JSON Schema - ${frontmatter.title}`; + return ( <SectionContext.Provider value={frontmatter.section || null}> <Head> @@ -35,4 +62,5 @@ export default function StaticMarkdownPage({ </SectionContext.Provider> ); } + StaticMarkdownPage.getLayout = getLayout; diff --git a/pages/understanding-json-schema/index.page.tsx b/pages/understanding-json-schema/index.page.tsx index e8f6fa8e6..ab746ec7c 100644 --- a/pages/understanding-json-schema/index.page.tsx +++ b/pages/understanding-json-schema/index.page.tsx @@ -6,6 +6,10 @@ import StyledMarkdown from '~/components/StyledMarkdown'; import { DocsHelp } from '~/components/DocsHelp'; import { SectionContext } from '~/context'; +interface ContentExampleProps { + blocks: string[]; +} + export async function getStaticProps() { const block1 = fs.readFileSync( 'pages/understanding-json-schema/_index.md', @@ -19,7 +23,7 @@ export async function getStaticProps() { }; } -export default function ContentExample({ blocks }: { blocks: any[] }) { +export default function ContentExample({ blocks }: ContentExampleProps) { const markdownFile = '_indexPage'; return ( diff --git a/pages/understanding-json-schema/reference/[slug].page.tsx b/pages/understanding-json-schema/reference/[slug].page.tsx index acab32f4c..967313292 100644 --- a/pages/understanding-json-schema/reference/[slug].page.tsx +++ b/pages/understanding-json-schema/reference/[slug].page.tsx @@ -8,10 +8,39 @@ import getStaticMarkdownProps from '~/lib/getStaticMarkdownProps'; import { SectionContext } from '~/context'; import { DocsHelp } from '~/components/DocsHelp'; +interface StaticPropsArgs { + params: { + slug: string; + }; +} + +interface Frontmatter { + title: string; + section?: + | 'learn' + | 'docs' + | 'implementers' + | 'tools' + | 'implementations' + | 'blog' + | 'community' + | 'specification' + | 'overview' + | 'getting-started' + | 'reference' + | null; +} + +interface StaticMarkdownPageProps { + frontmatter: Frontmatter; + content: string; +} + export async function getStaticPaths() { return getStaticMarkdownPaths('pages/understanding-json-schema/reference'); } -export async function getStaticProps(args: any) { + +export async function getStaticProps(args: StaticPropsArgs) { return getStaticMarkdownProps( args, 'pages/understanding-json-schema/reference', @@ -21,12 +50,10 @@ export async function getStaticProps(args: any) { export default function StaticMarkdownPage({ frontmatter, content, -}: { - frontmatter: any; - content: any; -}) { - const newTitle = 'JSON Schema - ' + frontmatter.title; +}: StaticMarkdownPageProps) { + const newTitle = `JSON Schema - ${frontmatter.title}`; const markdownFile = '_index'; + return ( <SectionContext.Provider value={frontmatter.section || null}> <Head> @@ -38,4 +65,5 @@ export default function StaticMarkdownPage({ </SectionContext.Provider> ); } + StaticMarkdownPage.getLayout = getLayout; diff --git a/pages/understanding-json-schema/reference/index.page.tsx b/pages/understanding-json-schema/reference/index.page.tsx index 19953a9d4..ec37c9b4c 100644 --- a/pages/understanding-json-schema/reference/index.page.tsx +++ b/pages/understanding-json-schema/reference/index.page.tsx @@ -6,6 +6,10 @@ import StyledMarkdown from '~/components/StyledMarkdown'; import { SectionContext } from '~/context'; import { DocsHelp } from '~/components/DocsHelp'; +interface ContentExampleProps { + blocks: string[]; +} + export async function getStaticProps() { const block1 = fs.readFileSync( 'pages/understanding-json-schema/reference/_index.md', @@ -19,7 +23,7 @@ export async function getStaticProps() { }; } -export default function ContentExample({ blocks }: { blocks: any[] }) { +export default function ContentExample({ blocks }: ContentExampleProps) { const markdownFile = '_indexPage'; return ( <SectionContext.Provider value='docs'> @@ -28,4 +32,5 @@ export default function ContentExample({ blocks }: { blocks: any[] }) { </SectionContext.Provider> ); } + ContentExample.getLayout = getLayout;