Add youtube downloader

src/components/PluginCard.tsx

@@ -3,6 +3,7 @@ import { Card } from "@/components/ui/card";
 import { Badge } from "@/components/ui/badge";
 import { Button } from "@/components/ui/button";
 import { Input } from "@/components/ui/input";
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select";
 import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
 import { PluginMetadata } from "@/client/hooks/usePlugin";
 import { Play, ChevronDown, ChevronUp, Copy, Check } from "lucide-react";
@@ -116,6 +117,42 @@ export function PluginCard({ plugin }: PluginCardProps) {
     setTimeout(() => setCopiedRequestUrl(false), 2000);
   };
 
+  const renderParameterInput = (param: any) => {
+    if (param.enum && Array.isArray(param.enum) && param.enum.length > 0) {
+      return (
+        <Select
+          value={paramValues[param.name] || ""}
+          onValueChange={(value) => handleParamChange(param.name, value)}
+        >
+          <SelectTrigger className="bg-black/50 border-white/10 text-white focus:border-purple-500">
+            <SelectValue placeholder={`Select ${param.name}...`} />
+          </SelectTrigger>
+          <SelectContent className="bg-zinc-900 border-white/10">
+            {param.enum.map((option: any) => (
+              <SelectItem 
+                key={option} 
+                value={option.toString()}
+                className="text-white hover:bg-white/10 focus:bg-white/10"
+              >
+                {option}
+              </SelectItem>
+            ))}
+          </SelectContent>
+        </Select>
+      );
+    } else {
+      return (
+        <Input
+          type="text"
+          placeholder={param.example?.toString() || param.description}
+          value={paramValues[param.name] || ""}
+          onChange={(e) => handleParamChange(param.name, e.target.value)}
+          className="bg-black/50 border-white/10 text-white focus:border-purple-500"
+        />
+      );
+    }
+  };
+
   const hasQueryParams = plugin.parameters?.query && plugin.parameters.query.length > 0;
   const hasBodyParams = plugin.parameters?.body && plugin.parameters.body.length > 0;
   const hasPathParams = plugin.parameters?.path && plugin.parameters.path.length > 0;
