llama-stack-mirror/llama_stack/ui
Francisco Arceo f3d5459647
feat(UI): adding MVP playground UI (#2828)
# What does this PR do?
I've been tinkering a little with a simple chat playground in the UI, so
I'm opening the PR with what's kind of a WIP.

If you look at the first commit, that includes the big part of the
changes. The rest of the files changed come from adding installing the
`shadcn` components.

Note this is missing a lot; e.g.,
- sessions
- document upload
- audio (the shadcn components install these by default from
https://shadcn-chatbot-kit.vercel.app/docs/components/chat)

I still need to wire up a lot more to make it actually fully functional
but it does basic chat using the LS Typescript Client.

Basic demo: 

<img width="1329" height="1430" alt="Image"
src="https://github.com/user-attachments/assets/917a2096-36d4-4925-b83b-f1f2cda98698"
/>

<img width="1319" height="1424" alt="Image"
src="https://github.com/user-attachments/assets/fab1583b-1c72-4bf3-baf2-405aee13c6bb"
/>


<!-- If resolving an issue, uncomment and update the line below -->
<!-- Closes #[issue-number] -->

## Test Plan
<!-- Describe the tests you ran to verify your changes with result
summaries. *Provide clear instructions so the plan can be easily
re-executed.* -->

---------

Signed-off-by: Francisco Javier Arceo <farceo@redhat.com>
2025-07-30 19:44:16 -07:00
..
app feat(UI): adding MVP playground UI (#2828) 2025-07-30 19:44:16 -07:00
components feat(UI): adding MVP playground UI (#2828) 2025-07-30 19:44:16 -07:00
e2e feat(ui): add infinite scroll pagination to chat completions/responses logs table (#2466) 2025-06-18 15:28:39 -07:00
hooks feat(UI): adding MVP playground UI (#2828) 2025-07-30 19:44:16 -07:00
lib feat(UI): adding MVP playground UI (#2828) 2025-07-30 19:44:16 -07:00
public feat: scaffolding for Llama Stack UI (#2149) 2025-05-14 17:22:46 -07:00
types feat(auth,ui): support github sign-in in the UI (#2545) 2025-07-08 11:02:57 -07:00
.gitignore feat(ui): add infinite scroll pagination to chat completions/responses logs table (#2466) 2025-06-18 15:28:39 -07:00
.prettierignore feat(ui): implement chat completion views (#2201) 2025-05-22 22:05:54 -07:00
.prettierrc feat(ui): implement chat completion views (#2201) 2025-05-22 22:05:54 -07:00
components.json feat(UI): adding MVP playground UI (#2828) 2025-07-30 19:44:16 -07:00
eslint.config.mjs feat: scaffolding for Llama Stack UI (#2149) 2025-05-14 17:22:46 -07:00
instrumentation.ts feat(auth,ui): support github sign-in in the UI (#2545) 2025-07-08 11:02:57 -07:00
jest.config.ts feat(ui): add infinite scroll pagination to chat completions/responses logs table (#2466) 2025-06-18 15:28:39 -07:00
jest.setup.ts feat(ui): add infinite scroll pagination to chat completions/responses logs table (#2466) 2025-06-18 15:28:39 -07:00
next.config.ts feat: scaffolding for Llama Stack UI (#2149) 2025-05-14 17:22:46 -07:00
package-lock.json feat(UI): adding MVP playground UI (#2828) 2025-07-30 19:44:16 -07:00
package.json feat(UI): adding MVP playground UI (#2828) 2025-07-30 19:44:16 -07:00
playwright.config.ts feat(ui): add infinite scroll pagination to chat completions/responses logs table (#2466) 2025-06-18 15:28:39 -07:00
postcss.config.mjs feat: scaffolding for Llama Stack UI (#2149) 2025-05-14 17:22:46 -07:00
README.md feat(ui): implement chat completion views (#2201) 2025-05-22 22:05:54 -07:00
tsconfig.json feat: scaffolding for Llama Stack UI (#2149) 2025-05-14 17:22:46 -07:00

This is WIP.

We use shadcdn/ui Shadcn UI for the UI components.

Getting Started

First, install dependencies:

npm install

Then, run the development server:

npm run dev
# or
yarn dev
# or
pnpm dev
# or
bun dev

Open http://localhost:8322 with your browser to see the result.