Files
coder/site/static
Jake Howellandケイラ ca971dda29 fix: improve AI Bridge request logs UI/UX (#21252)
Closes #21052 and is related to #21218 

This pull request implements a bunch of changes the team requested to
improve the overall user experience when navigating to the Request Logs
page. Since these are mostly UI changes, screenshots do a much better
job of showing what's different than me trying to explain everything in
words, so I've included them below.

> [!WARNING]  
> More globally we've changed how we're rendering `<PaginationHeader
/>`, therefore we've renamed it to `<PaginationAmount />`. This will
effect multiple layouts however its a global improvement we're
intentionally looking to make.

### Preview 


![ai-bridge-improvements](https://github.com/user-attachments/assets/ce92852e-d0fc-4268-b52b-9aefd431033b)

### Changes

1. Date formatting set to a standardised way including the month as a
`MMM` (i.e `Dec`)
2. Names and avatars are now rendered larger, furthermore they render
the `.name` field falling back on `.username`.
3. Font-size increased from `text-xs` to `text-sm` to increase overall
legibility globally.
4. Initiator is now rendered inside of a `<Badge />` and gives longer
names a chance to render.
5. Models are now rendered in a `<Badge />` alongside their icons.
6. Input/Output tokens are in a shared `<Badge />`-group alongside
truncation (when necessary).
7. Badge from `5` is rendered with the proper name being visible on
hover (for use if truncated).
8. Move globally the `Showing X of X` counts to the bottom of the tables
(effects other components outside of AI Bridge).
9. Icons are now included within the dropdown for the `Provider` filter.
10. Truncation of elements is now handled so larger prompts don't cause
the table to require further scrolling.
11. New merged Input/Output `<dt>` element with the badge 

| Position | Pull-request |
| -------- | ------------ |
|  | [fix: improve AI Bridge request logs
UI/UX](https://github.com/coder/coder/pull/21252) |
| | [feat: add AI Bridge request logs model
filter](https://github.com/coder/coder/pull/21259) |
| | [chore!: promote AIBridge from
`ExperimentalHandler`](https://github.com/coder/coder/pull/21278) |
| | [feat: implement request log collapsing prompt (`<RequestLogsPrompt
/>`)](https://github.com/coder/coder/pull/21313) |

---------

Co-authored-by: ケイラ <mckayla@hey.com>
2025-12-19 00:47:20 +11:00
..