ref: Refactor performance/ui-related items

[GuiLeme]

What does this PR do?

• Place useUsersBasicInfo inside the presenter's scope;
• Re-work countdown ui to look better and have a better UX;
• Added the different avatar shapes for moderators and attendees;

Motivation

• Improve UI;
• Improve performance of the plugin

More

Here is a demo of how it looks:

demo-pick-random-user.mp4

[Copilot]

Pull request overview

This PR refactors the pick-random-user modal to move user filtering/picking work into the presenter view, refreshes the countdown UI into a floating toast, and consolidates avatar rendering with moderator/attendee shape differences.

Changes:

• Moves filter options and pick-random-user logic into modal/presenter-view scoped hooks.
• Adds shared UserAvatar component and replaces duplicated avatar UI.
• Reworks prevent-close countdown UI and updates behavioral selectors/tests.

Reviewed changes

Copilot reviewed 23 out of 24 changed files in this pull request and generated 3 comments.

Show a summary per file

File	Description
tsconfig.json	Adds ES2017/DOM library typings.
tests/elements.ts	Removes the countdown progress bar selector.
tests/behavioral/multi-user.spec.ts	Updates countdown expectations for both users.
src/components/pick-random-user/types.ts	Removes relocated filter-options type.
src/components/pick-random-user/hooks.ts	Removes filter hooks and updates nullable picked-user handling.
src/components/pick-random-user/context.ts	Deletes the filter-options context.
src/components/pick-random-user/component.tsx	Passes plugin API into the modal and removes root-level user filtering.
src/components/modal/user-avatar/styles.tsx	Adds shared avatar styling.
src/components/modal/user-avatar/component.tsx	Adds shared avatar rendering.
src/components/modal/types.ts	Updates modal props and defines filter-options type.
src/components/modal/styles.tsx	Adds floating toast and modal wrapper styling.
src/components/modal/presenter-view/utils.ts	Updates imports after type relocation.
src/components/modal/presenter-view/types.ts	Updates presenter-view props for scoped hooks and filter props.
src/components/modal/presenter-view/styles.tsx	Removes duplicated avatar styles and reuses list container styling.
src/components/modal/presenter-view/hooks.ts	Adds presenter-scoped user filtering and pick handler hooks.
src/components/modal/presenter-view/component.tsx	Uses scoped hooks and shared avatar component.
src/components/modal/picked-user-view/types.ts	Updates picked-user nullable props and removes progress prop.
src/components/modal/picked-user-view/styles.tsx	Removes countdown/avatar styles now handled elsewhere.
src/components/modal/picked-user-view/component.tsx	Uses shared avatar and removes embedded countdown UI.
src/components/modal/hooks.ts	Moves filter-options data-channel hooks into modal scope.
src/components/modal/component.tsx	Implements modal-level floating countdown toast and passes presenter props.
src/components/extensible-areas/action-button-dropdown/types.ts	Updates nullable picked-user/current-user-info prop typing.
src/commons/utils.ts	Makes picked-user seen helper tolerate missing picked-user id.
src/commons/constants.ts	Adds toast minimum-delay constant.

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.