rbondessonandGitHub
4315038346
* Refactor MessageActionBar into MVVM ActionBarView * Adding tooltips for menu items and correct i18n strings * Layout changes * Renaming some properties * Rename property * Create a first version of the view model and refactor media visibility logic * Refactor view to take options and rections menu as optional properties * Cleaner interface between view and view model * Refactor view properties and replace Menu and MenuItem * Bugfixes and switching to ActionBarView instead of MessageActionBar in element-web * Avoid creating view models and render toolbar until it is actually shown * Added unit and playwright tests and documented the view * Added view model unit tests and updated snapshots of dependant tests * Remove unused components and unnecessary css * Remove unused language tags * Fix for handling join-rules correctly * Prettier * Add handling of stale view model in async calls * Prettier * Split the element-web css into two different. One for legacy components and one for the ActionBarView * Missing variables used for linting * Fix for showing ActionBarView when using keyboard for navigation * Handle visibility on context menu closing * ThreadPanel uses the ActionBarView so restore css rule * Fix for visibility of the ActionBarView in Thread panel * Fix for ActionBarVuew visibility when closing right-click context menu and not still hovering * Add roving index to function as a toolbar * Adjust the RoomView test to send hover to the EventTile instead of the message text * Fix SonarCloud issues * Fix for SonarCloud issue * Merge fix * Rename mx_LegacyActionBar to mx_ThreadActionBar * Added documentation and simplified join rules * Generalize the ActionBarView and move logic to view model * Add the four new buttons to the ActionBarView * Update view model and tests to use the updated ActionBarView * Refactor element-web to use ActionBarView * Clean up styling in element-web * Clean up and updating snaps and screenshots * Added unit-tests for better coverage * Moving ActionBarView to the correct folder in shared components * Update snaps in element-web * Better documentation in stories * Merge fixes * Updates after review comments * Review comment fixes * Added documentation to view models and updated snaps * Hide button had the wrong label * Replace createRef with useRef
76 lines
2.6 KiB
TypeScript
76 lines
2.6 KiB
TypeScript
/*
|
|
* Copyright 2026 Element Creations Ltd.
|
|
*
|
|
* SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial
|
|
* Please see LICENSE files in the repository root for full details.
|
|
*/
|
|
|
|
import {
|
|
ActionBarAction,
|
|
BaseViewModel,
|
|
type ActionBarViewActions,
|
|
type ActionBarViewSnapshot,
|
|
} from "@element-hq/web-shared-components";
|
|
|
|
/** Props for the edit-history action bar view model. */
|
|
export interface EditHistoryActionBarViewModelProps {
|
|
/** Whether to include the remove action. */
|
|
canRemove: boolean;
|
|
/** Whether to include the view source action. */
|
|
showViewSource: boolean;
|
|
/** Called when the remove action is activated. */
|
|
onRemoveClick?: (anchor: HTMLElement | null) => void;
|
|
/** Called when the view source action is activated. */
|
|
onViewSourceClick?: (anchor: HTMLElement | null) => void;
|
|
}
|
|
|
|
/** View model for the label-style action bar shown in the edit-history panel. */
|
|
export class EditHistoryActionBarViewModel
|
|
extends BaseViewModel<ActionBarViewSnapshot, EditHistoryActionBarViewModelProps>
|
|
implements ActionBarViewActions
|
|
{
|
|
public constructor(props: EditHistoryActionBarViewModelProps) {
|
|
super(props, EditHistoryActionBarViewModel.buildSnapshot(props));
|
|
}
|
|
|
|
private static buildSnapshot(props: EditHistoryActionBarViewModelProps): ActionBarViewSnapshot {
|
|
const actions: ActionBarAction[] = [];
|
|
|
|
if (props.canRemove) {
|
|
actions.push(ActionBarAction.Remove);
|
|
}
|
|
if (props.showViewSource) {
|
|
actions.push(ActionBarAction.ViewSource);
|
|
}
|
|
|
|
return {
|
|
actions,
|
|
presentation: "label",
|
|
isDownloadEncrypted: false,
|
|
isDownloadLoading: false,
|
|
isPinned: false,
|
|
isQuoteExpanded: false,
|
|
isThreadReplyAllowed: true,
|
|
};
|
|
}
|
|
|
|
/** Updates props and rebuilds the derived action-bar snapshot. */
|
|
public setProps(newProps: Partial<EditHistoryActionBarViewModelProps>): void {
|
|
this.props = {
|
|
...this.props,
|
|
...newProps,
|
|
};
|
|
this.snapshot.merge(EditHistoryActionBarViewModel.buildSnapshot(this.props));
|
|
}
|
|
|
|
/** Forwards the remove action using the triggering button as the anchor. */
|
|
public onRemoveClick = (anchor: HTMLElement | null): void => {
|
|
this.props.onRemoveClick?.(anchor);
|
|
};
|
|
|
|
/** Forwards the view source action using the triggering button as the anchor. */
|
|
public onViewSourceClick = (anchor: HTMLElement | null): void => {
|
|
this.props.onViewSourceClick?.(anchor);
|
|
};
|
|
}
|