feat: add YAML download support for SDG analysis output

frontend/components/results.tsx

@@ -123,6 +123,88 @@ const Results = ({ results, setResults, setError }: ResultsProps) => {
     }
   };
 
+  const convertToYaml = (obj: unknown, indent: number = 0): string => {
+    const spaces = " ".repeat(indent);
+    if (obj === null || obj === undefined) return `${spaces}null`;
+    if (typeof obj === "boolean") return `${spaces}${obj}`;
+    if (typeof obj === "number") return `${spaces}${obj}`;
+    if (typeof obj === "string") {
+      if (obj.includes("\n") || obj.includes(":") || obj.includes("#")) {
+        return `${spaces}"${obj.replace(/"/g, '\\"')}"`;
+      }
+      return `${spaces}${obj}`;
+    }
+    if (Array.isArray(obj)) {
+      if (obj.length === 0) return `${spaces}[]`;
+      return obj.map((item) => `${spaces}- ${convertToYaml(item, 0).trim()}`).join("\n");
+    }
+    if (typeof obj === "object") {
+      const entries = Object.entries(obj as Record<string, unknown>);
+      if (entries.length === 0) return `${spaces}{}`;
+      return entries
+        .map(([key, value]) => {
+          const formattedKey = key.includes(":") || key.includes(" ") ? `"${key}"` : key;
+          if (typeof value === "object" && value !== null && !Array.isArray(value)) {
+            return `${spaces}${formattedKey}:\n${convertToYaml(value, indent + 2)}`;
+          }
+          return `${spaces}${formattedKey}: ${convertToYaml(value, 0).trim()}`;
+        })
+        .join("\n");
+    }
+    return `${spaces}${String(obj)}`;
+  };
+
+  const handleDownloadYaml = () => {
+    if (!results?.predictions) {
+      setError("No SDG predictions available.");
+      return;
+    }
+    try {
+      const predictions = results.predictions as Record<
+        string,
+        number | SDGValue
+      >;
+      const unsdgData = {
+        sdg_analysis: {
+          analyzed_at: new Date().toISOString(),
+          repositoryName: results.projectName,
+          repositoryUrl: results.projectUrl,
+          predictions,
+          summary: {
+            total_sdgs: Object.keys(predictions).length,
+            high_confidence: Object.values(predictions).filter(
+              (score) => getScore(score) >= 0.7,
+            ).length,
+            medium_confidence: Object.values(predictions).filter(
+              (score) => getScore(score) >= 0.4 && getScore(score) < 0.7,
+            ).length,
+            low_confidence: Object.values(predictions).filter(
+              (score) => getScore(score) < 0.4,
+            ).length,
+          },
+        },
+      };
+
+      const yamlString = convertToYaml(unsdgData);
+      const blob = new Blob([yamlString], { type: "text/yaml" });
+      const url = URL.createObjectURL(blob);
+      const link = document.createElement("a");
+      link.href = url;
+      link.download = "unsdg.yaml";
+      document.body.appendChild(link);
+      link.click();
+      document.body.removeChild(link);
+      URL.revokeObjectURL(url);
+      setSaveMessage("SDG analysis YAML file downloaded successfully!");
+
+      setTimeout(() => {
+        setSaveMessage(null);
+      }, 3000);
+    } catch {
+      setError("Failed to create yaml file for download.");
+    }
+  };
+
   const handleDownload = () => {
     if (!results?.predictions) {
       setError("No SDG predictions available.");
@@ -324,7 +406,15 @@ const Results = ({ results, setResults, setError }: ResultsProps) => {
                         className="cursor-pointer mx-4 px-4 py-2 bg-white text-purple-600 border border-purple-600 rounded-md hover:bg-purple-50 disabled:opacity-50 disabled:cursor-not-allowed transition-colors duration-200"
                       >
                         <span className="flex items-center">
-                          Yes, Download SDG Analysis File
+                          Download as JSON
+                        </span>
+                      </button>
+                      <button
+                        onClick={handleDownloadYaml}
+                        className="cursor-pointer mx-4 px-4 py-2 bg-white text-green-600 border border-green-600 rounded-md hover:bg-green-50 disabled:opacity-50 disabled:cursor-not-allowed transition-colors duration-200"
+                      >
+                        <span className="flex items-center">
+                          Download as YAML
                         </span>
                       </button>
                       <button