fix(frontend/marketplace): require category selection (#10031)

## Summary
- require categories to be selected in PublishAgent popout

### Changes 🏗️
Makes it require the categories to be set before allowing an agent to be
uploaded
added popup notification to say its missing categories 

### Checklist 📋

#### For code changes:
- [x] I have clearly listed my changes in the PR description
- [x] I have made a test plan
- [x] I have tested my changes according to the test plan:
  <!-- Put your test plan here: -->
- [x] Try to upload a agent with out setting categories and it will
error and show message saying "Missing Required Fields, Please fill in:
Categories"
- [x] Now try to upload a agent with the categories set and it will work

Co-authored-by: Bently <[email protected]>

Author: itsababseh

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

@@ -159,9 +159,16 @@ export const PublishAgentInfo: React.FC<PublishAgentInfoProps> = ({
 
   const handleSubmit = (e: React.MouseEvent<HTMLButtonElement>) => {
     e.preventDefault();
-    onSubmit(title, subheader, slug, description, images, youtubeLink, [
-      category,
-    ]);
+    const categories = category ? [category] : [];
+    onSubmit(
+      title,
+      subheader,
+      slug,
+      description,
+      images,
+      youtubeLink,
+      categories,
+    );
   };
 
   return (

autogpt_platform/frontend/src/components/agptui/composite/PublishAgentPopout.tsx

@@ -155,7 +155,7 @@ export const PublishAgentPopout: React.FC<PublishAgentPopoutProps> = ({
     if (!subHeading) missingFields.push("Sub-heading");
     if (!description) missingFields.push("Description");
     if (!imageUrls.length) missingFields.push("Image");
-    if (!categories.length) missingFields.push("Categories");
+    if (!categories.filter(Boolean).length) missingFields.push("Categories");
 
     if (missingFields.length > 0) {
       toast({
@@ -166,6 +166,7 @@ export const PublishAgentPopout: React.FC<PublishAgentPopoutProps> = ({
       return;
     }
 
+    const filteredCategories = categories.filter(Boolean);
     setPublishData({
       name,
       sub_heading: subHeading,
@@ -175,7 +176,7 @@ export const PublishAgentPopout: React.FC<PublishAgentPopoutProps> = ({
       agent_id: selectedAgentId || "",
       agent_version: selectedAgentVersion || 0,
       slug,
-      categories,
+      categories: filteredCategories,
     });
 
     // Create store submission
@@ -189,7 +190,7 @@ export const PublishAgentPopout: React.FC<PublishAgentPopoutProps> = ({
         agent_id: selectedAgentId || "",
         agent_version: selectedAgentVersion || 0,
         slug: slug.replace(/\s+/g, "-"),
-        categories: categories,
+        categories: filteredCategories,
       });
     } catch (error) {
       console.error("Error creating store submission:", error);