refactored the api routes

ell-studio/src/components/invocations/InvocationsTable.js

@@ -6,7 +6,6 @@ import { getTimeAgo } from '../../utils/lmpUtils';
 import VersionBadge from '../VersionBadge';
 import { useNavigate } from 'react-router-dom';
 import { lstrCleanStringify } from '../../utils/lstrCleanStringify';
-import { useInvocations } from '../../hooks/useBackend';
 
 const InvocationsTable = ({ invocations, currentPage, setCurrentPage, pageSize, onSelectTrace, currentlySelectedTrace, omitColumns = [] }) => {
   const navigate = useNavigate();

ell-studio/src/hooks/useBackend.js

@@ -8,7 +8,11 @@ export const useLMPs = (name, id) => {
   return useQuery({
     queryKey: ['lmpDetails', name, id],
     queryFn: async () => {
-      const lmpResponse = await axios.get(`${API_BASE_URL}/api/lmps/${name}${id ? `/${id}` : ""}`);
+      const params = new URLSearchParams();
+      if (name) params.append('name', name);
+      if (id) params.append('lmp_id', id);
+
+      const lmpResponse = await axios.get(`${API_BASE_URL}/api/lmps?${params.toString()}`);
       const all_lmps_matching = lmpResponse.data;
       return all_lmps_matching
         .map((lmp) => ({ ...lmp, created_at: new Date(lmp.created_at) }))
@@ -17,12 +21,19 @@ export const useLMPs = (name, id) => {
   });
 };
 
-export const useInvocations = (name, id, page = 0, pageSize = 100) => {
+export const useInvocations = (name, id, page = 0, pageSize = 50) => {
   return useQuery({
     queryKey: ['invocations', name, id, page, pageSize],
     queryFn: async () => {
       const skip = page * pageSize;
-      const response = await axios.get(`${API_BASE_URL}/api/invocations/${name ? name : ""}${name && id ? `/${id}` : ""}?skip=${skip}&limit=${pageSize}`);
+      const params = new URLSearchParams();
+      if (name) params.append('name', name);
+      if (id) params.append('lmp_id', id);
+      params.append('skip', skip);
+      params.append('limit', pageSize);
+      const response = await axios.get(`${API_BASE_URL}/api/invocations?${params.toString()}`);
+
+
       return response.data.sort((a, b) => new Date(b.created_at) - new Date(a.created_at));
     }
   });
@@ -33,8 +44,8 @@ export const useMultipleLMPs = (usesIds) => {
     queries: (usesIds || []).map(use => ({
       queryKey: ['lmp', use],
       queryFn: async () => {
-        const useResponse = await axios.get(`${API_BASE_URL}/api/lmps/${use}`);
-        return useResponse.data[0];
+        const useResponse = await axios.get(`${API_BASE_URL}/api/lmp/${use}`);
+        return useResponse.data;
       },
       enabled: !!use,
     })),
@@ -44,16 +55,7 @@ export const useMultipleLMPs = (usesIds) => {
   return { isLoading, data };
 };
 
-export const useAllInvocations = (page = 0, pageSize = 100) => {
-  return useQuery({
-    queryKey: ['allInvocations', page, pageSize],
-    queryFn: async () => {
-      const skip = page * pageSize;
-      const response = await axios.get(`${API_BASE_URL}/api/invocations?skip=${skip}&limit=${pageSize}`);
-      return response.data.sort((a, b) => new Date(b.created_at) - new Date(a.created_at));
-    }
-  });
-};
+
 
 
 export const useLatestLMPs = (page = 0, pageSize = 100) => {
@@ -102,4 +104,3 @@ export const useTraces = (lmps) => {
       enabled: !!lmps && lmps.length > 0,
     });
   };
-

ell-studio/src/pages/LMP.js

@@ -33,7 +33,10 @@ function LMP() {
   const { name, id } = useParams();
   let [searchParams, setSearchParams] = useSearchParams();
   const requestedInvocationId = searchParams.get("i");
+  
+  const [currentPage, setCurrentPage] = useState(0);
 
+  // TODO: Could be expensive if you have a funct on of versions.
   const { data: versionHistory, isLoading: isLoadingLMP } = useLMPs(name);
   const lmp = useMemo(() => {
     if (!versionHistory) return null;
@@ -44,10 +47,10 @@ function LMP() {
     }
   }, [versionHistory, id]);
 
-  console.log(name,id)
   const { data: invocations } = useInvocations(name, id);
   const { data: uses } = useMultipleLMPs(lmp?.uses);
-  console.log(uses)
+
+  
 
   const [activeTab, setActiveTab] = useState("runs");
   const [selectedTrace, setSelectedTrace] = useState(null);
@@ -69,9 +72,7 @@ function LMP() {
   useEffect(() => {
     setSelectedTrace(requestedInvocation);
   }, [requestedInvocation]);
-  
-  const [currentPage, setCurrentPage] = useState(0);
-  const pageSize = 10;
+
 
   const handleCopyCode = () => {
     const fullCode = `${lmp?.dependencies.trim()}\n\n${lmp?.source.trim()}`;

ell-studio/src/pages/Traces.js

@@ -3,7 +3,7 @@ import { FiCopy, FiZap, FiEdit2, FiFilter, FiClock, FiColumns, FiPause, FiPlay }
 import InvocationsTable from '../components/invocations/InvocationsTable';
 import InvocationsLayout from '../components/invocations/InvocationsLayout';
 import { useNavigate, useLocation } from 'react-router-dom';
-import { useAllInvocations } from '../hooks/useBackend';
+import { useInvocations } from '../hooks/useBackend';
 
 const Traces = () => {
   const [selectedTrace, setSelectedTrace] = useState(null);
@@ -11,10 +11,10 @@ const Traces = () => {
   const navigate = useNavigate();
   const location = useLocation();
 
-  const { data: invocations, refetch , isLoading } = useAllInvocations();
   const [currentPage, setCurrentPage] = useState(0);
   const pageSize = 10;
 
+  const { data: invocations, refetch , isLoading } = useInvocations(null, null, currentPage, pageSize);
   
   useEffect(() => {
     let intervalId;

src/ell/studio/data_server.py

@@ -44,54 +44,67 @@ def create_app(storage_dir: Optional[str] = None):
             )
         return lmps
 
-    @app.get("/api/lmps/{name_or_id:path}")
+    # TOOD: Create a get endpoint to efficient get on the index with /api/lmp/<lmp_id>
+    @app.get("/api/lmp/{lmp_id}")
+    def get_lmp_by_id(lmp_id: str):
+        lmp = serializer.get_lmps(lmp_id=lmp_id)[0]
+        return lmp
+
+
+    @app.get("/api/lmps")
     def get_lmp(
-        name_or_id: str,
+        lmp_id: Optional[str] = Query(None),
+        name: Optional[str] = Query(None),
         skip: int = Query(0, ge=0),
         limit: int = Query(100, ge=1, le=100)
     ):
-        # Remove any leading slash if present
-        name_or_id = name_or_id.lstrip("/")
-
-        # First, try to get by name
-        lmps_by_name = serializer.get_lmps(name=name_or_id, skip=skip, limit=limit)
-        if lmps_by_name:
-            return list(lmps_by_name)
         
-        # If not found by name, try to get by ID
-        lmp_by_id = serializer.get_lmps(lmp_id=name_or_id)
-        if lmp_by_id:
-            return list(lmp_by_id)
-        
-        # If still not found, check if the last part of the path is a valid lmp_id
-        name_parts = name_or_id.split("/")
-        if len(name_parts) > 1:
-            potential_lmp_id = name_parts[-1]
-            potential_name = "/".join(name_parts[:-1])
-            lmps = serializer.get_lmps(name=potential_name, lmp_id=potential_lmp_id, skip=skip, limit=limit)
-            if lmps:
-                return list(lmps)
+        filters = {}
+        if name:
+            filters['name'] = name
+        if lmp_id:
+            filters['lmp_id'] = lmp_id
 
-        raise HTTPException(status_code=404, detail="LMP not found")
+        lmps = serializer.get_lmps(skip=skip, limit=limit, **filters)
+        
+        if not lmps:
+            raise HTTPException(status_code=404, detail="LMP not found")
+        
+        return lmps
+
+
+
+    @app.get("/api/invocation/{invocation_id}")
+    def get_invocation(
+        invocation_id: str,
+    ):
+        invocation = serializer.get_invocations(id=invocation_id)[0]
+        return invocation
 
     @app.get("/api/invocations")
-    @app.get("/api/invocations/{name:path}")
     def get_invocations(
-        name: Optional[str] = None,
+        id: Optional[str] = Query(None),
         skip: int = Query(0, ge=0),
-        limit: int = Query(100, ge=1, le=100)
+        limit: int = Query(100, ge=1, le=100),
+        lmp_name: Optional[str] = Query(None),
+        lmp_id: Optional[str] = Query(None),
     ):
         lmp_filters = {}
-        if name:
-            name = name.lstrip("/")
-            name_parts = name.split("/")
+        if lmp_name:
+            lmp_filters["name"] = lmp_name
+        if lmp_id:
+            lmp_filters["lmp_id"] = lmp_id
 
-            lmp_filters["name"] = name_parts[0]
-            if len(name_parts) > 1:
-                potential_lmp_id = name_parts[-1]
-                lmp_filters["lmp_id"] = potential_lmp_id
+        invocation_filters = {}
+        if id:
+            invocation_filters["id"] = id
 
-        invocations = serializer.get_invocations(lmp_filters=lmp_filters, skip=skip, limit=limit)
+        invocations = serializer.get_invocations(
+            lmp_filters=lmp_filters,
+            filters=invocation_filters,
+            skip=skip,
+            limit=limit
+        )
         return invocations
 
     @app.post("/api/invocations/search")