Organize folder structure for generated typescript handlers

[fahadnasir40]

Hi,

Is there a way to organize the handler code generated by the Smithy model into subfolders? The default setup places all the handlers in a single "src" folder, which can become difficult to manage with multiple resources in the Smithy model.

If I manually move the files into separate folders, new handlers are automatically generated in the "src" and "test" folders on the next build.

This is the current folder structure for handlers for 2 resource APIs (Groups, ShoppingLists)

src/
  create-group.ts
  get-group.ts
  list-groups.ts
  create-shopping-list.ts
  delete-shopping-list.ts
  get-shopping-list.ts
test/
  create-group.test.ts
  get-group.test.ts
  list-groups.test.ts
  create-shopping-list.test.ts
  delete-shopping-list.test.ts
  get-shopping-list.test.ts

Desired folder structure

src/
  groups/
    create-group.ts
    get-group.ts
    list-groups.ts
  shopping-lists/
    create-shopping-list.ts
    delete-shopping-list.ts
    get-shopping-list.ts

test/
  groups/
    create-group.test.ts
    get-group.test.ts
    list-groups.test.ts
  shopping-lists/
    create-shopping-list.test.ts
    delete-shopping-list.test.ts
    get-shopping-list.test.ts

Smithy model

service WebApi {
    version: "1.0"
    resources: [
        ShoppingListResource
        GroupResource
    ]
}

Any suggestions would be helpful :)

Thanks!

[cogwirrel]

Hey Fahad!

I'm afraid the @handler trait in the Smithy model will always generate the handlers in the root of the src folder.

To achieve your custom directory setup you have to do a little bit of customisation - what I'd recommend is something like:

1. Add the @handler trait as normal when you add an operation
2. pdk build to generate the new handler and test, as well as the CDK lambda function construct
3. Remove the @handler trait from the operation
4. Move the handler/test to your desired folder
5. Copy/paste the CDK construct for the lambda from packages/api/generated/infrastructure/typescript/src/functions.ts into your infrastructure package. Make sure you update the asset path to point to your packages/api/handlers/typescript/dist/lambda directory relative to wherever you pasted the function construct.
6. Update your .projenrc.ts to pass handlerEntryPoints to your typescript handlers, eg:

new TypeSafeApiProject({
  ...
  handlers: {
    languages: [Language.TYPESCRIPT],
    options: {
      typescript: {
        handlerEntryPoints: ['src/groups/*.ts*', 'src/shopping-lists/*.ts']
      }
    }
  }
});

7. Rerun pdk && pdk build

Hopefully that'll do the trick! :)

I imagine it's fairly common to want to group handlers in subfolders especially as apis grow to larger numbers of operations - feel free to raise this as a feature request (or even better a PR 😄)! We could add eg a subdir option to the @handler trait, or perhaps we could do something like base the sub directory off what @tags the operation has...

Thanks,
Jack

[fahadnasir40]

Thanks for your response. The workaround worked for me! 😄 However, I'll submit it as a feature request so we can update the handlers without any manual work.

I think adding a subdir option to the handler trait would be a good solution. This would allow us to have nested directories. I was able to create custom folders using the subdir option by making changes to the script templates and prelude files locally. Now figuring out some additional changes that need to be made.

[cogwirrel]

Awesome, thanks for raising #860 - and thanks so much for looking into adding support too! 😄 I'll add some thoughts there too :)