Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Style room header icons and facepile for toggled state #28968

Merged
merged 11 commits into from
Jan 27, 2025

Conversation

MidhunSureshR
Copy link
Member

For https://github.com/element-hq/wat-internal/issues/240 and https://github.com/element-hq/wat-internal/issues/242

According to the figma designs, the toggled on state of the room header buttons should look like:
image

and the face pile should look like:
image

So that we track changes to the right panel phases
We do this so that we can get by using a single event listener i.e we
only need to call `useCurrentPhase` in the provider as opposed to
calling it in each header icon.
and adds a class name when the corresponding panel is open
@@ -0,0 +1,30 @@
/*
Copyright 2024 New Vector Ltd.
Copy link
Member

Choose a reason for hiding this comment

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

2025?

@@ -0,0 +1,23 @@
/*
Copyright 2024 New Vector Ltd.
Copy link
Member

Choose a reason for hiding this comment

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

2025?

@@ -0,0 +1,34 @@
/*
Copyright 2024 New Vector Ltd.
Copy link
Member

Choose a reason for hiding this comment

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

2025?

@@ -0,0 +1,45 @@
/*
Copyright 2024 New Vector Ltd.
Copy link
Member

Choose a reason for hiding this comment

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

2025?

import { useToggled } from "./useToggled";

type Props = {
Icon: React.ComponentType<any>;
Copy link
Member

Choose a reason for hiding this comment

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

using any here is weak, that doesn't even guarantee the component accepts className as it is used

Copy link
Member Author

Choose a reason for hiding this comment

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

Done in 7bd3033

@MidhunSureshR MidhunSureshR added this pull request to the merge queue Jan 27, 2025
@github-merge-queue github-merge-queue bot removed this pull request from the merge queue due to failed status checks Jan 27, 2025
@MidhunSureshR MidhunSureshR added this pull request to the merge queue Jan 27, 2025
@github-merge-queue github-merge-queue bot removed this pull request from the merge queue due to failed status checks Jan 27, 2025
@MidhunSureshR MidhunSureshR added this pull request to the merge queue Jan 27, 2025
Merged via the queue into develop with commit f29ce94 Jan 27, 2025
33 checks passed
@MidhunSureshR MidhunSureshR deleted the midhun/room-header-active-icons branch January 27, 2025 15:18
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants