feat: adding some suspense and GROQ goodness 💖

[stipsan]

Big fan of you and your work @SimeonGriggs, after using this plugin in a new starter I found an opportunity to share back a smol PR 😌

• It uses Suspense for data fetching, so you get 1 spinner for the form pane, instead of a waterfall of spinners when using async language resolving.
• The languages: async () => Promise<Language[]> is updated to languages: async (client: SanityClient) => Promise<Language[]> so you can store the languages list in your dataset.
• Exports a clear function that clears the suspense cache, super handy to run on unmount in an input component when you have the languages in the dataset.
• Exports all typings, and added some rich comments so you get code snippets in your IDE.
• It starts a preload if you resolve languages async, 99% of the time it is done resolving before the form editor have finished loading its stores.

[SimeonGriggs]

Absolutely amazing work 🤩

One small thing before we make it official, I'm wondering if we could/should pass more props to the languages function.

For example, I might want to load specific languages based on a value in the document, or the role of the current user. Is there a larger context object we could pass in that also includes the client?

[stipsan]

One small thing before we make it official, I'm wondering if we could/should pass more props to the languages function.

For example, I might want to load specific languages based on a value in the document, or the role of the current user. Is there a larger context object we could pass in that also includes the client?

We could follow the precedent of productionUrl (its context argument, not the prev bit and not the reducer flow): https://github.com/sanity-io/sanity/blob/c1676f69750c804694265c168204b99065eb4032/packages/sanity/src/core/config/configPropertyReducers.ts#L39-L49

The context here does indeed contain the current document and the current user, it also uses the getClient pattern seen elsewhere in the Studio, instead of providing the client instance eagerly:

/** @public */
export interface ConfigContext {
  projectId: string
  dataset: string
  schema: Schema
  currentUser: CurrentUser | null
  getClient: (options: SourceClientOptions) => SanityClient
}

export interface ResolveProductionUrlContext extends ConfigContext {
  document: SanityDocumentLike
}

I think the reason why it uses getClient is because of the apiVersion requirenment 🤔

[SimeonGriggs]

I like that. I'm very keen to have access to the same contextual options wherever possible.

[SimeonGriggs]

Going to merge as-is, there's probably other ways around what I'm describing.

[github-actions[bot]]

:tada: This PR is included in version 1.5.0 :tada:

The release is available on:

• npm package (@latest dist-tag)
• GitHub release

Your semantic-release bot :package::rocket: