jiti-meet/react/features/settings/components/web/SettingsDialog.js

213 lines
6.5 KiB
JavaScript
Raw Normal View History

// @flow
import React, { Component } from 'react';
import { getAvailableDevices } from '../../../base/devices';
import { DialogWithTabs, hideDialog } from '../../../base/dialog';
2019-03-21 16:38:29 +00:00
import { connect } from '../../../base/redux';
Google & Microsoft calendar API integration (#3340) * Refactor calendar-sync feature to be loaded on web. For the web part it just adds new property to enable/disable calendar web integration, disabled by default. * Initial implementation of retrieving google calendar events. * Initial implementation of retrieving microsoft calendar events. * Fixes comments. * Rework to use the promise part of microsoft-graph-client api. * Moves dispatching some actions, fixing comments. * Makes sure we do not initializeClient google-api client multiple times. * Do not try to login when fetching calendar entries. The case where there is a calendar type google selected, but not logged in, trying to login on loading welcome page will show a warning that it tried to open a popup, which was denied by browser. * Updates profile display data on sign in. * Propagate google-api state to calendar-sync only if we use google cal. * Adds sign out action. * Clears the event listener when the popup closes. * Clears calendarIntegrationInstance on signOut. * WIP: UI for calendar settings, refactor auth flows * Clean up some unused constants, functions and exports. * break circular dependency of function and constant * Exports only isCalendarEnabled from functions. * Checks isSignedIn when doing fetchCalendarEntries on web. * address comments List microsoftApiApplicationClientID in undocument config. remove unused SET_CALENDAR_TYPE action use helper for calendar enabled in bootstrap reorder actions reorder imports change order of signin -> set type -> update profile add logging for signout error reword setting dialog desc to avoid redundancy add jsdoc to microsoft button props reorder calendar constants move default state to reducer (not reused anywhere) update comment about calendar-sync due to removal of getCalendarState update comment for getCalendarIntegration remove vague comment alpha order reducer, return default state on reset alpha order persistence registry remove unnecessary getType from apis update comments in microsoftCalendar alpha order google-api exports, use api.get in loadGoogleAPI set jsdoc for google signin props alpha order googleapi methods fix calendartab docs * Moves fetching calendar from APP_WILL_MOUNT to SET_CONFIG. The web part needs configuration in order to refresh tokens (Microsoft). * Fixes storing token expire time and refreshing tokens in Microsoft impl. * Address comments updateProfile changed to getCurrentEmail rename result to results stop storing integration in redux, store if ready for use use existing helpers to parse redirect url * update jsdocs, get google app id from redux * clear integration instead of actual sign out
2018-08-15 20:11:54 +00:00
import { isCalendarEnabled } from '../../../calendar-sync';
import {
DeviceSelection,
getDeviceSelectionDialogProps,
submitDeviceSelectionTab
} from '../../../device-selection';
Google & Microsoft calendar API integration (#3340) * Refactor calendar-sync feature to be loaded on web. For the web part it just adds new property to enable/disable calendar web integration, disabled by default. * Initial implementation of retrieving google calendar events. * Initial implementation of retrieving microsoft calendar events. * Fixes comments. * Rework to use the promise part of microsoft-graph-client api. * Moves dispatching some actions, fixing comments. * Makes sure we do not initializeClient google-api client multiple times. * Do not try to login when fetching calendar entries. The case where there is a calendar type google selected, but not logged in, trying to login on loading welcome page will show a warning that it tried to open a popup, which was denied by browser. * Updates profile display data on sign in. * Propagate google-api state to calendar-sync only if we use google cal. * Adds sign out action. * Clears the event listener when the popup closes. * Clears calendarIntegrationInstance on signOut. * WIP: UI for calendar settings, refactor auth flows * Clean up some unused constants, functions and exports. * break circular dependency of function and constant * Exports only isCalendarEnabled from functions. * Checks isSignedIn when doing fetchCalendarEntries on web. * address comments List microsoftApiApplicationClientID in undocument config. remove unused SET_CALENDAR_TYPE action use helper for calendar enabled in bootstrap reorder actions reorder imports change order of signin -> set type -> update profile add logging for signout error reword setting dialog desc to avoid redundancy add jsdoc to microsoft button props reorder calendar constants move default state to reducer (not reused anywhere) update comment about calendar-sync due to removal of getCalendarState update comment for getCalendarIntegration remove vague comment alpha order reducer, return default state on reset alpha order persistence registry remove unnecessary getType from apis update comments in microsoftCalendar alpha order google-api exports, use api.get in loadGoogleAPI set jsdoc for google signin props alpha order googleapi methods fix calendartab docs * Moves fetching calendar from APP_WILL_MOUNT to SET_CONFIG. The web part needs configuration in order to refresh tokens (Microsoft). * Fixes storing token expire time and refreshing tokens in Microsoft impl. * Address comments updateProfile changed to getCurrentEmail rename result to results stop storing integration in redux, store if ready for use use existing helpers to parse redirect url * update jsdocs, get google app id from redux * clear integration instead of actual sign out
2018-08-15 20:11:54 +00:00
import CalendarTab from './CalendarTab';
import MoreTab from './MoreTab';
import ProfileTab from './ProfileTab';
import { getMoreTabProps, getProfileTabProps } from '../../functions';
import { submitMoreTab, submitProfileTab } from '../../actions';
import { SETTINGS_TABS } from '../../constants';
declare var APP: Object;
declare var interfaceConfig: Object;
/**
* The type of the React {@code Component} props of
* {@link ConnectedSettingsDialog}.
*/
type Props = {
/**
* Which settings tab should be initially displayed. If not defined then
* the first tab will be displayed.
*/
defaultTab: string,
/**
* Information about the tabs to be rendered.
*/
_tabs: Array<Object>,
/**
* Invoked to save changed settings.
*/
Google & Microsoft calendar API integration (#3340) * Refactor calendar-sync feature to be loaded on web. For the web part it just adds new property to enable/disable calendar web integration, disabled by default. * Initial implementation of retrieving google calendar events. * Initial implementation of retrieving microsoft calendar events. * Fixes comments. * Rework to use the promise part of microsoft-graph-client api. * Moves dispatching some actions, fixing comments. * Makes sure we do not initializeClient google-api client multiple times. * Do not try to login when fetching calendar entries. The case where there is a calendar type google selected, but not logged in, trying to login on loading welcome page will show a warning that it tried to open a popup, which was denied by browser. * Updates profile display data on sign in. * Propagate google-api state to calendar-sync only if we use google cal. * Adds sign out action. * Clears the event listener when the popup closes. * Clears calendarIntegrationInstance on signOut. * WIP: UI for calendar settings, refactor auth flows * Clean up some unused constants, functions and exports. * break circular dependency of function and constant * Exports only isCalendarEnabled from functions. * Checks isSignedIn when doing fetchCalendarEntries on web. * address comments List microsoftApiApplicationClientID in undocument config. remove unused SET_CALENDAR_TYPE action use helper for calendar enabled in bootstrap reorder actions reorder imports change order of signin -> set type -> update profile add logging for signout error reword setting dialog desc to avoid redundancy add jsdoc to microsoft button props reorder calendar constants move default state to reducer (not reused anywhere) update comment about calendar-sync due to removal of getCalendarState update comment for getCalendarIntegration remove vague comment alpha order reducer, return default state on reset alpha order persistence registry remove unnecessary getType from apis update comments in microsoftCalendar alpha order google-api exports, use api.get in loadGoogleAPI set jsdoc for google signin props alpha order googleapi methods fix calendartab docs * Moves fetching calendar from APP_WILL_MOUNT to SET_CONFIG. The web part needs configuration in order to refresh tokens (Microsoft). * Fixes storing token expire time and refreshing tokens in Microsoft impl. * Address comments updateProfile changed to getCurrentEmail rename result to results stop storing integration in redux, store if ready for use use existing helpers to parse redirect url * update jsdocs, get google app id from redux * clear integration instead of actual sign out
2018-08-15 20:11:54 +00:00
dispatch: Function
};
/**
* A React {@code Component} for displaying a dialog to modify local settings
* and conference-wide (moderator) settings. This version is connected to
* redux to get the current settings.
*
* @extends Component
*/
class SettingsDialog extends Component<Props> {
/**
* Initializes a new {@code ConnectedSettingsDialog} instance.
*
* @param {Props} props - The React {@code Component} props to initialize
* the new {@code ConnectedSettingsDialog} instance with.
*/
constructor(props: Props) {
super(props);
// Bind event handlers so they are only bound once for every instance.
this._closeDialog = this._closeDialog.bind(this);
}
/**
* Implements React's {@link Component#render()}.
*
* @inheritdoc
* @returns {ReactElement}
*/
render() {
const { _tabs, defaultTab, dispatch } = this.props;
const onSubmit = this._closeDialog;
const defaultTabIdx
= _tabs.findIndex(({ name }) => name === defaultTab);
const tabs = _tabs.map(tab => {
return {
...tab,
onMount: tab.onMount
? (...args) => dispatch(tab.onMount(...args))
: undefined,
Google & Microsoft calendar API integration (#3340) * Refactor calendar-sync feature to be loaded on web. For the web part it just adds new property to enable/disable calendar web integration, disabled by default. * Initial implementation of retrieving google calendar events. * Initial implementation of retrieving microsoft calendar events. * Fixes comments. * Rework to use the promise part of microsoft-graph-client api. * Moves dispatching some actions, fixing comments. * Makes sure we do not initializeClient google-api client multiple times. * Do not try to login when fetching calendar entries. The case where there is a calendar type google selected, but not logged in, trying to login on loading welcome page will show a warning that it tried to open a popup, which was denied by browser. * Updates profile display data on sign in. * Propagate google-api state to calendar-sync only if we use google cal. * Adds sign out action. * Clears the event listener when the popup closes. * Clears calendarIntegrationInstance on signOut. * WIP: UI for calendar settings, refactor auth flows * Clean up some unused constants, functions and exports. * break circular dependency of function and constant * Exports only isCalendarEnabled from functions. * Checks isSignedIn when doing fetchCalendarEntries on web. * address comments List microsoftApiApplicationClientID in undocument config. remove unused SET_CALENDAR_TYPE action use helper for calendar enabled in bootstrap reorder actions reorder imports change order of signin -> set type -> update profile add logging for signout error reword setting dialog desc to avoid redundancy add jsdoc to microsoft button props reorder calendar constants move default state to reducer (not reused anywhere) update comment about calendar-sync due to removal of getCalendarState update comment for getCalendarIntegration remove vague comment alpha order reducer, return default state on reset alpha order persistence registry remove unnecessary getType from apis update comments in microsoftCalendar alpha order google-api exports, use api.get in loadGoogleAPI set jsdoc for google signin props alpha order googleapi methods fix calendartab docs * Moves fetching calendar from APP_WILL_MOUNT to SET_CONFIG. The web part needs configuration in order to refresh tokens (Microsoft). * Fixes storing token expire time and refreshing tokens in Microsoft impl. * Address comments updateProfile changed to getCurrentEmail rename result to results stop storing integration in redux, store if ready for use use existing helpers to parse redirect url * update jsdocs, get google app id from redux * clear integration instead of actual sign out
2018-08-15 20:11:54 +00:00
submit: (...args) => tab.submit
&& dispatch(tab.submit(...args))
};
});
return (
<DialogWithTabs
closeDialog = { this._closeDialog }
cssClassName = 'settings-dialog'
defaultTab = {
defaultTabIdx === -1 ? undefined : defaultTabIdx
}
onSubmit = { onSubmit }
tabs = { tabs }
titleKey = 'settings.title' />
);
}
_closeDialog: () => void;
/**
* Callback invoked to close the dialog without saving changes.
*
* @private
* @returns {void}
*/
_closeDialog() {
this.props.dispatch(hideDialog());
}
}
/**
* Maps (parts of) the Redux state to the associated props for the
* {@code ConnectedSettingsDialog} component.
*
* @param {Object} state - The Redux state.
* @private
* @returns {{
* tabs: Array<Object>
* }}
*/
function _mapStateToProps(state) {
const configuredTabs = interfaceConfig.SETTINGS_SECTIONS || [];
const jwt = state['features/base/jwt'];
// The settings sections to display.
const showDeviceSettings = configuredTabs.includes('devices');
const moreTabProps = getMoreTabProps(state);
const { showModeratorSettings, showLanguageSettings } = moreTabProps;
const showProfileSettings
= configuredTabs.includes('profile') && jwt.isGuest;
Google & Microsoft calendar API integration (#3340) * Refactor calendar-sync feature to be loaded on web. For the web part it just adds new property to enable/disable calendar web integration, disabled by default. * Initial implementation of retrieving google calendar events. * Initial implementation of retrieving microsoft calendar events. * Fixes comments. * Rework to use the promise part of microsoft-graph-client api. * Moves dispatching some actions, fixing comments. * Makes sure we do not initializeClient google-api client multiple times. * Do not try to login when fetching calendar entries. The case where there is a calendar type google selected, but not logged in, trying to login on loading welcome page will show a warning that it tried to open a popup, which was denied by browser. * Updates profile display data on sign in. * Propagate google-api state to calendar-sync only if we use google cal. * Adds sign out action. * Clears the event listener when the popup closes. * Clears calendarIntegrationInstance on signOut. * WIP: UI for calendar settings, refactor auth flows * Clean up some unused constants, functions and exports. * break circular dependency of function and constant * Exports only isCalendarEnabled from functions. * Checks isSignedIn when doing fetchCalendarEntries on web. * address comments List microsoftApiApplicationClientID in undocument config. remove unused SET_CALENDAR_TYPE action use helper for calendar enabled in bootstrap reorder actions reorder imports change order of signin -> set type -> update profile add logging for signout error reword setting dialog desc to avoid redundancy add jsdoc to microsoft button props reorder calendar constants move default state to reducer (not reused anywhere) update comment about calendar-sync due to removal of getCalendarState update comment for getCalendarIntegration remove vague comment alpha order reducer, return default state on reset alpha order persistence registry remove unnecessary getType from apis update comments in microsoftCalendar alpha order google-api exports, use api.get in loadGoogleAPI set jsdoc for google signin props alpha order googleapi methods fix calendartab docs * Moves fetching calendar from APP_WILL_MOUNT to SET_CONFIG. The web part needs configuration in order to refresh tokens (Microsoft). * Fixes storing token expire time and refreshing tokens in Microsoft impl. * Address comments updateProfile changed to getCurrentEmail rename result to results stop storing integration in redux, store if ready for use use existing helpers to parse redirect url * update jsdocs, get google app id from redux * clear integration instead of actual sign out
2018-08-15 20:11:54 +00:00
const showCalendarSettings
= configuredTabs.includes('calendar') && isCalendarEnabled(state);
const tabs = [];
if (showDeviceSettings) {
tabs.push({
name: SETTINGS_TABS.DEVICES,
component: DeviceSelection,
label: 'settings.devices',
onMount: getAvailableDevices,
props: getDeviceSelectionDialogProps(state),
propsUpdateFunction: (tabState, newProps) => {
// Ensure the device selection tab gets updated when new devices
// are found by taking the new props and only preserving the
// current user selected devices. If this were not done, the
// tab would keep using a copy of the initial props it received,
// leaving the device list to become stale.
return {
...newProps,
selectedAudioInputId: tabState.selectedAudioInputId,
selectedAudioOutputId: tabState.selectedAudioOutputId,
selectedVideoInputId: tabState.selectedVideoInputId
};
},
styles: 'settings-pane devices-pane',
submit: submitDeviceSelectionTab
});
}
if (showProfileSettings) {
tabs.push({
name: SETTINGS_TABS.PROFILE,
component: ProfileTab,
label: 'profile.title',
props: getProfileTabProps(state),
styles: 'settings-pane profile-pane',
submit: submitProfileTab
});
}
Google & Microsoft calendar API integration (#3340) * Refactor calendar-sync feature to be loaded on web. For the web part it just adds new property to enable/disable calendar web integration, disabled by default. * Initial implementation of retrieving google calendar events. * Initial implementation of retrieving microsoft calendar events. * Fixes comments. * Rework to use the promise part of microsoft-graph-client api. * Moves dispatching some actions, fixing comments. * Makes sure we do not initializeClient google-api client multiple times. * Do not try to login when fetching calendar entries. The case where there is a calendar type google selected, but not logged in, trying to login on loading welcome page will show a warning that it tried to open a popup, which was denied by browser. * Updates profile display data on sign in. * Propagate google-api state to calendar-sync only if we use google cal. * Adds sign out action. * Clears the event listener when the popup closes. * Clears calendarIntegrationInstance on signOut. * WIP: UI for calendar settings, refactor auth flows * Clean up some unused constants, functions and exports. * break circular dependency of function and constant * Exports only isCalendarEnabled from functions. * Checks isSignedIn when doing fetchCalendarEntries on web. * address comments List microsoftApiApplicationClientID in undocument config. remove unused SET_CALENDAR_TYPE action use helper for calendar enabled in bootstrap reorder actions reorder imports change order of signin -> set type -> update profile add logging for signout error reword setting dialog desc to avoid redundancy add jsdoc to microsoft button props reorder calendar constants move default state to reducer (not reused anywhere) update comment about calendar-sync due to removal of getCalendarState update comment for getCalendarIntegration remove vague comment alpha order reducer, return default state on reset alpha order persistence registry remove unnecessary getType from apis update comments in microsoftCalendar alpha order google-api exports, use api.get in loadGoogleAPI set jsdoc for google signin props alpha order googleapi methods fix calendartab docs * Moves fetching calendar from APP_WILL_MOUNT to SET_CONFIG. The web part needs configuration in order to refresh tokens (Microsoft). * Fixes storing token expire time and refreshing tokens in Microsoft impl. * Address comments updateProfile changed to getCurrentEmail rename result to results stop storing integration in redux, store if ready for use use existing helpers to parse redirect url * update jsdocs, get google app id from redux * clear integration instead of actual sign out
2018-08-15 20:11:54 +00:00
if (showCalendarSettings) {
tabs.push({
name: SETTINGS_TABS.CALENDAR,
component: CalendarTab,
label: 'settings.calendar.title',
styles: 'settings-pane calendar-pane'
});
}
if (showModeratorSettings || showLanguageSettings) {
tabs.push({
name: SETTINGS_TABS.MORE,
component: MoreTab,
label: 'settings.more',
props: moreTabProps,
propsUpdateFunction: (tabState, newProps) => {
// Updates tab props, keeping users selection
return {
...newProps,
currentLanguage: tabState.currentLanguage,
followMeEnabled: tabState.followMeEnabled,
startAudioMuted: tabState.startAudioMuted,
startVideoMuted: tabState.startVideoMuted
};
},
styles: 'settings-pane more-pane',
submit: submitMoreTab
});
}
return { _tabs: tabs };
}
export default connect(_mapStateToProps)(SettingsDialog);