refactor: migrate marketplace plugin schema for upcoming redesign

Signed-off-by: LakshanSS <lakshan230897@gmail.com>

Author: LakshanSS

src/components/PluginCard/PluginCard.module.css

@@ -45,11 +45,7 @@
   object-fit: contain;
 }
 
-.icon {
-  font-size: 2rem;
-}
-
-/* Placeholder when no logo/icon */
+/* Placeholder when no logo */
 .placeholder {
   width: 36px;
   height: 36px;
@@ -83,9 +79,8 @@
   color: var(--ifm-color-emphasis-700);
 }
 
-/* Module type labels */
-.labelCore,
-.labelBackstage {
+/* Group label */
+.groupLabel {
   display: inline-block;
   white-space: nowrap;
   padding: 0.2rem 0.55rem;
@@ -94,36 +89,17 @@
   font-weight: 600;
   flex-shrink: 0;
   margin-left: 0.75rem;
-}
-
-.labelCore {
   background: #e8f4ff;
   color: #0070c9;
   border: 1px solid #b3d7f5;
 }
 
-.labelBackstage {
-  background: #f0ecff;
-  color: #6441c8;
-  border: 1px solid #cfc2f5;
-}
-
-html[data-theme='dark'] .labelCore {
+html[data-theme='dark'] .groupLabel {
   background: #0c2a45;
   color: #5ab3f7;
   border-color: #1f4d78;
 }
 
-html[data-theme='dark'] .labelBackstage {
-  background: #1e1340;
-  color: #a78bfa;
-  border-color: #3b2a6e;
-}
-
-.stars {
-  margin-top: 0.15rem;
-}
-
 /* --- Body --- */
 .body {
   flex-grow: 1;

src/components/PluginCard/PluginCard.tsx

@@ -3,36 +3,34 @@ import styles from "./PluginCard.module.css";
 
 interface Plugin {
   id: string;
+  group: string;
   name: string;
   description: string;
   category: string;
   tags: string[];
-  icon: string;
   logoUrl?: string;
   author: string;
-  moduleType?: "openchoreo" | "backstage";
-  repo?: string;
-  moduleUrl?: string;
-  stars?: number; // generated
+  sourceUrl?: string;
+  default?: boolean;
   released?: boolean;
 }
 
 interface PluginCardProps {
   plugin: Plugin;
 }
 
-function getRepoUrl(repo?: string): string | null {
-  if (!repo) return null;
-
-  const r = repo.trim().replace(/\/+$/, "");
-  if (/^https?:\/\//i.test(r)) return r;
-  if (/^(www\.)?github\.com\//i.test(r)) return `https://${r}`;
-  return `https://github.com/${r}`;
-}
+const GROUP_LABELS: Record<string, string> = {
+  module: "Module",
+  integration: "Integration",
+  agent: "Agent",
+  skill: "Skill",
+  "component-type": "Component Type",
+  workflow: "Workflow",
+};
 
 export const PluginCard: React.FC<PluginCardProps> = ({ plugin }) => {
-  const repoUrl = React.useMemo(() => getRepoUrl(plugin.repo), [plugin.repo]);
-  const exploreUrl = plugin.moduleUrl || repoUrl;
+  const exploreUrl = plugin.sourceUrl;
+  const groupName = GROUP_LABELS[plugin.group] ?? plugin.group;
 
   return (
     <article className={`card ${styles.card}`}>
@@ -41,8 +39,6 @@ export const PluginCard: React.FC<PluginCardProps> = ({ plugin }) => {
           <div className={styles.iconWrapper}>
             {plugin.logoUrl ? (
               <img src={plugin.logoUrl} alt={`${plugin.name} logo`} className={styles.logo} />
-            ) : plugin.icon ? (
-              <span className={styles.icon}>{plugin.icon}</span>
             ) : (
               <div className={styles.placeholder}>Logo</div>
             )}
@@ -54,12 +50,7 @@ export const PluginCard: React.FC<PluginCardProps> = ({ plugin }) => {
           </div>
         </div>
 
-        {plugin.moduleType && (
-          <span className={plugin.moduleType === "openchoreo" ? styles.labelCore : styles.labelBackstage}>
-            {plugin.moduleType === "openchoreo" ? "OpenChoreo Module" : "Backstage Curated Module"}
-          </span>
-        )}
-
+        <span className={styles.groupLabel}>{groupName}</span>
       </div>
 
       <div className={styles.body}>