search

mattpocock / xstate-codegen

A codegen tool for 100% TS type-safety in XState
MIT License
245 stars 12 forks source link

Error in options of useMachine when not including all options used in createMachine #73

Closed jackharding closed 3 years ago

jackharding commented 3 years ago

Here's a sandbox.

I have a machine that includes actions in the second argument of createMachine. I'm trying to pass in services using the second argument of useMachine but I'm getting type errors. I'm assuming it doesn't like that the two arguments are different. Is there any way around this?

danielkcz commented 3 years ago

Can you be more specific about what are the issues in that sandbox? It started successfully and I am not seeing any TS errors.

jackharding commented 3 years ago

@FredyC I get the following error:

Argument of type '{ services: { checkIfLoggedIn: () => Promise<unknown>; logout: () => Promise<unknown>; }; }' is not assignable to parameter of type '{ context?: Partial<AuthContext> | undefined; guards?: {} | undefined; actions: { addUser?: ActionFunction<AuthContext, { type: "LOGIN_SUCCESS"; user: any; }> | ActionObject<...> | undefined; actions: ActionObject<...> | ActionFunction<...>; addError: ActionFunction<...> | ActionObject<...>; removeUserFromState: Act...'.
  Property 'actions' is missing in type '{ services: { checkIfLoggedIn: () => Promise<unknown>; logout: () => Promise<unknown>; }; }' but required in type '{ context?: Partial<AuthContext> | undefined; guards?: {} | undefined; actions: { addUser?: ActionFunction<AuthContext, { type: "LOGIN_SUCCESS"; user: any; }> | ActionObject<...> | undefined; actions: ActionObject<...> | ActionFunction<...>; addError: ActionFunction<...> | ActionObject<...>; removeUserFromState: Act...'.ts(2345)

Screenshot 2021-02-02 at 18 47 25

danielkcz commented 3 years ago

Sadly TS errors can't be really improved to be more understandable, but in this case, the important part is Property actions is missing in type. You have other actions in your machine you haven't defined in machine config. The xstate-codegen works the way that everything in machine config is optional, but if you define it there, you don't need to configure it later with eg. useMachine. The goal is to have everything defined somewhere so you don't run into runtime errors.

jackharding commented 3 years ago

Right, ok. So, are you saying that there's no way to specify different options in useMachine without also including everything else that's included in createMachine options?

danielkcz commented 3 years ago

No, that's not what I am saying. Each action or service has to be defined somewhere and it's up to you where. The generator is clever here, it will only want things you haven't included in machine configuration.

jackharding commented 3 years ago

But I have included actions in the machine config - so why is it erroring that I haven't included actions in useMachine?

jackharding commented 3 years ago

I've managed to solve the problem by changing line 36 of the machine from actions: () => console.log() to actions: ["doNothing"] and then defining doNothing in the machine config. I guess the error was a result of it thinking that there was still an action that wasn't defined somewhere.

Thanks very much for your help with this.