mirror of
https://github.com/netzbegruenung/jitsi-meet-electron.git
synced 2024-04-28 06:44:52 +02:00
Add button to remove conference from recents list
Fixes #313, #283, #322, #127, #334
This commit is contained in:
parent
044c864cde
commit
111a1ef884
10
app/features/recent-list/actionTypes.js
Normal file
10
app/features/recent-list/actionTypes.js
Normal file
|
@ -0,0 +1,10 @@
|
||||||
|
/**
|
||||||
|
* The type of (redux) action that is dispatched when a conference is removed from the recents list.
|
||||||
|
*
|
||||||
|
* @type {
|
||||||
|
* type: CONFERENCE_REMOVED,
|
||||||
|
* conference: Object
|
||||||
|
* }
|
||||||
|
*/
|
||||||
|
export const CONFERENCE_REMOVED = Symbol('CONFERENCE_REMOVED');
|
||||||
|
|
19
app/features/recent-list/actions.js
Normal file
19
app/features/recent-list/actions.js
Normal file
|
@ -0,0 +1,19 @@
|
||||||
|
// @flow
|
||||||
|
|
||||||
|
import { CONFERENCE_REMOVED } from './actionTypes';
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Notifies that conference is removed from recents list.
|
||||||
|
*
|
||||||
|
* @param {Object} conference - Conference Details.
|
||||||
|
* @returns {{
|
||||||
|
* type: CONFERENCE_REMOVED,
|
||||||
|
* conference: Object
|
||||||
|
* }}
|
||||||
|
*/
|
||||||
|
export function conferenceRemoved(conference: Object) {
|
||||||
|
return {
|
||||||
|
type: CONFERENCE_REMOVED,
|
||||||
|
conference
|
||||||
|
};
|
||||||
|
}
|
|
@ -6,6 +6,7 @@ import { connect } from 'react-redux';
|
||||||
import type { Dispatch } from 'redux';
|
import type { Dispatch } from 'redux';
|
||||||
import { push } from 'react-router-redux';
|
import { push } from 'react-router-redux';
|
||||||
|
|
||||||
|
import { conferenceRemoved } from '../actions';
|
||||||
import {
|
import {
|
||||||
ConferenceCard,
|
ConferenceCard,
|
||||||
ConferenceTitle,
|
ConferenceTitle,
|
||||||
|
@ -13,6 +14,8 @@ import {
|
||||||
TruncatedText
|
TruncatedText
|
||||||
} from '../styled';
|
} from '../styled';
|
||||||
import type { RecentListItem } from '../types';
|
import type { RecentListItem } from '../types';
|
||||||
|
import Button from '@atlaskit/button';
|
||||||
|
import CrossIcon from '@atlaskit/icon/glyph/cross';
|
||||||
|
|
||||||
type Props = {
|
type Props = {
|
||||||
|
|
||||||
|
@ -58,6 +61,20 @@ class RecentList extends Component<Props, *> {
|
||||||
return () => this.props.dispatch(push('/conference', conference));
|
return () => this.props.dispatch(push('/conference', conference));
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Creates a handler for removing a conference from the recents list.
|
||||||
|
*
|
||||||
|
* @param {RecentListItem} conference - Conference Details.
|
||||||
|
* @returns {void}
|
||||||
|
*/
|
||||||
|
_onRemoveConference(conference: RecentListItem) {
|
||||||
|
return e => {
|
||||||
|
this.props.dispatch(conferenceRemoved(conference));
|
||||||
|
e.stopPropagation();
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Renders the conference card.
|
* Renders the conference card.
|
||||||
*
|
*
|
||||||
|
@ -81,6 +98,11 @@ class RecentList extends Component<Props, *> {
|
||||||
<TruncatedText>
|
<TruncatedText>
|
||||||
{ this._renderDuration(conference) }
|
{ this._renderDuration(conference) }
|
||||||
</TruncatedText>
|
</TruncatedText>
|
||||||
|
<Button
|
||||||
|
appearance = 'subtle'
|
||||||
|
iconBefore = { <CrossIcon primaryColor = 'white' /> }
|
||||||
|
onClick = { this._onRemoveConference(conference) }
|
||||||
|
spacing = 'none' />
|
||||||
</ConferenceCard>
|
</ConferenceCard>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,6 +1,7 @@
|
||||||
// @flow
|
// @flow
|
||||||
|
|
||||||
import { CONFERENCE_ENDED, CONFERENCE_JOINED } from '../conference';
|
import { CONFERENCE_ENDED, CONFERENCE_JOINED } from '../conference';
|
||||||
|
import { CONFERENCE_REMOVED } from './actionTypes';
|
||||||
|
|
||||||
import type { RecentListItem } from './types';
|
import type { RecentListItem } from './types';
|
||||||
|
|
||||||
|
@ -34,6 +35,12 @@ export default (state: State = DEFAULT_STATE, action: Object) => {
|
||||||
recentList: _insertConference(state.recentList, action.conference)
|
recentList: _insertConference(state.recentList, action.conference)
|
||||||
};
|
};
|
||||||
|
|
||||||
|
case CONFERENCE_REMOVED:
|
||||||
|
return {
|
||||||
|
...state,
|
||||||
|
recentList: _removeConference(state.recentList, action.conference)
|
||||||
|
};
|
||||||
|
|
||||||
default:
|
default:
|
||||||
return state;
|
return state;
|
||||||
}
|
}
|
||||||
|
@ -65,6 +72,21 @@ function _insertConference(
|
||||||
return newRecentList;
|
return newRecentList;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Remove a conference from the recent list array.
|
||||||
|
*
|
||||||
|
* @param {Array<RecentListItem>} recentList - Previous recent list array.
|
||||||
|
* @param {RecentListItem} toRemove - Conference to be removed.
|
||||||
|
* @returns {Array<RecentListItem>} - Updated recent list array.
|
||||||
|
*/
|
||||||
|
function _removeConference(
|
||||||
|
recentList: Array<RecentListItem>,
|
||||||
|
toRemove: RecentListItem
|
||||||
|
): Array<RecentListItem> {
|
||||||
|
return recentList.filter(
|
||||||
|
(conference: RecentListItem) => conference !== toRemove);
|
||||||
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Update the EndTime of the last conference.
|
* Update the EndTime of the last conference.
|
||||||
*
|
*
|
||||||
|
|
|
@ -6,8 +6,10 @@ export default styled.div`
|
||||||
background: #1754A9;
|
background: #1754A9;
|
||||||
border-radius: 0.5em;
|
border-radius: 0.5em;
|
||||||
color: white;
|
color: white;
|
||||||
display: flex;
|
display: grid;
|
||||||
flex-direction: column;
|
grid-template-rows: repeat(4, auto);
|
||||||
|
grid-template-columns: 1fr auto;
|
||||||
|
grid-auto-flow: column;
|
||||||
font-size: 0.9em;
|
font-size: 0.9em;
|
||||||
margin: 0.5em;
|
margin: 0.5em;
|
||||||
padding: 1em;
|
padding: 1em;
|
||||||
|
|
Loading…
Reference in a new issue