feat(server): threads Implementation refinements

start preparing backend and fronend to manage threads

work on #24

server-jetty/src/main/java/org/bsc/langgraph4j/LangGraphStreamingServer.java

@@ -6,6 +6,7 @@
 import jakarta.servlet.http.HttpServlet;
 import jakarta.servlet.http.HttpServletRequest;
 import jakarta.servlet.http.HttpServletResponse;
+import org.bsc.langgraph4j.checkpoint.MemorySaver;
 import org.bsc.langgraph4j.state.AgentState;
 import org.eclipse.jetty.ee10.servlet.ServletContextHandler;
 import org.eclipse.jetty.ee10.servlet.ServletHolder;
@@ -128,23 +129,49 @@ public CompletableFuture<Void> start() throws Exception {
     }
 }
 
+record PersistentConfig(String sessionId, String threadId) {
+    public PersistentConfig {
+        Objects.requireNonNull(sessionId);
+    }
+
+}
 
 class GraphExecutionServlet<State extends AgentState> extends HttpServlet {
+    Logger log = LangGraphStreamingServer.log;
+
     final StateGraph<State> stateGraph;
     final ObjectMapper objectMapper;
+    final MemorySaver saver = new MemorySaver();
+    final Map<PersistentConfig, CompiledGraph<State>> graphCache = new HashMap<>();
 
     public GraphExecutionServlet(StateGraph<State> stateGraph, ObjectMapper objectMapper) {
         Objects.requireNonNull(stateGraph, "stateGraph cannot be null");
         this.stateGraph = stateGraph;
         this.objectMapper = objectMapper;
     }
 
+    private CompileConfig compileConfig(PersistentConfig config) {
+        return CompileConfig.builder()
+                .checkpointSaver(saver)
+                .build();
+    }
+
+    RunnableConfig runnableConfig( PersistentConfig config ) {
+        return RunnableConfig.builder()
+                .threadId(config.threadId())
+                .build();
+    }
+
+
     @Override
     protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
         response.setHeader("Accept", "application/json");
         response.setContentType("text/plain");
         response.setCharacterEncoding("UTF-8");
 
+        var session = request.getSession(true);
+        Objects.requireNonNull(session, "session cannot be null");
+
         final PrintWriter writer = response.getWriter();
 
         Map<String, Object> dataMap = objectMapper.readValue(request.getInputStream(), new TypeReference<Map<String, Object>>() {
@@ -154,9 +181,15 @@ protected void doPost(HttpServletRequest request, HttpServletResponse response)
         var asyncContext = request.startAsync();
 
         try {
-            var config = CompileConfig.builder().build();
+            var threadId = request.getParameter("threadId");
+
+            var config = new PersistentConfig( session.getId(), threadId);
 
-            var compiledGraph = stateGraph.compile(config);
+            var compiledGraph =  graphCache.get(config);
+            if( compiledGraph == null ) {
+                compiledGraph = stateGraph.compile( compileConfig(config) );
+                graphCache.put( config, compiledGraph );
+            }
 
             compiledGraph.stream(dataMap)
                     .forEachAsync(s -> {
@@ -184,7 +217,7 @@ protected void doPost(HttpServletRequest request, HttpServletResponse response)
             ;
 
         } catch (Exception e) {
-            throw new RuntimeException(e);
+            throw new ServletException(e);
         }
     }
 }

server-jetty/src/main/js/src/lg4j-result.js

@@ -20,6 +20,11 @@ export class LG4JResultElement extends LitElement {
   static properties = {
   }
 
+  /**
+   * @type {string[]}
+   */
+  threads = []
+
   constructor() {
     super()
     this.results = []
@@ -29,14 +34,22 @@ export class LG4JResultElement extends LitElement {
     super.connectedCallback();
 
     this.addEventListener( 'result', this.#onResult )
+    this.addEventListener( 'result-threads', this.#onInitThreads )
   }
 
   disconnectedCallback() {
     super.disconnectedCallback()
 
     this.removeEventListener( 'result',  this.#onResult )
+    this.removeEventListener( 'result-threads',  this.#onInitThreads )
   }
 
+  #onInitThreads = (e) => {
+    const { detail: threads } = e 
+
+  }
+
+
   /**
    * Event handler for the 'result' event.
    * 
@@ -70,7 +83,13 @@ export class LG4JResultElement extends LitElement {
     });
   }
 
-  /**
+  #onNewTab = (event) => {
+    console.log( "NEW TAB", event)
+    this.threads.push( `Thread-${this.threads.length+1}`);
+    this.requestUpdate();
+  }
+
+  /** 
    * Renders a result.
    * @param {ResultData} result - The result data to render.
    * @returns {import('lit').TemplateResult} The template for the result.
@@ -102,25 +121,24 @@ export class LG4JResultElement extends LitElement {
       
       <div class="h-full">
         <div role="tablist" class="tabs tabs-bordered">
-        <a role="tab" class="tab">
-          <div class="flex items-center gap-x-2">
-            <p>No Thread</p>
-            <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20">
-              <circle cx="10" cy="10" r="9" fill="none" stroke="white" stroke-width="1.5"/>
-              <line x1="5" y1="10" x2="15" y2="10" stroke="white" stroke-width="1.5" stroke-linecap="round"/>
-              <line x1="10" y1="5" x2="10" y2="15" stroke="white" stroke-width="1.5" stroke-linecap="round"/>
-            </svg>
+            <a role="tab" class="tab tab-active">No Thread</a>
+            ${this.threads.map( t => html`<a role="tab" class="tab" >${t}</a>`)}
+            <a role="tab" class="tab">
+              <svg  @click="${this.#onNewTab}" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20">
+                <circle cx="10" cy="10" r="9" fill="none" stroke="white" stroke-width="1.5"/>
+                <line x1="5" y1="10" x2="15" y2="10" stroke="white" stroke-width="1.5" stroke-linecap="round"/>
+                <line x1="10" y1="5" x2="10" y2="15" stroke="white" stroke-width="1.5" stroke-linecap="round"/>
+              </svg>
+            </a>
           </div>
-        </a>
+            <div class="max-h-[95%] overflow-x-auto bg-slate-500">
+              <table class="table table-pin-rows">
+                <tbody>
+                    ${this.results.map( (result, index) => html`<tr><td>${this.#renderResult(result, index)}</td></tr>`) }
+                </tbody>
+              </table>
+            </div>
         </div> 
-        <div class="max-h-[95%] overflow-x-auto bg-slate-500">
-          <table class="table table-pin-rows">
-            <tbody>
-                ${this.results.map( (result, index) => html`<tr><td>${this.#renderResult(result, index)}</td></tr>`) }
-            </tbody>
-          </table>
-        </div>
-      </div>
        
     `;
   }

server-jetty/src/main/js/src/lg4j-workbench.js

@@ -36,9 +36,10 @@ export class LG4JWorkbenchElement extends LitElement {
   }
 
   #routeInitEvent( e ) {
-      const { graph, title } = e.detail 
+      const { graph, title, threads = [] } = e.detail 
 
       this.#routeEvent( new CustomEvent( "graph", { detail: graph }));
+      this.#routeEvent( new CustomEvent( "result-threads", { detail: threads }));
 
       if( title ) {
         this.title = title