ref(toolbar): kill Stateless Toolbar and Invite, Feedback, Profile buttons

react/features/feedback/components/FeedbackButton.web.js

@@ -1,113 +0,0 @@
-// @flow
-
-import Tooltip from '@atlaskit/tooltip';
-import React, { Component } from 'react';
-import { connect } from 'react-redux';
-
-import { translate } from '../../base/i18n';
-
-import { openFeedbackDialog } from '../actions';
-
-/**
- * The type of the React {@code Component} props of {@link FeedbackButton}.
- */
-type Props = {
-
-    /**
-     * The JitsiConference for which the feedback will be about.
-     *
-     * FIXME define JitsiConference type
-     * @type {JitsiConference}
-     */
-    _conference: Object,
-
-    /**
-     * Redux store dispatch function.
-     */
-    dispatch: Dispatch<*>,
-
-    /**
-     * Invoked to obtain translated strings.
-     */
-    t: Function,
-
-    /**
-     * From which side of the button the tooltip should appear from.
-     */
-    tooltipPosition: string
-}
-
-/**
- * Implements a Web/React Component which renders a feedback button.
- */
-class FeedbackButton extends Component<Props> {
-    _onClick: Function;
-
-    /**
-     * Initializes a new FeedbackButton instance.
-     *
-     * @param {Object} props - The read-only properties with which the new
-     * instance is to be initialized.
-     */
-    constructor(props: Object) {
-        super(props);
-
-        // Bind event handlers so they are only bound once for every instance.
-        this._onClick = this._onClick.bind(this);
-    }
-
-    /**
-     * Implements React's {@link Component#render()}.
-     *
-     * @inheritdoc
-     * @returns {ReactElement}
-     */
-    render() {
-        return (
-            <div id = 'feedbackButton'>
-                <Tooltip
-                    description = { this.props.t('welcomepage.sendFeedback') }
-                    position = { this.props.tooltipPosition } >
-                    <a
-                        className = 'button icon-feedback'
-                        onClick = { this._onClick } />
-                </Tooltip>
-            </div>
-        );
-    }
-
-    /**
-     * Dispatches an action to open a dialog requesting call feedback.
-     *
-     * @private
-     * @returns {void}
-     */
-    _onClick() {
-        const { _conference, dispatch } = this.props;
-
-        dispatch(openFeedbackDialog(_conference));
-    }
-}
-
-/**
- * Maps (parts of) the Redux state to the associated Conference's props.
- *
- * @param {Object} state - The Redux state.
- * @private
- * @returns {{
- *     _toolboxVisible: boolean
- * }}
- */
-function _mapStateToProps(state) {
-    return {
-        /**
-         * The JitsiConference for which the feedback will be about.
-         *
-         * @private
-         * @type {JitsiConference}
-         */
-        _conference: state['features/base/conference'].conference
-    };
-}
-
-export default translate(connect(_mapStateToProps)(FeedbackButton));

react/features/feedback/components/index.js

@@ -1,2 +1 @@
-export { default as FeedbackButton } from './FeedbackButton';
 export { default as FeedbackDialog } from './FeedbackDialog';

react/features/invite/components/InviteButton.native.js

@@ -1 +0,0 @@
-

react/features/toolbox/components/ProfileButton.web.js

