debug: add logs in dev variant of slug/tab

src/routes/[slug]/[...tab].tsx

@@ -16,16 +16,21 @@ import AuthorPage, { AuthorPageProps } from '../author/[slug]/[...tab]'
 import TopicPage, { TopicPageProps } from '../topic/[slug]/[...tab]'
 
 const fetchShout = async (slug: string): Promise<Shout | undefined> => {
+  console.debug('fetchShout called with slug:', slug)
   if (slug.startsWith('@')) return
   const shoutLoader = getShout({ slug })
   const result = await shoutLoader()
+  console.debug('fetchShout result:', result)
   return result
 }
 
 export const route: RouteDefinition = {
-  load: async ({ params }) => ({
+  load: async ({ params }) => {
-    article: await fetchShout(params.slug)
+    console.debug('route.load called with params:', params)
-  })
+    const article = await fetchShout(params.slug)
+    console.debug('route.load fetched article:', article)
+    return { article }
+  }
 }
 
 export type ArticlePageProps = {
@@ -71,11 +76,18 @@ export default function ArticlePage(props: RouteSectionProps<SlugPageProps>) {
   function ArticlePage(props: RouteSectionProps<ArticlePageProps>) {
     const loc = useLocation()
     const { t } = useLocalize()
-    const data = createAsync(async () => props.data?.article || (await fetchShout(props.params.slug)))
+    const data = createAsync(async () => {
+      console.debug('createAsync fetching data with slug:', props.params.slug)
+      const result = props.data?.article || (await fetchShout(props.params.slug))
+      console.debug('createAsync fetched result:', result)
+      return result
+    })
 
     onMount(async () => {
+      console.debug('onMount triggered')
       if (gaIdentity && data()?.id) {
         try {
+          console.debug('Loading GA script')
           await loadGAScript(gaIdentity)
           initGA(gaIdentity)
         } catch (error) {
@@ -88,6 +100,7 @@ export default function ArticlePage(props: RouteSectionProps<SlugPageProps>) {
       on(
         data,
         (a?: Shout) => {
+          console.debug('createEffect triggered with data:', a)
           if (!a?.id) return
           window?.gtag?.('event', 'page_view', {
             page_title: a.title,
@@ -100,17 +113,22 @@ export default function ArticlePage(props: RouteSectionProps<SlugPageProps>) {
     )
 
     return (
-      <ErrorBoundary fallback={() => <HttpStatusCode code={500} />}>
+      <ErrorBoundary fallback={() => {
+        console.error('Rendering 500 error page')
+        return <HttpStatusCode code={500} />
+      }}>
         <Suspense fallback={<Loading />}>
           <Show
             when={data()?.id}
             fallback={
               <PageLayout isHeaderFixed={false} hideFooter={true} title={t('Nothing is here')}>
+                {console.warn('Rendering 404 error page - no article data found')}
                 <FourOuFourView />
                 <HttpStatusCode code={404} />
               </PageLayout>
             }
           >
+            {console.debug('Rendering article page with data:', data())}
             <PageLayout
               title={`${t('Discours')}${data()?.title ? ' :: ' : ''}${data()?.title || ''}`}
               desc={descFromBody(data()?.body || '')}
@@ -129,3 +147,4 @@ export default function ArticlePage(props: RouteSectionProps<SlugPageProps>) {
     )
   }
   return <ArticlePage {...props} />
+}