import packageJson from "reacord/package.json"
import type { LinksFunction, LoaderFunction, MetaFunction } from "remix"
import {
Links,
LiveReload,
Meta,
Outlet,
Scripts,
ScrollRestoration,
useLoaderData,
} from "remix"
import bannerUrl from "~/assets/banner.png"
import faviconUrl from "~/assets/favicon.png"
import { GuideLinksProvider } from "~/modules/navigation/guide-links-context"
import type { GuideLink } from "~/modules/navigation/load-guide-links.server"
import { loadGuideLinks } from "~/modules/navigation/load-guide-links.server"
import prismThemeCss from "~/modules/ui/prism-theme.css"
import tailwindCss from "~/modules/ui/tailwind.out.css"
export const meta: MetaFunction = () => ({
"title": "Reacord",
"description": packageJson.description,
"og:url": "https://reacord.fly.dev/",
"og:type": "website",
"og:title": "Reacord",
"og:description": "Create interactive Discord messages using React",
"og:image": bannerUrl,
"twitter:card": "summary_large_image",
"twitter:domain": "reacord.fly.dev",
"twitter:url": "https://reacord.fly.dev/",
"twitter:title": "Reacord",
"twitter:description": "Create interactive Discord messages using React",
"twitter:image": bannerUrl,
})
export const links: LinksFunction = () => [
{ rel: "icon", type: "image/png", href: faviconUrl },
{ rel: "stylesheet", href: tailwindCss },
{ rel: "stylesheet", href: prismThemeCss },
{ rel: "preconnect", href: "https://fonts.googleapis.com" },
{
rel: "preconnect",
href: "https://fonts.gstatic.com",
crossOrigin: "anonymous",
},
{
rel: "preload",
as: "style",
href: "https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@500&family=Rubik:ital,wght@0,300;0,400;0,500;1,300;1,400;1,500&display=swap",
},
]
type LoaderData = {
guideLinks: GuideLink[]
}
export const loader: LoaderFunction = async () => {
const data: LoaderData = {
guideLinks: await loadGuideLinks(),
}
return data
}
export default function App() {
const data: LoaderData = useLoaderData()
return (
{process.env.NODE_ENV === "production" && (
)}
{process.env.NODE_ENV === "development" && }
)
}