Commit Graph
187 Commits
Author SHA1 Message Date
Bruno Quaresma e8d5f98ede feat: support markdown in notifications (#17075)
To make the notification content more appealing, we are sending the
notification content as markdown from the server, so we need to adjust
the FE to display it properly.
2025-03-24 13:46:43 -03:00
Bruno Quaresma e40ea258dc fix: fix double ws connection for notifications (#17044)
**Issue:**
The UI was creating two web socket connections to receive notification
updates causing duplicated values.

**Cause:**
We were rendering the notification container twice. One for the desktop
nav and another for mobile.

**Fix:**
Only use one notification container for the nav.

**Improvements for later:**
I think would be better at some point to move the networking and data
logic into a provider but it would require testing and some tiny rework.
Since the actual fix works well, and it is not complex or difficult, I
think it is ok to stay with it until we require to load notifications in
more places.
2025-03-21 14:12:22 -03:00
Bruno Quaresma 1593861d7c feat: add load more notifications on inbox (#17030)
Users need to see older notifications, so to make that happen, we added
a load more button at the end of the notifications list.

**Demo:**


https://github.com/user-attachments/assets/bd3d7964-a8f5-4164-8da0-9ba89ae88c9c

**What is missing?**
As you can notice, I didn't add tests for this feature. I tried, but I
didn't find a good solution for testing scroll events. However I was
able to get it working, but it was too cumbersome that I decided to
remove because of its maintenence burden.
2025-03-21 13:38:17 -03:00
Bruno Quaresma 0cd254f219 feat: enable mark all inbox notifications as read (#17023)
Bind the "Mark all notifications as read" action to the correct API
request in the UI.
2025-03-20 10:30:05 -03:00
Bruno Quaresma bf59c7ca0f fix: add notifications back to desktop (#17021)
The notifications were removed on [this PR
](https://github.com/coder/coder/pull/17008)by accident.
2025-03-20 09:42:08 -03:00
Bruno Quaresma 4ea5ef925f feat: make notifications header sticky (#17005)
When having a bunch of notifications and the user is scrolling down the
content it is helpful to keep the header visible so the user can easily
mark all of them as read if they want to.
2025-03-19 16:02:45 -03:00
Bruno Quaresma ab763ca242 fix: show notifications on mobile (#17008)
Show the notifications close to the menu button.

**After fix:**
<img width="515" alt="Screenshot 2025-03-19 at 15 09 36"
src="https://github.com/user-attachments/assets/38f86c5b-d324-4a8b-9c68-ea818b226ae4"
/>
2025-03-19 15:19:57 -03:00
Bruno Quaresma abbd88b819 feat: update notification badge to support 99+ (#17007)
After dogfooding the notifications we noticed that admins will probably
have a larger number of unread notifications everyday so with that in
mind we decided to increase the "truncate" rate from 9+ to 99+.
2025-03-19 15:15:31 -03:00
Bruno Quaresma 4a548021c3 fix: close popover when notification settings are clicked (#17001)
When a user clicks in the notification settings does not make sense to
keep the popover open, instead, we want to close it.
2025-03-19 10:52:04 -03:00
Bruno Quaresma 86d907126d fix: fix overflowing text in inbox notifications (#17000)
- Break white spaces 
- Break long words in inbox notifications

**Before:**
<img width="499" alt="Screenshot 2025-03-19 at 10 10 36"
src="https://github.com/user-attachments/assets/4729cf51-0e2c-412b-b5e5-bb37a4b7d86f"
/>

**Now:**
<img width="498" alt="Screenshot 2025-03-19 at 10 10 15"
src="https://github.com/user-attachments/assets/331e8492-0114-4100-bd46-a66258741e46"
/>
2025-03-19 10:39:37 -03:00
Mathias Fredriksson 3ac844ad3d chore(codersdk): rename WorkspaceAgent(Dev)container structs (#16996)
This is to free up the devcontainer name space for more targeted
structs.

Updates #16423
2025-03-19 10:16:14 +00:00
Bruno Quaresma ab8ba96707 feat: add notifications widget in the navbar (#16983)
**Preview:**
<img width="479" alt="Screenshot 2025-03-18 at 10 38 25"
src="https://github.com/user-attachments/assets/2e4cb48e-3606-478c-a68d-13465789330b"
/>

[Figma
file](https://www.figma.com/design/5kRpzK8Qr1k38nNz7H0HSh/Inbox-notifications?node-id=1-2726&t=PUsQwLrwyzXUxhf1-0)

**This PR adds:**
- Notification widget in the navbar
- Show notifications
- Option to mark each notification as read
- Update notifications in realtime 

**What is next?**
- Option to mark all the notifications as read at once
- Option to load previous notifications - Right now, it only shows the
latest 25 notifications
- Having custom icons for each type of notification

**And about tests?**
The notification widget components are well covered by the current
stories, but we definitely want to have e2e tests for it. However, in my
recent projects, I found more useful to ship the UI features first, get
feedback, change whatever needs to be changed, and then, add the e2e
tests to avoid major rework.

Related to https://github.com/coder/internal/issues/336
2025-03-18 15:21:22 -03:00
Cian Johnston 75b27e8f19 fix(agent/agentcontainers): improve testing of convertDockerInspect, return correct host port (#16887)
* Improves separation of concerns between `runDockerInspect` and
`convertDockerInspect`: `runDockerInspect` now just runs the command and
returns the output, while `convertDockerInspect` now does all of the
conversion and parsing logic.
* Improves testing of `convertDockerInspect` using real test fixtures.
* Fixes issue where the container port is returned instead of the host
port.
* Updates UI to link to correct host port. Container port is still
displayed in the button text, but the HostIP:HostPort is shown in a
popover.
* Adds stories for workspace agent UI
2025-03-18 14:37:45 +00:00
Marcin Tojek 13d0dac795 feat: display error if app is not installed (#16980)
Fixes: https://github.com/coder/coder/issues/13937
2025-03-18 14:24:02 +01:00
Bruno Quaresma 564b387262 feat: add provisioner jobs into the UI (#16867)
- Add provisioner jobs back, but as a sub page of the organization
settings
- Add missing storybook tests to the components

Related to https://github.com/coder/coder/issues/15192.
2025-03-14 08:22:00 -03:00
Bruno Quaresma f2cd046b2b chore: add notification UI components (#16818)
Related to https://github.com/coder/internal/issues/336

This PR adds the base components for the Notifications UI below (you can
click on the image to open the related Figma design) based on the
response structure defined on this [notion
doc](https://www.notion.so/coderhq/Coder-Inbox-Endpoints-1a1d579be592809eb921f13baf18f783).

[![new notifications including
hover](https://github.com/user-attachments/assets/885fb055-544e-4d9e-b5bf-be986e8b9fc0)](https://www.figma.com/design/5kRpzK8Qr1k38nNz7H0HSh/Inbox-notifications?node-id=2-1098&m=dev)

**What is not included**
- Support for infinite scrolling (pending on BE definition)

**How to test the components?**
- The only way to test the components is to use Chromatic or downloading
the branch and running Storybook locally.
2025-03-12 14:36:33 -03:00
Jaayden Halko 86b61ef1d8 fix: use correct permissions for CRUD of custom roles (#16854)
resolves coder/internal#428

The goal of the PR is to start using updateOrgRoles and deleteOrgRoles
permissions to gate custom roles functionality

```
		updateOrgRoles: {
			object: {
				resource_type: "assign_org_role",
				organization_id: organizationId,
			},
			action: "update",
		},
		deleteOrgRoles: {
			object: {
				resource_type: "assign_org_role",
				organization_id: organizationId,
			},
			action: "delete",
		}
```
2025-03-10 18:43:09 -04:00
ケイラ 092c129de0 chore: perform several small frontend permissions refactors (#16735) 2025-03-07 10:33:09 -07:00
ケイラ deb95f948a chore: remove unused code (#16815) 2025-03-05 13:53:21 -07:00
Bruno QuaresmaandCian Johnston 861c4b140b feat: add devcontainer in the UI (#16800)
![image](https://github.com/user-attachments/assets/361f9e69-dec8-47c8-b075-7c13ce84c7e8)

Related to https://github.com/coder/coder/issues/16422

---------

Co-authored-by: Cian Johnston <cian@coder.com>
2025-03-04 14:29:02 -03:00
ケイラ 17ad2849e4 fix: fix deployment settings navigation issues (#16780) 2025-03-03 15:48:17 -07:00
Bruno Quaresma 7c035a4d98 fix: remove provisioners from deployment sidebar (#16717)
Provisioners should be only under orgs. This is a left over from a
previous provisioner refactoring.
2025-02-26 14:20:47 -03:00
Bruno Quaresma 38ad8d1f3a feat: add provisioner tags field on template creation (#16656)
Close https://github.com/coder/coder/issues/15426

Demo:


https://github.com/user-attachments/assets/a7901908-8714-4a55-8d4f-c27bf7743111
2025-02-25 14:27:51 -03:00
Marcin Tojek a2d4b9984e fix: hide app icon if not found (#16684)
Fixes: https://github.com/coder/coder/issues/14759
2025-02-25 10:30:17 +00:00
Hugo Dutka ac88c9ba17 fix: ensure the web UI doesn't break when license telemetry required check fails (#16667)
Addresses https://github.com/coder/coder/issues/16455.

## Changes

- Initialize default entitlements in a Set to include all features
- Initialize entitlements' `Warnings` and `Errors` fields to arrays
rather than `nil`s.
- Minor changes in formatting on the frontend

## Reasoning

I had to change how entitlements are initialized to match the `codersdk`
[generated
types](https://github.com/coder/coder/blob/33d62619225702257fa2542f40ecc26bfd0d1fa6/site/src/api/typesGenerated.ts#L727),
which the frontend assumes are correct, and doesn't run additional
checks on.

- `features: Record<FeatureName, Feature>`: this type signifies that
every `FeatureName` is present in the record, but on `main`, that's not
true if there's a telemetry required error
- `warnings: readonly string[];` and `errors: readonly string[];`: these
types mean that the fields are not `null`, but that's not always true

With a valid license, the [`LicensesEntitlements`
function](https://github.com/coder/coder/blob/33d62619225702257fa2542f40ecc26bfd0d1fa6/enterprise/coderd/license/license.go#L92)
ensures that all features are present in the entitlements. It's called
by the [`Entitlements`
function](https://github.com/coder/coder/blob/33d62619225702257fa2542f40ecc26bfd0d1fa6/enterprise/coderd/license/license.go#L42),
which is called by
[`api.updateEnittlements`](https://github.com/coder/coder/blob/33d62619225702257fa2542f40ecc26bfd0d1fa6/enterprise/coderd/coderd.go#L687).
However, when a license requires telemetry and telemetry is disabled,
the entitlements with all features [are
discarded](https://github.com/coder/coder/blob/33d62619225702257fa2542f40ecc26bfd0d1fa6/enterprise/coderd/coderd.go#L704)
in an early exit from the same function. By initializing entitlements
with all the features from the get go, we avoid this problem.

## License issue banner after the changes

<img width="1512" alt="Screenshot 2025-02-23 at 20 25 42"
src="https://github.com/user-attachments/assets/ee0134b3-f745-45d9-8333-bfa1661e33d2"
/>
2025-02-24 16:02:33 +01:00
ケイラ a85a220816 chore: clean up built-in role permissions (#16645) 2025-02-21 14:33:34 -07:00
ケイラ deadac0b91 fix: fix loading states and permissions checks in organization settings (#16465) 2025-02-19 11:48:13 -07:00
Marcin Tojek e59c54a539 fix: center proxy spinner (#16621)
Fixes: https://github.com/coder/coder/issues/16615
2025-02-19 19:07:10 +01:00
Kira PilotandJaayden Halko 2c6df5a9ae fix: sort orgs alphabetically in dropdown (#16583)
resolves https://github.com/coder/internal/issues/352
<img width="312" alt="Screenshot 2025-02-18 at 12 16 09 PM"
src="https://github.com/user-attachments/assets/c7863bfd-c7cc-4fa6-be88-68a03cd19c1f"
/>

---------

Co-authored-by: Jaayden Halko <jaayden.halko@gmail.com>
2025-02-19 10:20:14 -05:00
Bruno Quaresma 0f3858ecc9 feat: display provisioner jobs and daemons for an organization (#16532)
**Jobs:**
<img width="1624" alt="Screenshot 2025-02-13 at 09 26 31"
src="https://github.com/user-attachments/assets/dc1f24de-48e8-4f91-b128-8e4f3b109328"
/>
[Figma
Link](https://www.figma.com/design/JYW69pbgOMr21fCMiQsPXg/Provisioners?node-id=10-2005&m=dev)

**Daemons:**
<img width="1624" alt="Screenshot 2025-02-13 at 09 26 53"
src="https://github.com/user-attachments/assets/429d77ee-2b4f-45d1-924f-796145901fd8"
/>
[Figma
Link](https://www.figma.com/design/JYW69pbgOMr21fCMiQsPXg/Provisioners?node-id=26-4038&m=dev)

Close https://github.com/coder/coder/issues/15192 and
https://github.com/coder/coder/issues/15193
2025-02-18 11:27:51 -03:00
Marcin Tojek 1c5a0425c5 fix: include origin in support link (#16572)
Fixes: https://github.com/coder/coder/issues/15542
2025-02-14 13:07:59 +00: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
ケイラ b13cac9f0a chore: remove beta badges from organizations (#16411) 2025-02-05 09:21:17 -07:00
Jaayden Halko 7f44189ed2 feat: orgs IDP sync - add combobox to select claim field value when sync field is set (#16335)
contributes to coder/internal#330

For organizations IdP sync:

1. when the sync field is set, call the claim field values API to see if
the sync field is a valid claim field and return an array of claim field
values
2. If there are 1 or more claim field values, replace the input
component for entering the IdP organization name with a combobox
populated with the claim field values
3. The user can now select a value from the dropdown or enter a custom
value

Tests will be added in a separate PR

The same functionality for Group and Role sync will be handled in a
separate PR.


<img width="832" alt="Screenshot 2025-02-04 at 17 45 42"
src="https://github.com/user-attachments/assets/d9123260-f6c6-4914-869b-f11b14773ea1"
/>

<img width="786" alt="Screenshot 2025-02-04 at 17 45 58"
src="https://github.com/user-attachments/assets/06138320-d50c-43bd-b2b9-676ffee42e1a"
/>

<img width="810" alt="Screenshot 2025-02-04 at 17 46 14"
src="https://github.com/user-attachments/assets/50b74909-4629-435d-9774-67d281bbc442"
/>

<img width="825" alt="Screenshot 2025-02-04 at 17 52 08"
src="https://github.com/user-attachments/assets/7470281e-e88f-497b-a613-52bf8007dae8"
/>
2025-02-05 08:40:07 -05:00
ケイラ f3916a68d6 chore: clean up groups page (#16259) 2025-01-29 16:13:52 -07:00
Jaayden Halko d32a5e1a01 fix: fix UI bugs for orgs (#16302)
resolves coder/internal#288
resolves coder/internal#287

Fixes alignment issue on create organizations page when license banner
is visible.

before
<img width="1178" alt="Screenshot 2025-01-27 at 18 36 35"
src="https://github.com/user-attachments/assets/b845f1df-adb3-4876-aba5-8fa9d56eb22b"
/>

after
<img width="961" alt="Screenshot 2025-01-27 at 18 47 06"
src="https://github.com/user-attachments/assets/4a6374f9-9571-453c-9258-9cc4631afb77"
/>
2025-01-28 15:47:05 -05:00
Bruno Quaresma 12c5c65c7f refactor: replace MUI buttons on banners, paywalls and a few pages (#16215) 2025-01-24 10:36:01 -03:00
Bruno Quaresma 0c30a114d1 refactor: remove Docs from the navbar (#16251)
Close #16247
2025-01-24 09:25:20 -03:00
dependabot[bot]andMuhammad Atif Ali f8844cab0a ci: bump the github-actions group with 4 updates (#16192)
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Co-authored-by: Muhammad Atif Ali <atif@coder.com>
2025-01-21 15:31:30 +00:00
Jaayden Halko fbc2a73bef fix: add groups to deployment settings (#16185)
fixes #16182 

<img width="1177" alt="Screenshot 2025-01-17 at 23 20 04"
src="https://github.com/user-attachments/assets/e0eec4bb-6b50-45e9-a27b-d3a89552562a"
/>
<img width="1163" alt="Screenshot 2025-01-17 at 23 20 12"
src="https://github.com/user-attachments/assets/d8a7129c-0240-4ef5-9f21-84cda5631366"
/>
<img width="1161" alt="Screenshot 2025-01-17 at 23 20 22"
src="https://github.com/user-attachments/assets/0ec78f3d-ec96-46a6-8def-aad4700712ac"
/>
2025-01-17 19:46:28 -05:00
Bruno Quaresma eda8190eee feat: open app in tab or slim-window (#16152)
Close https://github.com/coder/terraform-provider-coder/issues/297
2025-01-17 10:01:44 -03:00
ケイラ cd62e3934a feat: add a page to showcase the local installation script (#16122) 2025-01-15 10:42:14 -07:00
Bruno Quaresma 473fcc33a5 chore: add Chart component (#16118)
Related to https://github.com/coder/coder/issues/15297 and based on
[this
design](https://www.figma.com/design/gtVchocIWPGYjzaHD2OIY7/Setting-page?node-id=16-1848&m=dev).
2025-01-14 09:04:14 -03:00
Michael Smith 8b9763dd2c fix: ensure active Deployment Page nav links are highlighted (#16092)
## Changes made
- Updated links in the deployment settings page to ensure that they're
highlighted properly
- Updated comment about previous PR to make sure it's clear why we
needed a workaround.
2025-01-10 09:58:42 -05:00
Jaayden Halko 8a0094ce70 feat: add redesigned organization settings sidebar (#15932)
resolves coder/internal#173, coder/internal#175

This PR does the following
1. Updates the left sidebar for organizations to use a dropdown to
select the organization
2. Move the create organization button inside the dropdown
3. Update the design of the create organization page
4. Do not display the organization in the dropdown if there is only 1
org to display

Figma:
https://www.figma.com/design/OR75XeUI0Z3ksqt1mHsNQw/Dashboard-v1?node-id=139-1380&m=dev

The loading state for the save button in the create organization form
will be handled separately after #14978 is completed.

Note: Since the dropdown is based off the cmdk component, navigation in
the dropdown is handled by the arrow keys, https://cmdk.paco.me/

<img width="560" alt="Screenshot 2025-01-03 at 21 11 26"
src="https://github.com/user-attachments/assets/ff6e61ab-c8d4-4f97-b603-306492e9bfec"
/>
<img width="641" alt="Screenshot 2025-01-03 at 21 11 39"
src="https://github.com/user-attachments/assets/fedb28e0-9ef3-4b0f-8665-06215338f351"
/>
<img width="1178" alt="Screenshot 2025-01-03 at 21 12 05"
src="https://github.com/user-attachments/assets/ee672533-2689-4b2e-a7bf-471ea72e1095"
/>
<img width="1177" alt="Screenshot 2025-01-03 at 21 12 39"
src="https://github.com/user-attachments/assets/f13824a6-2581-4bff-b5b6-2024c2e145a4"
/>
2025-01-08 08:01:00 -05: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 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 5786a13ac9 chore: apply design changes to the admin settings menu dropdown (#15947)
resolves coder/internal#177

Design changes for the admin settings menu dropdown

<img width="327" alt="Screenshot 2024-12-20 at 17 44 48"
src="https://github.com/user-attachments/assets/04af04b3-bfa2-4659-b31c-58252bf43c05"
/>
2024-12-20 17:55:19 -05:00
Bruno Quaresma 300ad87c2e refactor: replace and remove deprecated Avatar component (#15930)
Close https://github.com/coder/coder/issues/14997
2024-12-20 09:57:51 -03:00
Jaayden Halko 1ead56fdc9 fix: add missing idp-org-sync sidebar item (#15933)
During the work to split the deployment and organizations sidebars, the
sidebar item for idp organization sync was accidentally removed.
2024-12-19 18:14:09 -05:00