@@ -280,7 +317,14 @@ export function PluginCard({ plugin }: PluginCardProps) {
                       {plugin.parameters?.path?.map((param) => (
                         <tr key={param.name} className="border-b border-white/5">
                           <td className="py-3 pr-4 text-white font-mono">{param.name}</td>
-                          <td className="py-3 pr-4 text-blue-400 font-mono text-xs">{param.type}</td>
+                          <td className="py-3 pr-4">
+                            <span className="text-blue-400 font-mono text-xs">{param.type}</span>
+                            {param.enum && (
+                              <span className="ml-2 text-xs text-gray-500">
+                                (options: {param.enum.join(', ')})
+                              </span>
+                            )}
+                          </td>
                           <td className="py-3 pr-4">
                             <span className={param.required ? "text-red-400" : "text-gray-500"}>
                               {param.required ? "Yes" : "No"}
@@ -293,7 +337,14 @@ export function PluginCard({ plugin }: PluginCardProps) {
                       {plugin.parameters?.query?.map((param) => (
                         <tr key={param.name} className="border-b border-white/5">
                           <td className="py-3 pr-4 text-white font-mono">{param.name}</td>
-                          <td className="py-3 pr-4 text-blue-400 font-mono text-xs">{param.type}</td>
+                          <td className="py-3 pr-4">
+                            <span className="text-blue-400 font-mono text-xs">{param.type}</span>
+                            {param.enum && (
+                              <span className="ml-2 text-xs text-gray-500">
+                                (options: {param.enum.join(', ')})
+                              </span>
+                            )}
+                          </td>
                           <td className="py-3 pr-4">
                             <span className={param.required ? "text-red-400" : "text-gray-500"}>
                               {param.required ? "Yes" : "No"}
@@ -306,7 +357,14 @@ export function PluginCard({ plugin }: PluginCardProps) {
                       {plugin.parameters?.body?.map((param) => (
                         <tr key={param.name} className="border-b border-white/5">
                           <td className="py-3 pr-4 text-white font-mono">{param.name}</td>
-                          <td className="py-3 pr-4 text-blue-400 font-mono text-xs">{param.type}</td>
+                          <td className="py-3 pr-4">
+                            <span className="text-blue-400 font-mono text-xs">{param.type}</span>
+                            {param.enum && (
+                              <span className="ml-2 text-xs text-gray-500">
+                                (options: {param.enum.join(', ')})
+                              </span>
+                            )}
+                          </td>
                           <td className="py-3 pr-4">
                             <span className={param.required ? "text-red-400" : "text-gray-500"}>
                               {param.required ? "Yes" : "No"}
@@ -388,14 +446,13 @@ export function PluginCard({ plugin }: PluginCardProps) {
                       {param.name}
                       {param.required && <span className="text-red-400 ml-1">*</span>}
                       <span className="text-xs text-gray-500 ml-2">({param.type})</span>
+                      {param.enum && (
+                        <span className="text-xs text-purple-400 ml-2">
+                          • Select from options
+                        </span>
+                      )}
                     </label>
-                    <Input
-                      type="text"
-                      placeholder={param.example?.toString() || param.description}
-                      value={paramValues[param.name] || ""}
-                      onChange={(e) => handleParamChange(param.name, e.target.value)}
-                      className="bg-black/50 border-white/10 text-white focus:border-purple-500"
-                    />
+                    {renderParameterInput(param)}
                     <p className="text-xs text-gray-500 mt-1">{param.description}</p>
                   </div>
                 ))}
@@ -407,14 +464,13 @@ export function PluginCard({ plugin }: PluginCardProps) {
                       {param.name}
                       {param.required && <span className="text-red-400 ml-1">*</span>}
                       <span className="text-xs text-gray-500 ml-2">({param.type})</span>
+                      {param.enum && (
+                        <span className="text-xs text-purple-400 ml-2">
+                          • Select from options
+                        </span>
+                      )}
                     </label>
-                    <Input
-                      type="text"
-                      placeholder={param.example?.toString() || param.description}
-                      value={paramValues[param.name] || ""}
-                      onChange={(e) => handleParamChange(param.name, e.target.value)}
-                      className="bg-black/50 border-white/10 text-white focus:border-purple-500"
-                    />
+                    {renderParameterInput(param)}
                     <p className="text-xs text-gray-500 mt-1">{param.description}</p>
                   </div>
                 ))}
@@ -498,4 +554,4 @@ export function PluginCard({ plugin }: PluginCardProps) {
       )}
     </Card>
   );
-}
+}

src/server/index.ts

@@ -111,7 +111,7 @@ app.use((req, res, next) => {
     if (path.startsWith("/api")) {
       let logLine = `${req.method} ${path} ${res.statusCode} in ${duration}ms`;
       if (capturedJsonResponse) {
-        logLine += ` :: ${JSON.stringify(capturedJsonResponse)}`;
+        logLine += ` :: ${JSON.stringify(capturedJsonResponse, null, 2)}`;
       }
 
       log(logLine);

src/server/plugins/downloader/youtube.js

@@ -0,0 +1,138 @@
+import axios from "axios";
+import { sendSuccess, ErrorResponses } from "../../lib/response-helper.js";
+
+class Youtube {
+  constructor() {
+    this.API_URL = "https://thesocialcat.com/api/youtube-download";
+    this.HEADERS = {
+      "accept": "*/*",
+      "accept-language": "id-ID",
+      "content-type": "application/json",
+      "Referer": "https://thesocialcat.com/tools/youtube-video-downloader",
+      "Referrer-Policy": "strict-origin-when-cross-origin"
+    };
+
+    this.CREATED_BY = "Ditzzy";
+    this.NOTE = "Thank you for using this scrape, I hope you appreciate me for making this scrape by not deleting wm";
+  }
+
+  wrapResponse(data) {
+    return {
+      created_by: this.CREATED_BY,
+      note: this.NOTE,
+      results: data
+    };
+  }
+  
+  async download(url, format) {
+    try {
+      const config = {
+        url: this.API_URL,
+        headers: this.HEADERS,
+        method: "POST",
+        data: {
+          format,
+          url
+        }
+      };
+
+      const { data } = await axios.request(config);
+      return this.wrapResponse(data);
+    } catch (e) {
+      throw new Error(`Error downloading YouTube content: ${e}`);
+    }
+  }
+}
+
+/** @type {import("../../types/plugin").ApiPluginHandler} */
+const handler = {
+  name: "YouTube Downloader",
+  description: "Download YouTube media with resolution up to 1080p and support audio",
+  version: "1.0.0",
+  method: "GET",
+  category: ["downloader"],
+  alias: ["youtube", "yt"],
+  tags: ["social-media", "video", "downloader"],
+  parameters: {
+    query: [
+      {
+        name: "url",
+        type: "string",
+        required: true,
+        description: "Your YouTube URL",
+        example: "https://youtu.be/zawDTvoXT8k?si=FgZnxXzMXJI8jfkB"
+      },
+      {
+        name: "format",
+        type: "string",
+        required: true,
+        description: "Format to download",
+        example: "720p",
+        enum: ["144p", "240p", "360p", "480p", "720p", "1080p", "audio"],
+        default: "720p"
+      }
+    ],
+    body: [],
+    headers: []
+  },
+  responses: {
+    200: {
+      status: 200,
+      description: "Successfully retrieved YouTube video data",
+      example: {
+        status: 200,
+        author: "Ditzzy",
+        note: "Thank you for using this API!",
+        results: {}
+      }
+    },
+    400: {
+      status: 400,
+      description: "Invalid YouTube URL provided",
+      example: {
+        status: 400,
+        message: "Invalid URL - must be a valid YouTube URL"
+      }
+    },
+    404: {
+      status: 404,
+      description: "Missing required parameter",
+      example: {
+        status: 404,
+        message: "Missing required parameter: ..."
+      }
+    },
+    500: {
+      status: 500,
+      description: "Server error or YouTube API unavailable",
+      example: {
+        status: 500,
+        message: "An error occurred, please try again later."
+      }
+    }
+  },
+  exec: async (req, res) => {
+    const { url } = req.query
+    const { format } = req.query
+    
+    if (!url) return ErrorResponses.missingParameter(res, "url");
+    
+    if (!format) return ErrorResponses.missingParameter(res, "format");
+    
+    const regex = /^(https?:\/\/)?((www\.|m\.)?youtube(-nocookie)?\.com|youtu\.be)(\/(embed\/|v\/|watch\?v=|watch\?.+&v=|shorts\/)?)([\w-]{11})(\S+)?$/;
+    
+    if (!regex.test(url)) return ErrorResponses.invalidUrl(res, "Invalid URL - must be a valid YouTube URL");
+    
+    const yt = new Youtube();    
+    try {
+      const download = await yt.download(url, format);
+      
+      return sendSuccess(res, download.results);
+    } catch (e) {
+      console.error("TikTok download error:", e);
+      return ErrorResponses.serverError(res);
+    }
+  }
+}
+
+export default handler;