Add Terraform autoscaling snippet and chart to ROI tools

Author: haasonsaas

web/src/pages/ToolsPage.css

@@ -168,3 +168,20 @@
 .tools__empty {
   color: rgba(148, 163, 184, 0.75);
 }
+
+.tools__terraform-comment {
+  color: rgba(148, 163, 184, 0.8);
+  font-size: 0.85rem;
+  margin: 0 0 0.75rem;
+}
+
+.tools__terraform-snippet {
+  background: rgba(15, 23, 42, 0.85);
+  border: 1px solid rgba(148, 163, 184, 0.2);
+  border-radius: 0.75rem;
+  padding: 0.75rem 1rem;
+  font-family: "JetBrains Mono", "Fira Code", monospace;
+  font-size: 0.85rem;
+  color: rgba(226, 232, 240, 0.95);
+  white-space: pre-wrap;
+}

web/src/pages/ToolsPage.tsx

@@ -26,6 +26,12 @@ interface CostPoint {
   nimbusMonthly: number;
 }
 
+interface TerraformSuggestion {
+  desiredCapacity: number;
+  comment: string;
+  snippet: string;
+}
+
 const DEFAULT_INPUTS: RoiInputs = {
   runsPerDay: 180,
   avgRuntimeMins: 12,
@@ -109,6 +115,28 @@ export function ToolsPage() {
     URL.revokeObjectURL(url);
   };
 
+  const terraformSuggestion = useMemo<TerraformSuggestion>(() => {
+    const totalMinutesPerDay = inputs.runsPerDay * inputs.avgRuntimeMins;
+    const targetUtilisationMinutes = 8 * 60; // assume 8 productive hours per agent
+    const desiredCapacity = Math.max(1, Math.ceil(totalMinutesPerDay / targetUtilisationMinutes));
+    const snippet = [
+      "# Suggested values generated by the ROI calculator",
+      `agent_instance_type = "t3.large"`,
+      `agent_desired_capacity = ${desiredCapacity}`,
+    ].join("\n");
+    const comment =
+      "Assuming ~8 productive hours per agent each day. Tweak the instance type or desired capacity to match your workload.";
+    return {
+      desiredCapacity,
+      comment,
+      snippet,
+    };
+  }, [inputs]);
+
+  const handleCopyTerraform = () => {
+    void navigator.clipboard.writeText(terraformSuggestion.snippet);
+  };
+
   return (
     <div className="tools__container">
       <header className="tools__header">
@@ -187,6 +215,19 @@ export function ToolsPage() {
           </li>
         </ul>
       </section>
+
+      <section className="tools__section">
+        <div className="tools__chart-header">
+          <h2>Terraform autoscaling snippet</h2>
+          <button type="button" onClick={handleCopyTerraform} className="tools__download">
+            Copy snippet
+          </button>
+        </div>
+        <p className="tools__terraform-comment">{terraformSuggestion.comment}</p>
+        <pre className="tools__terraform-snippet">
+{terraformSuggestion.snippet}
+        </pre>
+      </section>
     </div>
   );
 }

web/src/pages/__tests__/ToolsPage.test.tsx

@@ -18,6 +18,8 @@ describe('ToolsPage', () => {
     expect(screen.getByText(/GitHub Actions monthly cost/i)).toBeInTheDocument();
     expect(screen.getByRole('img', { name: /Monthly cost comparison/i })).toBeInTheDocument();
     expect(screen.getByText(/Download CSV/i)).toBeInTheDocument();
+    expect(screen.getByText(/terraform autoscaling snippet/i)).toBeInTheDocument();
+    expect(screen.getByText(/agent_desired_capacity/)).toBeInTheDocument();
   });
 
   it('updates calculations when inputs change', () => {