Upload folder using huggingface_hub

components/SimulationGraph.tsx

@@ -1,7 +1,8 @@
 import React, { useEffect, useRef, useState } from 'react';
 import Plotly from 'plotly.js';
-import { X, Linkedin, Globe, MapPin, User, Briefcase, Users } from 'lucide-react';
+import { X, Linkedin, Globe, MapPin, User, Briefcase, Users, Loader2 } from 'lucide-react';
 import Button from './ui/Button';
+import { GradioService } from '../services/gradioService';
 
 interface SimulationGraphProps {
   isBuilding: boolean;
@@ -19,112 +20,128 @@ const SimulationGraph: React.FC<SimulationGraphProps> = ({ isBuilding, societyTy
   }, [isBuilding]);
 
   useEffect(() => {
-    if (!graphDiv.current || isBuilding) return;
-
-    // --- Dynamic Data Generation based on Society Type ---
-    const safeSocietyType = typeof societyType === 'string' ? societyType : '';
-    const isTech = safeSocietyType.includes('Tech') || safeSocietyType.includes('Founders');
-    
-    const N = isTech ? 120 : 80; 
-    const radius = isTech ? 0.18 : 0.22; 
-    const nodes = [];
-
-    // Create nodes
-    for (let i = 0; i < N; i++) {
-      nodes.push({
-        x: Math.random(),
-        y: Math.random(),
-        connections: 0,
-        // Mock data for the popup
-        role: isTech ? ['Founder', 'CTO', 'Product Lead', 'VC'][Math.floor(Math.random() * 4)] : ['Journalist', 'Reader', 'Editor', 'Subscriber'][Math.floor(Math.random() * 4)],
-        location: ['New York, USA', 'London, UK', 'Berlin, DE', 'Paris, FR'][Math.floor(Math.random() * 4)]
-      });
-    }
-
-    // Create edges
-    const edgeX: (number | null)[] = [];
-    const edgeY: (number | null)[] = [];
-    
-    for (let i = 0; i < N; i++) {
-      for (let j = i + 1; j < N; j++) {
-        const dx = nodes[i].x - nodes[j].x;
-        const dy = nodes[i].y - nodes[j].y;
-        const dist = Math.sqrt(dx * dx + dy * dy);
-        
-        if (dist < radius) {
-          nodes[i].connections++;
-          nodes[j].connections++;
-          edgeX.push(nodes[i].x, nodes[j].x, null);
-          edgeY.push(nodes[i].y, nodes[j].y, null);
+    const renderGraph = async () => {
+      if (!graphDiv.current || isBuilding) return;
+
+      let nodes: any[] = [];
+      let edges: any[] = [];
+
+      try {
+        // Attempt to fetch real network data
+        const networkData = await GradioService.getNetworkGraph(societyType);
+        if (networkData && networkData.nodes) {
+          nodes = networkData.nodes.map((n: any) => ({
+            ...n,
+            x: n.x || Math.random(),
+            y: n.y || Math.random(),
+            role: n.name || n.id || 'Persona',
+            location: n.location || 'Unknown'
+          }));
+          edges = networkData.edges || [];
         }
+      } catch (e) {
+        console.warn("Failed to fetch real network, falling back to mock.");
       }
-    }
-
-    const nodeX = nodes.map(n => n.x);
-    const nodeY = nodes.map(n => n.y);
-    const nodeColor = nodes.map(n => n.connections); 
-
-    // --- Plotly Config ---
-    const edgeTrace = {
-      x: edgeX,
-      y: edgeY,
-      mode: 'lines',
-      line: { width: 0.5, color: '#4b5563' },
-      hoverinfo: 'none',
-      type: 'scatter'
-    };
 
-    const nodeTrace = {
-      x: nodeX,
-      y: nodeY,
-      mode: 'markers',
-      hoverinfo: 'none', 
-      marker: {
-        showscale: false,
-        colorscale: isTech ? 'Electric' : 'Viridis',
-        color: nodeColor,
-        size: 10,
-        line: { width: 0 }
-      },
-      type: 'scatter'
-    };
+      // Fallback to mock data if no real data
+      if (nodes.length === 0) {
+        const safeSocietyType = typeof societyType === 'string' ? societyType : '';
+        const isTech = safeSocietyType.includes('Tech') || safeSocietyType.includes('Founders');
+        const N = isTech ? 120 : 80;
+        const radius = isTech ? 0.18 : 0.22;
+
+        for (let i = 0; i < N; i++) {
+          nodes.push({
+            x: Math.random(),
+            y: Math.random(),
+            connections: 0,
+            role: isTech ? ['Founder', 'CTO', 'Product Lead', 'VC'][Math.floor(Math.random() * 4)] : ['Journalist', 'Reader', 'Editor', 'Subscriber'][Math.floor(Math.random() * 4)],
+            location: ['New York, USA', 'London, UK', 'Berlin, DE', 'Paris, FR'][Math.floor(Math.random() * 4)]
+          });
+        }
 
-    const layout = {
-      showlegend: false,
-      hovermode: 'closest',
-      margin: { b: 0, l: 0, r: 0, t: 0 },
-      xaxis: { showgrid: false, zeroline: false, showticklabels: false, range: [-0.05, 1.05], fixedrange: true },
-      yaxis: { showgrid: false, zeroline: false, showticklabels: false, range: [-0.05, 1.05], fixedrange: true },
-      paper_bgcolor: 'rgba(0,0,0,0)',
-      plot_bgcolor: 'rgba(0,0,0,0)',
-      autosize: true,
-      dragmode: false 
-    };
+        for (let i = 0; i < N; i++) {
+          for (let j = i + 1; j < N; j++) {
+            const dx = nodes[i].x - nodes[j].x;
+            const dy = nodes[i].y - nodes[j].y;
+            const dist = Math.sqrt(dx * dx + dy * dy);
+            if (dist < radius) {
+              nodes[i].connections++;
+              nodes[j].connections++;
+              edges.push({ source: i, target: j });
+            }
+          }
+        }
+      }
 
-    const config = { 
-      staticPlot: false, 
-      displayModeBar: false, 
-      responsive: true 
-    };
+      const edgeX: (number | null)[] = [];
+      const edgeY: (number | null)[] = [];
+      edges.forEach(edge => {
+        const source = nodes[edge.source];
+        const target = nodes[edge.target];
+        if (source && target) {
+          edgeX.push(source.x, target.x, null);
+          edgeY.push(source.y, target.y, null);
+        }
+      });
+
+      const nodeX = nodes.map(n => n.x);
+      const nodeY = nodes.map(n => n.y);
+      const nodeColor = nodes.map(n => n.connections || 0);
+
+      const edgeTrace = {
+        x: edgeX,
+        y: edgeY,
+        mode: 'lines',
+        line: { width: 0.5, color: '#4b5563' },
+        hoverinfo: 'none',
+        type: 'scatter'
+      };
+
+      const nodeTrace = {
+        x: nodeX,
+        y: nodeY,
+        mode: 'markers',
+        hoverinfo: 'none',
+        marker: {
+          showscale: false,
+          colorscale: 'Electric',
+          color: nodeColor,
+          size: 10,
+          line: { width: 0 }
+        },
+        type: 'scatter'
+      };
+
+      const layout = {
+        showlegend: false,
+        hovermode: 'closest',
+        margin: { b: 0, l: 0, r: 0, t: 0 },
+        xaxis: { showgrid: false, zeroline: false, showticklabels: false, range: [-0.05, 1.05], fixedrange: true },
+        yaxis: { showgrid: false, zeroline: false, showticklabels: false, range: [-0.05, 1.05], fixedrange: true },
+        paper_bgcolor: 'rgba(0,0,0,0)',
+        plot_bgcolor: 'rgba(0,0,0,0)',
+        autosize: true,
+        dragmode: false
+      };
+
+      const config = { staticPlot: false, displayModeBar: false, responsive: true };
 
-    // @ts-ignore
-    Plotly.newPlot(graphDiv.current, [edgeTrace, nodeTrace], layout, config).then((gd) => {
       // @ts-ignore
-      gd.on('plotly_click', (data) => {
-        const point = data.points[0];
-        if (point) {
-           const nodeIndex = point.pointNumber;
-           const nodeData = nodes[nodeIndex];
-           
-           setSelectedProfile({
-               x: point.x, 
-               y: point.y,
-               data: nodeData
-           });
-        }
+      Plotly.newPlot(graphDiv.current, [edgeTrace, nodeTrace], layout, config).then((gd) => {
+        // @ts-ignore
+        gd.on('plotly_click', (data) => {
+          const point = data.points[0];
+          if (point) {
+            const nodeIndex = point.pointNumber;
+            const nodeData = nodes[nodeIndex];
+            setSelectedProfile({ x: point.x, y: point.y, data: nodeData });
+          }
+        });
       });
-    });
+    };
 
+    renderGraph();
   }, [isBuilding, societyType]);
 
   return (

components/SimulationPage.tsx

@@ -439,7 +439,43 @@ const SimulationPage: React.FC<SimulationPageProps> = ({
                  </button>
                  <button 
                    onClick={async () => {
-                     // Save to backend logic
+                     if (activeModal === 'assemble') {
+                       setIsBuilding(true);
+                       try {
+                         // 1. Generate personas based on profile and company info
+                         const personas = await GradioService.generatePersonas(formData.companyInfo, formData.customerProfile, 5);
+                         
+                         // 2. Generate social network for these personas
+                         const groupName = formData.customerProfile.substring(0, 20);
+                         await GradioService.generateSocialNetwork(groupName, 10, 'scale_free', groupName);
+                         
+                         // 3. Save to backend
+                         await fetch('/api/save-data', {
+                           method: 'POST',
+                           headers: { 'Content-Type': 'application/json' },
+                           body: JSON.stringify({
+                             type: 'assemble',
+                             data: { ...formData, generatedPersonas: personas },
+                             user: user?.preferred_username || 'anonymous'
+                           })
+                         });
+
+                         // 4. Update UI
+                         setSocieties(prev => [groupName, ...prev]);
+                         setSociety(groupName);
+                         setActiveModal('none');
+                         alert('Focus group assembled and selected!');
+                       } catch (e) {
+                         console.error(e);
+                         alert('Failed to assemble group via API. Falling back to local save.');
+                         setActiveModal('none');
+                       } finally {
+                         setIsBuilding(false);
+                       }
+                       return;
+                     }
+
+                     // Save to backend logic for other modals
                      try {
                         const response = await fetch('/api/save-data', {
                           method: 'POST',

gradio_api.txt

@@ -0,0 +1,129 @@
+Loaded as API: https://auxteam-tiny-factory.hf.space
+Client.predict() Usage Info
+---------------------------
+Named API endpoints: 18
+
+ - predict(business_description, customer_profile, num_personas, blablador_api_key, api_name="/generate_personas") -> output_generated_or_matched_persona
+    Parameters:
+     - [Textbox] business_description: str (required)  
+     - [Textbox] customer_profile: str (required)  
+     - [Number] num_personas: float (not required, defaults to:   1)  
+     - [Textbox] blablador_api_key: str | None (not required, defaults to:   None)  
+    Returns:
+     - [Json] output_generated_or_matched_persona: str | float | bool | list | dict (any valid json) 
+
+ - predict(criteria, api_name="/find_best_persona") -> output_generated_or_matched_persona
+    Parameters:
+     - [Textbox] criteria: str (required)  
+    Returns:
+     - [Json] output_generated_or_matched_persona: str | float | bool | list | dict (any valid json) 
+
+ - predict(context, api_name="/identify_personas") -> value_20
+    Parameters:
+     - [Textbox] context: str (required)  
+    Returns:
+     - [Json] value_20: str | float | bool | list | dict (any valid json) 
+
+ - predict(name, persona_count, network_type, focus_group_name, api_name="/generate_social_network") -> value_28
+    Parameters:
+     - [Textbox] name: str (required)  
+     - [Number] persona_count: float (not required, defaults to:   10)  
+     - [Dropdown] network_type: Literal['scale_free', 'small_world'] (not required, defaults to:   scale_free)  
+     - [Textbox] focus_group_name: str | None (not required, defaults to:   None)  
+    Returns:
+     - [Json] value_28: str | float | bool | list | dict (any valid json) 
+
+ - predict(simulation_id, content_text, format, api_name="/predict_engagement") -> value_35
+    Parameters:
+     - [Textbox] simulation_id: str (required)  
+     - [Textbox] content_text: str (required)  
+     - [Textbox] format: str (not required, defaults to:   text)  
+    Returns:
+     - [Json] value_35: str | float | bool | list | dict (any valid json) 
+
+ - predict(simulation_id, content_text, format, api_name="/start_simulation_async") -> value_42
+    Parameters:
+     - [Textbox] simulation_id: str (required)  
+     - [Textbox] content_text: str (required)  
+     - [Textbox] format: str (not required, defaults to:   text)  
+    Returns:
+     - [Json] value_42: str | float | bool | list | dict (any valid json) 
+
+ - predict(simulation_id, api_name="/get_simulation_status") -> value_45
+    Parameters:
+     - [Textbox] simulation_id: str (required)  
+    Returns:
+     - [Json] value_45: str | float | bool | list | dict (any valid json) 
+
+ - predict(simulation_id, sender, message, api_name="/send_chat_message") -> value_53
+    Parameters:
+     - [Textbox] simulation_id: str (required)  
+     - [Textbox] sender: str (not required, defaults to:   User)  
+     - [Textbox] message: str (required)  
+    Returns:
+     - [Json] value_53: str | float | bool | list | dict (any valid json) 
+
+ - predict(simulation_id, api_name="/get_chat_history") -> value_55
+    Parameters:
+     - [Textbox] simulation_id: str (required)  
+    Returns:
+     - [Json] value_55: str | float | bool | list | dict (any valid json) 
+
+ - predict(content_text, num_variants, api_name="/generate_variants") -> value_61
+    Parameters:
+     - [Textbox] content_text: str (required)  
+     - [Number] num_variants: float (not required, defaults to:   5)  
+    Returns:
+     - [Json] value_61: str | float | bool | list | dict (any valid json) 
+
+ - predict(api_name="/list_simulations") -> value_65
+    Parameters:
+     - None
+    Returns:
+     - [Json] value_65: str | float | bool | list | dict (any valid json) 
+
+ - predict(simulation_id, api_name="/list_personas") -> value_69
+    Parameters:
+     - [Textbox] simulation_id: str (required)  
+    Returns:
+     - [Json] value_69: str | float | bool | list | dict (any valid json) 
+
+ - predict(simulation_id, persona_name, api_name="/get_persona") -> value_75
+    Parameters:
+     - [Textbox] simulation_id: str (required)  
+     - [Textbox] persona_name: str (required)  
+    Returns:
+     - [Json] value_75: str | float | bool | list | dict (any valid json) 
+
+ - predict(simulation_id, api_name="/delete_simulation") -> value_80
+    Parameters:
+     - [Textbox] simulation_id: str (required)  
+    Returns:
+     - [Json] value_80: str | float | bool | list | dict (any valid json) 
+
+ - predict(simulation_id, api_name="/export_simulation") -> value_85
+    Parameters:
+     - [Textbox] simulation_id: str (required)  
+    Returns:
+     - [Json] value_85: str | float | bool | list | dict (any valid json) 
+
+ - predict(simulation_id, api_name="/get_network_graph") -> value_90
+    Parameters:
+     - [Textbox] simulation_id: str (required)  
+    Returns:
+     - [Json] value_90: str | float | bool | list | dict (any valid json) 
+
+ - predict(api_name="/list_focus_groups") -> value_94
+    Parameters:
+     - None
+    Returns:
+     - [Json] value_94: str | float | bool | list | dict (any valid json) 
+
+ - predict(name, simulation_id, api_name="/save_focus_group") -> value_98
+    Parameters:
+     - [Textbox] name: str (required)  
+     - [Textbox] simulation_id: str (required)  
+    Returns:
+     - [Json] value_98: str | float | bool | list | dict (any valid json) 
+
+None

services/gradioService.ts

@@ -66,4 +66,37 @@ export class GradioService {
       return [];
     }
   }
+
+  static async generatePersonas(businessDescription: string, customerProfile: string, numPersonas: number = 1) {
+    try {
+      const client = await this.getClient();
+      const result = await client.predict("/generate_personas", [businessDescription, customerProfile, numPersonas, null]);
+      return result.data[0];
+    } catch (error) {
+      console.error("Error generating personas:", error);
+      throw error;
+    }
+  }
+
+  static async generateSocialNetwork(name: string, personaCount: number = 10, networkType: string = "scale_free", focusGroupName: string | null = null) {
+    try {
+      const client = await this.getClient();
+      const result = await client.predict("/generate_social_network", [name, personaCount, networkType, focusGroupName]);
+      return result.data[0];
+    } catch (error) {
+      console.error("Error generating social network:", error);
+      throw error;
+    }
+  }
+
+  static async getNetworkGraph(simulationId: string) {
+    try {
+      const client = await this.getClient();
+      const result = await client.predict("/get_network_graph", [simulationId]);
+      return result.data[0];
+    } catch (error) {
+      console.error("Error getting network graph:", error);
+      throw error;
+    }
+  }
 }