mirror
/
wildebeest
kopia lustrzana https://github.com/cloudflare/wildebeest
1
0
Forkuj 0
Kod Zgłoszenia Packages Projekty Wydania Wiki Aktywność

Simplify layout file now that it only applies to the frontend routes

pull/62/head
Pete Bacon Darwin 2023-01-10 13:47:25 +00:00
rodzic 8e584b2632
commit e18a85d4f9
1 zmienionych plików z 17 dodań i 33 usunięć
Pokaż statystyki Ściągnij plik aktualizacji Ściągnij plik porównania Expand all files Collapse all files

50
frontend/src/routes/(frontend)/layout.tsx
Wyświetl plik

@ -1,20 +1,12 @@
import { component$, Slot, useContextProvider } from '@builder.io/qwik'
import { DocumentHead, useLocation, loader$ } from '@builder.io/qwik-city'
import { DocumentHead, loader$ } from '@builder.io/qwik-city'
import * as instance from 'wildebeest/functions/api/v1/instance'
import type { InstanceConfig } from 'wildebeest/backend/src/types/configs'
import LeftColumn from '~/components/layout/LeftColumn/LeftColumn'
import RightColumn from '~/components/layout/RightColumn/RightColumn'
import { InstanceConfigContext } from '~/utils/instanceConfig'
import { WildebeestLogo } from '~/components/MastodonLogo'
import { getCommitHash } from '~/utils/getCommitHash'
const pathsWithoutColumns = ['/first-login', '/start-instance']
export const useShowHeaderAndColumns = () => {
const location = useLocation()
const pathname = new URL(location.href).pathname
return !pathsWithoutColumns.includes(pathname)
}
import { InstanceConfigContext } from '~/utils/instanceConfig'
export const instanceLoader = loader$<{ DATABASE: D1Database; domain: string }, Promise<InstanceConfig>>(
async ({ platform }) => {
@ -26,39 +18,31 @@ export const instanceLoader = loader$<{ DATABASE: D1Database; domain: string },
)
export default component$(() => {
const showHeaderAndColumns = useShowHeaderAndColumns()
useContextProvider(InstanceConfigContext, instanceLoader.use().value)
return (
<>
{showHeaderAndColumns && (
<header class="h-[3.9rem] z-50 sticky top-0 bg-wildebeest-600 p-3 w-full border-b border-wildebeest-700 xl:hidden">
<a class="no-underline flex items-center w-max" href="https://mastodon.social">
<WildebeestLogo size="small" />
</a>
</header>
)}
<header class="h-[3.9rem] z-50 sticky top-0 bg-wildebeest-600 p-3 w-full border-b border-wildebeest-700 xl:hidden">
<a class="no-underline flex items-center w-max" href="https://mastodon.social">
<WildebeestLogo size="small" />
</a>
</header>
<main class="h-full flex justify-center main-wrapper top-[3.9rem]">
{showHeaderAndColumns && (
<div class="w-fit md:w-72 hidden xl:block mx-[10px]">
<div class="sticky top-[10px]">
<LeftColumn />
</div>
<div class="w-fit md:w-72 hidden xl:block mx-[10px]">
<div class="sticky top-[10px]">
<LeftColumn />
</div>
)}
<div class={`w-full ${showHeaderAndColumns ? 'xl:max-w-xl' : ''}`}>
<div class={`bg-wildebeest-600 ${showHeaderAndColumns ? 'rounded ' : 'min-h-screen'}`}>
</div>
<div class="w-full xl:max-w-xl">
<div class="bg-wildebeest-600 rounded">
<Slot />
</div>
</div>
{showHeaderAndColumns && (
<div class="w-fit md:w-72 border-l xl:border-l-0 border-wildebeest-700 xl:mx-[10px] flex flex-col">
<div class="xl:top-[10px] flex-1 flex flex-col">
<RightColumn />
</div>
<div class="w-fit md:w-72 border-l xl:border-l-0 border-wildebeest-700 xl:mx-[10px] flex flex-col">
<div class="xl:top-[10px] flex-1 flex flex-col">
<RightColumn />
</div>
)}
</div>
</main>
<footer class="flex justify-end p-2 bg-wildebeest-600 border-t border-wildebeest-700 xl:bg-transparent xl:mt-10 xl:mx-6">
<p class="text-sm text-wildebeest-500">v.{getCommitHash()}</p>