2024-07-13 09:36:23 +00:00
|
|
|
import { Params, RouteSectionProps, createAsync } from '@solidjs/router'
|
2024-07-03 21:25:03 +00:00
|
|
|
import { createEffect, createMemo, on } from 'solid-js'
|
2024-07-09 09:13:13 +00:00
|
|
|
import { TopicsNav } from '~/components/Nav/TopicsNav'
|
2024-07-04 07:51:15 +00:00
|
|
|
import { Expo } from '~/components/Views/Expo'
|
|
|
|
import { PageLayout } from '~/components/_shared/PageLayout'
|
|
|
|
import { useLocalize } from '~/context/localize'
|
|
|
|
import { loadShouts } from '~/graphql/api/public'
|
2024-07-03 21:25:03 +00:00
|
|
|
import { LoadShoutsOptions, Shout } from '~/graphql/schema/core.gen'
|
|
|
|
import { LayoutType } from '~/types/common'
|
2024-07-13 09:06:49 +00:00
|
|
|
import { SHOUTS_PER_PAGE } from '../(main)'
|
2024-07-03 21:25:03 +00:00
|
|
|
|
|
|
|
const fetchExpoShouts = async (layouts: string[]) => {
|
|
|
|
const result = await loadShouts({
|
|
|
|
filters: { layouts },
|
|
|
|
limit: SHOUTS_PER_PAGE,
|
|
|
|
offset: 0
|
|
|
|
} as LoadShoutsOptions)
|
|
|
|
return result || []
|
|
|
|
}
|
|
|
|
|
|
|
|
export const route = {
|
|
|
|
load: async ({ params }: { params: Params }) => {
|
|
|
|
const layouts = params.layout ? [params.layout] : ['audio', 'literature', 'article', 'video', 'image']
|
|
|
|
const shoutsLoader = await fetchExpoShouts(layouts)
|
|
|
|
return (await shoutsLoader()) as Shout[]
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2024-07-05 17:23:07 +00:00
|
|
|
export default (props: RouteSectionProps<Shout[]>) => {
|
2024-07-03 21:25:03 +00:00
|
|
|
const { t } = useLocalize()
|
|
|
|
const shouts = createAsync(
|
|
|
|
async () =>
|
|
|
|
props.data ||
|
|
|
|
(await fetchExpoShouts(
|
2024-07-13 09:36:23 +00:00
|
|
|
props.params.layout ? [props.params.layout] : ['audio', 'literature', 'article', 'video', 'image']
|
2024-07-03 21:25:03 +00:00
|
|
|
))
|
|
|
|
)
|
2024-07-13 09:36:23 +00:00
|
|
|
const layout = createMemo(() => props.params.layout)
|
2024-07-03 21:25:03 +00:00
|
|
|
const title = createMemo(() => {
|
|
|
|
switch (layout()) {
|
|
|
|
case 'audio': {
|
|
|
|
return t('Audio')
|
|
|
|
}
|
|
|
|
case 'video': {
|
|
|
|
return t('Video')
|
|
|
|
}
|
|
|
|
case 'image': {
|
|
|
|
return t('Artworks')
|
|
|
|
}
|
|
|
|
case 'literature': {
|
|
|
|
return t('Literature')
|
|
|
|
}
|
|
|
|
default: {
|
|
|
|
return t('Art')
|
|
|
|
}
|
|
|
|
}
|
|
|
|
})
|
|
|
|
|
|
|
|
createEffect(on(title, (ttl) => (document.title = ttl), { defer: true }))
|
|
|
|
|
|
|
|
return (
|
2024-07-05 08:11:57 +00:00
|
|
|
<PageLayout withPadding={true} zeroBottomPadding={true} title={`${t('Discours')} :: ${title()}`}>
|
2024-07-09 09:13:13 +00:00
|
|
|
<TopicsNav />
|
2024-07-03 21:25:03 +00:00
|
|
|
<Expo shouts={shouts() || []} layout={layout() as LayoutType} />
|
|
|
|
</PageLayout>
|
|
|
|
)
|
|
|
|
}
|