@@ -1,147 +0,0 @@
-/* @flow */
-
-import PropTypes from 'prop-types';
-import React, { Component } from 'react';
-import { connect } from 'react-redux';
-
-import {
-    createToolbarEvent,
-    sendAnalytics
-} from '../../analytics';
-import {
-    getAvatarURL,
-    getLocalParticipant
-} from '../../base/participants';
-import UIEvents from '../../../../service/UI/UIEvents';
-
-import ToolbarButton from './ToolbarButton';
-
-declare var APP: Object;
-
-/**
- * The default configuration for the button.
- *
- * @type {Object}
- */
-const DEFAULT_BUTTON_CONFIGURATION = {
-    buttonName: 'profile',
-    classNames: [ 'button' ],
-    enabled: true,
-    id: 'toolbar_button_profile',
-    tooltipKey: 'profile.setDisplayNameLabel'
-};
-
-/**
- * React {@code Component} for the profile button.
- *
- * @extends Component
- */
-class ProfileButton extends Component<*> {
-    _onClick: Function;
-
-    /**
-     * {@code ProfileButton}'s property types.
-     *
-     * @static
-     */
-    static propTypes = {
-        /**
-         * The redux representation of the local participant.
-         */
-        _localParticipant: PropTypes.object,
-
-        /**
-         * Whether the button support clicking or not.
-         */
-        _unclickable: PropTypes.bool,
-
-        /**
-         * Whether the side panel is opened or not.
-         */
-        toggled: PropTypes.bool,
-
-        /**
-         * From which side tooltips should display. Will be re-used for
-         * displaying the inline dialog for video quality adjustment.
-         */
-        tooltipPosition: PropTypes.string
-    };
-
-    /**
-     * Initializes a new {@code ProfileButton} instance.
-     *
-     * @param {Object} props - The read-only properties with which the new
-     * instance is to be initialized.
-     */
-    constructor(props) {
-        super(props);
-
-        // Bind event handlers so they are only bound once for every instance.
-        this._onClick = this._onClick.bind(this);
-    }
-
-    /**
-     * Implements React's {@link Component#render()}.
-     *
-     * @inheritdoc
-     * @returns {ReactElement}
-     */
-    render() {
-        const {
-            _localParticipant,
-            _unclickable,
-            tooltipPosition,
-            toggled
-        } = this.props;
-        const buttonConfiguration = {
-            ...DEFAULT_BUTTON_CONFIGURATION,
-            unclickable: _unclickable,
-            toggled
-        };
-
-        return (
-            <ToolbarButton
-                button = { buttonConfiguration }
-                onClick = { this._onClick }
-                tooltipPosition = { tooltipPosition }>
-                <img
-                    id = 'avatar'
-                    src = { getAvatarURL(_localParticipant) } />
-            </ToolbarButton>
-        );
-    }
-
-    /**
-     * Click handler for the button.
-     *
-     * @returns {void}
-     */
-    _onClick() {
-        if (!this.props._unclickable) {
-            // TODO: Include an 'enable' attribute, which specifies whether
-            // the profile panel was opened or closed.
-            sendAnalytics(createToolbarEvent('profile'));
-            APP.UI.emitEvent(UIEvents.TOGGLE_PROFILE);
-        }
-    }
-}
-
-/**
- * Maps (parts of) the Redux state to the associated {@code ProfileButton}
- * component's props.
- *
- * @param {Object} state - The Redux state.
- * @private
- * @returns {{
- *     _localParticipant: Object,
- *     _unclickable: boolean
- * }}
- */
-function _mapStateToProps(state) {
-    return {
-        _localParticipant: getLocalParticipant(state),
-        _unclickable: !state['features/base/jwt'].isGuest
-    };
-}
-
-export default connect(_mapStateToProps)(ProfileButton);

react/features/toolbox/components/StatelessToolbar.web.js

@@ -1,65 +0,0 @@
-/* @flow */
-
-import PropTypes from 'prop-types';
-import React, { Component } from 'react';
-
-/**
- * Implements a toolbar in React/Web. It is a strip that contains a set of
- * toolbar items such as buttons.
- *
- * @class StatelessToolbar
- * @extends Component
- */
-export default class StatelessToolbar extends Component<*> {
-    /**
-     * Base toolbar component's property types.
-     *
-     * @static
-     */
-    static propTypes = {
-        /**
-         * Children of current React component.
-         */
-        children: PropTypes.node,
-
-        /**
-         * Toolbar's class name.
-         */
-        className: PropTypes.string,
-
-        /**
-         *  Handler for mouse out event.
-         */
-        onMouseOut: PropTypes.func,
-
-        /**
-         * Handler for mouse over event.
-         */
-        onMouseOver: PropTypes.func
-    };
-
-    /**
-     * Implements React's {@link Component#render()}.
-     *
-     * @inheritdoc
-     * @returns {ReactElement}
-     */
-    render(): React$Element<*> {
-        const {
-            className,
-            onMouseOut,
-            onMouseOver
-        } = this.props;
-
-        return (
-            <div
-                className = { `toolbar ${className}` }
-                onMouseOut = { onMouseOut }
-                onMouseOver = { onMouseOver }>
-                {
-                    this.props.children
-                }
-            </div>
-        );
-    }
-}

