Commit Graph

26 Commits

Author SHA1 Message Date
Jake Howell 203899718f feat: remove agent workspaces limit (#21998)
In relation to
[`internal#1281`](https://github.com/coder/internal/issues/1281)

Managed agent workspace build limits are now advisory only. Breaching
the limit no longer blocks workspace creation — it only surfaces a
warning.

- Removed hard-limit enforcement in `checkAIBuildUsage` so AI task
builds are always permitted regardless of managed agent count.
- Updated the license warning to remove "Further managed agent builds
will be blocked." verbiage.
- Updated tests to assert builds succeed beyond the limit instead of
failing.
- Removed the "Limit" display from the `ManagedAgentsConsumption`
progress bar — the bar is now relative to the included allowance (soft
limit) only, and turns orange when usage exceeds it.

Bonus:

- De-MUI'd `LicenseBannerView` — replaced Emotion CSS and MUI `Link`
with Tailwind classes.
- Added `highlight-orange` color token to the Tailwind theme.
2026-02-20 12:56:00 +11:00
Jaayden Halko b1d5f77cf0 chore: update colors (#22070) 2026-02-13 08:37:00 +00:00
Jaayden Halko c9909817a8 chore: replace Inter with Geist variable font (#22060) 2026-02-12 17:26:47 +00:00
Jake Howell e45635aab6 fix: refactor <Paywall /> component to be universal (#21740)
During development of #21659 I approved some `<Paywall />` code that had
an extensive props system, however, I wasn't a huge fan of this. This
approach attempts to take it further like something `shadcn` would,
where-in we define the `<Paywall />` (and its subset of components) and
we wrap around those when needed for `<PaywallAIGovernance />` and
`<PaywallPremium />`.

Theoretically there is no real CSS/Design changes here. However
screenshot for prosperity.

| Previously | Now |
| --- | --- |
| <img width="2306" height="614" alt="CleanShot 2026-01-29 at 10 56
05@2x"
src="https://github.com/user-attachments/assets/83a4aa1b-da74-459d-ae11-fae06c1a8371"
/> | <img width="2308" height="622" alt="CleanShot 2026-01-29 at 10 55
05@2x"
src="https://github.com/user-attachments/assets/4aa43b09-6705-4af3-86cc-edc0c08e53b1"
/> |

---------

Co-authored-by: Ben Potter <me@bpmct.net>
Co-authored-by: Claude Opus 4.5 <noreply@anthropic.com>
2026-01-30 23:44:07 +11:00
blink-so[bot] 5448a2645d feat: migrate Alert component from MUI to shadcn and update to new Alert designs (#18412)
--- Although originally created with Blink most of the PR has been
re-written since then

## Summary

This PR migrates the Alert component from MUI to shadcn implementation
while maintaining full backward compatibility with the existing API.
Updates Alerts to new design in Figma.

Figma design:
https://www.figma.com/design/WfqIgsTFXN2BscBSSyXWF8/Coder-kit?node-id=3522-3005&m=dev

<img width="1008" height="623" alt="Screenshot 2025-12-18 at 20 37 32"
src="https://github.com/user-attachments/assets/8b2077f1-f746-4a9a-8b58-3ec3477c247b"
/>

---------

Co-authored-by: blink-so[bot] <211532188+blink-so[bot]@users.noreply.github.com>
Co-authored-by: jaaydenh <1858163+jaaydenh@users.noreply.github.com>
Co-authored-by: Jaayden Halko <jaayden@coder.com>
2025-12-22 11:52:40 +00:00
Cian Johnston f6526b789a feat(site): make TaskPrompt PromptTextarea read-only when submitting (#20363)
- Makes the text area of TaskPrompt read-only when submitting
- Adds a "scanning" animation to the textarea on submit.
2025-10-17 18:11:31 +01:00
Michael Smith 759746cbf1 fix(site): update useAgentLogs to make it more testable and add more tests (#19126)
Take 2
Closes https://github.com/coder/internal/issues/644

## Changes made
- Updated how `useAgentLogs` was defined to make it easier to inject
specific data dependencies (basically making the hook more
unit-testable)
- Simplified the hook API to limit the amount of scope of data it needs
to work
- Added more test cases, and re-enabled the one test case we had
previously disabled
- Extracted our mock websocket code into a separate file, and added more
methods to it
- Updated all runtime code to accommodate new changes
2025-09-17 19:58:02 -04:00
Bruno Quaresma 3be6487f02 feat: support GFM alerts in markdown (#17662)
Closes https://github.com/coder/coder/issues/17660

Add support to [GFM
Alerts](https://docs.github.com/en/get-started/writing-on-github/getting-started-with-writing-and-formatting-on-github/basic-writing-and-formatting-syntax#alerts).

<img width="635" alt="Screenshot 2025-05-02 at 14 26 36"
src="https://github.com/user-attachments/assets/8b785e0f-87f4-4bbd-9107-67858ad5dece"
/>

PS: This was heavily copied from
https://github.com/coder/coder-registry/blob/dev/cmd/main/site/src/components/MarkdownView/MarkdownView.tsx
2025-05-02 14:44:01 -03:00
Bruno Quaresma 3ab3ef865c feat: add link to provisioner jobs and daemons (#17509)
Close https://github.com/coder/coder/issues/17314

**Demo**


https://github.com/user-attachments/assets/db37aa67-4755-4b72-a54d-2c3f0c297b7d

**Changes**
- Added the `xs` button variant
- Display all the daemons - idle and offline - and set a size limit to
100 results (explanation in the demo)
- Filter daemons and jobs by ID
2025-04-28 11:38:32 -03:00
Bruno Quaresma c8edadae10 refactor: redesign workspace status on workspaces table (#17425)
Closes https://github.com/coder/coder/issues/17310

**Before:**
<img width="1624" alt="Screenshot 2025-04-16 at 11 49 52"
src="https://github.com/user-attachments/assets/4fb6c8e5-329f-476f-99bb-192c0f9562a2"
/>

**After:**
<img width="1624" alt="Screenshot 2025-04-16 at 11 49 19"
src="https://github.com/user-attachments/assets/c7025fee-fefd-4064-9101-d7a1b364dd80"
/>

**Notice!**
- I've create a new size variation for the badge, `xs`. Since we reduced
the line-height for the `text-xs` to be 16px instead of 18px, having a
smaller badge, reducing the vertical size and horizontal paddings, just
worked better.
- I have to update Figma to reflect these changes. I tried, but I was
not able to get it working and updated correctly. I'm going to take a
pause during this week to learn that.
- Updated the destructive, and warning badges to use borders as defined
in the designs
[here](https://www.figma.com/design/WfqIgsTFXN2BscBSSyXWF8/Coder-kit?node-id=489-3472&t=gfnYeLOIFUqHx6qv-0).
2025-04-17 10:57:02 -03:00
Jaayden Halko a8c2586404 feat: implement UI for top level dynamic parameters diagnostics (#17394)
<img width="672" alt="Screenshot 2025-04-14 at 21 31 11"
src="https://github.com/user-attachments/assets/5ca25c9d-e82e-4d52-8c43-91e4dc31117d"
/>
2025-04-16 13:00:56 -04:00
Jaayden Halko 8a24372e4d feat: add shadcn checkbox component (#17248)
contributes to coder/preview#55

Add shadcn checkbox component matching Figma styles from Coder Kit:
https://www.figma.com/design/WfqIgsTFXN2BscBSSyXWF8/Coder-kit?node-id=489-4187&t=Zx137ETWsQZtaCku-1

<img width="52" alt="Screenshot 2025-04-03 at 21 15 52"
src="https://github.com/user-attachments/assets/ff2de95c-cb12-46ed-af31-a6d230e52a31"
/>
2025-04-04 10:05:21 -04:00
Bruno Quaresma 4604f191e9 refactor: increase workspace and template avatar size (#17200)
**Before**
<img width="1363" alt="Screenshot 2025-04-01 at 14 46 10"
src="https://github.com/user-attachments/assets/d3d76d70-df16-4b27-a138-e493e0bcac83"
/>
<img width="1360" alt="Screenshot 2025-04-01 at 14 45 55"
src="https://github.com/user-attachments/assets/bbae38fe-6ed2-42fa-99b0-e24f6c8d382d"
/>

**After**
<img width="1359" alt="Screenshot 2025-04-01 at 14 46 18"
src="https://github.com/user-attachments/assets/230b606b-fd5f-4e42-9ca2-56ddb2e1f617"
/>
<img width="1362" alt="Screenshot 2025-04-01 at 14 46 02"
src="https://github.com/user-attachments/assets/b22d4b59-4660-47dd-a362-e8d842dd2a82"
/>
2025-04-01 21:29:36 -03:00
Bruno Quaresma 9668cba0e5 refactor: improve markdown rendering on notifications (#17112)
**Before:**
<img width="753" alt="Screenshot 2025-03-26 at 11 11 46"
src="https://github.com/user-attachments/assets/d4504de9-d007-43bf-9e0b-a8ff1b04da2c"
/>

**After:**

![image](https://github.com/user-attachments/assets/5a249a48-e2ec-4573-97ea-7a978fbe3c9a)
2025-03-26 11:24:54 -03:00
Bruno Quaresma 8a3a79f527 refactor: match StatusIndicator component with the new designs (#16458)
Reference:
https://www.figma.com/design/WfqIgsTFXN2BscBSSyXWF8/Coder-kit?node-id=489-4278&m=dev
2025-02-07 15:11:56 -03:00
ケイラ bcfeb726d6 feat: show warning on unrecognized idp org mapping claims (#16478) 2025-02-06 16:45:03 -07:00
Jaayden Halko 42451aa615 chore: add overlay color for background behind dialogs (#16442)
Create tailwind color for the background overlay for dialogs

<img width="1153" alt="Screenshot 2025-02-05 at 12 26 16"
src="https://github.com/user-attachments/assets/46d16418-f594-4daa-9fa9-8ecc597e5c02"
/>
2025-02-05 07:54:59 -05:00
Bruno Quaresma 947818f2d3 chore: add Table component (#16410)
Reference:
https://www.figma.com/design/JYW69pbgOMr21fCMiQsPXg/Provisioners?node-id=10-2056&m=dev

Unfortunately, it’s kinda hard to apply a border only around the table
body using CSS and make it rounded—at least I couldn’t figure out a sane
way to do that. We’d probably need to use a workaround, like not using
the native HTML table element, but that would add significant work. With
that in mind, I'm wrapping the entire table with a border.

<img width="688" alt="Screenshot 2025-02-03 at 14 37 12"
src="https://github.com/user-attachments/assets/55675df0-1aca-4353-b795-0e3cc2938812"
/>
2025-02-03 20:24:47 -03:00
Bruno Quaresma 3217cb85f6 feat: improve usage visibility (#16134)
- Refactor the DAUs chart for clarity by improving the description and updating its title to better reflect the data.  
- Add a license consumption chart to the licenses page.
2025-01-17 12:37:54 -03:00
Bruno Quaresma cb6facb53a refactor: use the new button component on forms and dialogs (#16050)
This is a significant PR that will impact many parts of the UI, so I’d
like to ask you, @jaaydenh, for a very thorough review of the Storybook
stories on Chromatic. I know it’s a bit of a hassle with around 180
stories affected, but it’s all for a good cause 💪

Main changes:
- Update the `Button` component to match the [new buttons
design](https://www.figma.com/design/WfqIgsTFXN2BscBSSyXWF8/Coder-kit?node-id=3-1756&p=f&m=dev).
- Update forms and dialogs to use the new `Button` component.

Related to https://github.com/coder/coder/issues/14978
2025-01-07 14:28:58 -03:00
Bruno Quaresma cee365670d chore: add spinner component (#16014)
This component is necessary to move forward with the "[Define a global
button style](https://github.com/coder/coder/issues/14978)" issue, as it
requires buttons to support loading states with spinners. The `Spinner`
component is heavily inspired by the [Radix UI Spinner
component](https://www.radix-ui.com/themes/docs/components/spinner) and
was developed with the help of [v0](https://v0.dev/).

**Preview**
![Screen Recording 2025-01-02 at 14 37
18](https://github.com/user-attachments/assets/838f6bb2-2125-4a55-9bee-3b3a52852d40)

---------

Co-authored-by: Jaayden Halko <jaayden.halko@gmail.com>
2025-01-02 16:10:38 -03:00
Bruno Quaresma 49fadb801d refactor: update the navbar to match the new designs (#15964)
Update the navbar to match the designs in [this Figma
file](https://www.figma.com/design/WfqIgsTFXN2BscBSSyXWF8/Coder-kit?node-id=656-2354&t=4a6pX5tQU5Ti2Oyi-0).
Related to https://github.com/coder/coder/issues/15617.

**Desktop preview:**


https://github.com/user-attachments/assets/01ce7cd2-baaa-49c4-9e9a-bf6e675151da

**Mobile preview:**


https://github.com/user-attachments/assets/155e2521-7293-4368-a5f5-425179d76326

For a closer look, you can check Chromatic snapshots or test the changes
locally.

**A few considerations:**
- I made some adjustments to improve the design, such as removing the
chevron from the profile menu and reducing the size of the chevrons in
the dropdowns. I’ve documented these changes in the [Figma
file](https://www.figma.com/design/WfqIgsTFXN2BscBSSyXWF8/Coder-kit?node-id=656-2354&t=4a6pX5tQU5Ti2Oyi-0)
so @chrifro can review them after returning from vacation.
- Some of the design questions involve how the proxy and account
dropdown menus should look on desktop and mobile. For desktop, I decided
to retain the current styles, and for mobile, I tried to infer how they
should look based on the existing design.
- There is some duplicated logic between the regular/desktop navbar
menus and the mobile menus, which could lead to inconsistencies and make
maintenance harder in the future. I plan to address this in a follow-up
PR to keep this review manageable.
- I’ve added tests to minimize inconsistencies and potential bugs while
working on this refactor.
2024-12-30 14:25:00 -03:00
Jaayden Halko 6c9ccca687 feat: implement CRUD UI for IDP organization sync settings (#15503)
resolves coder/internal#205

The goal is to create a new page located in deployment settings to allow
users to create and update organization IDP sync settings.

- [x] Use shadcn button for export policy button
- [x] Disable save button if form is not dirty
- [x] Disable "Add IdP organization" button if idp org name or coder
orgs are empty
- [x] Add footnote label below organization sync field input
- [x] Add button to Delete rows in mapping table
- [x] Create Multi-select combox box component to select coder org to
map to idp org
- [x] Storybook tests
- [x] Tooltip for assign default org switch
- [x] Display success/error toast on form submission

<img width="1181" alt="Screenshot 2024-12-02 at 20 33 07"
src="https://github.com/user-attachments/assets/86877d3b-82ec-4ed2-b239-bf8497352a9e">
2024-12-04 14:23:18 -05:00
Bruno Quaresma 308df177c9 chore: use hsl for tailwind and shadcn theming (#15453)
Co-authored-by: Jaayden Halko <jaayden.halko@gmail.com>
2024-11-08 14:33:50 -03:00
Jaayden Halko de2f42eedd fix: enable Tailwind with storybook (#15418)
This adds index.css to the storybook preview file and references to
#storybook-root element in the tailwind config

---------

Co-authored-by: Spike Curtis <spike@coder.com>
Co-authored-by: BrunoQuaresma <bruno_nonato_quaresma@hotmail.com>
2024-11-07 20:56:42 -05:00
Jaayden Halko d4131badb6 feat: implement Premium features page using shadcn/ui and Tailwind (#15094)
resolves coder/internal#176

This is a proof of concept to showcase the use of Tailwind + shadcn/ui.
The goal here was to implement a lower complexity page to reduce the
initial risk and highlight the specific global changes needed.

Changes:

- Create a separate version of Premium features content for Enterprise
and OSS users
- Use shadcn/ui button component and setup styling and variants to match
the buttons defined in the Coder Kit Figma.
https://www.figma.com/design/WfqIgsTFXN2BscBSSyXWF8/Coder-kit?node-id=3-1756
- Setup theming using CSS variables and custom Tailwind colors by using
the dark class name on the root element.
- CSS variable design token naming and colors defined in Figma.
https://www.figma.com/design/WfqIgsTFXN2BscBSSyXWF8/Coder-kit?node-id=1-2


<img width="1199" alt="Screenshot 2024-11-01 at 12 46 03 PM"
src="https://github.com/user-attachments/assets/a251450f-8447-405a-9cc4-9f6aad9cd19f">
<img width="1197" alt="Screenshot 2024-11-01 at 12 45 36 PM"
src="https://github.com/user-attachments/assets/e78a5a40-cbdf-4d85-9ffe-873505800fcc">
2024-11-06 12:53:00 -05:00