Skip to content

Comments

feat: AI SDK from Vercel AI Gateway#27

Merged
DongDuong2001 merged 6 commits intomainfrom
feat/AI-SDK-Vercel
Jan 25, 2026
Merged

feat: AI SDK from Vercel AI Gateway#27
DongDuong2001 merged 6 commits intomainfrom
feat/AI-SDK-Vercel

Conversation

@DongDuong2001
Copy link
Collaborator

This pull request modernizes the AI chat tool by switching from a local Ollama-based backend to Vercel AI Gateway with streaming and multi-model support. It introduces a model selector UI, improves the chat experience with streaming responses, and refactors the code to use the latest @ai-sdk/react hooks for state management. The changes also include a new reusable Select UI component and necessary dependency updates.

Key changes:

Backend/API Integration

  • Migrated the /api/chat endpoint from using a local Ollama server to Vercel AI Gateway, supporting multiple models and streaming responses via the ai package. The endpoint now requires an AI_GATEWAY_API_KEY and handles errors accordingly.

Frontend Chat Experience

  • Refactored the AI Tools chat page (ai-tools/page.tsx) to use the @ai-sdk/react useChat hook, enabling streaming messages, improved error handling, and more robust state management.
  • Added a model selector dropdown allowing users to choose between Gemini 1.5 Pro, Claude 3.5 Sonnet, and GPT-4o. The selected model is sent with each chat request and reflected in the UI. [1] [2]
  • Updated chat UI to display the selected model as the assistant's name and in status indicators, replacing previous provider logic. [1] [2] [3]
  • Improved message rendering and input handling to better support streaming and future extensibility. [1] [2]

UI Components

  • Added a new reusable Select component (components/ui/select.tsx) based on Radix UI, used for the model selector in the chat UI.

Dependency Updates

  • Added dependencies for @ai-sdk/react, @ai-sdk/google, and ai to support new AI integration and streaming. [1] [2]

Replaces the Ollama-based implementation with AI Gateway and streamText for handling chat requests. Adds API key check, updates request handling, and streams responses directly. Improves error handling and simplifies the code.
Replaces manual chat state and API calls with the useChat hook from @ai-sdk/react, simplifying message handling and loading state. Adds a model selection dropdown for users to choose between Gemini, Claude, and GPT-4o, and updates UI to reflect the selected model. Removes provider-specific logic and streamlines the chat input and message rendering.
Introduces a new Select component built on top of Radix UI's Select primitives with custom styling and subcomponents for consistent UI usage across the application.
Added @ai-sdk/google, @ai-sdk/react, and ai packages to dependencies in package.json to support AI-related features.
Added and updated several dependencies including @ai-sdk/google, @ai-sdk/react, ai, swr, and their related packages. This ensures compatibility with the latest features and bug fixes from these libraries.
@DongDuong2001 DongDuong2001 requested a review from mthutt January 24, 2026 07:38
@DongDuong2001 DongDuong2001 self-assigned this Jan 24, 2026
@DongDuong2001 DongDuong2001 added the features New feature add to project. label Jan 24, 2026
@vercel
Copy link
Contributor

vercel bot commented Jan 24, 2026

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Review Updated (UTC)
lab68dev-platform-1ds5 Ready Ready Preview, Comment Jan 25, 2026 9:01am

…tion or class'

Co-authored-by: Copilot Autofix powered by AI <223894421+github-code-quality[bot]@users.noreply.github.com>
@DongDuong2001 DongDuong2001 merged commit e39303b into main Jan 25, 2026
6 checks passed
@DongDuong2001 DongDuong2001 deleted the feat/AI-SDK-Vercel branch January 25, 2026 09:02
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

features New feature add to project.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant