storyblok / storyblok-nuxt

Storyblok Nuxt module
https://www.storyblok.com/tp/nuxt-js-multilanguage-website-tutorial
261 stars 40 forks source link

Improved TypeScript definitions #543

Open Skwai opened 10 months ago

Skwai commented 10 months ago

Description

As a developer I'd like to have better TypeScript definitions for the SDK. Currently a lot of things are just typed to any.

Eg.

export declare const useAsyncStoryblok: (url: string, apiOptions?: ISbStoriesParams, bridgeOptions?: StoryblokBridgeConfigV2) => Promise<any>;

That just returns a Promise<any> rather than an indication of the type of data it returns. At the very least making it a generic would allow us to manually define the Story schema we're expecting.

Suggested solution or improvement

Better TypeScript definitions. I can see from this project that there are underlying definitions used in the project but they're not exposed:

https://github.com/storyblok/storyblok-js-client/blob/main/src/interfaces.ts

Additional context

No response

Validations

fgalarraga commented 9 months ago

Has there been any updates on this? Trying to get Storyblok, nextjs 13 with app router to work. Seeing this error during build:

Code page.tsx:

import {
  getStoryblokApi, ISbStoriesParams
} from "@storyblok/react/rsc";
import StoryblokStory from "@storyblok/react/story";

export default async function Home() {
  const { data } = await fetchData();

  return (
    <div>
      <StoryblokStory story={data.story} />
    </div>
  )
}

export async function fetchData() {
  let sbParams: ISbStoriesParams = { version: "draft" };

  const storyblokApi = getStoryblokApi();
  return storyblokApi.get(`cdn/stories/home`, sbParams);
}

Here is the build error:

npm run build

> testsite@0.1.0 build
> next build

 ✓ Creating an optimized production build
 ✓ Compiled successfully
   Linting and checking validity of types  .Failed to compile.

.next/types/app/page.ts:8:13
Type error: Type 'OmitWithTag<typeof import("D:/Repos/testsite/src/app/page"), "metadata" | "default" | "config" | "generateStaticParams" | "revalidate" | "dynamic" | "dynamicParams" | "fetchCache" | "preferredRegion" | "runtime" | "maxDuration" | "generateMetadata", "">' does not satisfy the constraint '{ [x: string]: never; }'.
  Property 'fetchData' is incompatible with index signature.
    Type '() => Promise<ISbResult>' is not assignable to type 'never'.

   6 |
   7 | // Check that the entry is a valid entry
>  8 | checkFields<Diff<{
     |             ^
   9 |   default: Function
  10 |   config?: {}
  11 |   generateStaticParams?: Function
   Linting and checking validity of types  ..
gbyesiltas commented 2 months ago

This package was incredibly useful for us for typing. I'm surprised it's not mentioned anywhere in the readme (it would be even more great if the module implemented this based on some options actually).

gbyesiltas commented 1 month ago

I just opened a PR that should improve typing for the useAsyncStoryblok composable