Update generated Typescript schema for Directus SDK v11

[stuikomma]

The latest release of the directus SDK version 11 requires the collections to be of array types. See the example code taken from https://docs.directus.io/guides/sdk/getting-started.html#creating-a-composable-client

import { createDirectus } from '@directus/sdk';
import { rest } from '@directus/sdk/rest';
import { graphql } from '@directus/sdk/graphql';

interface Article {
	id: number;
	title: string;
	content: string;
}

interface Schema {
	articles: Article[]; // <-- Note the array
}

// The extension currently generates types like this
// interface Schema {
//	articles: Article; // <-- Not an array
//}

// Client with REST support
const client = createDirectus<Schema>('http://directus.example.com').with(rest());

// Client with GraphQL support
const client = createDirectus<Schema>('http://directus.example.com').with(graphql());

If the array is missing, you will get type errors when making a call like this:

client.request(readItems('articles'));

I propose adding a checkbox [ ] Generate types for SDK v11.

Thanks for making this extension!

[stuikomma]

I found another issue: Optional fields should be be typed optionalField: ValueType | null instead of optionalField?: ValueType.

When using the current version, optional fields become required and vice-versa.

[maltejur]

Are you talking about the export type CustomDirectusTypes being generated? If that is required, adding a checkbox (probably enabled by default) sounds like a sensible change.

I found another issue: Optional fields should be be typed optionalField: ValueType | null instead of optionalField?: ValueType.

I would argue that is pretty much up to personal preference. Or are there any objective reasons it should be done this way and not with the ?? Of couse we can also add a checkbox to configure this behavior.

[stuikomma]

Are you talking about the export type CustomDirectusTypes being generated? If that is required, adding a checkbox (probably enabled by default) sounds like a sensible change.

Yes, that's what I meant.

I would argue that is pretty much up to personal preference. Or are there any objective reasons it should be done this way and not with the ?? Of couse we can also add a checkbox to configure this behavior.

The types in the new directus SDK do not resolve properly with ?. They can be resolved by using | null instead of ?. Here is an example use case I have in my projects:

import { createDirectus, readItems, rest } from '@directus/sdk';

interface Article {
    id: number;
    title: string;
    content: string;
    author: Author | null; // <-- this works
    // author?: Author; // <-- this doesn't work
}

interface Author {
    first_name: string;
}

interface Schema {
    articles: Article[]; // <-- Note the array
    authors: Author[];
}

// Client with REST support
const client = createDirectus<Schema>('http://directus.example.com').with(
    rest(),
);

function fetchArticles() {
    return client.request(
        readItems('articles', {
            fields: ['id', 'title', { author: ['first_name'] }],
        }),
    );
}

const mockArticles = [
    { id: 1, title: 'Mock Title', author: null },
    //                              ^ errors if you choose `?`
    // { id: 2, title: 'Some Title', author: undefined },
    //                                ^ this errors in both cases, so this is not a workaround
    {
        id: 3,
        title: 'Another Title',
        author: {
            first_name: 'Edgar',
        },
    },
] satisfies Awaited<ReturnType<typeof fetchArticles>>;

[maxbec]

Is there any progress regarding the array types implementation?

[maltejur]

Implemented in 84afcd2

Can anybody try it out and check if I changed the right thing? I currently don't actively use Directus anymore, so it isn't that easy for me.

index.js

[JeremieLeblanc]

Implemented in 84afcd2

Can anybody try it out and check if I changed the right thing? I currently don't actively use Directus anymore, so it isn't that easy for me.

index.js

I have tested it quickly and it does seem to work except for the fields that add "any[]"

An example of this is translations fields like the following:

export type Articles = {
  date_created?: string | null;
  date_updated?: string | null;
  id: string;
  status: string;
  translations: any[] | ArticlesTranslations[];
  user_created?: string | DirectusUsers | null;
  user_updated?: string | DirectusUsers | null;
};

This seems to break the deep filtering.

As soon as I removed all of the "any" in the types, the errors went away.

[JeremieLeblanc]

One more thing.

Singletons should not me marked as arrays in the CustomDirectusTypes.

[maltejur]

Singletons should not me marked as arrays in the CustomDirectusTypes.

Ah yes, fixed.

I have tested it quickly and it does seem to work except for the fields that add "any[]"

Is that related to the original issue or something else? I originally wrote it like that because, depending on the query, the API either returned a list of primary keys (of which we do not know the type), or complete objects of the type we know.

[marquetd]

Sorry another thing, don't forget to update the example when " Generate Types for Directus SDK >= v11" is checked :

[maltejur]

@marquetd what exactly needs to change there?

[marquetd]

When the checkbox is checked :

unchecked :

[maltejur]

Thanks, I've updated the example code in 95c53f6

[maltejur]

https://github.com/maltejur/directus-extension-generate-types/releases/tag/0.5.0

[D3VL-Jack]

@maltejur

Ah yes, fixed.

In 0.5.0, Singletons are still returning as arrays.

export type CustomDirectusTypes = {
    // ...
    global_variables: GlobalVariables[];
    // ...
};