-
Notifications
You must be signed in to change notification settings - Fork 401
/
layout.tsx
70 lines (62 loc) · 1.94 KB
/
layout.tsx
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
import { component$, useStylesScoped$, Slot, useContextProvider } from '@builder.io/qwik'
import { DocumentHead, useLocation, 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 styles from './layout.scss?inline'
import { InstanceConfigContext } from '~/utils/instanceConfig'
const pathsWithoutColumns = ['/first-login', '/start-instance']
export const useShowColumns = () => {
const location = useLocation()
const pathname = new URL(location.href).pathname
return !pathsWithoutColumns.includes(pathname)
}
export const instanceLoader = loader$<{ DATABASE: D1Database; domain: string }, Promise<InstanceConfig>>(
async ({ platform }) => {
const response = await instance.handleRequest('', platform.DATABASE)
const results = await response.text()
const json = JSON.parse(results) as InstanceConfig
return json
}
)
export default component$(() => {
useStylesScoped$(styles)
const showColumns = useShowColumns()
useContextProvider(InstanceConfigContext, instanceLoader.use().value)
return (
<main class="main-wrapper">
{showColumns && (
<div class="side-column">
<div class="sticky">
<LeftColumn />
</div>
</div>
)}
<div class={`w-full ${showColumns ? 'max-w-lg' : ''}`}>
<div class={`bg-slate-800 ${showColumns ? 'rounded ' : 'min-h-screen'}`}>
<Slot />
</div>
</div>
{showColumns && (
<div class="side-column">
<div class="sticky">
<RightColumn />
</div>
</div>
)}
</main>
)
})
export const head: DocumentHead = (props) => {
const config = props.getData(instanceLoader)
return {
title: config.short_description,
meta: [
{
name: 'description',
content: config.description,
},
],
}
}