chore: fix typecheck

Author: adrian-ub

docs/src/pages/og/[...slug].ts

@@ -1,8 +1,16 @@
 import { OGImageRoute } from 'astro-og-canvas'
 
+// eslint-disable-next-line ts/ban-ts-comment
+// @ts-ignore
 import { paths } from 'node_modules/astro-vitesse/src/utils/routing'
 
-const pages = Object.fromEntries(paths.map(({ params: { slug }, props: {
+const pages = Object.fromEntries(paths.map(({ params: {
+  // eslint-disable-next-line ts/ban-ts-comment
+  // @ts-ignore
+  slug,
+}, props: {
+  // eslint-disable-next-line ts/ban-ts-comment
+  // @ts-ignore
   entry,
 } }) => {
   return [!slug ? 'index' : slug, entry?.data]

src/components/ListPosts.astro

@@ -1,17 +1,17 @@
 ---
-import { CollectionEntry } from 'astro:content'
+import type { InferEntrySchema } from 'astro:content'
 import { formatDate } from '../logics'
 import { slugToLocaleData } from '../utils/slugs'
 import { ensureLeadingSlash, stripLeadingSlash } from '../utils/path'
-import { getLocaleRoutes, Route, VitessePagesEntry } from '../utils/routing'
+import { getLocaleRoutes, type Route } from '../utils/routing'
 import { generateVitessePageRouteData } from '../utils/vitesse-page'
 
 export interface Props {
   startsWith?: string
-  items?: CollectionEntry<'pages'>['data'][]
+  items?: InferEntrySchema<'pages'>[]
 }
 
-let { startsWith = 'posts/', items: pagesProps } = Astro.props
+const { startsWith = 'posts/', items: pagesProps } = Astro.props
 
 let pagesCollection: Route[] = []
 
@@ -23,29 +23,29 @@ if (!pagesProps?.length) {
   pagesCollection = routes
 }
 
-const newPagePros = [...(pagesProps || [])].map(async (page) => {
-  const { entry, slug, id, entryMeta, dir, lang, locale } = await generateVitessePageRouteData({
-    url: Astro.url,
-    props: {
-      frontmatter: page,
-      lang: localeData.locale,
-    },
-  })
-
-  return {
-    entry,
-    slug,
-    id,
-    entryMeta,
-    dir,
-    lang,
-    locale,
-  }
-})
-
-pagesProps = await Promise.all(newPagePros)
-
-const pages: Route[] = [...((pagesProps.length ? pagesProps : null) || pagesCollection)]
+const newPagePros: Route[] = await Promise.all(
+  [...(pagesProps || [])].map(async (page) => {
+    const { entry, slug, id, entryMeta, dir, lang, locale } = await generateVitessePageRouteData({
+      url: Astro.url,
+      props: {
+        frontmatter: page,
+        lang: localeData.locale,
+      },
+    })
+
+    return {
+      entry,
+      slug,
+      id,
+      entryMeta,
+      dir,
+      lang,
+      locale,
+    }
+  }),
+)
+
+const pages: Route[] = [...((newPagePros?.length ? newPagePros : null) || pagesCollection)]
   .sort((a, b) => +new Date(b.entry.data.date!) - +new Date(a.entry.data.date!))
   .map((page) => ({
     ...page,
@@ -61,51 +61,31 @@ const pages: Route[] = [...((pagesProps.length ? pagesProps : null) || pagesColl
 const getYear = (a: Date | string | number) => new Date(a).getFullYear()
 const isFuture = (a?: Date | string | number) => a && new Date(a) > new Date()
 const isSameYear = (a?: Date | string | number, b?: Date | string | number) => a && b && getYear(a) === getYear(b)
-function isSameGroup(a: VitessePagesEntry, b?: VitessePagesEntry) {
+function isSameGroup(a: InferEntrySchema<'pages'>, b?: InferEntrySchema<'pages'>) {
   return isFuture(a.date) === isFuture(b?.date) && isSameYear(a.date, b?.date)
 }
 
-function getGroupName(p: VitessePagesEntry) {
+function getGroupName(p: InferEntrySchema<'pages'>) {
   if (isFuture(p.date)) return 'Upcoming'
   return getYear(p.date!)
 }
 ---
 
 <ul>
-  {
-    !pages.length && (
-      <div py2 op50>
-        {'{ nothing here yet }'}
-      </div>
-    )
-  }
+  {!pages.length && <div class="py2 op50">{'{ nothing here yet }'}</div>}
 
   {
     pages.map(({ entry: { data }, isFallback, entryMeta }, idx) => (
       <>
         {!isSameGroup(data, pages[idx - 1]?.entry.data) && (
           <div
-            select-none
-            relative
-            h20
-            pointer-events-none
-            slide-enter
+            class="select-none relative h20 pointer-events-none slide-enter"
             style={{
               '--enter-stage': idx - 2,
               '--enter-step': '60ms',
             }}
           >
-            <span
-              text-8em
-              color-transparent
-              absolute
-              left--3rem
-              top--2rem
-              font-bold
-              text-stroke-2
-              text-stroke-hex-aaa
-              op10
-            >
+            <span class="text-8em color-transparent absolute left--3rem top--2rem font-bold text-stroke-2 text-stroke-hex-aaa op10">
               {getGroupName(data)}
             </span>
           </div>
@@ -121,12 +101,12 @@ function getGroupName(p: VitessePagesEntry) {
             href={data.path}
             class="item block font-normal mb-6 mt-2 no-underline"
             {...{
-              target: data.path.startsWith('http') ? '_blank' : undefined,
-              rel: data.path.startsWith('http') ? 'noopener noreferrer' : undefined,
+              target: data.path?.startsWith('http') ? '_blank' : undefined,
+              rel: data.path?.startsWith('http') ? 'noopener noreferrer' : undefined,
             }}
           >
-            <li class="no-underline" flex="~ col md:row gap-2 md:items-center">
-              <div class="title text-lg leading-1.2em" flex="~ gap-2 wrap">
+            <li class="no-underline flex:(~ col md:row gap-2 md:items-center)">
+              <div class="title text-lg leading-1.2em flex:(~ gap-2 wrap)">
                 {isFallback && (
                   <span
                     align-middle
@@ -140,37 +120,20 @@ function getGroupName(p: VitessePagesEntry) {
                 <span align-middle>{data.title}</span>
 
                 {data.redirect && (
-                  <span align-middle op50 flex-none text-xs ml--1.5 i-carbon-arrow-up-right title="External" />
+                  <span class="align-middle op50 flex-none text-xs ml--1.5 i-carbon-arrow-up-right" title="External" />
                 )}
               </div>
 
-              <div flex="~ gap-2 items-center">
-                {data.inperson && <span align-middle op50 flex-none i-ri:group-2-line title="In person" />}
+              <div class="flex:(~ gap-2 items-center)">
+                {data.inperson && <span class="align-middle op50 flex-none i-ri:group-2-line" title="In person" />}
                 {(data.recording || data.video) && (
-                  <span align-middle op50 flex-none i-ri:film-line title="Provided in video" />
-                )}
-                {data.radio && <span align-middle op50 flex-none i-ri:radio-line title="Provided in radio" />}
-                <span text-sm op50 ws-nowrap>
-                  {formatDate(data.date!, true)}
-                </span>
-                {data.duration && (
-                  <span text-sm op40 ws-nowrap>
-                    {' '}
-                    · {data.duration}
-                  </span>
-                )}
-                {data.platform && (
-                  <span text-sm op40 ws-nowrap>
-                    {' '}
-                    · {data.platform}
-                  </span>
-                )}
-                {data.place && (
-                  <span text-sm op40 ws-nowrap md:hidden>
-                    {' '}
-                    · {data.place}
-                  </span>
+                  <span class="align-middle op50 flex-none i-ri:film-line" title="Provided in video" />
                 )}
+                {data.radio && <span class="align-middle op50 flex-none i-ri:radio-line" title="Provided in radio" />}
+                <span class="text-sm op50 ws-nowrap">{formatDate(data.date!, true)}</span>
+                {data.duration && <span class="text-sm op40 ws-nowrap"> · {data.duration}</span>}
+                {data.platform && <span class="text-sm op40 ws-nowrap"> · {data.platform}</span>}
+                {data.place && <span class="text-sm op40 ws-nowrap md:hidden"> · {data.place}</span>}
 
                 {isFallback && (
                   <span
@@ -183,11 +146,7 @@ function getGroupName(p: VitessePagesEntry) {
                 )}
               </div>
             </li>
-            {data.place && (
-              <div op50 text-sm hidden mt--2 md:block>
-                {data.place}
-              </div>
-            )}
+            {data.place && <div class="op50 text-sm hidden mt--2 md:block">{data.place}</div>}
           </a>
         </div>
       </>

src/components/ListProjects.astro

@@ -24,31 +24,15 @@ const { projects } = Astro.props
       <div slide-enter style={{ '--enter-stage': cidx + 1 }}>
         <div
           id={slug(key)}
-          select-none
-          relative
-          h20
-          pointer-events-none
-          slide-enter
+          class="select-none relative h20 pointer-events-none slide-enter"
           style={{ '--enter-stage': cidx - 2, '--enter-step': '60ms' }}
         >
-          <span
-            text-5em
-            color-transparent
-            absolute
-            left--1rem
-            top-0rem
-            font-bold
-            leading-1em
-            text-stroke-1.5
-            text-stroke-hex-aaa
-            op35
-            dark:op20
-          >
+          <span class="text-5em color-transparent absolute left--1rem top-0rem font-bold leading-1em text-stroke-1.5 text-stroke-hex-aaa op35 dark:op20">
             {key}
           </span>
         </div>
 
-        <div class="project-grid mx-auto max-w-500 w-max py-2" grid="~ cols-1 md:cols-2 gap-4 lg:cols-3">
+        <div class="project-grid mx-auto max-w-500 w-max py-2 grid:(~ cols-1 md:cols-2 gap-4 lg:cols-3)">
           {projects[key].map((item) => (
             <a href={item.link} target="_blank" class="item relative flex items-center" title={item.name}>
               <div class="pr-5 pt-2">

src/components/Page.astro

@@ -19,6 +19,8 @@ import 'virtual:vitesse/user-css'
 ---
 
 <script is:inline>
+  // eslint-disable-next-line ts/ban-ts-comment
+  // @ts-nocheck
   // eslint-disable-next-line ts/explicit-function-return-type
   function setDarkMode(document) {
     const prefersDark = window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches

src/components/SubNav.astro

@@ -10,7 +10,7 @@ const subNavBar = getSubNavbarFromConfig(config.subNavBar, url.pathname, localeD
 ---
 
 <div class="prose m-auto mb-8 select-none animate-none! op100!">
-  <div mb-0 flex="~ col gap-1 sm:row sm:gap-3 wrap" text-3xl>
+  <div class="mb-0 flex:(~ col gap-1 sm:row sm:gap-3 wrap) text-3xl">
     {
       subNavBar.map((subNavLink) => (
         <a

src/components/Toc.astro

@@ -1,5 +1,5 @@
 ---
-import { TocHeading } from '../utils/toc'
+import type { TocHeading } from '../utils/toc'
 import TocItem from './TocItem.astro'
 
 export interface Props {

src/components/TocItem.astro

@@ -1,5 +1,5 @@
 ---
-import { TocHeading } from '../utils/toc'
+import type { TocHeading } from '../utils/toc'
 
 export type Props = TocHeading
 

src/routes/static/404.astro

@@ -27,6 +27,12 @@ const fallbackEntry: VitessePagesEntry = {
     head: [],
     subtitle: t('404.text'),
     draft: false,
+    layoutFullWidth: false,
+    tocAlwaysOn: false,
+    inperson: false,
+    recording: false,
+    radio: false,
+    video: false,
   },
   render: async () => ({
     Content: EmptyContent,

src/utils/route-data.ts

@@ -6,7 +6,7 @@ import { getNavBar, type NavBarEntry } from './navigation'
 import { generateToc, type TocHeading } from './toc'
 
 export interface PageProps extends Route {
-
+  headings: TocHeading[]
 }
 
 export interface VitesseRouteData extends Route {

src/utils/routing.ts

@@ -53,7 +53,7 @@ const pages: VitessePagesEntry[] = (
     // In production, filter out drafts.
     return import.meta.env.MODE !== 'production' || data.draft === false
   })) ?? []
-).map(({ slug, ...entry }: { slug: string, [key: string]: any }) => ({
+).map(({ slug, ...entry }) => ({
   ...entry,
   slug: normalizeIndexSlug(slug),
 }))

src/utils/vitesse-page.ts

@@ -23,11 +23,12 @@ import { slugToLocaleData, urlToSlug } from './slugs'
  * The frontmatter schema for Vitesse pages cannot include some properties which will be omitted
  * and some others needs to be refined to a stricter type.
  */
-async function VitessePageFrontmatterSchema(context: SchemaContext): Promise<z.ZodEffects<z.ZodObject<any>>> {
+// eslint-disable-next-line ts/explicit-function-return-type
+async function VitessePageFrontmatterSchema(context: SchemaContext) {
   const userPagesSchema = await getUserPagesSchema()
   const schema = typeof userPagesSchema === 'function' ? userPagesSchema(context) : userPagesSchema
 
-  return schema.transform((frontmatter: any) => {
+  return schema.transform((frontmatter) => {
     /**
      * Vitesse pages can only be edited if an edit URL is explicitly provided.
      * The `navBar` frontmatter prop only works for pages in an autogenerated links group.
@@ -46,8 +47,7 @@ async function VitessePageFrontmatterSchema(context: SchemaContext): Promise<z.Z
      * @see VitessePageFrontmatter
      * @see https://github.com/colinhacks/zod#intersections
      */
-    const { ...others } = frontmatter
-    return { ...others }
+    return frontmatter
   })
 }
 
@@ -75,9 +75,10 @@ function validateNavBarProp(navBarProp: VitesseUserConfig['navBar']): VitesseCon
 export type VitessePageProps = Prettify<
   // Remove the index signature from `Route`, omit undesired properties and make the rest optional.
   Partial<Omit<RemoveIndexSignature<PageProps>, 'entry' | 'entryMeta' | 'id' | 'locale' | 'slug'>> &
-  {
+  // Add the sidebar definitions for a Starlight page.
+  Partial<Pick<VitesseRouteData, 'hasToc'>> & {
     navBar?: VitesseUserConfig['navBar']
-    // And finally add the Vitesse page frontmatter properties in a `frontmatter` property.
+    // And finally add the Starlight page frontmatter properties in a `frontmatter` property.
     frontmatter: VitessePageFrontmatter
   }
 >
@@ -119,9 +120,6 @@ export async function generateVitessePageRouteData({
     collection: 'pages',
     data: {
       ...pageFrontmatter,
-      navBar: {
-        attrs: {},
-      },
     },
   }
   const entry = pagePagesEntry as unknown as VitessePagesEntry
@@ -140,6 +138,8 @@ export async function generateVitessePageRouteData({
     siteTitle: getSiteTitle(localeData.lang),
     siteTitleHref: getSiteTitleHref(localeData.locale),
     slug,
+    headins: props.headings ?? [],
+    hasToc: props.hasToc ?? false,
   }
   if (isFallback) {
     routeData.isFallback = true
@@ -148,7 +148,8 @@ export async function generateVitessePageRouteData({
 }
 
 /** Validates the Vitesse page frontmatter properties from the props received by a Vitesse page. */
-async function getVitessePageFrontmatter(frontmatter: VitessePageFrontmatter): Promise<z.infer<typeof schema>> {
+// eslint-disable-next-line ts/explicit-function-return-type
+async function getVitessePageFrontmatter(frontmatter: VitessePageFrontmatter) {
   // This needs to be in sync with ImageMetadata.
   // https://github.com/withastro/astro/blob/cf993bc263b58502096f00d383266cd179f331af/packages/astro/src/assets/types.ts#L32
   const schema = await VitessePageFrontmatterSchema({