Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[@xstate/store] Add examples + update createStoreWithProducer(…) #5079

Merged
merged 19 commits into from
Sep 20, 2024

Conversation

davidkpiano
Copy link
Member

@davidkpiano davidkpiano commented Sep 17, 2024

The createStoreWithProducer(…) function now uses the new configuration API:

import { createStoreWithProducer } from '@xstate/store';
// DEPRECATED API
// const store = createStoreWithProducer(
//   producer,
//   {
//     count: 0
//   },
//   {
//     inc: (context, event) => {
//       context.count++;
//     }
//   }
// );

const store = createStoreWithProducer(producer, {
  context: {
    count: 0
  },
  on: {
    inc: (context, event) => {
      context.count++;
    }
  }
});

Also, an example directory and simple example was added.

Copy link

changeset-bot bot commented Sep 17, 2024

🦋 Changeset detected

Latest commit: ee56fe1

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 7 packages
Name Type
xstate Patch
@xstate/store Minor
@xstate/graph Patch
@xstate/react Patch
@xstate/solid Patch
@xstate/svelte Patch
@xstate/vue Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

send: (...args: never) => void;
send: (event: any) => void;
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@Andarist The ...args: never part doesn't work with this:

const { inspect } = createBrowserInspector();

// ...

store.inspect(inspect); // fails on actorRef.send(…)

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

You could also fix it like this:

Alternative patch
diff --git a/packages/core/src/inspection.ts b/packages/core/src/inspection.ts
index ec61c3aa1b..1e3114d4d5 100644
--- a/packages/core/src/inspection.ts
+++ b/packages/core/src/inspection.ts
@@ -35,7 +35,7 @@ interface InspectedMicrostepEvent extends BaseInspectionEventProperties {
   type: '@xstate.microstep';
   event: AnyEventObject; // { type: string, ... }
   snapshot: Snapshot<unknown>;
-  _transitions: AnyTransitionDefinition[];
+  _transitions: unknown[];
 }
 
 export interface InspectedActionEvent extends BaseInspectionEventProperties {
@@ -51,7 +51,7 @@ export interface InspectedEventEvent extends BaseInspectionEventProperties {
   // The source might not exist, e.g. when:
   // - root init events
   // - events sent from external (non-actor) sources
-  sourceRef: AnyActorRef | undefined;
+  sourceRef: ActorRefLike | undefined;
   event: AnyEventObject; // { type: string, ... }
 }
 
diff --git a/packages/core/src/types.ts b/packages/core/src/types.ts
index c84c91281d..463897aff2 100644
--- a/packages/core/src/types.ts
+++ b/packages/core/src/types.ts
@@ -1981,10 +1981,9 @@ export interface ActorRef<
 
 export type AnyActorRef = ActorRef<any, any, any>;
 
-export type ActorRefLike = Pick<
-  AnyActorRef,
-  'sessionId' | 'send' | 'getSnapshot'
->;
+export type ActorRefLike = Pick<AnyActorRef, 'sessionId' | 'getSnapshot'> & {
+  send: (...args: never) => void;
+};
 
 export type UnknownActorRef = ActorRef<Snapshot<unknown>, EventObject>;
 
diff --git a/packages/xstate-store/src/types.ts b/packages/xstate-store/src/types.ts
index 0ee864a93c..4aaed3491e 100644
--- a/packages/xstate-store/src/types.ts
+++ b/packages/xstate-store/src/types.ts
@@ -298,7 +298,7 @@ export interface InspectedActorEvent extends BaseInspectionEventProperties {
 export type ActorRefLike = {
   sessionId: string;
   // https://github.com/statelyai/xstate/pull/5037/files#r1717036732
-  send: (event: any) => void;
+  send: (...args: never) => void;
   getSnapshot: () => any;
 };

I don't mind either solution... although I really like how the ...args: never approach discovered here further inconsistencies in types. Something that any didn't 😉

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

btw. let's add a type test for this combination of things

package.json Outdated Show resolved Hide resolved
@davidkpiano davidkpiano marked this pull request as ready for review September 20, 2024 08:17
| InspectedActorEvent
| InspectedMicrostepEvent
| InspectedActionEvent;
export type StoreInspectionEvent =
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

technically this is a breaking change as you have renamed a public export, the same applied to other renamed exports in this file

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Added a deprecation instead

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@@ -51,7 +50,7 @@ export interface InspectedEventEvent extends BaseInspectionEventProperties {
// The source might not exist, e.g. when:
// - root init events
// - events sent from external (non-actor) sources
sourceRef: AnyActorRef | undefined;
sourceRef: ActorRefLike | undefined;
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

u might want to add some changeset for this change as without it u wont release xstate package and @xstore/store won't be able to utilize this improvement

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@davidkpiano davidkpiano merged commit 2596396 into main Sep 20, 2024
1 check passed
@davidkpiano davidkpiano deleted the davidkpiano/store-examples branch September 20, 2024 14:05
@github-actions github-actions bot mentioned this pull request Sep 20, 2024
@boneskull
Copy link
Contributor

Should type changes like this be considered breaking? It does break my build

@davidkpiano
Copy link
Member Author

Should type changes like this be considered breaking? It does break my build

We try to minimize breaking type changes but they are considered minor changes for XState, just like in TS: https://github.com/statelyai/xstate?tab=readme-ov-file#typescript-changes

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants