feat(client): improve client data types (#1626)

Author: Mister-Hope

packages/client/src/composables/clientData.ts

@@ -12,8 +12,11 @@ export const clientDataSymbol: InjectionKey<ClientData> = Symbol(
 /**
  * Returns client data
  */
-export const useClientData = (): ClientData => {
-  const clientData = inject(clientDataSymbol)
+export const useClientData = <
+  Frontmatter extends Record<string, unknown> = Record<string, unknown>,
+  Data extends Record<string, unknown> = Record<string, unknown>,
+>(): ClientData<Frontmatter, Data> => {
+  const clientData = inject<ClientData<Frontmatter, Data>>(clientDataSymbol)
   if (!clientData) {
     throw new Error('useClientData() is called without provider.')
   }

packages/client/src/composables/clientDataUtils.ts

@@ -22,12 +22,11 @@ export const usePageComponent = (): PageComponentRef =>
 
 export const usePageData = <
   T extends Record<string, unknown> = Record<string, unknown>,
->(): PageDataRef<T> => useClientData().pageData as PageDataRef<T>
+>(): PageDataRef<T> => useClientData<Record<string, unknown>, T>().pageData
 
 export const usePageFrontmatter = <
   T extends Record<string, unknown> = Record<string, unknown>,
->(): PageFrontmatterRef<T> =>
-  useClientData().pageFrontmatter as PageFrontmatterRef<T>
+>(): PageFrontmatterRef<T> => useClientData<T>().pageFrontmatter
 
 export const usePageHead = (): PageHeadRef => useClientData().pageHead
 

packages/client/src/types/clientData.ts

@@ -54,11 +54,14 @@ export type RoutesRef = Ref<Routes>
 export type SiteDataRef = Ref<SiteData>
 export type SiteLocaleDataRef = ComputedRef<SiteLocaleData>
 
-export interface ClientData {
+export interface ClientData<
+  Frontmatter extends Record<string, unknown> = Record<string, unknown>,
+  Data extends Record<string, unknown> = Record<string, unknown>,
+> {
   layouts: LayoutsRef
   pageComponent: PageComponentRef
-  pageData: PageDataRef
-  pageFrontmatter: PageFrontmatterRef
+  pageData: PageDataRef<Data>
+  pageFrontmatter: PageFrontmatterRef<Frontmatter>
   pageHead: PageHeadRef
   pageHeadTitle: PageHeadTitleRef
   pageLang: PageLangRef