remove RedactedGrouper for now
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>pull/21833/head
							parent
							
								
									a399b1018a
								
							
						
					
					
						commit
						83a4558d49
					
				| 
						 | 
					@ -1063,102 +1063,5 @@ class MemberGrouper {
 | 
				
			||||||
    }
 | 
					    }
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
// Wrap consecutive redactions by the same user in a ListSummary, ignore if redacted
 | 
					 | 
				
			||||||
class RedactionGrouper {
 | 
					 | 
				
			||||||
    static canStartGroup = function(panel, ev) {
 | 
					 | 
				
			||||||
        return panel._shouldShowEvent(ev) && ev.isRedacted();
 | 
					 | 
				
			||||||
    }
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
    constructor(panel, ev, prevEvent, lastShownEvent) {
 | 
					 | 
				
			||||||
        this.panel = panel;
 | 
					 | 
				
			||||||
        this.readMarker = panel._readMarkerForEvent(
 | 
					 | 
				
			||||||
            ev.getId(),
 | 
					 | 
				
			||||||
            ev === lastShownEvent,
 | 
					 | 
				
			||||||
        );
 | 
					 | 
				
			||||||
        this.events = [ev];
 | 
					 | 
				
			||||||
        this.prevEvent = prevEvent;
 | 
					 | 
				
			||||||
        this.lastShownEvent = lastShownEvent;
 | 
					 | 
				
			||||||
    }
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
    shouldGroup(ev) {
 | 
					 | 
				
			||||||
        if (this.panel._wantsDateSeparator(this.events[0], ev.getDate())) return false;
 | 
					 | 
				
			||||||
        if (ev.getType() === "m.room.redaction") return true; // for show-hidden-events users
 | 
					 | 
				
			||||||
        return ev.isRedacted() && ev.sender === this.events[0].sender &&
 | 
					 | 
				
			||||||
            ev.getUnsigned().redacted_because.sender === this.events[0].getUnsigned().redacted_because.sender;
 | 
					 | 
				
			||||||
    }
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
    add(ev) {
 | 
					 | 
				
			||||||
        if (ev.getType() === "m.room.redaction") return; // for show-hidden-events users
 | 
					 | 
				
			||||||
        this.readMarker = this.readMarker || this.panel._readMarkerForEvent(
 | 
					 | 
				
			||||||
            ev.getId(),
 | 
					 | 
				
			||||||
            ev === this.lastShownEvent,
 | 
					 | 
				
			||||||
        );
 | 
					 | 
				
			||||||
        this.events.push(ev);
 | 
					 | 
				
			||||||
    }
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
    getTiles() {
 | 
					 | 
				
			||||||
        // If we don't have any events to group, don't even try to group them. The logic
 | 
					 | 
				
			||||||
        // below assumes that we have a group of events to deal with, but we might not if
 | 
					 | 
				
			||||||
        // the events we were supposed to group were redacted.
 | 
					 | 
				
			||||||
        if (!this.events || !this.events.length) return [];
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
        const DateSeparator = sdk.getComponent('messages.DateSeparator');
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
        const panel = this.panel;
 | 
					 | 
				
			||||||
        const lastShownEvent = this.lastShownEvent;
 | 
					 | 
				
			||||||
        const ret = [];
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
        if (panel._wantsDateSeparator(this.prevEvent, this.events[0].getDate())) {
 | 
					 | 
				
			||||||
            const ts = this.events[0].getTs();
 | 
					 | 
				
			||||||
            ret.push(
 | 
					 | 
				
			||||||
                <li key={ts+'~'}><DateSeparator key={ts+'~'} ts={ts} /></li>,
 | 
					 | 
				
			||||||
            );
 | 
					 | 
				
			||||||
        }
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
        // Ensure that the key of the MemberEventListSummary does not change with new
 | 
					 | 
				
			||||||
        // member events. This will prevent it from being re-created unnecessarily, and
 | 
					 | 
				
			||||||
        // instead will allow new props to be provided. In turn, the shouldComponentUpdate
 | 
					 | 
				
			||||||
        // method on ELS can be used to prevent unnecessary renderings.
 | 
					 | 
				
			||||||
        const key = "redactioneventlistsummary-" + (this.prevEvent ? this.events[0].getId() : "initial");
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
        let highlightInMels = false;
 | 
					 | 
				
			||||||
        let eventTiles = this.events.map((e) => {
 | 
					 | 
				
			||||||
            if (e.getId() === panel.props.highlightedEventId) {
 | 
					 | 
				
			||||||
                highlightInMels = true;
 | 
					 | 
				
			||||||
            }
 | 
					 | 
				
			||||||
            // In order to prevent DateSeparators from appearing in the expanded form
 | 
					 | 
				
			||||||
            // of MemberEventListSummary, render each member event as if the previous
 | 
					 | 
				
			||||||
            // one was itself. This way, the timestamp of the previous event === the
 | 
					 | 
				
			||||||
            // timestamp of the current event, and no DateSeparator is inserted.
 | 
					 | 
				
			||||||
            return panel._getTilesForEvent(e, e, e === lastShownEvent);
 | 
					 | 
				
			||||||
        }).reduce((a, b) => a.concat(b), []);
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
        if (eventTiles.length === 0) {
 | 
					 | 
				
			||||||
            eventTiles = null;
 | 
					 | 
				
			||||||
        }
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
        ret.push(
 | 
					 | 
				
			||||||
            <RedactionEventListSummary
 | 
					 | 
				
			||||||
                key={key}
 | 
					 | 
				
			||||||
                events={this.events}
 | 
					 | 
				
			||||||
                onToggle={panel._onHeightChanged} // Update scroll state
 | 
					 | 
				
			||||||
                startExpanded={highlightInMels}
 | 
					 | 
				
			||||||
            >
 | 
					 | 
				
			||||||
                 { eventTiles }
 | 
					 | 
				
			||||||
            </RedactionEventListSummary>,
 | 
					 | 
				
			||||||
        );
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
        if (this.readMarker) {
 | 
					 | 
				
			||||||
            ret.push(this.readMarker);
 | 
					 | 
				
			||||||
        }
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
        return ret;
 | 
					 | 
				
			||||||
    }
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
    getNewPrevEvent() {
 | 
					 | 
				
			||||||
        return this.events[0];
 | 
					 | 
				
			||||||
    }
 | 
					 | 
				
