Skip to content
This repository was archived by the owner on Oct 11, 2022. It is now read-only.

fix(ToggleChannelNotifications): improve toggle notification icon consistency #5378

Closed
jzabala wants to merge 1 commit into from
Closed

fix(ToggleChannelNotifications): improve toggle notification icon consistency #5378

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 1 addition & 2 deletions src/components/entities/listItems/channel.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -151,10 +151,9 @@ const Channel = (props: Props) => {
<Tooltip content={tipText}>
<span style={{ marginLeft: '8px', display: 'flex' }}>
<OutlineButton
disabled={isLoading}
Copy link
Contributor

@brianlovin brianlovin Jul 22, 2020

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

If we remove this, the user could double click and we might end up with some race conditions on network requests, right? Is there any way to preserve this?

Copy link
Contributor Author

@jzabala jzabala Jul 22, 2020 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I decided to remove the disabled prop because in reality it is not preventing the double click right now. The component with the onClick functionality is ToggleChannelNotifications that is the parent of the button. The disabled at the moment is only giving the opacity effect.

Current app functionality

Jul-22-2020 13-43-54

Copy link
Contributor Author

@jzabala jzabala Jul 22, 2020

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I could also prevent that in this PR if you want.

onMouseEnter={() => setIsHoveringNotifications(true)}
onMouseLeave={() => setIsHoveringNotifications(false)}
style={{ padding: '4px' }}
style={{ padding: '4px', opacity: isLoading ? 0.6 : 1 }}
size={'small'}
>
<Icon
Expand Down