diff --git a/.github/scripts/update-example-dates.js b/.github/scripts/update-example-dates.js new file mode 100644 index 000000000..4372992f6 --- /dev/null +++ b/.github/scripts/update-example-dates.js @@ -0,0 +1,150 @@ +#!/usr/bin/env node + +const fs = require("fs"); +const path = require("path"); + +function parseRepositoriesFromMDX(content) { + const repositories = []; + + // Regex to find all SampleAppCard components with title and href + const sampleAppCardRegex = /]+)>/g; + + let match; + while ((match = sampleAppCardRegex.exec(content)) !== null) { + const propsString = match[1]; + + // Extract title and href from props + const titleMatch = propsString.match(/title="([^"]+)"/); + const hrefMatch = propsString.match(/href="([^"]+)"/); + + if (titleMatch && hrefMatch) { + const title = titleMatch[1]; + const href = hrefMatch[1]; + + // Check if it's a GitHub URL and extract repo name + const githubMatch = href.match(/https:\/\/github\.com\/([^/]+\/[^/]+)/); + + if (githubMatch) { + const repoName = githubMatch[1]; + repositories.push({ + title, + repo: repoName, + href, + }); + } + } + } + + return repositories; +} + +async function fetchRepoData(repoInfo) { + const url = `https://api.github.com/repos/${repoInfo.repo}`; + + try { + const response = await fetch(url, { + headers: { + Authorization: `token ${process.env.GITHUB_TOKEN}`, + "User-Agent": "arcade-docs-updater", + }, + }); + + if (!response.ok) { + throw new Error(`HTTP error! status: ${response.status}`); + } + + const data = await response.json(); + return { + repo: repoInfo.repo, + title: repoInfo.title, + href: repoInfo.href, + createdAt: new Date(data.created_at), + updatedAt: new Date(data.updated_at), + }; + } catch (error) { + console.error(`Error fetching data for ${repoInfo.repo}:`, error); + return null; + } +} + +function formatDate(date) { + const months = [ + "Jan", + "Feb", + "Mar", + "Apr", + "May", + "Jun", + "Jul", + "Aug", + "Sep", + "Oct", + "Nov", + "Dec", + ]; + + return `${months[date.getMonth()]} ${date.getFullYear()}`; +} + +async function updateExampleDates() { + console.log("Parsing repositories from MDX file..."); + + // Read the current MDX file + const mdxPath = path.join(__dirname, "../../app/en/home/examples/page.mdx"); + let content = fs.readFileSync(mdxPath, "utf8"); + + // Parse repositories from the MDX file + const repositories = parseRepositoriesFromMDX(content); + console.log( + "Found repositories:", + repositories.map((r) => `${r.title} (${r.repo})`) + ); + + if (repositories.length === 0) { + console.log("No GitHub repositories found in MDX file."); + return; + } + + console.log("Fetching repository data from GitHub API..."); + + // Fetch data for all repositories + const repoDataPromises = repositories.map(fetchRepoData); + const repoData = (await Promise.all(repoDataPromises)).filter(Boolean); + + // Sort by creation date (newest first) + repoData.sort((a, b) => b.createdAt - a.createdAt); + + console.log( + "Repository dates:", + repoData.map((r) => `${r.title}: ${formatDate(r.createdAt)}`) + ); + + // Update dates for each repository + repoData.forEach((repo) => { + // Find the SampleAppCard with this title and update its date + const titleRegex = new RegExp( + `(title="${repo.title.replace(/[.*+?^${}()|[\]\\]/g, "\\$&")}"[\\s\\S]*?)date="[^"]*"`, + "g" + ); + const newDate = formatDate(repo.createdAt); + + const before = content; + content = content.replace(titleRegex, `$1date="${newDate}"`); + + if (content !== before) { + console.log(`Updated date for "${repo.title}" to ${newDate}`); + } else { + console.warn(`Could not find or update date for "${repo.title}"`); + } + }); + + // Write the updated content back + fs.writeFileSync(mdxPath, content, "utf8"); + console.log("Successfully updated example dates!"); +} + +// Run the update +updateExampleDates().catch((error) => { + console.error("Error updating example dates:", error); + process.exit(1); +}); diff --git a/.github/workflows/update-example-dates.yml b/.github/workflows/update-example-dates.yml new file mode 100644 index 000000000..4b9d88e7f --- /dev/null +++ b/.github/workflows/update-example-dates.yml @@ -0,0 +1,59 @@ +name: Update Example App Dates + +on: + schedule: + # Run every Monday at 00:00 UTC + - cron: '0 0 * * 1' + workflow_dispatch: # Allow manual triggering + +jobs: + update-dates: + runs-on: ubuntu-latest + + steps: + - name: Checkout repository + uses: actions/checkout@v4 + with: + token: ${{ secrets.GITHUB_TOKEN }} + fetch-depth: 1 + + - name: Setup Node.js + uses: actions/setup-node@v4 + with: + node-version: '22.x' + + - name: Update repository dates + env: + GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }} + run: | + node .github/scripts/update-example-dates.js + + - name: Check for changes + id: check-changes + run: | + if [ -n "$(git status --porcelain)" ]; then + echo "changes=true" >> $GITHUB_OUTPUT + else + echo "changes=false" >> $GITHUB_OUTPUT + fi + + - name: Create Pull Request + if: steps.check-changes.outputs.changes == 'true' + uses: peter-evans/create-pull-request@v6 + with: + token: ${{ secrets.GITHUB_TOKEN }} + commit-message: "chore: update example app dates [skip ci]" + title: "🤖 Update example app repository dates" + body: | + This PR contains automated updates to the example app creation/update dates. + + **Generated on:** ${{ github.event_name == 'workflow_dispatch' && 'Manual trigger' || 'Scheduled run' }} + **Triggered by:** ${{ github.actor }} + + The script has fetched the latest repository information from GitHub API and updated the dates accordingly. + branch: chore/update-example-dates-${{ github.run_id }} + delete-branch: true + labels: | + automated + examples + assignees: rachelnabors \ No newline at end of file diff --git a/app/_components/sample-app-card.tsx b/app/_components/sample-app-card.tsx index 1e44c67d9..dec65c074 100644 --- a/app/_components/sample-app-card.tsx +++ b/app/_components/sample-app-card.tsx @@ -1,7 +1,5 @@ "use client"; import { Card, CardContent } from "@arcadeai/design-system"; -import { motion } from "motion/react"; -import Image from "next/image"; import Link from "next/link"; type SampleAppCardProps = { @@ -10,6 +8,8 @@ type SampleAppCardProps = { image: string; href: string; blank?: boolean; + tags?: string[]; + date?: string; }; export function SampleAppCard({ @@ -18,38 +18,87 @@ export function SampleAppCard({ image, href, blank = false, + tags = [], + date, }: SampleAppCardProps) { return ( - - - - -
- {title} -
-
-

