Skip to content

vladkol/a2a-chat-hub

Repository files navigation

Talk to Agents in A2A Chat Hub 💬

The single easiest way to interact with traditional (chat-like) AI agents that support the Agent2Agent (A2A) and A2UI protocols.

Chat Hub is a lightweight, modern web application (built with Angular) tailored for AI agent developers who prioritize interoperability, seamless integration, and building rich interactive experiences using open standards.

🚀 Deploy in a few steps to Google Cloud Run!

Vibe-coding alert!

This whole project is 95% vibe-coded in Antigravity with Gemini 3.1 Pro.

What about it?

Chat Hub

For developers building the next generation of AI agents, standardizing communication is key. This app serves as a ready-to-use frontend for your agents:

  • Agent2Agent (A2A) Interoperability: Out-of-the-box support for the A2A protocol with streaming.
  • Agent-to-UI (A2UI) Powered: Go beyond plain text. Render rich, agent-driven UI components directly in the chat using the native @a2ui/angular SDK integration.
  • Plug-and-Play: Simply provide the URL of your A2A-compatible agent endpoint, and start interacting immediately.
  • Secure and Scalable: Secure your chats with Google Authentication using Firebase, and deploy in a few steps to Google Cloud Run!

As of today, the app uses A2A v0.3.0 and A2UI v0.8.

Development

# Install dependencies and setup local A2UI libs
npm install

# Start the development server
npm run dev

Configuration and Deployment

Deploying Chat Hub to Google Cloud Run is fully automated via the included deployment script: npm run deploy (which executes scripts/deploy.sh).

Prerequisites

You need to have the following tools installed:

Deployment

[Optional] Google Account Authentication with Firebase:

You deploy the app to Cloud Run with Authentication or without it. If you would like to use Authentication (highly recommend that!), you need to create a Firebase project first.

  1. In you web browser, go to console.firebase.google.com.

  2. Create or select a Google Cloud project.

  3. One created, switch to Authentication (in Build product category) and enable Google sign-in method.

  4. If you want to try this app locally, while in Authentication, switch to Settings then Authorized domains and add localhost and 127.0.0.1 to the list of authorized domains.

  5. Navigate to Project Settings (gear icon) -> General, find Your apps section and add a new web app.

  6. When configuring the app, at Add Firebase SDK step, copy firebaseConfig (Firebase configuration) value:

    It looks like this:

    const firebaseConfig = {
      apiKey: "YOUR_API_KEY",
      authDomain: "YOUR_AUTH_DOMAIN",
      projectId: "YOUR_PROJECT_ID",
      storageBucket: "YOUR_STORAGE_BUCKET",
      messagingSenderId: "YOUR_MESSAGING_SENDER_ID",
      appId: "YOUR_APP_ID"
    };
  7. Paste the copied values one by one into .env file (use .env.example as a template):

    FIREBASE_API_KEY=YOUR_API_KEY
    FIREBASE_AUTH_DOMAIN=YOUR_AUTH_DOMAIN
    FIREBASE_PROJECT_ID=YOUR_PROJECT_ID
    FIREBASE_STORAGE_BUCKET=YOUR_STORAGE_BUCKET
    FIREBASE_MESSAGING_SENDER_ID=YOUR_MESSAGING_SENDER_ID
    FIREBASE_APP_ID=YOUR_APP_ID

Deployment without Authentication:

If Firebase is not used, Cloud Run deployment strictly requires the GOOGLE_CLOUD_PROJECT environment variable to be defined manually in your .env file for proper routing.

Deployment Command:

If you want to limit access by email domain, you can set ALLOWED_DOMAINS_EMAILS variable in .env file (e.g., user@example.com, mycompany.com).

Now, deploy the configured app to Cloud Run:

npm run deploy

Enjoy! 🎉

Note 1: If it doesn't already exist, the script automatically provisions a dedicated service account (a2a-chat-hub-sa@<PROJECT_ID>.iam.gserviceaccount.com).

Note 2: If A2A agent is deployed to Cloud Run, this app's service account needs to be granted the Cloud Run Invoker (roles/run.invoker) role on the agent's Cloud Run service or project. Every request to an A2A agent includes an Authorization header populated with this app's Cloud Run service account ID token. Requests also pass the X-Goog-Authenticated-User-Email header, representing the email of the authenticated app user.

Note 3: .gcloudignore file allows dist and node_modules to be included in uploaded sources. This is necessary for deploying the app to Cloud Run without building a container.

Have fun!

About

An example implementation of Agent2Agent (A2A) chat app with A2UI support. Chat with any A2A agent!

Topics

Resources

License

Stars

Watchers

Forks

Contributors