fix: extension page link fix, change nondeveloper to 'computer controller' (#766)

This commit is contained in:
Wendy Tang
2025-01-24 18:33:45 -08:00
committed by GitHub
parent dcfb76966f
commit 1e01ee438e
5 changed files with 62 additions and 119 deletions
+1 -28
View File
@@ -6,35 +6,8 @@ import type { MCPServer } from "../types/server";
import { Link, NavLink } from "react-router";
import { useState } from "react";
import { motion, AnimatePresence } from "motion/react";
import { getGooseInstallLink } from "../utils/install-links";
function getGooseInstallLink(server: MCPServer): string {
if (server.is_builtin) {
const queryParams = [
'cmd=goosed',
'arg=mcp',
`arg=${encodeURIComponent(server.id)}`,
`description=${encodeURIComponent(server.id)}`
].join('&');
return `goose://extension?${queryParams}`;
}
const parts = server.command.split(" ");
const baseCmd = parts[0]; // npx or uvx
const args = parts.slice(1); // remaining arguments
const queryParams = [
`cmd=${encodeURIComponent(baseCmd)}`,
...args.map((arg) => `arg=${encodeURIComponent(arg)}`),
`id=${encodeURIComponent(server.id)}`,
`name=${encodeURIComponent(server.name)}`,
`description=${encodeURIComponent(server.description)}`,
...server.environmentVariables
.filter((env) => env.required)
.map(
(env) => `env=${encodeURIComponent(`${env.name}=${env.description}`)}`
),
].join("&");
return `goose://extension?${queryParams}`;
}
export function ServerCard({ server }: { server: MCPServer }) {
const [isCommandVisible, setIsCommandVisible] = useState(false);
+1 -1
View File
@@ -1,4 +1,4 @@
import type { MCPServer } from '../types/server';
import type { MCPServer } from '../app/types/server';
export async function fetchMCPServers(): Promise<MCPServer[]> {
try {
+23 -55
View File
@@ -11,45 +11,13 @@ import { Badge } from "../components/ui/badge";
import { Card, CardContent, CardHeader } from "../components/ui/card";
import { useEffect, useState } from "react";
import { fetchMCPServers } from "../mcp-servers";
import { getGooseInstallLink } from "../utils/install-links";
import type { MCPServer } from "../types/server";
interface Server {
id: string;
name: string;
description: string;
command: string;
link: string;
installation_notes: string;
is_builtin: boolean;
endorsed: boolean;
githubStars: number;
environmentVariables: {
name: string;
description: string;
required: boolean;
}[];
}
function getGooseInstallLink(server: Server): string {
const parts = server.command.split(" ");
const baseCmd = parts[0];
const args = parts.slice(1);
const queryParams = [
`cmd=${encodeURIComponent(baseCmd)}`,
...args.map((arg) => `arg=${encodeURIComponent(arg)}`),
`description=${encodeURIComponent(server.description)}`,
...server.environmentVariables
.filter((env) => env.required)
.map(
(env) => `env=${encodeURIComponent(`${env.name}=${env.description}`)}`
),
].join("&");
return `goose://extension?${queryParams}`;
}
export default function DetailPage() {
const { id } = useParams();
const [server, setServer] = useState<Server | null>(null);
const [server, setServer] = useState<MCPServer | null>(null);
const [isCommandVisible, setIsCommandVisible] = useState(true);
const [error, setError] = useState<string | null>(null);
const [isLoading, setIsLoading] = useState(true);
@@ -213,25 +181,25 @@ export default function DetailPage() {
<span>{server.githubStars} on Github</span>
</div>
<a
href={getGooseInstallLink(server)}
target="_blank"
rel="noopener noreferrer"
className="no-underline"
>
{server.is_builtin ? (
<div
className="inline-block"
title="This extension is built into goose and can be enabled in the settings page"
{server.is_builtin ? (
<div
className="inline-block"
title="This extension is built into goose and can be enabled in the settings page"
>
<Badge
variant="secondary"
className="ml-2 text-xs cursor-help"
>
<Badge
variant="secondary"
className="ml-2 text-xs cursor-help"
>
Built-in
</Badge>
</div>
) : (
Built-in
</Badge>
</div>
) : (
<a
href={getGooseInstallLink(server)}
target="_blank"
rel="noopener noreferrer"
className="no-underline"
>
<Button
size="icon"
variant="link"
@@ -241,8 +209,8 @@ export default function DetailPage() {
<span>Install</span>
<Download className="h-4 w-4 ml-2 group-hover/download:text-[#FA5204]" />
</Button>
)}
</a>
</a>
)}
</div>
</CardContent>
</Card>
@@ -0,0 +1,30 @@
import type { MCPServer } from "../types/server";
export function getGooseInstallLink(server: MCPServer): string {
if (server.is_builtin) {
const queryParams = [
'cmd=goosed',
'arg=mcp',
`arg=${encodeURIComponent(server.id)}`,
`description=${encodeURIComponent(server.id)}`
].join('&');
return `goose://extension?${queryParams}`;
}
const parts = server.command.split(" ");
const baseCmd = parts[0]; // npx or uvx
const args = parts.slice(1); // remaining arguments
const queryParams = [
`cmd=${encodeURIComponent(baseCmd)}`,
...args.map((arg) => `arg=${encodeURIComponent(arg)}`),
`id=${encodeURIComponent(server.id)}`,
`name=${encodeURIComponent(server.name)}`,
`description=${encodeURIComponent(server.description)}`,
...server.environmentVariables
.filter((env) => env.required)
.map(
(env) => `env=${encodeURIComponent(`${env.name}=${env.description}`)}`
),
].join("&");
return `goose://extension?${queryParams}`;
}