+ + + +
+
+

{title}

-

- {description} -

+ {date && ( + + {date} + + )}
- - - - +

+ {description} +

+ {tags.length > 0 && ( +
+ {tags.map((tag, index) => { + const getTagColor = (tag: string) => { + const languages = [ + "JavaScript", + "Python", + "TypeScript", + "Java", + "Go", + "Rust", + ]; + const frameworks = [ + "Langchain", + "mastra", + "CrewAI", + "LangGraph", + "OpenAI", + "Anthropic", + "Next.js", + ]; + const integrations = [ + "Slack", + "GitHub", + "Gmail", + "Discord", + "Notion", + "Linear", + "Jira", + "Weaviate", + "Email", + "Stytch", + ]; + + if (languages.includes(tag)) { + return "bg-gradient-to-br from-emerald-600 to-emerald-800"; + } + if (frameworks.includes(tag)) { + return "bg-gradient-to-br from-blue-600 to-blue-800"; + } + if (integrations.includes(tag)) { + return "bg-gradient-to-br from-yellow-600 to-yellow-800"; + } + return "bg-gradient-to-br from-gray-600 to-gray-800"; + }; + + return ( + + {tag} + + ); + })} +
+ )} +
+ + + ); } diff --git a/app/en/home/_meta.tsx b/app/en/home/_meta.tsx index f66b9463c..6f0813653 100644 --- a/app/en/home/_meta.tsx +++ b/app/en/home/_meta.tsx @@ -51,6 +51,9 @@ export const meta: MetaRecord = { "api-keys": { title: "Get an API key", }, + examples: { + title: "Example agents", + }, "-- Authoring Tools": { type: "separator", title: "Authoring Tools", diff --git a/app/en/home/examples/page.mdx b/app/en/home/examples/page.mdx new file mode 100644 index 000000000..92781f0ad --- /dev/null +++ b/app/en/home/examples/page.mdx @@ -0,0 +1,135 @@ +--- +title: "Example apps" +description: "Example apps using Arcade's tools and MCP Servers in workflows and with agents." +--- + +## Example apps + +import { SampleAppCard } from "../../../_components/sample-app-card"; + +
+ + + + + + + + + + + +
+ +## Submit your app + +Built something awesome with Arcade? We'd love to feature it! Submit your app by creating a pull request to our documentation site. + +### Guidelines + +- **Open source**: Your app should be publicly available on GitHub +- **Uses Arcade**: Your app should integrate with Arcade's tools, MCP servers, or SDK +- **Working demo**: Include clear setup instructions and ensure your app runs +- **Good documentation**: Provide a clear README with installation and usage instructions +- **Appropriate content**: Family-friendly and professional applications only + +### How to submit + +1. Fork the [Arcade docs repository](https://github.com/ArcadeAI/docs) +2. Add your app to `/app/en/home/examples/page.mdx` following the existing pattern +3. Include a descriptive title, clear description, and appropriate tags +4. Create a pull request with details about your app and its Arcade integration +5. Our team will review and potentially feature your app! + +### Need help? + +If you have questions about submitting your app, feel free to [contact us](/home/contact-us) or open an issue in the docs repository. + diff --git a/public/llms.txt b/public/llms.txt index 5f8a43c59..286da23b9 100644 --- a/public/llms.txt +++ b/public/llms.txt @@ -1,4 +1,4 @@ - + # Arcade @@ -130,6 +130,10 @@ Arcade delivers three core capabilities: Deploy agents even your security team w - [Run evaluations with the Arcade CLI](https://docs.arcade.dev/en/home/evaluate-tools/run-evaluations.md): This documentation page provides guidance on using the Arcade CLI to run evaluations of tool-enabled language models. It outlines the steps to execute evaluation suites, customize the evaluation process with various command options, and analyze the results efficiently. Users will learn how to utilize the - [Why evaluate tools?](https://docs.arcade.dev/en/home/evaluate-tools/why-evaluate-tools.md): This documentation page explains the importance of evaluating tools used in language models with tool-calling capabilities, focusing on their effectiveness and reliability in production environments. It outlines the evaluation framework, which assesses tool utilization and intent understanding, and details the scoring system based on +## Examples + +- [page](https://docs.arcade.dev/en/home/examples.md): This documentation page provides a collection of example applications that utilize Arcade's tools and MCP servers, showcasing various workflows and agent capabilities. Users can explore detailed descriptions and links to GitHub repositories for each app, as well as guidelines for submitting their own projects that + ## Faq - [Frequently Asked Questions](https://docs.arcade.dev/en/home/faq.md): This documentation page provides answers to frequently asked questions about the Arcade platform, helping users understand how to create and contribute tools, differentiate between various API keys, and navigate authentication processes. It guides users through building custom tools, collaborating on projects, and managing OAuth @@ -235,13 +239,13 @@ Arcade delivers three core capabilities: Deploy agents even your security team w ## MCP Servers - Productivity -- [AirtableApi](https://docs.arcade.dev/en/mcp-servers/productivity/airtable-api.md): The AirtableApi documentation page provides users with a comprehensive set of tools for managing and interacting with Airtable's API, enabling actions such as creating, updating, and deleting SCIM groups and users, managing webhooks, and handling base collaborations. It -- [Asana](https://docs.arcade.dev/en/mcp-servers/productivity/asana.md): This documentation page provides users with a comprehensive guide to the Arcade Asana MCP Server, enabling them to build agents and AI applications that interact with Asana's tasks, projects, and workspaces. Users can learn how to manage teams, create and update -- [Asana Reference](https://docs.arcade.dev/en/mcp-servers/productivity/asana/reference.md): The Asana Reference documentation provides a comprehensive list of enumerations related to tag colors, task sorting criteria, and sort order options used in the Asana MCP Server. This page helps users understand and utilize these enumerations effectively in their applications. By referencing +- [AirtableApi](https://docs.arcade.dev/en/mcp-servers/productivity/airtable-api.md): The AirtableApi documentation provides users with a comprehensive guide to tools that facilitate interaction with the Airtable API, enabling efficient management of SCIM groups, users, webhooks, and bases. Users can learn to perform various actions such as creating, updating +- [Asana](https://docs.arcade.dev/en/mcp-servers/productivity/asana.md): This documentation page provides a comprehensive overview of the Arcade Asana MCP Server, which enables users to build agents and AI applications that interact with Asana tasks, projects, and workspaces. It details various tools available for managing tasks, projects, and users +- [Asana Reference](https://docs.arcade.dev/en/mcp-servers/productivity/asana/reference.md): The Asana Reference documentation provides a comprehensive list of enumerations related to tag colors, task sorting options, and sort order used in the Asana MCP Server. Users can utilize this reference to understand and implement specific color codes and sorting functionalities within their As - [AsanaApi](https://docs.arcade.dev/en/mcp-servers/productivity/asana-api.md): The AsanaApi documentation provides users with a comprehensive set of tools to interact with the Asana API, enabling them to manage access requests, allocations, custom fields, and goals effectively. Users can learn how to perform various actions such as creating, updating -- [AshbyApi](https://docs.arcade.dev/en/mcp-servers/productivity/ashby-api.md): The AshbyApi documentation provides a comprehensive guide for users to manage recruitment processes within the Ashby platform through various API tools. Users can create and update job applications, retrieve candidate information, manage interview schedules, and handle job postings, all aimed at stream -- [BoxApi](https://docs.arcade.dev/en/mcp-servers/productivity/box-api.md): The BoxApi documentation provides a comprehensive guide for users to manage Box content and workflows through a set of tools that facilitate file management, metadata handling, collaboration, document generation, and enterprise operations. It enables users to automate processes related to content lifecycle, security -- [CalendlyApi](https://docs.arcade.dev/en/mcp-servers/productivity/calendly-api.md): The CalendlyApi documentation provides users with tools to effectively manage scheduling and event-related tasks within the Calendly platform. It outlines various functionalities, such as retrieving event details, managing invitees, and creating event types, enabling users to build applications that interact +- [AshbyApi](https://docs.arcade.dev/en/mcp-servers/productivity/ashby-api.md): The AshbyApi documentation provides users with a comprehensive guide to utilizing the Ashby API for managing recruitment processes effectively. It outlines various tools and actions available for creating and managing job applications, candidates, interview schedules, and feedback, thereby streamlining the hiring +- [BoxApi](https://docs.arcade.dev/en/mcp-servers/productivity/box-api.md): The BoxApi documentation provides users with tools to effectively manage and automate various aspects of Box content, including file management, metadata handling, collaboration, document generation, and enterprise settings. It outlines key functionalities such as managing user permissions, retrieving audit data, and +- [CalendlyApi](https://docs.arcade.dev/en/mcp-servers/productivity/calendly-api.md): The CalendlyApi documentation provides a comprehensive guide for developers to integrate and manage scheduling tasks using the Calendly API. It outlines various tools available for actions such as retrieving event details, managing invitees, and creating event types, enabling users to build applications - [Clickup](https://docs.arcade.dev/en/mcp-servers/productivity/clickup.md): This documentation page provides an overview of the ClickUp MCP Server, which enables users to build agents and applications that interact with ClickUp workspaces, tasks, and members. It details various tools available for managing tasks, comments, and workspace structures, allowing - [Clickup Reference](https://docs.arcade.dev/en/mcp-servers/productivity/clickup/reference.md): The Clickup Reference documentation provides users with a comprehensive overview of enumerations used in various Clickup MCP Server tools, including task priority, filter scope, task ordering, and comment resolution. It helps users understand the default values and options available for creating tasks - [ClickupApi](https://docs.arcade.dev/en/mcp-servers/productivity/clickup-api.md): The ClickupApi documentation provides users with a comprehensive set of tools for interacting with the ClickUp API, facilitating efficient task and project management. Users can learn how to authenticate via OAuth2 and utilize various functionalities, such as managing checklists, comments,