feat: add canonical tags to documentation

This commit is contained in:
Valerio Ageno
2024-11-03 22:07:22 +01:00
parent 132d8ebe8f
commit 9591960e31
18 changed files with 140 additions and 69 deletions
@@ -3,60 +3,60 @@ import { Link } from 'tuono'
import { IconArrowRight, IconArrowLeft } from '@tabler/icons-react'
interface NavigationButton {
href: string
title: string
href: string
title: string
}
interface NavigationButtonsProps {
prev?: NavigationButton
next?: NavigationButton
prev?: NavigationButton
next?: NavigationButton
}
export default function NavigationButtons({
prev,
next,
prev,
next,
}: NavigationButtonsProps): JSX.Element {
return (
<Flex mt={50} gap={10}>
{prev && <NavigationBtn type="prev" {...prev} />}
{next && <NavigationBtn type="next" {...next} />}
</Flex>
)
return (
<Flex mt={50} gap={10}>
{prev && <NavigationBtn type="prev" {...prev} />}
{next && <NavigationBtn type="next" {...next} />}
</Flex>
)
}
interface NavigationButtonProps extends NavigationButton {
type: 'next' | 'prev'
type: 'next' | 'prev'
}
const NavigationBtn = ({
type,
title,
href,
type,
title,
href,
}: NavigationButtonProps): JSX.Element => {
const heading = type === 'next' ? 'Next' : 'Previous'
const textAlign = type === 'next' ? 'left' : 'right'
const variant = type === 'next' ? 'filled' : 'outline'
const heading = type === 'next' ? 'Next' : 'Previous'
const textAlign = type === 'next' ? 'left' : 'right'
const variant = type === 'next' ? 'filled' : 'outline'
return (
<Button
component={Link}
fullWidth
variant={variant}
href={href}
justify="space-between"
h="auto"
rightSection={type === 'next' && <IconArrowRight />}
leftSection={type === 'prev' && <IconArrowLeft />}
p="20"
>
<Box>
<Title component="span" display="block" order={4} style={{ textAlign }}>
{heading}
</Title>
<Text component="span" display="block" style={{ textAlign }}>
{title}
</Text>
</Box>
</Button>
)
return (
<Button
component={Link}
fullWidth
variant={variant}
href={href}
justify="space-between"
h="auto"
rightSection={type === 'next' && <IconArrowRight />}
leftSection={type === 'prev' && <IconArrowLeft />}
p="20"
>
<Box>
<Title component="span" display="block" order={4} style={{ textAlign }}>
{heading}
</Title>
<Text component="span" display="block" style={{ textAlign }}>
{title}
</Text>
</Box>
</Button>
)
}
@@ -2,6 +2,7 @@ import { Head } from 'tuono'
<Head>
<title>Tuono - CLI</title>
<link rel="canonical" href="https://tuono.dev/documentation/cli" />
</Head>
import Breadcrumbs, { Element } from '../../components/breadcrumbs'
@@ -2,6 +2,7 @@ import { Head } from 'tuono'
<Head>
<title>Tuono - Contributing</title>
<link rel="canonical" href="https://tuono.dev/documentation/contributing" />
</Head>
import Breadcrumbs, { Element } from '../../components/breadcrumbs'
@@ -2,6 +2,7 @@ import { Head } from 'tuono'
<Head>
<title>Tuono - Documentation</title>
<link rel="canonical" href="https://tuono.dev/documentation" />
</Head>
import Breadcrumbs from '../../components/breadcrumbs'
@@ -3,6 +3,7 @@ import Breadcrumbs, { Element } from '../../components/breadcrumbs'
<Head>
<title>Tuono - Installation</title>
<link rel="canonical" href="https://tuono.dev/documentation/installation" />
</Head>
<Breadcrumbs>
@@ -2,6 +2,7 @@ import { Head } from 'tuono'
<Head>
<title>Tuono - Routing</title>
<link rel="canonical" href="https://tuono.dev/documentation/routing" />
</Head>
import Breadcrumbs, { Element } from '../../../components/breadcrumbs'
@@ -2,6 +2,7 @@ import { Head } from 'tuono'
<Head>
<title>Tuono - Routing</title>
<link rel="canonical" href="https://tuono.dev/documentation/routing/intro" />
</Head>
import Breadcrumbs, { Element } from '../../../components/breadcrumbs'
@@ -2,6 +2,10 @@ import { Head } from 'tuono'
<Head>
<title>Tutorial - API fetching</title>
<link
rel="canonical"
href="https://tuono.dev/documentation/tutorial/api-fetching"
/>
</Head>
import Breadcrumbs, { Element } from '../../../components/breadcrumbs'
@@ -106,7 +110,10 @@ Refresh the browser now! A bit ugly, but all the Pokémon are finally printed on
import NavigationButtons from '../../../components/navigation-buttons'
<NavigationButtons
prev={{title: 'Development setup', href:"/documentation/tutorial/development-setup"}}
next={{title: 'Components', href:"/documentation/tutorial/components"}}
<NavigationButtons
prev={{
title: 'Development setup',
href: '/documentation/tutorial/development-setup',
}}
next={{ title: 'Components', href: '/documentation/tutorial/components' }}
/>
@@ -2,6 +2,10 @@ import { Head } from 'tuono'
<Head>
<title>Tutorial - Components</title>
<link
rel="canonical"
href="https://tuono.dev/documentation/tutorial/components"
/>
</Head>
import Breadcrumbs, { Element } from '../../../components/breadcrumbs'
@@ -130,7 +134,10 @@ export default function PokemonLink({
import NavigationButtons from '../../../components/navigation-buttons'
<NavigationButtons
prev={{title: 'API fetching', href:"/documentation/tutorial/api-fetching"}}
next={{title: 'Dynamic routes', href:"/documentation/tutorial/dynamic-routes"}}
<NavigationButtons
prev={{ title: 'API fetching', href: '/documentation/tutorial/api-fetching' }}
next={{
title: 'Dynamic routes',
href: '/documentation/tutorial/dynamic-routes',
}}
/>
@@ -2,6 +2,10 @@ import { Head } from 'tuono'
<Head>
<title>Tutorial - Conclusion</title>
<link
rel="canonical"
href="https://tuono.dev/documentation/tutorial/conclusion"
/>
</Head>
import Breadcrumbs, { Element } from '../../../components/breadcrumbs'
@@ -25,6 +29,9 @@ Ciao
import NavigationButtons from '../../../components/navigation-buttons'
<NavigationButtons
prev={{title: 'Production build', href:"/documentation/tutorial/production"}}
<NavigationButtons
prev={{
title: 'Production build',
href: '/documentation/tutorial/production',
}}
/>
@@ -2,6 +2,10 @@ import { Head } from 'tuono'
<Head>
<title>Tutorial - Development setup</title>
<link
rel="canonical"
href="https://tuono.dev/documentation/tutorial/development-setup"
/>
</Head>
import Breadcrumbs, { Element } from '../../../components/breadcrumbs'
@@ -67,7 +71,7 @@ Then open [http://localhost:3000/](http://localhost:3000) on the browser.
import NavigationButtons from '../../../components/navigation-buttons'
<NavigationButtons
prev={{title: 'Tutorial', href:"/documentation/tutorial"}}
next={{title: 'API fetching', href:"/documentation/tutorial/api-fetching"}}
<NavigationButtons
prev={{ title: 'Tutorial', href: '/documentation/tutorial' }}
next={{ title: 'API fetching', href: '/documentation/tutorial/api-fetching' }}
/>
@@ -2,6 +2,10 @@ import { Head } from 'tuono'
<Head>
<title>Tutorial - Dynamic routes</title>
<link
rel="canonical"
href="https://tuono.dev/documentation/tutorial/dynamic-routes"
/>
</Head>
import Breadcrumbs, { Element } from '../../../components/breadcrumbs'
@@ -160,7 +164,10 @@ export default function PokemonView({
import NavigationButtons from '../../../components/navigation-buttons'
<NavigationButtons
prev={{title: 'Components', href:"/documentation/tutorial/components"}}
next={{title: 'Error handling', href:"/documentation/tutorial/error-handling"}}
<NavigationButtons
prev={{ title: 'Components', href: '/documentation/tutorial/components' }}
next={{
title: 'Error handling',
href: '/documentation/tutorial/error-handling',
}}
/>
@@ -2,6 +2,10 @@ import { Head } from 'tuono'
<Head>
<title>Tutorial - Error handling</title>
<link
rel="canonical"
href="https://tuono.dev/documentation/tutorial/error-handling"
/>
</Head>
import Breadcrumbs, { Element } from '../../../components/breadcrumbs'
@@ -103,7 +107,10 @@ correctly receive a 404 status code in the console.
import NavigationButtons from '../../../components/navigation-buttons'
<NavigationButtons
prev={{title: 'Dynamic routes', href:"/documentation/tutorial/dynamic-routes"}}
next={{title: 'SEO and meta tags', href:"/documentation/tutorial/seo"}}
<NavigationButtons
prev={{
title: 'Dynamic routes',
href: '/documentation/tutorial/dynamic-routes',
}}
next={{ title: 'SEO and meta tags', href: '/documentation/tutorial/seo' }}
/>
@@ -2,6 +2,7 @@ import { Head } from 'tuono'
<Head>
<title>Tuono - Tutorial</title>
<link rel="canonical" href="https://tuono.dev/documentation/tutorial" />
</Head>
import Breadcrumbs, { Element } from '../../../components/breadcrumbs'
@@ -29,6 +30,9 @@ $ tuono new tutorial --template tutorial
import NavigationButtons from '../../../components/navigation-buttons'
<NavigationButtons
next={{title: 'Development setup', href:"/documentation/tutorial/development-setup"}}
<NavigationButtons
next={{
title: 'Development setup',
href: '/documentation/tutorial/development-setup',
}}
/>
@@ -2,6 +2,10 @@ import { Head } from 'tuono'
<Head>
<title>Tutorial - Building for production</title>
<link
rel="canonical"
href="https://tuono.dev/documentation/tutorial/production"
/>
</Head>
import Breadcrumbs, { Element } from '../../../components/breadcrumbs'
@@ -34,7 +38,10 @@ optimizations ready to unleash the power of a rust server that seamlessly render
import NavigationButtons from '../../../components/navigation-buttons'
<NavigationButtons
prev={{title: 'Server redirection', href:"/documentation/tutorial/redirections"}}
next={{title: 'Conclusion', href:"/documentation/tutorial/conclusion"}}
<NavigationButtons
prev={{
title: 'Server redirection',
href: '/documentation/tutorial/redirections',
}}
next={{ title: 'Conclusion', href: '/documentation/tutorial/conclusion' }}
/>
@@ -2,6 +2,10 @@ import { Head } from 'tuono'
<Head>
<title>Tutorial - Redirections</title>
<link
rel="canonical"
href="https://tuono.dev/documentation/tutorial/redirections"
/>
</Head>
import Breadcrumbs, { Element } from '../../../components/breadcrumbs'
@@ -48,7 +52,10 @@ Click on it and see the application automatically redirecting you to your favour
import NavigationButtons from '../../../components/navigation-buttons'
<NavigationButtons
prev={{title: 'SEO and meta tags', href:"/documentation/tutorial/seo"}}
next={{title: 'Production build', href:"/documentation/tutorial/production"}}
<NavigationButtons
prev={{ title: 'SEO and meta tags', href: '/documentation/tutorial/seo' }}
next={{
title: 'Production build',
href: '/documentation/tutorial/production',
}}
/>
@@ -2,6 +2,7 @@ import { Head } from 'tuono'
<Head>
<title>Tutorial - SEO and meta tags</title>
<link rel="canonical" href="https://tuono.dev/documentation/tutorial/seo" />
</Head>
import Breadcrumbs, { Element } from '../../../components/breadcrumbs'
@@ -97,7 +98,13 @@ The `Head` component takes as children any valid HTML meta tag.
import NavigationButtons from '../../../components/navigation-buttons'
<NavigationButtons
prev={{title: 'Error handling', href:"/documentation/tutorial/error-handling"}}
next={{title: 'Server redirection', href:"/documentation/tutorial/redirections"}}
<NavigationButtons
prev={{
title: 'Error handling',
href: '/documentation/tutorial/error-handling',
}}
next={{
title: 'Server redirection',
href: '/documentation/tutorial/redirections',
}}
/>
+1
View File
@@ -6,6 +6,7 @@ export default function IndexPage(): JSX.Element {
<>
<Head>
<title>Tuono - The React/Rust full-stack framework</title>
<link rel="canonical" href="https://tuono.dev" />
<meta
name="description"
content="The technologies we love seamlessly working together to unleash the highest web performance ever met on React"