awesome-uses/src/root.tsx

65 lines
1.6 KiB
TypeScript
Raw Normal View History

2023-02-20 21:56:44 +00:00
import type { LinksFunction, MetaFunction } from '@remix-run/node';
2023-02-20 20:41:29 +00:00
import {
Links,
LiveReload,
Meta,
Outlet,
2023-02-20 21:56:44 +00:00
Scripts
2023-02-20 20:41:29 +00:00
} from '@remix-run/react';
2023-02-20 21:56:44 +00:00
import Layout from './components/layout';
2023-02-20 20:41:29 +00:00
import styles from './styles.css';
import { countries, devices, tags } from './util/stats';
2023-02-20 21:56:44 +00:00
import twitterCard from './images/twitter-card.png';
2023-02-20 20:41:29 +00:00
export const links: LinksFunction = () => [
{ rel: 'stylesheet', href: styles },
];
export function loader() {
return {
2023-02-20 22:16:48 +00:00
tags: tags(),
countries: countries(),
devices: devices(),
2023-02-20 20:41:29 +00:00
}
}
const metaData = {
description: `A list of /uses pages detailing developer setups.`,
siteUrl: 'https://uses.tech',
author: `@wesbos`,
title: '/uses',
}
export const meta: MetaFunction = () => ({
charset: 'utf-8',
title: '/uses',
viewport: 'width=device-width,initial-scale=1',
});
export default function App() {
return (
<html lang="en">
<head>
<Meta />
<link rel="icon" href="https://fav.farm/🖥" />
<meta name="description" content={metaData.description} />
<link rel="canonical" href={metaData.siteUrl} />
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:creator" content="@wesbos" />
<meta name="twitter:title" content={metaData.title} />
<meta name="twitter:description" content={metaData.description} />
2023-02-21 20:16:45 +00:00
<meta name="twitter:image" content={`https://uses.tech${twitterCard}`} />
2023-02-20 20:41:29 +00:00
<Links />
</head>
<body>
<Layout>
<Outlet />
{/* <ScrollRestoration /> */}
<Scripts />
<LiveReload />
</Layout>
</body>
</html>
);
}