Progressive loading (#79)

* Suspense boundary and progressive loading on blocks

* Start refactoring to better leverage app router

* Use skeleton for page layout

* Improve dynamic toc

* Switch page full width to be client side only

* Format

* Remove old PageLoading

* Fix first page not marked as active

* Close search when clicking search link

src/components/Search/SearchModal.tsx

@@ -195,6 +195,7 @@ function SearchModalBody(
                             query: state.query,
                         });
                     }}
+                    onClose={onClose}
                 />
             ) : null}
             {state.query && state.ask && withAsk ? (

src/components/Search/SearchPageResultItem.tsx

@@ -11,15 +11,17 @@ export const SearchPageResultItem = React.forwardRef(function SearchPageResultIt
         query: string;
         item: ComputedPageResult;
         active: boolean;
+        onClick: () => void;
     },
     ref: React.Ref<HTMLAnchorElement>,
 ) {
-    const { query, item, active } = props;
+    const { query, item, active, onClick } = props;
 
     return (
         <Link
             ref={ref}
             href={item.href}
+            onClick={onClick}
             className={tcls(
                 'flex',
                 'flex-row',

src/components/Search/SearchResults.tsx

@@ -33,10 +33,11 @@ export const SearchResults = React.forwardRef(function SearchResults(
         spaceId: string;
         withAsk: boolean;
         onSwitchToAsk: () => void;
+        onClose: () => void;
     },
     ref: React.Ref<SearchResultsRef>,
 ) {
-    const { query, spaceId, withAsk, onSwitchToAsk } = props;
+    const { query, spaceId, withAsk, onSwitchToAsk, onClose } = props;
 
     const language = useLanguage();
     const debounceTimeout = React.useRef<NodeJS.Timeout | null>(null);
@@ -188,6 +189,7 @@ export const SearchResults = React.forwardRef(function SearchResults(
                                         query={query}
                                         item={item}
                                         active={index === cursor}
+                                        onClick={onClose}
                                     />
                                 );
                             }
@@ -228,6 +230,7 @@ export const SearchResults = React.forwardRef(function SearchResults(
                                         query={query}
                                         item={item}
                                         active={index === cursor}
+                                        onClick={onClose}
                                     />
                                 );
                             }

src/components/Search/SearchSectionResultItem.tsx

@@ -7,15 +7,16 @@ import { HighlightQuery } from './HighlightQuery';
 import type { ComputedSectionResult } from './server-actions';
 
 export const SearchSectionResultItem = React.forwardRef(function SearchSectionResultItem(
-    props: { query: string; item: ComputedSectionResult; active: boolean },
+    props: { query: string; item: ComputedSectionResult; active: boolean; onClick: () => void },
     ref: React.Ref<HTMLAnchorElement>,
 ) {
-    const { query, item, active } = props;
+    const { query, item, active, onClick } = props;
 
     return (
         <Link
             ref={ref}
             href={item.href}
+            onClick={onClick}
             className={tcls(
                 'search-section-result-item',
                 'flex',