formatting

autogpt_platform/frontend/src/app/[lang]/store/agent/[creator]/[slug]/page.tsx

@@ -86,7 +86,7 @@ export default async function Page({
           description="Join our ever-growing community of hackers and tinkerers"
           buttonText="Become a Creator"
         />
-        
+
         <div className="fixed bottom-8 right-8">
           <RatingCard
             agentName={agent.agent_name}

autogpt_platform/frontend/src/components/agptui/RatingCard.stories.tsx

@@ -41,4 +41,4 @@ export const WithoutCallbacks: Story = {
   args: {
     agentName: "Test Agent",
   },
-};
+};

autogpt_platform/frontend/src/components/agptui/RatingCard.tsx

@@ -22,9 +22,9 @@ export const RatingCard: React.FC<RatingCardProps> = ({
   const supabase = createClient();
 
   const api = new AutoGPTServerAPI(
-        process.env.NEXT_PUBLIC_AGPT_SERVER_URL,
-        process.env.NEXT_PUBLIC_AGPT_WS_SERVER_URL,
-        supabase,
+    process.env.NEXT_PUBLIC_AGPT_SERVER_URL,
+    process.env.NEXT_PUBLIC_AGPT_WS_SERVER_URL,
+    supabase,
   );
 
   const handleClose = () => {
@@ -35,63 +35,67 @@ export const RatingCard: React.FC<RatingCardProps> = ({
 
   const handleSubmit = async (rating: number) => {
     if (rating > 0) {
-        console.log(`Rating submitted for ${agentName}:`, rating);
-        await api.reviewAgent("--", agentName, {
-          store_listing_version_id: storeListingVersionId,
-          score: rating
-        });
-        handleClose();
+      console.log(`Rating submitted for ${agentName}:`, rating);
+      await api.reviewAgent("--", agentName, {
+        store_listing_version_id: storeListingVersionId,
+        score: rating,
+      });
+      handleClose();
     }
   };
 
   const getRatingText = (rating: number) => {
     switch (rating) {
-      case 1: return "Needs improvement";
-      case 2: return "Meh";
-      case 3: return "Average";
-      case 4: return "Good";
-      case 5: return "Awesome!";
-      default: return "Rate it!";
+      case 1:
+        return "Needs improvement";
+      case 2:
+        return "Meh";
+      case 3:
+        return "Average";
+      case 4:
+        return "Good";
+      case 5:
+        return "Awesome!";
+      default:
+        return "Rate it!";
     }
   };
 
   return (
-    <div className="w-[400px] p-8 bg-white rounded-[32px] shadow-lg flex flex-col relative">
-      <button 
+    <div className="relative flex w-[400px] flex-col rounded-[32px] bg-white p-8 shadow-lg">
+      <button
         onClick={handleClose}
-        className="absolute top-6 right-6 w-6 h-6 text-gray-400 hover:text-gray-600 transition-colors"
+        className="absolute right-6 top-6 h-6 w-6 text-gray-400 transition-colors hover:text-gray-600"
       >
-        <Cross1Icon className="w-5 h-5" />
+        <Cross1Icon className="h-5 w-5" />
       </button>
-      
-      <div className="text-xl font-semibold text-center mb-2">
-        Rate agent
-      </div>
 
-      <div className="text-gray-600 text-sm text-center mb-6">
+      <div className="mb-2 text-center text-xl font-semibold">Rate agent</div>
+
+      <div className="mb-6 text-center text-sm text-gray-600">
         Could you rate {agentName} agent for us?
       </div>
-      
-      <div className="flex flex-col items-center mb-6">
-        <div className="flex gap-2 mb-2">
+
+      <div className="mb-6 flex flex-col items-center">
+        <div className="mb-2 flex gap-2">
           {[1, 2, 3, 4, 5].map((star) => (
             <button
               key={star}
-              className="w-8 h-8 flex items-center justify-center"
+              className="flex h-8 w-8 items-center justify-center"
               onMouseEnter={() => setHoveredRating(star)}
               onMouseLeave={() => setHoveredRating(0)}
               onClick={() => setRating(star)}
             >
               {star <= (hoveredRating || rating) ? (
-                <IconStarFilled className="w-8 h-8 text-yellow-400" />
+                <IconStarFilled className="h-8 w-8 text-yellow-400" />
               ) : (
-                <IconStar className="w-8 h-8 text-gray-200" />
+                <IconStar className="h-8 w-8 text-gray-200" />
               )}
             </button>
           ))}
         </div>
 
-        <div className="text-gray-600 text-sm text-center">
+        <div className="text-center text-sm text-gray-600">
           {getRatingText(hoveredRating || rating)}
         </div>
       </div>
@@ -99,15 +103,15 @@ export const RatingCard: React.FC<RatingCardProps> = ({
       <div className="self-end">
         <button
           onClick={() => rating > 0 && handleSubmit(rating)}
-          className={`px-6 py-2 rounded-full text-sm font-medium transition-colors
-            ${rating > 0 
-              ? "bg-slate-900 text-white hover:bg-slate-800 cursor-pointer" 
-              : "bg-gray-200 text-gray-400 cursor-not-allowed"
-            }`}
+          className={`rounded-full px-6 py-2 text-sm font-medium transition-colors ${
+            rating > 0
+              ? "cursor-pointer bg-slate-900 text-white hover:bg-slate-800"
+              : "cursor-not-allowed bg-gray-200 text-gray-400"
+          }`}
         >
           Submit
         </button>
       </div>
     </div>
   );
-};
+};

autogpt_platform/frontend/src/lib/autogpt-server-api/baseClient.ts

@@ -345,7 +345,11 @@ export default class BaseAutoGPTServerAPI {
     review: StoreReviewCreate,
   ): Promise<StoreReview> {
     console.log("Reviewing agent: ", username, agentName, review);
-    return this._request("POST", `/store/agents/${username}/${agentName}/review`, review);
+    return this._request(
+      "POST",
+      `/store/agents/${username}/${agentName}/review`,
+      review,
+    );
   }
 
   getMyAgents(params?: {