aljaz/goose
1
0
Fork 0
mirror of https://github.com/aljazceru/goose.git synced 2026-02-23 15:34:27 +01:00
Code Issues Packages Projects Releases Wiki Activity

Add Pieces for Developers MCP server to the extensions library (#2074)

Browse Source 
Co-authored-by: Jim Bennett <jim@pieces.app>
This commit is contained in:
Jim Bennett
2025-04-26 07:49:01 -07:00
committed by GitHub
parent b4f5d606ca
commit f708e4d613
11 changed files with 495 additions and 117 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
documentation/src/components/prompt-card.tsx
View File

@@ -12,6 +12,7 @@ function extensionToMCPServer(extension: Extension): MCPServer {
id: extension.command,
name: extension.name,
command: extension.command,
url: extension.url,
description: extension.name,
is_builtin: extension.is_builtin,
link: extension.link || '',
@@ -119,9 +120,15 @@ export function PromptCard({ prompt }: { prompt: Prompt }) {
<Terminal className="h-4 w-4" />
<h4 className="mx-2">Command</h4>
</button>
<CodeBlock language="bash">
goose session --with-extension "{extension.command}"
</CodeBlock>
{extension.url ? (
<CodeBlock language="bash">
goose session --with-remote-extension "{extension.url}"
</CodeBlock>
) : (
<CodeBlock language="bash">
goose session --with-extension "{extension.command}"
</CodeBlock>
)}
</div>
</motion.div>
)}

137
documentation/src/components/server-card.tsx
View File

@@ -50,65 +50,104 @@ export function ServerCard({ server }: { server: MCPServer }) {
</div>
<div className="py-4">
{server.is_builtin ? (
{server.is_builtin && (
<div className="flex items-center gap-2">
<Info
style={{ width: "12px", height: "12px" }}
className="text-textSubtle shrink-0"
/>
<span
style={{ fontSize: "12px" }}
className="text-textSubtle leading-normal"
>
Can be enabled in the goose settings page
</span>
<Info
style={{ width: "12px", height: "12px" }}
className="text-textSubtle shrink-0"
/>
<span
style={{ fontSize: "12px" }}
className="text-textSubtle leading-normal"
>
Can be enabled in the goose settings page
</span>
</div>
) : (
)}
{(!server.is_builtin && server.command !== undefined && server.url === undefined) && (
<>
<button
onClick={() => setIsCommandVisible(!isCommandVisible)}
className="command-toggle"
<button
onClick={() => setIsCommandVisible(!isCommandVisible)}
className="command-toggle"
>
<Terminal className="h-4 w-4" />
<h4 className="mx-2">Command</h4>
<ChevronRight
className={`ml-auto transition-transform ${
isCommandVisible ? "rotate-90" : ""
}`}
/>
</button>
<AnimatePresence>
{isCommandVisible && (
<motion.div
className="command-content"
initial={{ opacity: 0, translateY: -20 }}
animate={{ opacity: 1, translateY: 0 }}
exit={{
opacity: 0,
translateY: -20,
transition: { duration: 0.1 },
}}
>
<Terminal className="h-4 w-4" />
<h4 className="mx-2">Command</h4>
<ChevronRight
className={`ml-auto transition-transform ${
isCommandVisible ? "rotate-90" : ""
}`}
/>
</button>
<AnimatePresence>
{isCommandVisible && (
<motion.div
className="command-content"
initial={{ opacity: 0, translateY: -20 }}
animate={{ opacity: 1, translateY: 0 }}
exit={{
opacity: 0,
translateY: -20,
transition: { duration: 0.1 },
}}
>
<code>
{`goose session --with-extension "${server.command}"`}
</code>
</motion.div>
)}
</AnimatePresence>
<code>
{`goose session --with-extension "${server.command}"`}
</code>
</motion.div>
)}
</AnimatePresence>
</>
)}
{(!server.is_builtin && server.command === undefined && server.url !== undefined) && (
<>
<button
onClick={() => setIsCommandVisible(!isCommandVisible)}
className="command-toggle"
>
<Terminal className="h-4 w-4" />
<h4 className="mx-2">Command</h4>
<ChevronRight
className={`ml-auto transition-transform ${
isCommandVisible ? "rotate-90" : ""
}`}
/>
</button>
<AnimatePresence>
{isCommandVisible && (
<motion.div
className="command-content"
initial={{ opacity: 0, translateY: -20 }}
animate={{ opacity: 1, translateY: 0 }}
exit={{
opacity: 0,
translateY: -20,
transition: { duration: 0.1 },
}}
>
<code>
{`goose session --with-remote-extension "${server.url}"`}
</code>
</motion.div>
)}
</AnimatePresence>
</>
)}
</div>
</div>
<div className="card-footer">
<Link
to={server.link}
className="card-stats"
onClick={(e) => e.stopPropagation()}
>
<Star className="h-4 w-4" />
<span>{server.githubStars} on Github</span>
</Link>
{server.githubStars !== undefined && (
<Link
to={server.link}
className="card-stats"
onClick={(e) => e.stopPropagation()}
>
<Star className="h-4 w-4" />
<span>{server.githubStars} on Github</span>
</Link>
)}
<div className="card-action">
{server.is_builtin ? (
<div

16
documentation/src/pages/prompt-library/data/prompts/pieces-stand-up-status-report.json Normal file
View File

@@ -0,0 +1,16 @@
{
"id": "pieces-stand-up-status-report",
"title": "Create a status report for a stand-up meeting",
"description": "Create a status report for a stand-up meeting, including 5 bullet points for what was accomplished yesterday. This is using the Pieces Long-Term Memory.",
"category": "productivity",
"job": "project-management",
"example_prompt": "I need a status update for what I was using yesterday. Create a report with 5 bullet points based off the most important activities, and give each one a brief description.",
"example_result": "Here's a report summarizing your key activities from yesterday, based on the most important interactions and applications you were using:\n\n1. Code Development with Goose:\n\tActivity: You worked on integrating SSE MCP servers into the Goose CLI, making enhancements to handle extensions via schema URLs.\n\tDescription: This task involved modifying code and testing new integrations to support advanced functionalities. It also included interactions with the Goose community on Discord for feedback and troubleshooting.\n\n2. Documentation Updates:\n\tActivity: You updated and managed documentation related to the Goose project and MCP integrations.\n\tDescription: This involved preparing documentation for new features, including usage guidelines and technical details, aiding in the improvement of user experience and technical instructions.\n\n3. Community Interaction on Discord:\n\tActivity: Engaged with the Block Open Source Community to discuss project developments and potential collaborations.\n\tDescription: You actively participated in community discussions, exchanging insights on project enhancements, and exploring collaborative opportunities with other developers and contributors.\n\n4. Managing and Testing Extensions:\n\tActivity: You focused on testing and managing various extensions through the Goose platform.\n\tDescription: This included configuring and validating different extensions, ensuring their compatibility and functionality, and incorporating feedback from testing.\n\n5. Content and Integration Planning:\n\tActivity: Planned integration workflows for MCP and documented their use cases.\n\tDescription: You worked on strategies for implementing MCP integrations effectively, involving planning sessions to optimize future project deployments and align them with user requirements and project objectives.\n\nThese activities demonstrate a productive day with a focus on development, collaboration, and content management within your technical community.",
"extensions": [
{
"name": "Pieces",
"url": "http://localhost:39300/model_context_protocol/2024-11-05/sse",
"is_builtin": false
}
]
}

146
documentation/src/pages/prompt-library/detail.tsx
View File

@@ -1,7 +1,7 @@
import Layout from "@theme/Layout";
import { ArrowLeft, Terminal, Download, Code } from "lucide-react";
import Admonition from '@theme/Admonition';
import CodeBlock from '@theme/CodeBlock';
import Admonition from "@theme/Admonition";
import CodeBlock from "@theme/CodeBlock";
import { Button } from "@site/src/components/ui/button";
import { Badge } from "@site/src/components/ui/badge";
import { useLocation } from "@docusaurus/router";
@@ -10,7 +10,7 @@ import Link from "@docusaurus/Link";
import { motion, AnimatePresence } from "framer-motion";
import type { MCPServer } from "@site/src/types/server";
import { getPromptById } from "@site/src/utils/prompts";
import ReactMarkdown from 'react-markdown';
import ReactMarkdown from "react-markdown";
import type { Prompt, Extension } from "@site/src/types/prompt";
import { getGooseInstallLink } from "@site/src/utils/install-links";
@@ -20,26 +20,32 @@ function extensionToMCPServer(extension: Extension): MCPServer {
id: extension.command,
name: extension.name,
command: extension.command,
url: extension.url,
description: extension.name,
is_builtin: extension.is_builtin,
link: extension.link || '',
installation_notes: extension.installation_notes || '',
link: extension.link || "",
installation_notes: extension.installation_notes || "",
endorsed: false,
environmentVariables: extension.environmentVariables || [],
githubStars: 0
githubStars: 0,
};
}
function ExtensionList({ extensions }: { extensions: Extension[] }) {
const [expandedExtension, setExpandedExtension] = useState<string | null>(null);
const [expandedExtension, setExpandedExtension] = useState<string | null>(
null
);
const hasExpandedExtension = expandedExtension !== null;
return (
<div className={`flex gap-3 ${hasExpandedExtension ? 'flex-col' : 'flex-wrap'}`}>
<div
className={`flex gap-3 ${
hasExpandedExtension ? "flex-col" : "flex-wrap"
}`}
>
{extensions.map((extension) => (
<ExtensionDetails
<ExtensionDetails
key={extension.name}
extension={extension}
isExpanded={expandedExtension === extension.name}
@@ -52,41 +58,43 @@ function ExtensionList({ extensions }: { extensions: Extension[] }) {
);
}
function ExtensionDetails({
function ExtensionDetails({
extension,
isExpanded,
onToggle
}: {
onToggle,
}: {
extension: Extension;
isExpanded: boolean;
onToggle: (expanded: boolean) => void;
}) {
return (
<div className="flex flex-col">
<div
<div
className={`
inline-flex items-center h-9 px-4 rounded-full
bg-background-subtle border border-borderSubtle
transition-all duration-150 ease-in-out
hover:bg-background-standard hover:border-borderStandard
group ${extension.is_builtin ? 'cursor-help' : 'cursor-pointer'}
${isExpanded ? 'bg-background-standard border-borderStandard' : ''}
group ${extension.is_builtin ? "cursor-help" : "cursor-pointer"}
${isExpanded ? "bg-background-standard border-borderStandard" : ""}
`}
onClick={() => {
if (!extension.is_builtin) {
onToggle(!isExpanded);
}
}}
title={extension.is_builtin ? "Built-in extension - can be enabled in settings" : "Click to see installation options"}
title={
extension.is_builtin
? "Built-in extension - can be enabled in settings"
: "Click to see installation options"
}
>
<span className="text-sm text-textStandard group-hover:text-textProminent">
{extension.name}
</span>
{extension.is_builtin ? (
<div className="inline-flex items-center ml-2">
<span className="text-sm text-textSubtle">
Built-in
</span>
<span className="text-sm text-textSubtle">Built-in</span>
</div>
) : (
<span className="ml-2 text-textSubtle">
@@ -118,23 +126,29 @@ function ExtensionDetails({
</a>
<div className="border-t border-borderSubtle" />
<button
className="command-toggle w-full flex items-center"
>
<button className="command-toggle w-full flex items-center">
<Terminal className="h-4 w-4" />
<h4 className="mx-2">Command</h4>
</button>
<div>
<CodeBlock language="bash">
goose session --with-extension "{extension.command}"
</CodeBlock>
{extension.url ? (
<CodeBlock language="bash">
goose session --with-remote-extension "{extension.url}"
</CodeBlock>
) : (
<CodeBlock language="bash">
goose session --with-extension "{extension.command}"
</CodeBlock>
)}
</div>
{extension.installation_notes && (
<>
<div className="border-t border-borderSubtle" />
<div>
<div className="text-sm font-medium mb-2">Installation Notes</div>
<div className="text-sm font-medium mb-2">
Installation Notes
</div>
<div className="text-sm text-textSubtle">
<ReactMarkdown>
{extension.installation_notes}
@@ -144,27 +158,33 @@ function ExtensionDetails({
</>
)}
{extension.environmentVariables && extension.environmentVariables.length > 0 && (
<>
<div className="border-t border-borderSubtle" />
<div>
<div className="text-sm font-medium mb-2">Environment Variables</div>
{extension.environmentVariables.map((env) => (
<div key={env.name} className="mb-2 last:mb-0">
<code className="text-sm">{env.name}</code>
<div className="text-sm text-textSubtle mt-1">
{env.description}
{env.required && (
<Badge variant="secondary" className="ml-2 text-xs">
Required
</Badge>
)}
</div>
{extension.environmentVariables &&
extension.environmentVariables.length > 0 && (
<>
<div className="border-t border-borderSubtle" />
<div>
<div className="text-sm font-medium mb-2">
Environment Variables
</div>
))}
</div>
</>
)}
{extension.environmentVariables.map((env) => (
<div key={env.name} className="mb-2 last:mb-0">
<code className="text-sm">{env.name}</code>
<div className="text-sm text-textSubtle mt-1">
{env.description}
{env.required && (
<Badge
variant="secondary"
className="ml-2 text-xs"
>
Required
</Badge>
)}
</div>
</div>
))}
</div>
</>
)}
</div>
</motion.div>
)}
@@ -181,9 +201,7 @@ function PromptDetail({ prompt }: { prompt: Prompt }) {
<div className="flex gap-8">
<div>
<Link to="/prompt-library" className="no-underline">
<Button
className="flex items-center gap-2 hover:cursor-pointer"
>
<Button className="flex items-center gap-2 hover:cursor-pointer">
<ArrowLeft className="h-4 w-4" />
Back
</Button>
@@ -204,21 +222,25 @@ function PromptDetail({ prompt }: { prompt: Prompt }) {
{prompt.description}
</p>
</div>
<Admonition type="info">
Results may vary depending on the model and context.
</Admonition>
<div>
<h2 className="text-2xl font-medium mb-4">Example Prompt</h2>
<CodeBlock language="markdown">
{prompt.example_prompt}
</CodeBlock>
<h2 className="text-2xl font-medium mb-4">
Example Prompt
</h2>
<CodeBlock language="markdown">
{prompt.example_prompt}
</CodeBlock>
</div>
{prompt.example_result && (
<div>
<h2 className="text-2xl font-medium mb-4">Example Result</h2>
<h2 className="text-2xl font-medium mb-4">
Example Result
</h2>
<CodeBlock language="markdown">
{prompt.example_result}
</CodeBlock>
@@ -226,7 +248,9 @@ function PromptDetail({ prompt }: { prompt: Prompt }) {
)}
<div>
<h2 className="text-2xl font-medium mb-4">Recommended Extensions</h2>
<h2 className="text-2xl font-medium mb-4">
Recommended Extensions
</h2>
<ExtensionList extensions={prompt.extensions} />
</div>
</div>
@@ -250,7 +274,7 @@ export default function DetailPage(): JSX.Element {
try {
setLoading(true);
setError(null);
// Get the ID from the query parameter
const params = new URLSearchParams(location.search);
const id = params.get("id");
@@ -284,9 +308,7 @@ export default function DetailPage(): JSX.Element {
<div className="flex gap-8">
<div>
<Link to="/prompt-library" className="no-underline">
<Button
className="flex items-center gap-2 hover:text-textProminent hover:cursor-pointer"
>
<Button className="flex items-center gap-2 hover:text-textProminent hover:cursor-pointer">
<ArrowLeft className="h-4 w-4" />
Back
</Button>
@@ -340,4 +362,4 @@ export default function DetailPage(): JSX.Element {
}
return <PromptDetail prompt={prompt} />;
}
}

3
documentation/src/types/prompt.ts
View File

@@ -6,7 +6,8 @@ export type EnvironmentVariable = {
export type Extension = {
name: string;
command: string;
command?: string;
url?: string;
is_builtin: boolean;
link?: string;
installation_notes?: string;

1
documentation/src/types/server.ts
View File

@@ -3,6 +3,7 @@ export interface MCPServer {
name: string;
description: string;
command: string;
url: string;
link: string;
installation_notes: string;
is_builtin: boolean;

19
documentation/src/utils/install-links.ts
View File

@@ -10,9 +10,28 @@ export function getGooseInstallLink(server: MCPServer): string {
].join('&');
return `goose://extension?${queryParams}`;
}
// Handle the case where the command is a URL
if (server.url) {
const queryParams = [
`url=${encodeURIComponent(server.url)}`,
`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}`;
}
const parts = server.command.split(" ");
const baseCmd = parts[0]; // jbang, npx or uvx
const args = parts.slice(1); // remaining arguments
const queryParams = [
`cmd=${encodeURIComponent(baseCmd)}`,
...args.map((arg) => `arg=${encodeURIComponent(arg)}`),