Merge pull request #36 from statelyai/matt/added-typegen-to-authentic…

…ation-pr Added typegen to authentication PR
statelyai · Jan 25, 2022 · 875e599 · 875e599
2 parents 5021cf9 + 84b5d60
commit 875e599
Show file tree

Hide file tree

Showing 23 changed files with 950 additions and 103 deletions.
diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml
@@ -0,0 +1,34 @@
+name: CI
+on:
+  push:
+    branches:
+      - "**"
+    tags:
+      - "v*"
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v2
+      - uses: actions/setup-node@v2
+        with:
+          node-version: 14.x
+          cache: "yarn"
+
+      - run: yarn
+      - run: npx vsce package
+      - uses: actions/upload-artifact@v2
+        with:
+          name: xstate-vscode
+          path: "*.vsix"
+
+  publish:
+    runs-on: ubuntu-latest
+    needs: build
+    if: success() && startsWith( github.ref, 'refs/tags/')
+    steps:
+      - uses: actions/download-artifact@v2
+      - run: npx vsce publish --packagePath $(find . -iname *.vsix)
+        env:
+          VSCE_PAT: ${{ secrets.VSCE_PAT }}
diff --git a/client/package.json b/client/package.json
@@ -20,8 +20,7 @@
     "@xstate/inspect": "^0.4.1",
     "lz-string": "^1.4.4",
     "vscode-languageclient": "^7.0.0",
-    "xstate": "^4.23.1",
-    "xstate-parser-demo": "0.3.1",
+    "xstate": "^4.28.0",
     "xstate-vscode-shared": "*"
   },
   "devDependencies": {

diff --git a/client/src/auth.ts b/client/src/auth.ts
@@ -1,4 +1,5 @@
 import * as vscode from "vscode";
+import { BASE_URL, EXTENSION_ID, TOKEN_KEY } from "./constants";
 import { uriHandler } from "./UriHandler";
 
 export interface TokenInfo {
@@ -15,10 +16,6 @@ export type SignInResult =
   | "could-not-open-external-url"
   | "cancelled";
 
-const TOKEN_KEY = "stately-editor-key";
-const BASE_URL = "http://localhost:3000";
-const EXTENSION_ID = "mattpocock.xstate-vscode";
-
 export const getAuth = (context: vscode.ExtensionContext) => {
   /**
    * Grabs the login token from localStorage

diff --git a/client/src/constants.ts b/client/src/constants.ts
@@ -0,0 +1,3 @@
+export const BASE_URL = "https://stately.ai";
+export const TOKEN_KEY = `stately-editor-key#${BASE_URL}`;
+export const EXTENSION_ID = "mattpocock.xstate-vscode";
diff --git a/client/src/editorWebviewScript.ts b/client/src/editorWebviewScript.ts
@@ -4,6 +4,7 @@ import { interpret } from "xstate";
 import { createMachine } from "xstate";
 import { compressToEncodedURIComponent } from "lz-string";
 import { TokenInfo } from "./auth";
+import { BASE_URL } from "./constants";
 
 declare global {
   function acquireVsCodeApi(): {
@@ -74,7 +75,9 @@ const machine = createMachine<WebViewMachineContext, EditorWebviewScriptEvent>(
       src: () => (send) => {
         const listener = (event) => {
           try {
-            send(JSON.parse(event.data));
+            const ourEvent: EditorWebviewScriptEvent = JSON.parse(event.data);
+
+            send(ourEvent);
           } catch (e) {
             console.warn(e);
           }
@@ -111,14 +114,13 @@ const machine = createMachine<WebViewMachineContext, EditorWebviewScriptEvent>(
 
             if (!iframe || iframe.src) return;
 
-            iframe.src = `http://localhost:3000/registry/editor/from-url?config=${compressToEncodedURIComponent(
+            iframe.src = `${BASE_URL}/registry/editor/from-url?config=${compressToEncodedURIComponent(
               JSON.stringify(context.config),
             )}${
               context.layoutString ? `&layout=${context.layoutString}` : ""
             }${getTokenHash(context.token)}`;
           },
         },
-        initial: "notAcceptingUpdatesFromEditor",
         on: {
           RECEIVE_CONFIG_UPDATE_FROM_VSCODE: {
             cond: (ctx, event) => {
@@ -134,8 +136,6 @@ const machine = createMachine<WebViewMachineContext, EditorWebviewScriptEvent>(
               }),
               "updateIframe",
             ],
-            target: ".notAcceptingUpdatesFromEditor",
-            internal: false,
           },
           DEFINITION_UPDATED: {
             actions: [
@@ -155,29 +155,8 @@ const machine = createMachine<WebViewMachineContext, EditorWebviewScriptEvent>(
                 });
               },
             ],
-            target: ".notAcceptingUpdatesFromVsCode",
-            internal: false,
           },
         },
-        states: {
-          notAcceptingUpdatesFromVsCode: {
-            after: {
-              800: "acceptingUpdatesFromAny",
-            },
-            on: {
-              RECEIVE_CONFIG_UPDATE_FROM_VSCODE: {},
-            },
-          },
-          notAcceptingUpdatesFromEditor: {
-            after: {
-              800: "acceptingUpdatesFromAny",
-            },
-            on: {
-              DEFINITION_UPDATED: {},
-            },
-          },
-          acceptingUpdatesFromAny: {},
-        },
       },
     },
   },
@@ -189,11 +168,11 @@ const machine = createMachine<WebViewMachineContext, EditorWebviewScriptEvent>(
         if (!iframe) return;
 
         iframe.contentWindow.postMessage(
-          JSON.stringify({
+          {
             config: context.config,
             layoutString: context.layoutString,
             type: "UPDATE_CONFIG",
-          }),
+          },
           "*",
         );
       },

diff --git a/client/src/extension.ts b/client/src/extension.ts
@@ -13,12 +13,13 @@ import {
 } from "vscode-languageclient/node";
 import { getAuth, SignInResult } from "./auth";
 import { initiateEditor } from "./initiateEditor";
+import { initiateTypegen } from "./initiateTypegen";
 import { initiateVisualizer } from "./initiateVisualizer";
 import { uriHandler } from "./UriHandler";
 
 let client: LanguageClient;
 
-export function activate(context: vscode.ExtensionContext) {
+export async function activate(context: vscode.ExtensionContext) {
   // The server is implemented in node
   let serverModule = context.asAbsolutePath(
     path.join("server", "dist", "index.js"),
@@ -67,8 +68,11 @@ export function activate(context: vscode.ExtensionContext) {
 
   client.start();
 
+  await client.onReady();
+
   initiateVisualizer(context, client);
   initiateEditor(context, client);
+  initiateTypegen(context, client);
 
   context.subscriptions.push(
     vscode.window.registerUriHandler(uriHandler),

diff --git a/client/src/getStateMatchesObjectSyntax.ts b/client/src/getStateMatchesObjectSyntax.ts
@@ -0,0 +1,33 @@
+import { IntrospectMachineResult, SubState } from "xstate-vscode-shared";
+
+export const getStateMatchesObjectSyntax = (
+  introspectionResult: IntrospectMachineResult,
+): string => {
+  const getUnionForSubState = (subState: SubState, depth = 0): string => {
+    // Do not include sibling states in the union
+    // if it's the root
+    const states: string[] =
+      depth === 0
+        ? []
+        : Object.keys(subState.states).map((state) => `'${state}'`);
+
+    const substatesWithChildren = Object.entries(subState.states).filter(
+      ([, value]) => {
+        return Object.keys(value.states).length > 0;
+      },
+    );
+
+    if (substatesWithChildren.length > 0) {
+      states.push(
+        `{ ${substatesWithChildren
+          .map(([state, value]) => {
+            return `${state}?: ${getUnionForSubState(value, depth + 1)};`;
+          })
+          .join("\n")} }`,
+      );
+    }
+    return `${states.join(" | ")}`;
+  };
+
+  return getUnionForSubState(introspectionResult.subState);
+};