1
0
mirror of synced 2025-12-21 02:46:50 -05:00
Files
docs/components/page-header/RestBanner.tsx
2022-05-23 15:41:33 +00:00

80 lines
2.2 KiB
TypeScript

import React from 'react'
import { Flash } from '@primer/react'
import { useRouter } from 'next/router'
import { Link } from 'components/Link'
const restRepoDisplayPages = [
'branches',
'collaborators',
'commits',
'deploy_keys',
'deployments',
'pages',
'releases',
'repos',
'metrics',
'webhooks',
]
const restEnterpriseDisplayPages = ['enterprise-admin']
const restRepoCategoryExceptionsTitles = {
branches: 'Branches',
collaborators: 'Collaborators',
commits: 'Commits',
'deploy-keys': 'Deploy Keys',
deployments: 'Deployments',
pages: 'GitHub Pages',
releases: 'Releases',
metrics: 'Metrics',
webhooks: 'Webhooks',
}
export const RestBanner = () => {
const router = useRouter()
const restPage = router.query.category as string
if (!restRepoDisplayPages.includes(restPage) && !restEnterpriseDisplayPages.includes(restPage)) {
return null
}
let noticeString
if (restRepoDisplayPages.includes(restPage)) {
const pages = Object.keys(restRepoCategoryExceptionsTitles) as Array<
keyof typeof restRepoCategoryExceptionsTitles
>
const newRestPagesText = pages.map((page, i) => [
<React.Fragment key={page}>
<Link href={`/${router.locale}/rest/${page}`}>
{restRepoCategoryExceptionsTitles[page]}
</Link>
{i < pages.length - 1 && ', '}
</React.Fragment>,
])
noticeString = (
<React.Fragment>
If you can't find what you're looking for, you might try the new {newRestPagesText} REST API
pages.
</React.Fragment>
)
} else if (restEnterpriseDisplayPages.includes(restPage)) {
noticeString = (
<React.Fragment>
If you can't find what you're looking for, you might try the{' '}
<Link href={`/${router.locale}/rest/actions`}>Actions</Link> REST API page.
</React.Fragment>
)
}
return (
<div data-testid="rest-api-repos-banner" className="container-xl mt-3 mx-auto p-responsive">
<Flash variant="warning">
<p>
<b className="text-bold">
<span>We've recently moved some of the REST API documentation. {noticeString}</span>
</b>{' '}
</p>
</Flash>
</div>
)
}