synapse-sdk 1.0.0a98__py3-none-any.whl → 1.0.0b1__py3-none-any.whl

synapse_sdk/devtools/web/src/utils/api.js

@@ -1,442 +0,0 @@
-import { createSignal, createEffect, onCleanup } from "solid-js";
-
-// API configuration
-const getApiConfig = () => {
-  const port = window.VITE_API_PORT || 8080;
-  const host = window.VITE_API_HOST || "localhost";
-  return {
-    baseURL: `http://${host}:${port}`,
-    headers: {
-      'Content-Type': 'application/json',
-    },
-  };
-};
-
-// Generic API client
-export class ApiClient {
-  constructor() {
-    this.config = getApiConfig();
-  }
-
-  async request(endpoint, options = {}) {
-    const url = `${this.config.baseURL}${endpoint}`;
-    const config = {
-      ...options,
-      headers: {
-        ...this.config.headers,
-        ...options.headers,
-      },
-    };
-
-    try {
-      const response = await fetch(url, config);
-      
-      if (!response.ok) {
-        throw new Error(`HTTP ${response.status}: ${response.statusText}`);
-      }
-
-      const contentType = response.headers.get('content-type');
-      if (contentType && contentType.includes('application/json')) {
-        return { data: await response.json(), error: null };
-      } else {
-        return { data: await response.text(), error: null };
-      }
-    } catch (error) {
-      console.error('API request failed:', error);
-      return { data: null, error: error.message };
-    }
-  }
-
-  async get(endpoint) {
-    return this.request(endpoint, { method: 'GET' });
-  }
-
-  async post(endpoint, data) {
-    return this.request(endpoint, {
-      method: 'POST',
-      body: JSON.stringify(data),
-    });
-  }
-
-  async put(endpoint, data) {
-    return this.request(endpoint, {
-      method: 'PUT',
-      body: JSON.stringify(data),
-    });
-  }
-
-  async delete(endpoint) {
-    return this.request(endpoint, { method: 'DELETE' });
-  }
-}
-
-// Singleton API client
-export const apiClient = new ApiClient();
-
-// Hook for API GET requests with automatic reactivity
-export function createApiResource(endpoint, options = {}) {
-  const [data, setData] = createSignal(null);
-  const [loading, setLoading] = createSignal(true);
-  const [error, setError] = createSignal(null);
-
-  const fetchData = async () => {
-    // Support function endpoints
-    const resolvedEndpoint = typeof endpoint === 'function' ? endpoint() : endpoint;
-    if (!resolvedEndpoint) {
-      setLoading(false);
-      return;
-    }
-    
-    setLoading(true);
-    setError(null);
-    
-    const result = await apiClient.get(resolvedEndpoint);
-    
-    if (result.error) {
-      setError(result.error);
-      setData(null);
-    } else {
-      setData(result.data);
-      setError(null);
-    }
-    
-    setLoading(false);
-  };
-
-  // Auto-refresh functionality with reduced intervals
-  let intervalId;
-  if (options.autoRefresh && options.refreshInterval) {
-    createEffect(() => {
-      fetchData();
-      intervalId = setInterval(fetchData, options.refreshInterval);
-      
-      onCleanup(() => {
-        if (intervalId) clearInterval(intervalId);
-      });
-    });
-  } else {
-    createEffect(fetchData);
-  }
-
-  const refresh = () => fetchData();
-
-  return {
-    data,
-    loading,
-    error,
-    refresh,
-  };
-}
-
-// Hook for API mutations (POST, PUT, DELETE)
-export function createApiMutation(mutationFn) {
-  const [loading, setLoading] = createSignal(false);
-  const [error, setError] = createSignal(null);
-  const [data, setData] = createSignal(null);
-
-  const mutate = async (...args) => {
-    setLoading(true);
-    setError(null);
-    
-    try {
-      const result = await mutationFn(...args);
-      setData(result);
-      setError(null);
-      return result;
-    } catch (err) {
-      setError(err.message);
-      throw err;
-    } finally {
-      setLoading(false);
-    }
-  };
-
-  return {
-    mutate,
-    data,
-    loading,
-    error,
-  };
-}
-
-// Jobs API
-export function createJobsResource() {
-  return createApiResource('/jobs', { 
-    autoRefresh: true, 
-    refreshInterval: 3000
-  });
-}
-
-export function createJobResource(jobId) {
-  return createApiResource(() => {
-    const id = typeof jobId === 'function' ? jobId() : jobId;
-    return id ? `/jobs/${id}` : null;
-  });
-}
-
-// Applications API  
-export function createApplicationsResource() {
-  return createApiResource('/serve_applications', {
-    autoRefresh: true,
-    refreshInterval: 3000
-  });
-}
-
-export function createApplicationResource(appId) {
-  return createApiResource(() => {
-    const id = typeof appId === 'function' ? appId() : appId;
-    return id ? `/serve_applications/${id}` : null;
-  });
-}
-
-// Status and health API
-export function createStatusResource() {
-  return createApiResource('/status');
-}
-
-export function createBackendHealthResource() {
-  return createApiResource('/health/backend', {
-    autoRefresh: true,
-    refreshInterval: 5000
-  });
-}
-
-export function createAgentHealthResource() {
-  return createApiResource('/health/agent', {
-    autoRefresh: true,
-    refreshInterval: 5000
-  });
-}
-
-export function createAuthTokenResource() {
-  return createApiResource('/auth/token');
-}
-
-// User API - requires token and backend host
-export async function fetchUserInfo(token, backendHost) {
-  if (!token || !backendHost) return null;
-  
-  try {
-    const response = await fetch(`${backendHost}/users/me/`, {
-      method: 'GET',
-      headers: {
-        'Synapse-Access-Token': token,
-        'Content-Type': 'application/json',
-      },
-    });
-
-    if (response.ok) {
-      const userData = await response.json();
-      return {
-        name: userData.name || userData.username || "Unknown",
-        email: userData.email || "No email",
-      };
-    }
-    return null;
-  } catch (error) {
-    console.error('Error fetching user info:', error);
-    return null;
-  }
-}
-
-// Plugin configuration API
-export function createConfigResource() {
-  return createApiResource('/config');
-}
-
-export function createConfigMutation() {
-  return createApiMutation(async (config) => {
-    // Ensure proper data structure for backend
-    const configPayload = {
-      config: config
-    };
-    
-    const result = await apiClient.put('/config', configPayload);
-    if (result.error) throw new Error(result.error);
-    return result.data;
-  });
-}
-
-// Plugin validation API
-export function createValidationMutation() {
-  return createApiMutation(async (config) => {
-    // Ensure proper data structure for backend
-    const configPayload = {
-      config: config
-    };
-    
-    const result = await apiClient.post('/config/validate', configPayload);
-    if (result.error) throw new Error(result.error);
-    return result.data;
-  });
-}
-
-// Job log streaming
-export function createJobLogsStream(jobId) {
-  const [logs, setLogs] = createSignal([]);
-  const [streaming, setStreaming] = createSignal(false);
-  const [error, setError] = createSignal(null);
-
-  let reader = null;
-
-  const parseLogLine = (line) => {
-    const timestampMatch = line.match(
-      /^(\d{4}-\d{2}-\d{2}[T ]\d{2}:\d{2}:\d{2}(?:\.\d{3})?(?:Z|[+-]\d{2}:\d{2})?)/
-    );
-    const levelMatch = line.match(
-      /\[(ERROR|WARN|WARNING|INFO|DEBUG)\]|\b(ERROR|WARN|WARNING|INFO|DEBUG)\b/i
-    );
-
-    let timestamp = undefined;
-    let level = undefined;
-    let message = line;
-
-    if (timestampMatch) {
-      timestamp = timestampMatch[1];
-      message = line.substring(timestampMatch[0].length).trim();
-    }
-
-    if (levelMatch) {
-      level = (levelMatch[1] || levelMatch[2])?.toLowerCase();
-      message = message.replace(
-        /\[(ERROR|WARN|WARNING|INFO|DEBUG)\]|\b(ERROR|WARN|WARNING|INFO|DEBUG)\b/i,
-        ""
-      ).trim();
-    }
-
-    return { message, level, timestamp };
-  };
-
-  const startStreaming = async () => {
-    if (streaming() || !jobId) return;
-
-    try {
-      setStreaming(true);
-      setError(null);
-
-      const config = getApiConfig();
-      const response = await fetch(`${config.baseURL}/jobs/${jobId}/logs`);
-
-      if (!response.ok || !response.body) {
-        throw new Error(`HTTP ${response.status}`);
-      }
-
-      const decoder = new TextDecoder();
-      reader = response.body.getReader();
-      let buffer = "";
-
-      while (true) {
-        const { value, done } = await reader.read();
-        if (done) break;
-
-        buffer += decoder.decode(value, { stream: true });
-        const lines = buffer.split(/\r?\n/);
-        buffer = lines.pop() || "";
-
-        for (const line of lines) {
-          if (!line.trim()) continue;
-          
-          // Handle SSE format (data: prefix)
-          if (line.startsWith('data: ')) {
-            const content = line.substring(6).trim();
-            
-            // Check if this is an error message from the server
-            if (content.includes('Agent client error') || 
-                content.includes('Agent connection error') ||
-                content.includes('Agent error:') ||
-                content.includes('Unexpected error:')) {
-              setError(content);
-              // Still add as a log entry so user can see the error
-              setLogs(prev => [...prev, parseLogLine(content)]);
-            } else {
-              // Normal log line
-              setLogs(prev => [...prev, parseLogLine(content)]);
-            }
-          } else {
-            // Handle non-SSE format (backward compatibility)
-            setLogs(prev => [...prev, parseLogLine(line)]);
-          }
-        }
-      }
-
-      if (buffer.trim()) {
-        setLogs(prev => [...prev, parseLogLine(buffer)]);
-      }
-    } catch (err) {
-      setError(err.message);
-      console.error("Error streaming logs:", err);
-    } finally {
-      setStreaming(false);
-    }
-  };
-
-  const stopStreaming = () => {
-    if (reader) {
-      reader.cancel();
-      reader = null;
-    }
-    setStreaming(false);
-  };
-
-  const clearLogs = () => {
-    setLogs([]);
-  };
-
-  onCleanup(stopStreaming);
-
-  return {
-    logs,
-    streaming,
-    error,
-    startStreaming,
-    stopStreaming,
-    clearLogs,
-  };
-}
-
-// Utility functions
-export function getJobStatusVariant(status) {
-  switch (status?.toLowerCase()) {
-    case "succeeded":
-      return "success";
-    case "failed":
-    case "cancelled":
-      return "error";
-    case "running":
-      return "info";
-    case "pending":
-      return "warning";
-    default:
-      return "default";
-  }
-}
-
-export function formatTimestamp(timeStr) {
-  if (!timeStr) return "N/A";
-  try {
-    const date = new Date(timeStr);
-    return date.toLocaleString("sv-SE").replace("T", " ");
-  } catch {
-    return timeStr;
-  }
-}
-
-export function formatJobDuration(startTime, endTime) {
-  if (!startTime) return "N/A";
-
-  const start = new Date(startTime);
-  const end = endTime ? new Date(endTime) : new Date();
-  const durationMs = end.getTime() - start.getTime();
-
-  const seconds = Math.floor(durationMs / 1000);
-  const minutes = Math.floor(seconds / 60);
-  const hours = Math.floor(minutes / 60);
-
-  if (hours > 0) {
-    return `${hours}h ${minutes % 60}m ${seconds % 60}s`;
-  } else if (minutes > 0) {
-    return `${minutes}m ${seconds % 60}s`;
-  } else {
-    return `${seconds}s`;
-  }
-}

