fix: send instance_id as number; rotate funnel chart x-axis labels

src/api/viewService.ts

@@ -319,9 +319,10 @@ export function performActivity(
   activityId: string,
   data?: Record<string, unknown>,
 ): Promise<WorkflowResponse> {
+  const numericInstanceId = Number(instanceId);
   return request("POST", `/app/${APP_ID}/activity`, {
     workflow_uuid: workflowUuid,
-    instance_id: instanceId,
+    instance_id: Number.isNaN(numericInstanceId) ? instanceId : numericInstanceId,
     activity_id: activityId,
     data,
   });
@@ -334,12 +335,15 @@ export function submitForm(
   instanceId?: string,
   deviceType = "desktop",
 ): Promise<WorkflowResponse> {
+  const numericInstanceId = instanceId ? Number(instanceId) : undefined;
   return request("POST", `/app/${APP_ID}/form/submit`, {
     workflow_uuid: workflowUuid,
     activity_id: activityId,
     device_type: deviceType,
     form_data: formData,
-    ...(instanceId ? { instance_id: instanceId } : {}),
+    ...(numericInstanceId && !Number.isNaN(numericInstanceId)
+      ? { instance_id: numericInstanceId }
+      : {}),
   });
 }
 

src/components/variants/VariantB.tsx

@@ -385,9 +385,18 @@ function DashboardContent({
                           <Legend verticalAlign="middle" align="right" layout="vertical" iconType="circle" wrapperStyle={{ fontSize: 12 }} />
                         </RPieChart>
                       ) : (
-                        <RBarChart data={data} margin={{ top: 5, right: 10, left: -10, bottom: 5 }}>
+                        <RBarChart data={data} margin={{ top: 5, right: 10, left: -10, bottom: 50 }}>
                           <CartesianGrid strokeDasharray="3 3" stroke="#f5f5f4" vertical={false} />
-                          <XAxis dataKey="name" tick={{ fontSize: 11, fill: "#78716c" }} interval={0} axisLine={false} tickLine={false} />
+                          <XAxis
+                            dataKey="name"
+                            tick={{ fontSize: 11, fill: "#78716c" }}
+                            interval={0}
+                            angle={-25}
+                            textAnchor="end"
+                            height={60}
+                            axisLine={false}
+                            tickLine={false}
+                          />
                           <YAxis tick={{ fontSize: 11, fill: "#78716c" }} allowDecimals={false} axisLine={false} tickLine={false} />
                           <Tooltip cursor={{ fill: ACCENT_SOFT }} contentStyle={{ fontSize: 12, borderRadius: 12, border: "none", boxShadow: "0 4px 12px rgba(0,0,0,0.1)" }} />
                           <Bar dataKey="value" radius={[8, 8, 0, 0]}>