Merge pull request #17 from inngest/fix-issue-15

fix: do not update state in render
inngest · Sep 30, 2024 · 77705cf · 77705cf
2 parents 919ead6 + 5736c02
commit 77705cf
Show file tree

Hide file tree

Showing 6 changed files with 45 additions and 3,756 deletions.
diff --git a/.changeset/sixty-cups-itch.md b/.changeset/sixty-cups-itch.md
@@ -0,0 +1,5 @@
+---
+"@inngest/workflow-kit": patch
+---
+
+fix: do not update state in render
diff --git a/examples/nextjs-blog-cms/components/automation-editor.tsx b/examples/nextjs-blog-cms/components/automation-editor.tsx
@@ -68,9 +68,7 @@ export const AutomationEditor = ({ workflow }: { workflow: Workflow }) => {
               }}
             >
               <Editor>
-                <Sidebar position="right">
-                  <></>
-                </Sidebar>
+                <Sidebar position="right" />
               </Editor>
             </Provider>
           </div>

diff --git a/examples/nextjs-blog-cms/package.json b/examples/nextjs-blog-cms/package.json
@@ -9,7 +9,7 @@
     "lint": "next lint"
   },
   "dependencies": {
-    "@inngest/workflow-kit": "0.1.3-alpha-20240927112743-cfb6053c0cb7347670c83bb0edcd2edaedd11d9c",
+    "@inngest/workflow-kit": "0.1.3-alpha-20240930224141-9a7240323ec48bf95e5725173ab63ae424d76e6b",
     "@mdx-js/mdx": "^3.0.1",
     "@radix-ui/react-checkbox": "^1.1.1",
     "@radix-ui/react-icons": "^1.3.0",

diff --git a/examples/nextjs-blog-cms/pnpm-lock.yaml b/examples/nextjs-blog-cms/pnpm-lock.yaml
diff --git a/packages/workflow/src/ui/sidebar/Sidebar.tsx b/packages/workflow/src/ui/sidebar/Sidebar.tsx
@@ -1,3 +1,4 @@
+import { useEffect } from "react";
 import { useProvider } from "../Provider";
 import { SidebarWorkflowForm } from "./WorfklowForm";
 import { SidebarFooter } from "./Footer";
@@ -20,7 +21,9 @@ export const Sidebar = (props: SidebarProps) => {
 
   // Set this within context so the parent editor can adjust our
   // flex layouts correctly.
-  setSidebarPosition(props.position === "left" ? "left" : "right");
+  useEffect(() => {
+    setSidebarPosition(props.position === "left" ? "left" : "right");
+  }, [props.position])
 
   let content = props.children || useSidebarContent();