using the typescript definitions in an app

[dcsan]

Description

Typescript typings for incoming events could be extremely helpful in developing an app, however the current typings seem a bit confusing to use.
Are there any examples that show how to use the slack typings on these basic events inside our own apps?

Then I would be able to get intellisense on all the fields that are getting passed in the request.

eg I was trying to add types on the incoming message event, I created my own ISlackEvent interface and was going to gradually type it.

    app.message(/.*/, async (slackEvent: ISlackEvent) => {

No overload matches this call.
  Overload 1 of 2, '(actionId: string | RegExp, ...listeners: Middleware<SlackActionMiddlewareArgs<SlackAction>>[]): void', gave the following error.
    Argument of type '(slackEvent: ISlackEvent) => Promise<void>' is not assignable to parameter of type 
'Middleware<SlackActionMiddlewareArgs<SlackAction>>'.
      Types of parameters 'slackEvent' and 'args' are incompatible.
        Type 'SlackActionMiddlewareArgs<SlackAction> & AllMiddlewareArgs' is missing the following 
properties from type 'ISlackEvent': message, store, sessionId
  Overload 2 of 2, '(constraints: ActionConstraints<SlackAction>, ...listeners: Middleware<SlackActionMiddlewareArgs<SlackAction>>[]): void', gave the following error.
    Type 'RegExp' has no properties in common with type 'ActionConstraints<SlackAction>'.

Which is fair enough since ISlackEvent was my naive type I was going to start adding fields to.
So then researching what there might be...

The message event signature:

    message(...listeners: Middleware<SlackEventMiddlewareArgs<'message'>>[]): void;

Then digging into those Middleware, I can't really see a simple description of the incoming payload.

export interface SlackEventMiddlewareArgs<EventType extends string = string> {
    payload: EventFromType<EventType>;

...

declare type EventFromType<T extends string> = KnownEventFromType<T> extends never ? BasicSlackEvent<T> : KnownEventFromType<T>;

eventually I get to this humdinger:

export declare type SlackEvent = AppRequestedEvent | AppHomeOpenedEvent | AppMentionEvent | AppUninstalledEvent | ChannelArchiveEvent | ChannelCreatedEvent | ChannelDeletedEvent | ChannelHistoryChangedEvent | ChannelLeftEvent | ChannelRenameEvent | ChannelSharedEvent | ChannelUnarchiveEvent | ChannelUnsharedEvent | DNDUpdatedEvent | DNDUpdatedUserEvent | EmailDomainChangedEvent | EmojiChangedEvent | FileChangeEvent | FileCommentDeletedEvent | FileCreatedEvent | FileDeletedEvent | FilePublicEvent | FileSharedEvent | FileUnsharedEvent | GridMigrationFinishedEvent | GridMigrationStartedEvent | GroupArchiveEvent | GroupCloseEvent | GroupDeletedEvent | GroupHistoryChangedEvent | GroupLeftEvent | GroupOpenEvent | GroupRenameEvent | GroupUnarchiveEvent | IMCloseEvent | IMCreatedEvent | IMHistoryChangedEvent | IMOpenEvent | InviteRequestedEvent | LinkSharedEvent | MemberJoinedChannelEvent | MemberLeftChannelEvent | MessageEvent | PinAddedEvent | PinRemovedEvent | ReactionAddedEvent | ReactionRemovedEvent | StarAddedEvent | StarRemovedEvent | SubteamCreated | SubteamMembersChanged | SubteamSelfAddedEvent | SubteamSelfRemovedEvent | SubteamUpdatedEvent | TeamDomainChangedEvent | TeamJoinEvent | TeamRenameEvent | TokensRevokedEvent | UserChangeEvent;

ahh hmm ok.

So maybe this is the nature of adding typings to a huge API after the fact, but it's quite hard to use these typings to assisting app development. eg related to #587

What type of issue is this? (place an x in one of the [ ])

• bug
• enhancement (feature request)
• question
• documentation related
• testing related
• discussion

Requirements (place an x in each of the [ ])

• I've read and understood the Contributing guidelines and have done my best effort to follow them.
• I've read and agree to the Code of Conduct.
• I've searched for any related issues and avoided creating a duplicate issue.

---

[seratch]

I may not fully understand your intention here but just for type-safety, you don't need to maintain your own type definitions. In other words, you cannot do so as long as you use Bolt.

If you want AllMiddlewareArgs to be exposed, I do empathize that it'll be beneficial for TypeScript developers. But apart from the limitation, you can already take advantage of Bolt's types without any hurdles.

import { SlackEventMiddlewareArgs } from '@slack/bolt';

app.message("foo", async (args: SlackEventMiddlewareArgs<'message'>) => {
  const event = args.event;
  console.log(event);
});

app.message("foo", async ({ event }) => {
  console.log(event);
});

[dcsan]

awesome thanks!

that was the syntax I was looking for, i wasn't sure how to pass the event type. now i can get proper completion on everything!

[dcsan]

this maybe worth adding to the docs somewhere.

[dcsan]

well I guess it wasn't as simple as replacing message with action ...

[seratch]

The type looks like this:

If you're using Visual Studio Code, you can easily check the actual type by hovering the arg value.

See also: #349 (comment)

[seratch]

Let me close this issue now. If you have anything further to discuss/ask here, please feel free to reopen and/or write in.