			||||||
}
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
// all the grouper classes that we use
 | 
					// all the grouper classes that we use
 | 
				
			||||||
const groupers = [CreationGrouper, MemberGrouper, RedactionGrouper];
 | 
					const groupers = [CreationGrouper, MemberGrouper];
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -22,7 +22,8 @@ import {MatrixEvent, RoomMember} from "matrix-js-sdk";
 | 
				
			||||||
import {useStateToggle} from "../../../hooks/useStateToggle";
 | 
					import {useStateToggle} from "../../../hooks/useStateToggle";
 | 
				
			||||||
import AccessibleButton from "./AccessibleButton";
 | 
					import AccessibleButton from "./AccessibleButton";
 | 
				
			||||||
 | 
					
 | 
				
			||||||
const EventListSummary = ({events, children, threshold=3, onToggle, startExpanded, summaryMembers=[], summaryText}) => {
 | 
					const EventListSummary = (props) => {
 | 
				
			||||||
 | 
					    const {events, children, threshold=3, onToggle, startExpanded, summaryMembers=[], summaryText, summary} = props;
 | 
				
			||||||
    const [expanded, toggleExpanded] = useStateToggle(startExpanded);
 | 
					    const [expanded, toggleExpanded] = useStateToggle(startExpanded);
 | 
				
			||||||
 | 
					
 | 
				
			||||||
    // Whenever expanded changes call onToggle
 | 
					    // Whenever expanded changes call onToggle
 | 
				
			||||||
| 
						 | 
					@ -49,6 +50,8 @@ const EventListSummary = ({events, children, threshold=3, onToggle, startExpande
 | 
				
			||||||
            <div className="mx_EventListSummary_line"> </div>
 | 
					            <div className="mx_EventListSummary_line"> </div>
 | 
				
			||||||
            { children }
 | 
					            { children }
 | 
				
			||||||
        </React.Fragment>;
 | 
					        </React.Fragment>;
 | 
				
			||||||
 | 
					    } else if (summary) {
 | 
				
			||||||
 | 
					        body = summary;
 | 
				
			||||||
    } else {
 | 
					    } else {
 | 
				
			||||||
        const avatars = summaryMembers.map((m) => <MemberAvatar key={m.userId} member={m} width={14} height={14} />);
 | 
					        const avatars = summaryMembers.map((m) => <MemberAvatar key={m.userId} member={m} width={14} height={14} />);
 | 
				
			||||||
        body = (
 | 
					        body = (
 | 
				
			||||||
| 
						 | 
					@ -66,12 +69,12 @@ const EventListSummary = ({events, children, threshold=3, onToggle, startExpande
 | 
				
			||||||
    }
 | 
					    }
 | 
				
			||||||
 | 
					
 | 
				
			||||||
    return (
 | 
					    return (
 | 
				
			||||||
        <div className="mx_EventListSummary" data-scroll-tokens={eventIds}>
 | 
					        <li className="mx_EventListSummary" data-scroll-tokens={eventIds}>
 | 
				
			||||||
            <AccessibleButton className="mx_EventListSummary_toggle" onClick={toggleExpanded} aria-expanded={expanded}>
 | 
					            <AccessibleButton className="mx_EventListSummary_toggle" onClick={toggleExpanded} aria-expanded={expanded}>
 | 
				
			||||||
                { expanded ? _t('collapse') : _t('expand') }
 | 
					                { expanded ? _t('collapse') : _t('expand') }
 | 
				
			||||||
            </AccessibleButton>
 | 
					            </AccessibleButton>
 | 
				
			||||||
            { body }
 | 
					            { body }
 | 
				
			||||||
        </div>
 | 
					        </li>
 | 
				
			||||||
    );
 | 
					    );
 | 
				
			||||||
};
 | 
					};
 | 
				
			||||||
 | 
					
 | 
				
			||||||
| 
						 | 
					@ -87,10 +90,13 @@ EventListSummary.propTypes = {
 | 
				
			||||||
    // Whether or not to begin with state.expanded=true
 | 
					    // Whether or not to begin with state.expanded=true
 | 
				
			||||||
    startExpanded: PropTypes.bool,
 | 
					    startExpanded: PropTypes.bool,
 | 
				
			||||||
 | 
					
 | 
				
			||||||
    // The list of room members for which to show avatars next to the summary
 | 
					    // The node to render as a summary when the summary is not collapsed,
 | 
				
			||||||
 | 
					    // alternately summaryMembers and summaryText can be provided.
 | 
				
			||||||
 | 
					    summary: PropTypes.node,
 | 
				
			||||||
 | 
					    // The list of room members for which to show avatars next to the summary, ignored if summary is provided
 | 
				
			||||||
    summaryMembers: PropTypes.arrayOf(PropTypes.instanceOf(RoomMember)),
 | 
					    summaryMembers: PropTypes.arrayOf(PropTypes.instanceOf(RoomMember)),
 | 
				
			||||||
    // The text to show as the summary of this event list
 | 
					    // The text to show as the summary of this event list, ignored if summary is provided
 | 
				
			||||||
    summaryText: PropTypes.string.isRequired,
 | 
					    summaryText: PropTypes.string,
 | 
				
			||||||
};
 | 
					};
 | 
				
			||||||
 | 
					
 | 
				
			||||||
export default EventListSummary;
 | 
					export default EventListSummary;
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -1,81 +0,0 @@
 | 
				
			||||||
/*
 | 
					 | 
				
			||||||
Copyright 2020 The Matrix.org Foundation C.I.C.
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
Licensed under the Apache License, Version 2.0 (the "License");
 | 
					 | 
				
			||||||
you may not use this file except in compliance with the License.
 | 
					 | 
				
			||||||
You may obtain a copy of the License at
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
    http://www.apache.org/licenses/LICENSE-2.0
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
Unless required by applicable law or agreed to in writing, software
 | 
					 | 
				
			||||||
distributed under the License is distributed on an "AS IS" BASIS,
 | 
					 | 
				
			||||||
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 | 
					 | 
				
			||||||
See the License for the specific language governing permissions and
 | 
					 | 
				
			||||||
limitations under the License.
 | 
					 | 
				
			||||||
*/
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
import React from "react";
 | 
					 | 
				
			||||||
import {MatrixClient} from "matrix-js-sdk/src/client";
 | 
					 | 
				
			||||||
import {MatrixEvent} from "matrix-js-sdk/src/models/event";
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
import { _t } from "../../../languageHandler";
 | 
					 | 
				
			||||||
import * as sdk from "../../../index";
 | 
					 | 
				
			||||||
import MatrixClientContext from "../../../contexts/MatrixClientContext";
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
interface IProps {
 | 
					 | 
				
			||||||
    // An array of member events to summarise
 | 
					 | 
				
			||||||
    events: MatrixEvent[];
 | 
					 | 
				
			||||||
    // An array of EventTiles to render when expanded
 | 
					 | 
				
			||||||
    children: React.ReactChildren;
 | 
					 | 
				
			||||||
    // The minimum number of events needed to trigger summarisation
 | 
					 | 
				
			||||||
    threshold?: number;
 | 
					 | 
				
			||||||
    // Called when the ELS expansion is toggled
 | 
					 | 
				
			||||||
    onToggle: () => void;
 | 
					 | 
				
			||||||
    // Whether or not to begin with state.expanded=true
 | 
					 | 
				
			||||||
    startExpanded?: boolean;
 | 
					 | 
				
			||||||
}
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
export default class RedactionEventListSummary extends React.Component<IProps> {
 | 
					 | 
				
			||||||
    static displayName = "RedactionEventListSummary";
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
    static defaultProps = {
 | 
					 | 
				
			||||||
        threshold: 2,
 | 
					 | 
				
			||||||
    };
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
    static contextType = MatrixClientContext;
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
    shouldComponentUpdate(nextProps) {
 | 
					 | 
				
			||||||
        // Update if
 | 
					 | 
				
			||||||
        //  - The number of summarised events has changed
 | 
					 | 
				
			||||||
        //  - or if the summary is about to toggle to become collapsed
 | 
					 | 
				
			||||||
        //  - or if there are fewEvents, meaning the child eventTiles are shown as-is
 | 
					 | 
				
			||||||
        return (
 | 
					 | 
				
			||||||
            nextProps.events.length !== this.props.events.length ||
 | 
					 | 
				
			||||||
            nextProps.events.length < this.props.threshold
 | 
					 | 
				
			||||||
        );
 | 
					 | 
				
			||||||
    }
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
    render() {
 | 
					 | 
				
			||||||
        const count = this.props.events.length;
 | 
					 | 
				
			||||||
        const redactionSender = this.props.events[0].getUnsigned().redacted_because.sender;
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
        let avatarMember = this.props.events[0].sender;
 | 
					 | 
				
			||||||
        let summaryText = _t("%(count)s messages deleted", { count });
 | 
					 | 
				
			||||||
        if (redactionSender !== this.context.getUserId()) {
 | 
					 | 
				
			||||||
            const room = (this.context as MatrixClient).getRoom(redactionSender || this.props.events[0].getSender());
 | 
					 | 
				
			||||||
            avatarMember = room && room.getMember(redactionSender);
 | 
					 | 
				
			||||||
            const name = avatarMember ? avatarMember.name : redactionSender;
 | 
					 | 
				
			||||||
            summaryText = _t("%(count)s messages deleted by %(name)s", { count, name });
 | 
					 | 
				
			||||||
        }
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
        const EventListSummary = sdk.getComponent("views.elements.EventListSummary");
 | 
					 | 
				
			||||||
        return <EventListSummary
 | 
					 | 
				
			||||||
            events={this.props.events}
 | 
					 | 
				
			||||||
            threshold={this.props.threshold}
 | 
					 | 
				
			||||||
            onToggle={this.props.onToggle}
 | 
					 | 
				
			||||||
            startExpanded={this.props.startExpanded}
 | 
					 | 
				
			||||||
            children={this.props.children}
 | 
					 | 
				
			||||||
            summaryMembers={[avatarMember]}
 | 
					 | 
				
			||||||
            summaryText={summaryText} />;
 | 
					 | 
				
			||||||
    }
 | 
					 | 
				
			||||||
}
 | 
					 | 
				
			||||||
		Loading…
	
		Reference in New Issue