This commit is contained in:
Untone 2024-09-19 19:15:57 +03:00
commit d6c6545726
4 changed files with 36 additions and 9 deletions

1
.gitignore vendored
View File

@ -1,4 +1,5 @@
.devcontainer
.pnpm-store
dist/
node_modules/
npm-debug.log*

View File

@ -1,3 +1,10 @@
/**
* Placeholder component displays different placeholder content based on type and mode.
*
* @param {PlaceholderProps} props - The properties for the component.
* @returns {JSX.Element | null} The rendered placeholder or null if data is missing.
*/
import { clsx } from 'clsx'
import { For, Show, createMemo } from 'solid-js'
@ -89,7 +96,21 @@ export const Placeholder = (props: PlaceholderProps) => {
const { t } = useLocalize()
const { session } = useSession()
const placeholderData = createMemo(() => data[props.type])
// dufok (^-^') mem for placeholder data without a fallback, it will be `undefined` if not found
const placeholderData = createMemo(() => {
const dataForType = data[props.type]
if (!dataForType) {
console.warn(`No placeholder data found for type: ${props.type}`)
}
return dataForType
// (^-^') No fallback to ensure it is empty when data is missing
})
// (^-^') Return null if no placeholder data is found
if (!placeholderData()) {
return null
}
return (
<div
@ -100,17 +121,17 @@ export const Placeholder = (props: PlaceholderProps) => {
)}
>
<div class={styles.placeholderCover}>
<img src={`/${placeholderData().image}`} alt={placeholderData().header} />
<img src={`/${placeholderData()?.image}`} alt={placeholderData()?.header} />
</div>
<div class={styles.placeholderContent}>
<div>
<h3 innerHTML={t(placeholderData().header)} />
<p innerHTML={t(placeholderData().text)} />
<h3 innerHTML={t(placeholderData()?.header)} />
<p innerHTML={t(placeholderData()?.text)} />
</div>
<Show when={placeholderData().profileLinks}>
<Show when={placeholderData()?.profileLinks}>
<div class={styles.bottomLinks}>
<For each={placeholderData().profileLinks}>
<For each={placeholderData()?.profileLinks}>
{(link) => (
<a href={link.href}>
<Icon name="link-white" class={styles.icon} />
@ -133,7 +154,7 @@ export const Placeholder = (props: PlaceholderProps) => {
</a>
}
>
<a class={styles.button} href={placeholderData().href}>
<a class={styles.button} href={placeholderData()?.href}>
{t(
session()?.access_token
? placeholderData()?.buttonLabelAuthor || ''

View File

@ -133,7 +133,12 @@ export default function AuthorPage(props: RouteSectionProps<AuthorPageProps>) {
)
return (
<ErrorBoundary fallback={(_err) => <FourOuFourView />}>
<ErrorBoundary
fallback={(_err) => {
console.error('ErrorBoundary caught an error', _err)
return <FourOuFourView />
}}
>
<Suspense fallback={<Loading />}>
<PageLayout
title={title()}

View File

@ -28,7 +28,7 @@ export default {
'@': path.resolve('./public'),
'/icons': path.resolve('./public/icons'),
'/fonts': path.resolve('./public/fonts'),
'bootstrap': path.resolve('./node_modules/bootstrap')
bootstrap: path.resolve('./node_modules/bootstrap')
}
},
envPrefix: 'PUBLIC_',