Add xstate and create first iteration of intersection machine

cdonohue · Jan 12, 2024 · 1d53121 · 1d53121
1 parent 63985ca
commit 1d53121
Show file tree

Hide file tree

Showing 3 changed files with 97 additions and 2 deletions.
diff --git a/machines/intersectionMachine.ts b/machines/intersectionMachine.ts
@@ -0,0 +1,43 @@
+import { createMachine } from 'xstate'
+
+export default createMachine({
+  id: 'trafficIntersection',
+  initial: 'allRed',
+  states: {
+    allRed: {
+      after: {
+        2000: 'northSouthGreen',
+      },
+    },
+    northSouthGreen: {
+      after: {
+        5000: 'northSouthYellow',
+      },
+    },
+    northSouthYellow: {
+      after: {
+        2000: 'allRedBeforeEastWest',
+      },
+    },
+    allRedBeforeEastWest: {
+      after: {
+        1000: 'eastWestGreen',
+      },
+    },
+    eastWestGreen: {
+      after: {
+        5000: 'eastWestYellow',
+      },
+    },
+    eastWestYellow: {
+      after: {
+        2000: 'allRedBeforeNorthSouth',
+      },
+    },
+    allRedBeforeNorthSouth: {
+      after: {
+        1000: 'northSouthGreen',
+      },
+    },
+  },
+})
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -10,9 +10,11 @@
   },
   "dependencies": {
     "@heroicons/react": "^2.1.1",
+    "@xstate/react": "^4.0.2",
     "next": "14.0.4",
     "react": "^18",
-    "react-dom": "^18"
+    "react-dom": "^18",
+    "xstate": "^5.5.1"
   },
   "devDependencies": {
     "@types/node": "^20",