synapse_sdk/devtools/web/src/views/ApplicationDetailView.jsx

@@ -1,241 +0,0 @@
-import { Show, For, createMemo } from "solid-js";
-import { useParams, useNavigate } from "@solidjs/router";
-import { createApplicationResource, formatTimestamp } from "../utils/api";
-import { ArrowLeftIcon, RefreshIcon, CubeIcon } from "../components/icons";
-import Breadcrumbs from "../components/Breadcrumbs";
-
-export default function ApplicationDetailView() {
-  const params = useParams();
-  const navigate = useNavigate();
-
-  const appId = () => params.id;
-  const { data, loading, error, refresh } = createApplicationResource(() => appId());
-
-  const getStatusClass = (status) => {
-    switch (status?.toUpperCase()) {
-      case "RUNNING":
-        return "badge-outline badge-success";
-      case "DEPLOYING":
-        return "badge-outline badge-info";
-      case "DEPLOY_FAILED":
-        return "badge-outline badge-error";
-      case "DELETING":
-        return "badge-outline badge-warning";
-      default:
-        return "badge-outline badge-neutral";
-    }
-  };
-
-  const hasDeployments = createMemo(() => 
-    data()?.deployments && data().deployments.length > 0
-  );
-
-  return (
-    <div class="p-6">
-      {/* Breadcrumbs */}
-      <Breadcrumbs 
-        items={[
-          { label: "Serve Apps", path: "/serve_applications" },
-          { label: data()?.name || appId() || "Application Details" }
-        ]} 
-      />
-
-      {/* Header */}
-      <div class="flex justify-between items-center mb-6">
-        <div class="flex items-center gap-4">
-          <button 
-            class="btn btn-sm btn-outline"
-            onClick={() => navigate(-1)}
-          >
-            <ArrowLeftIcon class="w-4 h-4 mr-2" />
-            Back
-          </button>
-          <div>
-            <h1 class="text-2xl font-semibold text-slate-900">Application Details</h1>
-            <p class="text-sm text-slate-600">View serve application details and deployments</p>
-          </div>
-        </div>
-        <button 
-          class="btn btn-sm btn-primary"
-          onClick={refresh}
-          disabled={loading()}
-        >
-          <RefreshIcon class="w-4 h-4 mr-2" />
-          {loading() ? "Refreshing..." : "Refresh"}
-        </button>
-      </div>
-
-      {/* Error State */}
-      <Show when={error()}>
-        <div class="alert alert-error mb-6">
-          <div>
-            <h3 class="font-medium">Failed to load application details</h3>
-            <div class="text-sm">{error()}</div>
-          </div>
-        </div>
-      </Show>
-
-      {/* Loading State */}
-      <Show when={loading() && !data()}>
-        <div class="flex flex-col items-center justify-center py-12">
-          <div class="loading loading-spinner loading-lg mb-4"></div>
-          <p class="text-slate-500">Loading application details...</p>
-        </div>
-      </Show>
-
-      {/* Application Not Found */}
-      <Show when={!loading() && !data() && !error()}>
-        <div class="flex flex-col items-center justify-center py-12">
-          <div class="text-slate-400 mb-4">
-            <CubeIcon class="w-16 h-16" />
-          </div>
-          <h3 class="text-lg font-medium text-slate-900 mb-2">Application not found</h3>
-          <p class="text-slate-500">The requested application could not be found</p>
-        </div>
-      </Show>
-
-      {/* Application Details */}
-      <Show when={data()}>
-        <div class="space-y-6">
-          {/* Application Overview */}
-          <div class="card bg-white shadow-professional">
-            <div class="card-body p-6">
-              <h2 class="text-lg font-semibold text-slate-900 mb-4">Overview</h2>
-              
-              <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
-                <div class="bg-slate-50 p-4 rounded-lg">
-                  <div class="text-xs font-medium text-slate-600 uppercase tracking-wide mb-1">
-                    Application Name
-                  </div>
-                  <div class="font-medium text-slate-900">
-                    {data().name}
-                  </div>
-                </div>
-
-                <div class="bg-slate-50 p-4 rounded-lg">
-                  <div class="text-xs font-medium text-slate-600 uppercase tracking-wide mb-1">
-                    Status
-                  </div>
-                  <span class={`badge badge-sm ${getStatusClass(data().status)}`}>
-                    {data().status}
-                  </span>
-                </div>
-
-                <div class="bg-slate-50 p-4 rounded-lg">
-                  <div class="text-xs font-medium text-slate-600 uppercase tracking-wide mb-1">
-                    Route Prefix
-                  </div>
-                  <code class="text-sm bg-slate-200 px-2 py-1 rounded">
-                    {data().route_prefix || '/'}
-                  </code>
-                </div>
-
-                <Show when={data().docs_path}>
-                  <div class="bg-slate-50 p-4 rounded-lg">
-                    <div class="text-xs font-medium text-slate-600 uppercase tracking-wide mb-1">
-                      Docs Path
-                    </div>
-                    <code class="text-sm text-slate-700">
-                      {data().docs_path}
-                    </code>
-                  </div>
-                </Show>
-
-                <div class="bg-slate-50 p-4 rounded-lg">
-                  <div class="text-xs font-medium text-slate-600 uppercase tracking-wide mb-1">
-                    Deployments
-                  </div>
-                  <div class="text-sm text-slate-700">
-                    {data().deployments?.length || 0} deployment{(data().deployments?.length || 0) !== 1 ? 's' : ''}
-                  </div>
-                </div>
-
-                <Show when={data().last_deployed_time_s}>
-                  <div class="bg-slate-50 p-4 rounded-lg">
-                    <div class="text-xs font-medium text-slate-600 uppercase tracking-wide mb-1">
-                      Last Deployed
-                    </div>
-                    <div class="text-sm text-slate-700">
-                      {new Date(data().last_deployed_time_s * 1000).toLocaleString()}
-                    </div>
-                  </div>
-                </Show>
-              </div>
-            </div>
-          </div>
-
-          {/* Deployments */}
-          <Show when={hasDeployments()}>
-            <div class="card bg-white shadow-professional">
-              <div class="card-body p-6">
-                <h2 class="text-lg font-semibold text-slate-900 mb-4">Deployments</h2>
-                
-                <div class="overflow-x-auto">
-                  <table class="table table-xs w-full">
-                    <thead>
-                      <tr class="border-slate-200">
-                        <th class="bg-slate-50 text-slate-600 font-medium text-xs">Name</th>
-                        <th class="bg-slate-50 text-slate-600 font-medium text-xs">Status</th>
-                        <th class="bg-slate-50 text-slate-600 font-medium text-xs">Replicas</th>
-                        <th class="bg-slate-50 text-slate-600 font-medium text-xs">Route Prefix</th>
-                        <th class="bg-slate-50 text-slate-600 font-medium text-xs">Message</th>
-                      </tr>
-                    </thead>
-                    <tbody>
-                      <For each={data().deployments}>
-                        {(deployment) => (
-                          <tr class="border-slate-100">
-                            <td class="py-3">
-                              <span class="font-medium text-slate-900">{deployment.name}</span>
-                            </td>
-                            <td>
-                              <span class={`badge badge-sm ${getStatusClass(deployment.status)}`}>
-                                {deployment.status}
-                              </span>
-                            </td>
-                            <td>
-                              <div class="flex items-center gap-2">
-                                <span class="text-sm">{deployment.replica_count || 0}</span>
-                                <Show when={deployment.target_replica_count !== deployment.replica_count}>
-                                  <span class="text-xs text-slate-500">
-                                    → {deployment.target_replica_count}
-                                  </span>
-                                </Show>
-                              </div>
-                            </td>
-                            <td>
-                              <code class="text-xs bg-slate-100 px-2 py-1 rounded">
-                                {deployment.route_prefix || '/'}
-                              </code>
-                            </td>
-                            <td class="max-w-xs">
-                              <div class="truncate text-sm text-slate-600">
-                                {deployment.message || '—'}
-                              </div>
-                            </td>
-                          </tr>
-                        )}
-                      </For>
-                    </tbody>
-                  </table>
-                </div>
-              </div>
-            </div>
-          </Show>
-
-          {/* Raw Application Data */}
-          <div class="card bg-white shadow-professional">
-            <div class="card-body p-6">
-              <h2 class="text-lg font-semibold text-slate-900 mb-4">Raw Data</h2>
-              <div class="bg-slate-50 p-4 rounded-lg">
-                <pre class="text-xs text-slate-700 overflow-auto max-h-96">
-                  {JSON.stringify(data(), null, 2)}
-                </pre>
-              </div>
-            </div>
-          </div>
-        </div>
-      </Show>
-    </div>
-  );
-}