diff --git a/src/AnimGraph/AnimGraphEditor.cc b/src/AnimGraph/AnimGraphEditor.cc
index 4ead5aa..ba6a6bf 100644
--- a/src/AnimGraph/AnimGraphEditor.cc
+++ b/src/AnimGraph/AnimGraphEditor.cc
@@ -6,6 +6,7 @@
 
 #include <sstream>
 
+#include "3rdparty/imgui-node-editor/imgui_node_editor.h"
 #include "AnimGraphResource.h"
 #include "SkinnedMesh.h"
 #include "imgui.h"
@@ -246,7 +247,128 @@ void AnimGraphEditorRenderSidebar(
   }
 }
 
-void AnimGraphEditorUpdate() {
+void AnimGraphEditorUpdate(ax::NodeEditor::EditorContext* context) {
+  ImGui::BeginMenuBar();
+  if (ImGui::Button("Save")) {
+    sGraphGresource.saveToFile("editor_graph.json");
+  }
+  if (ImGui::Button("Load")) {
+    sGraphGresource.loadFromFile("editor_graph.json");
+
+//    for (size_t i = 0, n = sGraphGresource.m_nodes.size(); i < n; i++) {
+//      const AnimNodeResource& node_resource = sGraphGresource.m_nodes[i];
+//      ImNodes::SetNodeGridSpacePos(
+//          i,
+//          ImVec2(node_resource.m_position[0], node_resource.m_position[1]));
+//    }
+  }
+  if (ImGui::Button("Clear")) {
+    sGraphGresource.clear();
+  }
+  char graph_name_buffer[256];
+  memset(graph_name_buffer, 0, sizeof(graph_name_buffer));
+  strncpy(
+      graph_name_buffer,
+      sGraphGresource.m_name.c_str(),
+      sizeof(graph_name_buffer));
+  if (ImGui::InputText("Name", graph_name_buffer, sizeof(graph_name_buffer))) {
+    sGraphGresource.m_name = graph_name_buffer;
+  }
+
+  ImGui::EndMenuBar();
+
+  //
+  // Node editor canvas
+  //
+  ax::NodeEditor::SetCurrentEditor(context);
+  ax::NodeEditor::Begin("Graph Editor");
+
+  for (size_t node_id = 0, n = sGraphGresource.m_nodes.size(); node_id < n;
+       node_id++) {
+    AnimNodeResource& node_resource = sGraphGresource.m_nodes[node_id];
+
+    if (node_id == 0 || node_id == 1) {
+      // continue;
+    }
+
+
+    ax::NodeEditor::BeginNode(node_id);
+    ImGui::Text("%s", node_resource.m_type_name.c_str());
+
+    // Inputs
+    std::vector<Socket>& node_inputs =
+        node_resource.m_socket_accessor->m_inputs;
+    for (size_t j = 0, ni = node_inputs.size(); j < ni; j++) {
+      Socket& socket = node_inputs[j];
+      int pin_id = static_cast<int>(node_id) + j * 1000;
+      ax::NodeEditor::BeginPin(pin_id, ax::NodeEditor::PinKind::Input);
+      ImGui::Text("%s", socket.m_name.c_str());
+      ax::NodeEditor::EndPin();
+    }
+
+    // Outputs
+    const std::vector<Socket>& node_outputs =
+        node_resource.m_socket_accessor->m_outputs;
+    for (size_t j = 0, ni = node_outputs.size(); j < ni; j++) {
+      const Socket& socket = node_outputs[j];
+      int pin_id = static_cast<int>(node_id) + j * 1000 * 1000;
+      ax::NodeEditor::BeginPin(pin_id, ax::NodeEditor::PinKind::Output);
+      ImGui::Text("%s", socket.m_name.c_str());
+      ax::NodeEditor::EndPin();
+    }
+
+    ax::NodeEditor::EndNode();
+  }
+
+#if 0
+  int unique_id = 1;
+  ax::NodeEditor::BeginNode(unique_id++);
+
+  // Node A
+  ImGui::Text("Node A");
+  ax::NodeEditor::BeginPin(unique_id++, ax::NodeEditor::PinKind::Input);
+  ImGui::Text("In");
+  ax::NodeEditor::EndPin();
+  ImGui::SameLine();
+  ax::NodeEditor::BeginPin(unique_id++, ax::NodeEditor::PinKind::Output);
+  ImGui::Text("Out");
+  ax::NodeEditor::EndPin();
+
+  ax::NodeEditor::EndNode();
+
+  // Node B
+  ax::NodeEditor::BeginNode(unique_id++);
+
+  ImGui::Text("Node B");
+  ax::NodeEditor::BeginPin(unique_id++, ax::NodeEditor::PinKind::Input);
+  ImGui::Text("In");
+  ax::NodeEditor::EndPin();
+  ImGui::SameLine();
+  ax::NodeEditor::BeginPin(unique_id++, ax::NodeEditor::PinKind::Output);
+  ImGui::Text("Out");
+  ax::NodeEditor::EndPin();
+
+  ax::NodeEditor::EndNode();
+#endif
+
+  // Create Connections
+  if (ax::NodeEditor::BeginCreate()) {
+    ax::NodeEditor::PinId input_pin_id, output_pin_id;
+    if (ax::NodeEditor::QueryNewLink(&input_pin_id, &output_pin_id)) {
+      if (input_pin_id && output_pin_id) {
+        if (ax::NodeEditor::AcceptNewItem()) {
+        }
+      }
+    }
+  }
+  ax::NodeEditor::EndCreate();
+
+  ax::NodeEditor::End();
+
+  ax::NodeEditor::SetCurrentEditor(nullptr);
+}
+
+void LegacyAnimGraphEditorUpdate() {
   ImGui::BeginMenuBar();
   if (ImGui::Button("Save")) {
     sGraphGresource.saveToFile("editor_graph.json");
diff --git a/src/AnimGraph/AnimGraphEditor.h b/src/AnimGraph/AnimGraphEditor.h
index bd15c9e..5b09030 100644
--- a/src/AnimGraph/AnimGraphEditor.h
+++ b/src/AnimGraph/AnimGraphEditor.h
@@ -7,6 +7,10 @@
 
 #include "AnimGraph.h"
 
+namespace ax::NodeEditor {
+struct EditorContext;
+}  // namespace ax::NodeEditor
+
 struct SkinnedMesh;
 
 inline int GenerateInputAttributeId(int node_id, int input_index) {
@@ -33,7 +37,9 @@ void SyncTrackEditor(SyncTrack* sync_track);
 
 void SkinnedMeshWidget(SkinnedMesh* skinned_mesh);
 
-void AnimGraphEditorUpdate();
+void AnimGraphEditorUpdate(ax::NodeEditor::EditorContext* context);
+
+void LegacyAnimGraphEditorUpdate();
 
 void AnimGraphEditorGetRuntimeGraph(AnimGraph& anim_graph);
 
diff --git a/src/main.cc b/src/main.cc
index 27bb0b3..477a0cb 100644
--- a/src/main.cc
+++ b/src/main.cc
@@ -1072,56 +1072,7 @@ int main() {
       gApplicationConfig.graph_editor.size[0] = graph_editor_size.x;
       gApplicationConfig.graph_editor.size[1] = graph_editor_size.y;
 
-      ax::NodeEditor::SetCurrentEditor(gApplicationConfig.graph_editor.context);
-      ax::NodeEditor::Begin("Graph Editor");
-
-      int unique_id = 1;
-      ax::NodeEditor::BeginNode(unique_id++);
-
-      // Node A
-      ImGui::Text("Node A");
-      ax::NodeEditor::BeginPin(unique_id++, ax::NodeEditor::PinKind::Input);
-      ImGui::Text("In");
-      ax::NodeEditor::EndPin();
-      ImGui::SameLine();
-      ax::NodeEditor::BeginPin(unique_id++, ax::NodeEditor::PinKind::Output);
-      ImGui::Text("Out");
-      ax::NodeEditor::EndPin();
-
-      ax::NodeEditor::EndNode();
-
-      // Node B
-      ax::NodeEditor::BeginNode(unique_id++);
-
-      ImGui::Text("Node B");
-      ax::NodeEditor::BeginPin(unique_id++, ax::NodeEditor::PinKind::Input);
-      ImGui::Text("In");
-      ax::NodeEditor::EndPin();
-      ImGui::SameLine();
-      ax::NodeEditor::BeginPin(unique_id++, ax::NodeEditor::PinKind::Output);
-      ImGui::Text("Out");
-      ax::NodeEditor::EndPin();
-
-      ax::NodeEditor::EndNode();
-
-      // Create Connections
-      if (ax::NodeEditor::BeginCreate()) {
-        ax::NodeEditor::PinId input_pin_id, output_pin_id;
-        if (ax::NodeEditor::QueryNewLink(&input_pin_id, &output_pin_id)) {
-          if (input_pin_id && output_pin_id) {
-            if (ax::NodeEditor::AcceptNewItem()) {
-
-            }
-          }
-        }
-      }
-      ax::NodeEditor::EndCreate();
-
-      ax::NodeEditor::End();
-
-      ax::NodeEditor::SetCurrentEditor(nullptr);
-
-
+      AnimGraphEditorUpdate(gApplicationConfig.graph_editor.context);
 
       ImGui::End();
     }
@@ -1152,7 +1103,7 @@ int main() {
       gApplicationConfig.legacy_graph_editor.size[0] = graph_editor_size.x;
       gApplicationConfig.legacy_graph_editor.size[1] = graph_editor_size.y;
 
-      AnimGraphEditorUpdate();
+      LegacyAnimGraphEditorUpdate();
 
       ImGui::End();
     }