nikrozman/element-web
1
0
Fork 0
Code Issues Actions 3 Packages Projects Releases Wiki Activity

Move ResizerNotifier into SDKContext (#30939)

Browse Source 
* Move ResizerNotifier into SDKContext

so we don't have to pass it into RoomView

* Fix test

* Unused import

* Add tests

* Remove a bunch of resizeNotifier props

* Remove more resizeNotifier props

* Add resizenotifier to test

* Add more sdkcontext wrappers in tests

* More sdkcontext wrappers

* Even more sdkcontext wrappers

* Add test to make sonarcloud happy

* Context isn't always there unlike props

* Test actual resizing too

* Remove commented line
This commit is contained in:
David Baker
2025-10-06 10:23:06 +01:00
committed by GitHub
parent 87fdf96192
commit c08775588d
32 changed files with 490 additions and 443 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
src/components/views/right_panel/TimelineCard.tsx
View File

@@ -234,7 +234,6 @@ export default class TimelineCard extends React.Component<IProps, IState> {
membersLoaded={true}
editState={this.state.editState}
eventId={this.state.initialEventId}
resizeNotifier={this.props.resizeNotifier}
highlightedEventId={highlightedEventId}
onScroll={this.onScroll}
/>

15
src/components/views/rooms/AppsDrawer.tsx
View File

@@ -27,11 +27,11 @@ import UIStore from "../../../stores/UIStore";
import { type ActionPayload } from "../../../dispatcher/payloads";
import Spinner from "../elements/Spinner";
import SdkConfig from "../../../SdkConfig";
import { SDKContext } from "../../../contexts/SDKContext";
interface IProps {
userId: string;
room: Room;
resizeNotifier: ResizeNotifier;
showApps?: boolean; // Should apps be rendered
maxHeight: number;
role?: AriaRole;
@@ -57,8 +57,11 @@ export default class AppsDrawer extends React.Component<IProps, IState> {
showApps: true,
};
public constructor(props: IProps) {
super(props);
public static contextType = SDKContext;
declare public context: React.ContextType<typeof SDKContext>;
public constructor(props: IProps, context: React.ContextType<typeof SDKContext>) {
super(props, context);
this.state = {
apps: this.getApps(),
@@ -73,7 +76,7 @@ export default class AppsDrawer extends React.Component<IProps, IState> {
public componentDidMount(): void {
this.unmounted = false;
this.props.resizeNotifier.on("isResizing", this.onIsResizing);
this.context.resizeNotifier.on("isResizing", this.onIsResizing);
ScalarMessaging.startListening();
WidgetLayoutStore.instance.on(WidgetLayoutStore.emissionForRoom(this.props.room), this.updateApps);
@@ -88,7 +91,7 @@ export default class AppsDrawer extends React.Component<IProps, IState> {
if (this.resizeContainer) {
this.resizer.detach();
}
this.props.resizeNotifier.off("isResizing", this.onIsResizing);
this.context.resizeNotifier.off("isResizing", this.onIsResizing);
}
private onIsResizing = (resizing: boolean): void => {
@@ -281,7 +284,7 @@ export default class AppsDrawer extends React.Component<IProps, IState> {
className="mx_AppsDrawer_resizer"
handleWrapperClass="mx_AppsDrawer_resizer_container"
handleClass="mx_AppsDrawer_resizer_container_handle"
resizeNotifier={this.props.resizeNotifier}
resizeNotifier={this.context.resizeNotifier}
>
{appContainers}
</PersistentVResizer>

17
src/components/views/rooms/AuxPanel.tsx
View File

@@ -13,7 +13,6 @@ import AppsDrawer from "./AppsDrawer";
import SettingsStore from "../../../settings/SettingsStore";
import AutoHideScrollbar from "../../structures/AutoHideScrollbar";
import { UIFeature } from "../../../settings/UIFeature";
import type ResizeNotifier from "../../../utils/ResizeNotifier";
import LegacyCallViewForRoom from "../voip/LegacyCallViewForRoom";
import { objectHasDiff } from "../../../utils/objects";
@@ -22,7 +21,6 @@ interface IProps {
room: Room;
userId: string;
showApps: boolean; // Render apps
resizeNotifier: ResizeNotifier;
children?: ReactNode;
}
@@ -36,23 +34,12 @@ export default class AuxPanel extends React.Component<IProps> {
}
public render(): React.ReactNode {
const callView = (
<LegacyCallViewForRoom
roomId={this.props.room.roomId}
resizeNotifier={this.props.resizeNotifier}
showApps={this.props.showApps}
/>
);
const callView = <LegacyCallViewForRoom roomId={this.props.room.roomId} showApps={this.props.showApps} />;
let appsDrawer;
if (SettingsStore.getValue(UIFeature.Widgets)) {
appsDrawer = (
<AppsDrawer
room={this.props.room}
userId={this.props.userId}
showApps={this.props.showApps}
resizeNotifier={this.props.resizeNotifier}
/>
<AppsDrawer room={this.props.room} userId={this.props.userId} showApps={this.props.showApps} />
);
}

21
src/components/views/rooms/PinnedMessageBanner.tsx
View File

@@ -6,7 +6,7 @@
* Please see LICENSE files in the repository root for full details.
*/
import React, { type JSX, useEffect, useId, useRef, useState } from "react";
import React, { type JSX, useContext, useEffect, useId, useRef, useState } from "react";
import PinIcon from "@vector-im/compound-design-tokens/assets/web/icons/pin-solid";
import { Button } from "@vector-im/compound-web";
import { type MatrixEvent, type Room } from "matrix-js-sdk/src/matrix";
@@ -25,7 +25,7 @@ import { Action } from "../../../dispatcher/actions";
import MessageEvent from "../messages/MessageEvent";
import PosthogTrackers from "../../../PosthogTrackers.ts";
import { EventPreview } from "./EventPreview.tsx";
import type ResizeNotifier from "../../../utils/ResizeNotifier";
import { SDKContext } from "../../../contexts/SDKContext.ts";
/**
* The props for the {@link PinnedMessageBanner} component.
@@ -39,20 +39,12 @@ interface PinnedMessageBannerProps {
* The room where the banner is displayed
*/
room: Room;
/**
* The resize notifier to notify the timeline to resize itself when the banner is displayed or hidden.
*/
resizeNotifier: ResizeNotifier;
}
/**
* A banner that displays the pinned messages in a room.
*/
export function PinnedMessageBanner({
room,
permalinkCreator,
resizeNotifier,
}: PinnedMessageBannerProps): JSX.Element | null {
export function PinnedMessageBanner({ room, permalinkCreator }: PinnedMessageBannerProps): JSX.Element | null {
const pinnedEventIds = usePinnedEvents(room);
const pinnedEvents = useSortedFetchedPinnedEvents(room, pinnedEventIds);
const eventCount = pinnedEvents.length;
@@ -67,7 +59,7 @@ export function PinnedMessageBanner({
const isLastMessage = currentEventIndex === eventCount - 1;
const pinnedEvent = pinnedEvents[currentEventIndex];
useNotifyTimeline(pinnedEvent, resizeNotifier);
useNotifyTimeline(pinnedEvent);
const id = useId();
@@ -152,9 +144,10 @@ export function PinnedMessageBanner({
/**
* When the banner is displayed or hidden, we want to notify the timeline to resize itself.
* @param pinnedEvent
* @param resizeNotifier
*/
function useNotifyTimeline(pinnedEvent: MatrixEvent | null, resizeNotifier: ResizeNotifier): void {
function useNotifyTimeline(pinnedEvent: MatrixEvent | null): void {
const resizeNotifier = useContext(SDKContext).resizeNotifier;
const previousEvent = useRef<MatrixEvent | null>(null);
useEffect(() => {
// If we switch from a pinned message to no pinned message or the opposite, we want to resize the timeline

17
src/components/views/voip/LegacyCallViewForRoom.tsx
View File

@@ -12,14 +12,12 @@ import { Resizable } from "re-resizable";
import LegacyCallHandler, { LegacyCallHandlerEvent } from "../../../LegacyCallHandler";
import LegacyCallView from "./LegacyCallView";
import type ResizeNotifier from "../../../utils/ResizeNotifier";
import { SDKContext } from "../../../contexts/SDKContext";
interface IProps {
// What room we should display the call for
roomId: string;
resizeNotifier: ResizeNotifier;
showApps?: boolean;
}
@@ -33,8 +31,11 @@ interface IState {
* or nothing if there is no call in that room.
*/
export default class LegacyCallViewForRoom extends React.Component<IProps, IState> {
public constructor(props: IProps) {
super(props);
public static contextType = SDKContext;
declare public context: React.ContextType<typeof SDKContext>;
public constructor(props: IProps, context: React.ContextType<typeof SDKContext>) {
super(props, context);
const call = this.getCall();
this.state = {
call,
@@ -73,15 +74,15 @@ export default class LegacyCallViewForRoom extends React.Component<IProps, IStat
}
private onResizeStart = (): void => {
this.props.resizeNotifier.startResizing();
this.context.resizeNotifier.startResizing();
};
private onResize = (): void => {
this.props.resizeNotifier.notifyTimelineHeightChanged();
this.context.resizeNotifier.notifyTimelineHeightChanged();
};
private onResizeStop = (): void => {
this.props.resizeNotifier.stopResizing();
this.context.resizeNotifier.stopResizing();
};
private setSidebarShown = (sidebarShown: boolean): void => {