This PR increases the width of the border that we use to indicate when a
call participant is speaking.
This should make it more apparent in the UI when someone is speaking.
Release Notes:
- Increased the width of the ring used to indicate when someone is
speaking in a call.
This PR improves the muted indicators to make it clearer when a call
participant is muted.
Previously we used a red border color to denote when a participant was
muted.
Now we render an indicator with an icon to more clearly indicate the
participant's muted status:
<img width="303" alt="Screenshot 2024-01-16 at 4 05 15 PM"
src="https://github.com/zed-industries/zed/assets/1486634/d30fcd84-48e7-4959-b3c4-1054162c6bd6">
Hovering over the indicator will display a tooltip for further
explanation:
<img width="456" alt="Screenshot 2024-01-16 at 4 05 25 PM"
src="https://github.com/zed-industries/zed/assets/1486634/6345846f-196c-47d9-8d65-c8d86e63f823">
This change also paves the way for denoting the deafened status for call
participants.
Release Notes:
- Improved the mute indicator for call participants.
This PR adds a color ribbon for the local player in the current call.
This fixes the alignment of the local user's avatar so that it lines up
with the rest of the collaborators in the call:
<img width="307" alt="Screenshot 2024-01-16 at 2 56 04 PM"
src="https://github.com/zed-industries/zed/assets/1486634/979ee3fa-70c9-482a-9351-020402ad68b9">
Release Notes:
- Added a color ribbon for the local player when in a call.
This PR reworks the way we add indicators to `Avatar`s to make them more
general-purpose.
Previously we had logic specific to the availability indicator embedded
in the `Avatar` component, which made it unwieldy to repurpose for
something else.
Now the `indicator` is just a slot that we can put anything into.
Release Notes:
- N/A
Release Notes:
- Fixed a bug where the 'deafen' button would only apply to audio from
the call's current participants, but not any participants who joined
after the button was pressed.
- Fixed a bug where after being granted write access to a channel, the
microphone icon appeared non-muted, even though audio was not shared.
This PR renames the `h_stack` and `v_stack` to `h_flex` and `v_flex`,
respectively.
We were previously using `h_stack` and `v_stack` to match SwiftUI, but
`h_flex` and `v_flex` fit better with the web/flexbox terminology that
the rest of GPUI uses.
Additionally, we were already calling the utility functions used to
implement `h_stack` and `v_stack` by the new names.
Release Notes:
- N/A
- Update chat panel with current channel
- Open chat panel for guests
- Open chat when joining a channel with guests
- Some tweaks for chat panels
- Don't lose focus on default panel state
- Make chat prettier (to my eyes at least)
- Fix multiple mentions in one message
- Show a border when scrolled in chat
- Fix re-docking chat panel
- Move settings subscription to dock
[[PR Description]]
Release Notes:
- Opens chat by default when joining a public channel
- Improves chat panel UI
This PR changes the approach we're using to render the channel buttons
to use a more straightforward (and less hacky) approach.
### Motivation
Even with the variety of hacks that were employed to make the current
approach work, there are still a number of issues with the current
solution:
- Hovering in the empty space to the left of a channel doesn't correctly
apply the hover background to the container for the channel buttons
- Hovering to the very right of the collab panel (right on top of the
drag handle) causes the channel button container to apply its hover
background without applying it to the rest of the row
- The buttons would still get pushed off to the right by the indent
space in the channel tree, resulting in jagged indicators at small sizes
Additionally, the rectangular background placed behind the channel
buttons still didn't look great when it overlapped with the channel
names.
### Explanation
For these reasons, I decided to explore a simpler approach that
addresses these issues, albeit with some tradeoffs that I think are
acceptable.
We now render the absolutely-positioned button container as a sibling
element of the `ListItem`. This is to avoid issues with the container
getting pushed around based on the contents of the `ListItem` rather
than staying absolutely positioned at the end of the row.
We also have gotten rid of the background for the button container, and
now rely on the background of the individual `IconButton`s to occlude
the channel name behind them when the two are overlapping.
Here are some examples of the new UI in various configurations:
#### When the channel entry is hovered
<img width="270" alt="Screenshot 2024-01-09 at 6 15 24 PM"
src="https://github.com/zed-industries/zed/assets/1486634/0207a129-30eb-4067-8490-3b6c9cbf75ea">
#### Overlapping with the channel name
<img width="229" alt="Screenshot 2024-01-09 at 6 15 43 PM"
src="https://github.com/zed-industries/zed/assets/1486634/0a67507e-45c8-4325-a71e-d416edc3a115">
#### Narrow collab panel
<img width="116" alt="Screenshot 2024-01-09 at 6 16 07 PM"
src="https://github.com/zed-industries/zed/assets/1486634/887ebaa3-e4d6-4497-9141-afcc8b7cd356">
### Tradeoffs
The new approach comes with the following tradeoffs that I am currently
aware of:
The occlusion can look a little weird when the icons are in the middle
of a channel name (as opposed to fully occluding the end of the channel
name):
<img width="190" alt="Screenshot 2024-01-09 at 6 24 32 PM"
src="https://github.com/zed-industries/zed/assets/1486634/0062b806-1b8f-47eb-af8d-f061d9829366">
Hovering one of the icons causes the icon to be hovered instead of the
row:
<img width="232" alt="Screenshot 2024-01-09 at 6 31 38 PM"
src="https://github.com/zed-industries/zed/assets/1486634/cbcc1a45-64d2-4890-8ad6-c5a5ee961b86">
Release Notes:
- Improved the way channel buttons are displayed.
This PR renames the `IconElement` component to just `Icon`.
This better matches the rest of our components, as `IconElement` was the
only one using this naming convention.
The `Icon` enum has been renamed to `IconName` to free up the name.
I was trying to come up with a way that would allow rendering an
`Icon::Zed` directly (and thus make the `IconElement` a hidden part of
the API), but I couldn't come up with a way to do this cleanly.
Release Notes:
- N/A
This PR adds some basic stories for collab notifications to make them
easier to work on:
<img width="1076" alt="Screenshot 2024-01-08 at 9 43 39 PM"
src="https://github.com/zed-industries/zed/assets/1486634/4a0adcfa-1134-49c2-b589-74ac1d52af4c">
I factored out a `CollabNotification` component that defines the general
structure for one of these notifications, and this is the component that
we use in the stories, with representative values passed to it to
simulate the different instances of the notification.
We can't use the actual notification components in the stories due to
their data dependencies.
Release Notes:
- N/A
This PR improves the empty states for the chat panel:
- The signed-out state has been updated to match our other signed-out
panel states.
- A new state has been added to account for the case where a user is
signed in but doesn't have an active chat.
Release Notes:
- Improved the design of empty states in the chat panel.
