hono-agents agentsMiddleware TS error

[Sillyvan]

Hi there

i am using the hono-agents middleware and in my case i need access to the ctx inside the middleware so i did the following

const app = new Hono<{ Bindings: Env; Variables: { user: User | null; session: Session | null } }>();

app.use(
  '*',
  async (c, next) =>
    await agentsMiddleware({
      options: {
        onBeforeConnect: () => {
          if (!c.get('user')) return new Response('Unauthorized', { status: 401 });
        },
      },
      onError: (error) => {
        console.error(error);
      },
    })(c, next)
);

which works fine of course but it spits following typescript error now:

Argument of type 'Context<{ Bindings: Env; Variables: { user: { id: string; name: string; email: string; emailVerified: boolean; createdAt: Date; updatedAt: Date; image?: string | null | undefined; } | null; session: { ...; } | null; }; }, "*", {}>' is not assignable to parameter of type 'Context<Env, string, {}>'.
  Types of property 'set' are incompatible.
    Type 'Set<{ Bindings: Env; Variables: { user: { id: string; name: string; email: string; emailVerified: boolean; createdAt: Date; updatedAt: Date; image?: string | null | undefined; } | null; session: { ...; } | null; }; }>' is not assignable to type 'Set<Env>'.
      Type 'Env' is not assignable to type '{ Bindings: Env; Variables: { user: { id: string; name: string; email: string; emailVerified: boolean; createdAt: Date; updatedAt: Date; image?: string | null | undefined; } | null; session: { ...; } | null; }; }'.
        Types of property 'Bindings' are incompatible.
          Type 'object | undefined' is not assignable to type 'Env'.
            Type 'undefined' is not assignable to type 'Env'.ts(2345)

The following code makes the type error go away:

app.use(
  '*',
  createMiddleware(
    async (c, next) =>
      await agentsMiddleware({
        options: {
          onBeforeConnect: () => {
            if (!c.get('user')) return new Response('Unauthorized', { status: 401 });
          },
        },
        onError: (error) => {
          console.error(error);
        },
      })(c, next)
  )
);

Not sure if the types are fixable or if it should just be mentioned in the docs. either way would make sense i think

[brettimus]

ahhh the joys of the Hono type system! magic most of the time until stuff like this happens.

i think this issue might be related to the change here: https://github.com/cloudflare/agents/pull/109/files

could you try passing your App's env as a type parameter to agentsMiddleware to see if that resolves the issue?

type AppEnv = { Bindings: Env; Variables: { user: User | null; session: Session | null } }

const app = new Hono<AppEnv>();

app.use(
  '*',
  async (c, next) =>
    await agentsMiddleware<AppEnv>({
      options: {
        onBeforeConnect: () => {
          if (!c.get('user')) return new Response('Unauthorized', { status: 401 });
        },
      },
      onError: (error) => {
        console.error(error);
      },
    })(c, next)
);

also a nit: since Hono has a concept of a type called Env which is { Bindings, Variables }, it might be best to define your env var type as Bindings instead Env as it is in your snippet

[Sillyvan]

@brettimus Sadly dosent solve it. same error

And fair nit pick but im just using Env which is auto generated by wrangler using wrangler types
So not sure how to deal with those 2 colliding type names

[threepointone]

oh hmm I've been meaning to test how wrangler types works with the auto generated stuff
I'll have a look later this week

[brettimus]

@brettimus Sadly dosent solve it. same error

And fair nit pick but im just using Env which is auto generated by wrangler using wrangler types So not sure how to deal with those 2 colliding type names

right! totally forgot about that