"Fossies" - the Fresh Open Source Software Archive

Member "jitsi-meet-7312/react/features/security/components/security-dialog/web/SecurityDialog.tsx" (1 Jun 2023, 4928 Bytes) of package /linux/misc/jitsi-meet-7312.tar.gz:

As a special service "Fossies" has tried to format the requested source page into HTML format using (guessed) TSX (TypeScript with React) source code syntax highlighting (style: standard) with prefixed line numbers. Alternatively you can here view or download the uninterpreted source code file. See also the last Fossies "Diffs" side-by-side code changes report for "SecurityDialog.tsx": jitsi-meet_8319_vs_jitsi-meet_8615.

    1 import React, { useEffect, useState } from 'react';
    2 import { connect } from 'react-redux';
    3 
    4 import { IReduxState } from '../../../../app/types';
    5 import { setPassword as setPass } from '../../../../base/conference/actions';
    6 import { IJitsiConference } from '../../../../base/conference/reducer';
    7 import { getSecurityUiConfig } from '../../../../base/config/functions.any';
    8 import { isLocalParticipantModerator } from '../../../../base/participants/functions';
    9 import Dialog from '../../../../base/ui/components/web/Dialog';
   10 import E2EESection from '../../../../e2ee/components/E2EESection';
   11 import LobbySection from '../../../../lobby/components/web/LobbySection';
   12 
   13 import PasswordSection from './PasswordSection';
   14 
   15 export interface INotifyClick {
   16     key: string;
   17     preventExecution: boolean;
   18 }
   19 
   20 interface IProps {
   21 
   22     /**
   23      * Toolbar buttons which have their click exposed through the API.
   24      */
   25     _buttonsWithNotifyClick: Array<string | INotifyClick>;
   26 
   27     /**
   28      * Whether or not the current user can modify the current password.
   29      */
   30     _canEditPassword: boolean;
   31 
   32     /**
   33      * The JitsiConference for which to display a lock state and change the
   34      * password.
   35      */
   36     _conference?: IJitsiConference;
   37 
   38     /**
   39      * Whether to hide the lobby password section.
   40      */
   41     _disableLobbyPassword?: boolean;
   42 
   43     /**
   44      * The value for how the conference is locked (or undefined if not locked)
   45      * as defined by room-lock constants.
   46      */
   47     _locked?: string;
   48 
   49     /**
   50      * The current known password for the JitsiConference.
   51      */
   52     _password?: string;
   53 
   54     /**
   55      * The number of digits to be used in the password.
   56      */
   57     _passwordNumberOfDigits?: number;
   58 
   59     /**
   60      * Indicates whether e2ee will be displayed or not.
   61      */
   62     _showE2ee: boolean;
   63 
   64     /**
   65      * Action that sets the conference password.
   66      */
   67     setPassword: Function;
   68 }
   69 
   70 /**
   71  * Component that renders the security options dialog.
   72  *
   73  * @returns {React$Element<any>}
   74  */
   75 function SecurityDialog({
   76     _buttonsWithNotifyClick,
   77     _canEditPassword,
   78     _conference,
   79     _disableLobbyPassword,
   80     _locked,
   81     _password,
   82     _passwordNumberOfDigits,
   83     _showE2ee,
   84     setPassword
   85 }: IProps) {
   86     const [ passwordEditEnabled, setPasswordEditEnabled ] = useState(false);
   87 
   88     useEffect(() => {
   89         if (passwordEditEnabled && _password) {
   90             setPasswordEditEnabled(false);
   91         }
   92     }, [ _password ]);
   93 
   94     return (
   95         <Dialog
   96             cancel = {{ hidden: true }}
   97             ok = {{ hidden: true }}
   98             titleKey = 'security.title'>
   99             <div className = 'security-dialog'>
  100                 <LobbySection />
  101                 {!_disableLobbyPassword && (
  102                     <>
  103                         <div className = 'separator-line' />
  104                         <PasswordSection
  105                             buttonsWithNotifyClick = { _buttonsWithNotifyClick }
  106                             canEditPassword = { _canEditPassword }
  107                             conference = { _conference }
  108                             locked = { _locked }
  109                             password = { _password }
  110                             passwordEditEnabled = { passwordEditEnabled }
  111                             passwordNumberOfDigits = { _passwordNumberOfDigits }
  112                             setPassword = { setPassword }
  113                             setPasswordEditEnabled = { setPasswordEditEnabled } />
  114                     </>
  115                 )}
  116                 {
  117                     _showE2ee ? <>
  118                         <div className = 'separator-line' />
  119                         <E2EESection />
  120                     </> : null
  121                 }
  122 
  123             </div>
  124         </Dialog>
  125     );
  126 }
  127 
  128 /**
  129  * Maps (parts of) the Redux state to the associated props for the
  130  * {@code SecurityDialog} component.
  131  *
  132  * @param {Object} state - The Redux state.
  133  * @private
  134  * @returns {IProps}
  135  */
  136 function mapStateToProps(state: IReduxState) {
  137     const {
  138         conference,
  139         e2eeSupported,
  140         locked,
  141         password
  142     } = state['features/base/conference'];
  143     const {
  144         roomPasswordNumberOfDigits,
  145         buttonsWithNotifyClick
  146     } = state['features/base/config'];
  147     const { disableLobbyPassword } = getSecurityUiConfig(state);
  148 
  149     const showE2ee = Boolean(e2eeSupported) && isLocalParticipantModerator(state);
  150 
  151     return {
  152         _buttonsWithNotifyClick: buttonsWithNotifyClick ?? [],
  153         _canEditPassword: isLocalParticipantModerator(state),
  154         _conference: conference,
  155         _dialIn: state['features/invite'],
  156         _disableLobbyPassword: disableLobbyPassword,
  157         _locked: locked,
  158         _password: password,
  159         _passwordNumberOfDigits: roomPasswordNumberOfDigits,
  160         _showE2ee: showE2ee
  161     };
  162 }
  163 
  164 const mapDispatchToProps = { setPassword: setPass };
  165 
  166 export default connect(mapStateToProps, mapDispatchToProps)(SecurityDialog);