diff --git a/apps/web/package.json b/apps/web/package.json index 43912215..8381be3e 100644 --- a/apps/web/package.json +++ b/apps/web/package.json @@ -28,6 +28,7 @@ "@date-fns/utc": "catalog:", "@number-flow/react": "catalog:", "@pmndrs/assets": "catalog:", + "@radix-ui/react-collapsible": "^1.1.11", "@radix-ui/react-dropdown-menu": "catalog:", "@radix-ui/react-label": "catalog:", "@radix-ui/react-slot": "catalog:", @@ -52,6 +53,7 @@ "motion": "catalog:", "next": "catalog:", "next-themes": "catalog:", + "plur": "catalog:", "posthog-js": "catalog:", "react": "catalog:", "react-dom": "catalog:", diff --git a/apps/web/src/app/marketplace/projects/[namespace]/[project-slug]/marketplace-project-index.tsx b/apps/web/src/app/marketplace/projects/[namespace]/[project-slug]/marketplace-project-index.tsx index 1aaf992d..b396892b 100644 --- a/apps/web/src/app/marketplace/projects/[namespace]/[project-slug]/marketplace-project-index.tsx +++ b/apps/web/src/app/marketplace/projects/[namespace]/[project-slug]/marketplace-project-index.tsx @@ -2,9 +2,10 @@ import type { Project } from '@agentic/platform-types' import { assert, omit, sanitizeSearchParams } from '@agentic/platform-core' -import { ExternalLinkIcon } from 'lucide-react' +import { ChevronsUpDownIcon, ExternalLinkIcon } from 'lucide-react' import Link from 'next/link' import { useRouter, useSearchParams } from 'next/navigation' +import plur from 'plur' import { useCallback, useEffect, useMemo, useRef, useState } from 'react' import { useAgentic } from '@/components/agentic-provider' @@ -13,11 +14,18 @@ import { LoadingIndicator } from '@/components/loading-indicator' import { PageContainer } from '@/components/page-container' import { ProjectPricingPlans } from '@/components/project-pricing-plans' import { Button } from '@/components/ui/button' +import { + Collapsible, + CollapsibleContent, + CollapsibleTrigger +} from '@/components/ui/collapsible' import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs' import { GitHubIcon } from '@/icons/github' import { toast, toastError } from '@/lib/notifications' import { useQuery } from '@/lib/query-client' +const MAX_TOOLS_TO_SHOW = 5 + export function MarketplaceProjectIndex({ projectIdentifier }: { @@ -182,11 +190,19 @@ export function MarketplaceProjectIndex({ Overview - + Tools - + Pricing @@ -202,14 +218,60 @@ export function MarketplaceProjectIndex({
-
+
{deployment ? ( -

- {deployment?.description || - 'No description available'} -

+ <> +

+ {deployment.description || + 'No description available'} +

+ +
+

+ Tools +

+ +
    + {deployment.tools + .slice(0, MAX_TOOLS_TO_SHOW) + .map((tool) => ( +
  • +

    + {tool.name} +

    + +

    + {tool.description} +

    +
    • + ))} + + {deployment.tools.length > MAX_TOOLS_TO_SHOW && ( +
  • + +
    • + )} +
+
+ ) : (

This project doesn't have any published deployments. @@ -231,6 +293,60 @@ export function MarketplaceProjectIndex({

Tools

+ + {deployment && ( +
    + {deployment.tools.map((tool) => ( +
  • +

    + {tool.name} +

    + +

    + {tool.description} +

    + + + + + + + + 
    +                                {JSON.stringify(tool.inputSchema, null, 2)}
+
    +     +     + + {tool.outputSchema && ( + + + + + + + 
    +                                  {JSON.stringify(tool.outputSchema, null, 2)}
+
    +     +     + )} +
    • + ))} +
+ )} diff --git a/apps/web/src/components/ui/collapsible.tsx b/apps/web/src/components/ui/collapsible.tsx new file mode 100644 index 00000000..50e32073 --- /dev/null +++ b/apps/web/src/components/ui/collapsible.tsx @@ -0,0 +1,33 @@ +'use client' + +import * as CollapsiblePrimitive from '@radix-ui/react-collapsible' + +function Collapsible({ + ...props +}: React.ComponentProps) { + return +} + +function CollapsibleTrigger({ + ...props +}: React.ComponentProps) { + return ( + + ) +} + +function CollapsibleContent({ + ...props +}: React.ComponentProps) { + return ( + + ) +} + +export { Collapsible, CollapsibleContent,CollapsibleTrigger } diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 0463a6b9..cc1f5861 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -367,7 +367,7 @@ catalogs: specifier: ^8.3.0 version: 8.3.0 plur: - specifier: ^5.1.0 + specifier: 5.1.0 version: 5.1.0 postcss: specifier: ^8.5.6 @@ -776,6 +776,9 @@ importers: '@pmndrs/assets': specifier: 'catalog:' version: 1.7.0 + '@radix-ui/react-collapsible': + specifier: ^1.1.11 + version: 1.1.11(@types/react-dom@19.1.6(@types/react@19.1.8))(@types/react@19.1.8)(react-dom@19.1.0(react@19.1.0))(react@19.1.0) '@radix-ui/react-dropdown-menu': specifier: 'catalog:' version: 2.1.15(@types/react-dom@19.1.6(@types/react@19.1.8))(@types/react@19.1.8)(react-dom@19.1.0(react@19.1.0))(react@19.1.0) @@ -848,6 +851,9 @@ importers: next-themes: specifier: 'catalog:' version: 0.4.6(react-dom@19.1.0(react@19.1.0))(react@19.1.0) + plur: + specifier: 'catalog:' + version: 5.1.0 posthog-js: specifier: 'catalog:' version: 1.255.0 @@ -4499,6 +4505,19 @@ packages: '@types/react-dom': optional: true + '@radix-ui/react-collapsible@1.1.11': + resolution: {integrity: sha512-2qrRsVGSCYasSz1RFOorXwl0H7g7J1frQtgpQgYrt+MOidtPAINHn9CPovQXb83r8ahapdx3Tu0fa/pdFFSdPg==} + peerDependencies: + '@types/react': '*' + '@types/react-dom': '*' + react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc + react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc + peerDependenciesMeta: + '@types/react': + optional: true + '@types/react-dom': + optional: true + '@radix-ui/react-collection@1.1.7': resolution: {integrity: sha512-Fh9rGN0MoI4ZFUNyfFVNU4y9LUz93u9/0K+yLgA2bwRojxM8JU1DyvvMBabnZPBgMWREAJvU2jjVzq+LrFUglw==} peerDependencies: @@ -15201,6 +15220,22 @@ snapshots: '@types/react': 19.1.8 '@types/react-dom': 19.1.6(@types/react@19.1.8) + '@radix-ui/react-collapsible@1.1.11(@types/react-dom@19.1.6(@types/react@19.1.8))(@types/react@19.1.8)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)': + dependencies: + '@radix-ui/primitive': 1.1.2 + '@radix-ui/react-compose-refs': 1.1.2(@types/react@19.1.8)(react@19.1.0) + '@radix-ui/react-context': 1.1.2(@types/react@19.1.8)(react@19.1.0) + '@radix-ui/react-id': 1.1.1(@types/react@19.1.8)(react@19.1.0) + '@radix-ui/react-presence': 1.1.4(@types/react-dom@19.1.6(@types/react@19.1.8))(@types/react@19.1.8)(react-dom@19.1.0(react@19.1.0))(react@19.1.0) + '@radix-ui/react-primitive': 2.1.3(@types/react-dom@19.1.6(@types/react@19.1.8))(@types/react@19.1.8)(react-dom@19.1.0(react@19.1.0))(react@19.1.0) + '@radix-ui/react-use-controllable-state': 1.2.2(@types/react@19.1.8)(react@19.1.0) + '@radix-ui/react-use-layout-effect': 1.1.1(@types/react@19.1.8)(react@19.1.0) + react: 19.1.0 + react-dom: 19.1.0(react@19.1.0) + optionalDependencies: + '@types/react': 19.1.8 + '@types/react-dom': 19.1.6(@types/react@19.1.8) + '@radix-ui/react-collection@1.1.7(@types/react-dom@19.1.6(@types/react@19.1.8))(@types/react@19.1.8)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)': dependencies: '@radix-ui/react-compose-refs': 1.1.2(@types/react@19.1.8)(react@19.1.0) diff --git a/pnpm-workspace.yaml b/pnpm-workspace.yaml index a9aa6842..58bb7096 100644 --- a/pnpm-workspace.yaml +++ b/pnpm-workspace.yaml @@ -142,7 +142,7 @@ catalog: p-throttle: 6.2.0 p-times: ^4.0.0 parse-json: ^8.3.0 - plur: ^5.1.0 + plur: 5.1.0 postcss: ^8.5.6 postgres: ^3.4.7 posthog-js: ^1.255.0