react/features/toolbox/components/StatelessToolbarButton.js

@@ -1,130 +0,0 @@
-/* @flow */
-
-import PropTypes from 'prop-types';
-import React from 'react';
-
-import AbstractToolbarButton from './AbstractToolbarButton';
-
-type MapOfAttributes = { [key: string]: * };
-
-
-/* eslint-disable flowtype/space-before-type-colon */
-
-/**
- * Takes toolbar button props and maps them to HTML attributes to set.
- *
- * @param {Object} props - Props set to the React component.
- * @returns {MapOfAttributes}
- */
-function getButtonAttributesByProps(props: Object = {})
-        : MapOfAttributes {
-    // XXX Make sure to not modify props.classNames because that'd be bad
-    // practice.
-    const classNames = (props.classNames && [ ...props.classNames ]) || [];
-
-    props.toggled && classNames.push('toggled');
-    props.unclickable && classNames.push('unclickable');
-
-    const result: MapOfAttributes = {
-        className: classNames.join(' '),
-        'data-container': 'body',
-        'data-placement': 'bottom',
-        id: props.id
-    };
-
-    if (!props.enabled) {
-        result.disabled = 'disabled';
-    }
-
-    if (props.hidden) {
-        result.style = { display: 'none' };
-    }
-
-    if (props.tooltipText) {
-        result.content = props.tooltipText;
-    }
-
-    return result;
-}
-
-/* eslint-enable flowtype/space-before-type-colon */
-
-/**
- * Represents a button in Toolbar on React.
- *
- * @class ToolbarButton
- * @extends AbstractToolbarButton
- */
-export default class StatelessToolbarButton extends AbstractToolbarButton {
-    _onClick: Function;
-
-    /**
-     * Toolbar button component's property types.
-     *
-     * @static
-     */
-    static propTypes = {
-        ...AbstractToolbarButton.propTypes,
-
-        /**
-         * Object describing button.
-         */
-        button: PropTypes.object.isRequired
-    };
-
-    /**
-     * Initializes new ToolbarButton instance.
-     *
-     * @param {Object} props - The read-only properties with which the new
-     * instance is to be initialized.
-     */
-    constructor(props: Object) {
-        super(props);
-
-        // Bind methods to save the context
-        this._onClick = this._onClick.bind(this);
-    }
-
-    /**
-     * Implements React's {@link Component#render()}.
-     *
-     * @inheritdoc
-     * @returns {ReactElement}
-     */
-    render(): React$Element<*> {
-        const { button } = this.props;
-        const attributes = getButtonAttributesByProps(button);
-
-        return (
-            <div className = 'toolbar-button'>
-                <a
-                    { ...attributes }
-                    onClick = { this._onClick }>
-                    { this.props.children }
-                </a>
-            </div>
-        );
-    }
-
-    /**
-     * Wrapper on on click handler props for current button.
-     *
-     * @param {Event} event - Click event object.
-     * @returns {void}
-     * @private
-     */
-    _onClick(event: Event): void {
-        const {
-            button,
-            onClick
-        } = this.props;
-        const {
-            enabled,
-            unclickable
-        } = button;
-
-        if (enabled && !unclickable && onClick) {
-            onClick(event);
-        }
-    }
-}