From e0a2320d750223c0edac26cfe7349c4cf47a4436 Mon Sep 17 00:00:00 2001 From: Calin Chitu Date: Wed, 12 May 2021 19:13:03 +0300 Subject: [PATCH] feat(native-participants-panel) renamed ParticipantsPanel to ParticipantsPane and created modal --- ios/Podfile.lock | 44 ++++++++--------- react/features/app/components/App.native.js | 11 ++--- .../components/native/ParticipantsPane.js | 49 +++++++++++++++++++ ...nelButton.js => ParticipantsPaneButton.js} | 10 +++- .../components/native/ParticipantsPanel.js | 0 .../components/native/index.js | 3 +- react/index.native.js | 8 ++- 7 files changed, 89 insertions(+), 36 deletions(-) create mode 100644 react/features/participants-pane/components/native/ParticipantsPane.js rename react/features/participants-pane/components/native/{ParticipantsPanelButton.js => ParticipantsPaneButton.js} (80%) delete mode 100644 react/features/participants-pane/components/native/ParticipantsPanel.js diff --git a/ios/Podfile.lock b/ios/Podfile.lock index 9f30c3eb3..114b97154 100644 --- a/ios/Podfile.lock +++ b/ios/Podfile.lock @@ -1,9 +1,9 @@ PODS: - - AppAuth (1.2.0): - - AppAuth/Core (= 1.2.0) - - AppAuth/ExternalUserAgent (= 1.2.0) - - AppAuth/Core (1.2.0) - - AppAuth/ExternalUserAgent (1.2.0) + - AppAuth (1.4.0): + - AppAuth/Core (= 1.4.0) + - AppAuth/ExternalUserAgent (= 1.4.0) + - AppAuth/Core (1.4.0) + - AppAuth/ExternalUserAgent (1.4.0) - boost-for-react-native (1.63.0) - CocoaLumberjack (3.5.3): - CocoaLumberjack/Core (= 3.5.3) @@ -48,7 +48,7 @@ PODS: - GoogleUtilities/Environment (~> 6.7) - GoogleUtilities/Logger (~> 6.7) - nanopb (~> 1.30906.0) - - FirebaseCrashlytics (4.6.1): + - FirebaseCrashlytics (4.6.2): - FirebaseCore (~> 6.10) - FirebaseInstallations (~> 1.6) - GoogleDataTransport (~> 7.2) @@ -77,9 +77,9 @@ PODS: - GoogleUtilities/Network (~> 6.7) - "GoogleUtilities/NSData+zlib (~> 6.7)" - nanopb (~> 1.30906.0) - - GoogleDataTransport (7.4.0): + - GoogleDataTransport (7.5.1): - nanopb (~> 1.30906.0) - - GoogleSignIn (5.0.1): + - GoogleSignIn (5.0.2): - AppAuth (~> 1.2) - GTMAppAuth (~> 1.0) - GTMSessionFetcher/Core (~> 1.1) @@ -102,21 +102,17 @@ PODS: - GoogleUtilities/Logger - GoogleUtilities/UserDefaults (6.7.2): - GoogleUtilities/Logger - - GTMAppAuth (1.0.0): - - AppAuth/Core (~> 1.0) - - GTMSessionFetcher (~> 1.1) - - GTMSessionFetcher (1.2.2): - - GTMSessionFetcher/Full (= 1.2.2) - - GTMSessionFetcher/Core (1.2.2) - - GTMSessionFetcher/Full (1.2.2): - - GTMSessionFetcher/Core (= 1.2.2) + - GTMAppAuth (1.2.2): + - AppAuth/Core (~> 1.4) + - GTMSessionFetcher/Core (~> 1.5) + - GTMSessionFetcher/Core (1.5.0) - nanopb (1.30906.0): - nanopb/decode (= 1.30906.0) - nanopb/encode (= 1.30906.0) - nanopb/decode (1.30906.0) - nanopb/encode (1.30906.0) - ObjectiveDropboxOfficial (3.9.4) - - PromisesObjC (1.2.10) + - PromisesObjC (1.2.12) - RCTRequired (0.61.5-jitsi.2) - RCTTypeSafety (0.61.5-jitsi.2): - FBLazyVector (= 0.61.5-jitsi.2) @@ -519,7 +515,7 @@ EXTERNAL SOURCES: :path: "../node_modules/react-native/ReactCommon/yoga" SPEC CHECKSUMS: - AppAuth: bce82c76043657c99d91e7882e8a9e1a93650cd4 + AppAuth: 31bcec809a638d7bd2f86ea8a52bd45f6e81e7c7 boost-for-react-native: 39c7adb57c4e60d6c5479dd8623128eb5b3f0f2c CocoaLumberjack: 2f44e60eb91c176d471fdba43b9e3eae6a721947 DoubleConversion: 5805e889d232975c086db112ece9ed034df7a0b2 @@ -529,20 +525,20 @@ SPEC CHECKSUMS: FirebaseAnalytics: 5dd088bd2e67bb9d13dbf792d1164ceaf3052193 FirebaseCore: d889d9e12535b7f36ac8bfbf1713a0836a3012cd FirebaseCoreDiagnostics: 770ac5958e1372ce67959ae4b4f31d8e127c3ac1 - FirebaseCrashlytics: 5777d3462fb8c3ab9e80a2473bd7d667a2e8411c + FirebaseCrashlytics: 1a747c9cc084a24dc6d9511c991db1cd078154eb FirebaseDynamicLinks: 6eac37d86910382eafb6315d952cc44c9e176094 FirebaseInstallations: 466c7b4d1f58fe16707693091da253726a731ed2 Folly: 30e7936e1c45c08d884aa59369ed951a8e68cf51 glog: 1f3da668190260b06b429bb211bfbee5cd790c28 GoogleAppMeasurement: 966e88df9d19c15715137bb2ddaf52373f111436 - GoogleDataTransport: b7f406340a291370045a270c599e53c6fa6ec20f - GoogleSignIn: 3a51b9bb8e48b635fd7f4272cee06ca260345b86 + GoogleDataTransport: f56af7caa4ed338dc8e138a5d7c5973e66440833 + GoogleSignIn: 7137d297ddc022a7e0aa4619c86d72c909fa7213 GoogleUtilities: 7f2f5a07f888cdb145101d6042bc4422f57e70b3 - GTMAppAuth: 4deac854479704f348309e7b66189e604cf5e01e - GTMSessionFetcher: 61bb0f61a4cb560030f1222021178008a5727a23 + GTMAppAuth: ad5c2b70b9a8689e1a04033c9369c4915bfcbe89 + GTMSessionFetcher: b3503b20a988c4e20cc189aa798fd18220133f52 nanopb: 59317e09cf1f1a0af72f12af412d54edf52603fc ObjectiveDropboxOfficial: a5afefc83f6467c42c45f2253f583f2ad1ffc701 - PromisesObjC: b14b1c6b68e306650688599de8a45e49fae81151 + PromisesObjC: 3113f7f76903778cf4a0586bd1ab89329a0b7b97 RCTRequired: a686731276578c125dff205f08b6ec9cee6ede32 RCTTypeSafety: 88e5500e801c00d16a3d1895e3470d13beed6584 React: 8b2bcf6a93846e47a7a365a54ec6edeb78b37701 diff --git a/react/features/app/components/App.native.js b/react/features/app/components/App.native.js index 70e6a1aa7..0c4f689c7 100644 --- a/react/features/app/components/App.native.js +++ b/react/features/app/components/App.native.js @@ -11,7 +11,6 @@ import { getFeatureFlag } from '../../base/flags/functions'; import { Platform } from '../../base/react'; import { DimensionsDetector, clientResized } from '../../base/responsive-ui'; import { updateSettings } from '../../base/settings'; -import JitsiThemePaperProvider from '../../base/ui/components/JitsiThemeProvider.native'; import logger from '../logger'; import { AbstractApp } from './AbstractApp'; @@ -128,12 +127,10 @@ export class App extends AbstractApp { */ _createMainElement(component, props) { return ( - - - { super._createMainElement(component, props) } - - + + { super._createMainElement(component, props) } + ); } diff --git a/react/features/participants-pane/components/native/ParticipantsPane.js b/react/features/participants-pane/components/native/ParticipantsPane.js new file mode 100644 index 000000000..80bf4c681 --- /dev/null +++ b/react/features/participants-pane/components/native/ParticipantsPane.js @@ -0,0 +1,49 @@ +// @flow + +import React, { useCallback } from 'react'; +import { Button, Text, withTheme } from 'react-native-paper'; +import { useDispatch } from 'react-redux'; + + +import { translate } from '../../../base/i18n'; +import { JitsiModal } from '../../../base/modal'; +import { close } from '../../actions'; + +/** + * {@code ParticipantsPane}'s React {@code Component} prop types. + */ +type Props = { + + /** + * Theme used for styles. + */ + theme: Object +} + +/** + * Participant pane. + * + * @returns {React$Element} + */ +function ParticipantsPane({ theme }: Props) { + const dispatch = useDispatch(); + const closePane = useCallback( + () => dispatch(close()), + [ dispatch ]); + + return ( + + {/* eslint-disable-next-line react/jsx-no-bind */} + + + OLE + + + ); +} + + +export default translate(withTheme(ParticipantsPane)); diff --git a/react/features/participants-pane/components/native/ParticipantsPanelButton.js b/react/features/participants-pane/components/native/ParticipantsPaneButton.js similarity index 80% rename from react/features/participants-pane/components/native/ParticipantsPanelButton.js rename to react/features/participants-pane/components/native/ParticipantsPaneButton.js index 58b040cf2..bad80cb7c 100644 --- a/react/features/participants-pane/components/native/ParticipantsPanelButton.js +++ b/react/features/participants-pane/components/native/ParticipantsPaneButton.js @@ -2,11 +2,14 @@ import type { Dispatch } from 'redux'; +import { openDialog } from '../../../base/dialog'; import { translate } from '../../../base/i18n'; import { IconParticipants } from '../../../base/icons'; import { connect } from '../../../base/redux'; import { AbstractButton, type AbstractButtonProps } from '../../../base/toolbox/components'; +import { ParticipantsPane } from './'; + type Props = AbstractButtonProps & { /** @@ -19,7 +22,7 @@ type Props = AbstractButtonProps & { /** * Implements an {@link AbstractButton} to open the participants panel. */ -class ParticipantsPanelButton extends AbstractButton { +class ParticipantsPaneButton extends AbstractButton { accessibilityLabel = 'toolbar.accessibilityLabel.participants'; icon = IconParticipants; label = 'toolbar.participants'; @@ -30,6 +33,9 @@ class ParticipantsPanelButton extends AbstractButton { * @private * @returns {void} */ + _handleClick() { + this.props.dispatch(openDialog(ParticipantsPane)); + } } /** @@ -45,4 +51,4 @@ function mapStateToProps(state: Object) { }; } -export default translate(connect(mapStateToProps)(ParticipantsPanelButton)); +export default translate(connect(mapStateToProps)(ParticipantsPaneButton)); diff --git a/react/features/participants-pane/components/native/ParticipantsPanel.js b/react/features/participants-pane/components/native/ParticipantsPanel.js deleted file mode 100644 index e69de29bb..000000000 diff --git a/react/features/participants-pane/components/native/index.js b/react/features/participants-pane/components/native/index.js index 23876f024..24d81142f 100644 --- a/react/features/participants-pane/components/native/index.js +++ b/react/features/participants-pane/components/native/index.js @@ -1,3 +1,4 @@ // @flow -export { default as ParticipantsPanelButton } from './ParticipantsPanelButton'; +export { default as ParticipantsPane } from './ParticipantsPane'; +export { default as ParticipantsPaneButton } from './ParticipantsPaneButton'; diff --git a/react/index.native.js b/react/index.native.js index 763442988..4062b770c 100644 --- a/react/index.native.js +++ b/react/index.native.js @@ -9,6 +9,8 @@ import { AppRegistry } from 'react-native'; import { App } from './features/app/components'; import { _initLogging } from './features/base/logging/functions'; +import JitsiThemePaperProvider + from './features/base/ui/components/JitsiThemeProvider'; import { IncomingCallApp } from './features/mobile/incoming-call'; declare var __DEV__; @@ -40,8 +42,10 @@ class Root extends PureComponent { */ render() { return ( - + + + ); } }