erquhart•15mo ago

Support `index` in function folders

I know this is probably tricky to do, but I'm betting a lot of folks are going to land on a file structure something like:

/convex
  /feature
    /index.ts
    /util.ts
    /some-other-stuff.ts
  /another-feature
    /index.ts
    ...

/convex
  /feature
    /index.ts
    /util.ts
    /some-other-stuff.ts
  /another-feature
    /index.ts
    ...

Where the api for a feature basically lives in the index file and the other files are supporting. It would be cool to be able to use this kind of structure and be able to do api.feature.getFoo instead of api.feature.index.getFoo. Any chance there's a workaround?

5 Replies

ian•15mo ago

One thing I found out at some point is you can pass around references. e.g. you could do

const feature = api.feature.index;
...
useQuery(feature.getFoo)
...
someInnerFunction(feature, ...)

const feature = api.feature.index;
...
useQuery(feature.getFoo)
...
someInnerFunction(feature, ...)

So you could have a helper file somewhere exporting the shorter names

export const feature = api.feature.index;
export const another_feature = api.another_feature.index;
...

export const feature = api.feature.index;
export const another_feature = api.another_feature.index;
...

ballingt•15mo ago

You can also build your own API object manually:

import { api } from "../convex/_generated/api";

const myApi = {
  ...api.messages,
  listAgain: api.messages.list,
  nestedStuff: {
    foo: api.messages.list,
    bar: api.messages
  },
  m: api.messages,
}

const a = myApi.list;
const b = myApi.nestedStuff.bar
const c = myApi.listAgain
const d = myApi.m.list

import { api } from "../convex/_generated/api";

const myApi = {
  ...api.messages,
  listAgain: api.messages.list,
  nestedStuff: {
    foo: api.messages.list,
    bar: api.messages
  },
  m: api.messages,
}

const a = myApi.list;
const b = myApi.nestedStuff.bar
const c = myApi.listAgain
const d = myApi.m.list

erquhartOP•15mo ago

Ah, this works great, thank you both! Just realizing this sacrifices the dynamic generation part. Probably something that can be worked around with Typescript. Typescript handles import/export inference way better than I expected, especially surprised that it has no issues with spreading imports into an export. So dynamic still works fine 👍 Landed on:

/convex
  /feature.ts
  /feature
    /index.ts
    /whatever.ts

/convex
  /feature.ts
  /feature
    /index.ts
    /whatever.ts

// feature.ts
export * from './feature/index.ts'

// feature.ts
export * from './feature/index.ts'

Curious whether this hurts anything? I'm assuming whatever bundling convex does would handle dedupe, but not certain.

ian•15mo ago

It’ll probably have two versions of it mounted, but shouldn’t increase the bundle size. You’ll see it twice when fuzzy searching on the dashboard function runner but nothing glaring sticks out You won’t be able to export node actions and v8 actions in the same spot

erquhartOP•15mo ago

hmm okay I'll see if that last one bites me

Support `index` in function folders

Did you find this page helpful?