소스 검색

feat: add room lock pwd error message

master
Bettenbuk Zoltan 6 년 전
부모
커밋
a53a86ee7a

+ 1
- 0
lang/main.json 파일 보기

189
         "gracefulShutdown": "Our service is currently down for maintenance. Please try again later.",
189
         "gracefulShutdown": "Our service is currently down for maintenance. Please try again later.",
190
         "hungUp": "You hung up",
190
         "hungUp": "You hung up",
191
         "IamHost": "I am the host",
191
         "IamHost": "I am the host",
192
+        "incorrectRoomLockPassword": "Incorrect password",
192
         "incorrectPassword": "Incorrect username or password",
193
         "incorrectPassword": "Incorrect username or password",
193
         "inlineInstallationMsg": "You need to install our desktop sharing extension.",
194
         "inlineInstallationMsg": "You need to install our desktop sharing extension.",
194
         "inlineInstallExtension": "Install now",
195
         "inlineInstallExtension": "Install now",

+ 19
- 2
react/features/base/dialog/components/native/InputDialog.js 파일 보기

30
      */
30
      */
31
     contentKey: string,
31
     contentKey: string,
32
 
32
 
33
+    /**
34
+     * An optional initial value to initiate the field with.
35
+     */
36
+    initialValue?: ?string,
37
+
38
+    /**
39
+     * A message key to be shown for the user (e.g. an error that is defined after submitting the form).
40
+     */
41
+    messageKey?: string,
42
+
33
     t: Function,
43
     t: Function,
34
 
44
 
35
     textInputProps: ?Object,
45
     textInputProps: ?Object,
62
         super(props);
72
         super(props);
63
 
73
 
64
         this.state = {
74
         this.state = {
65
-            fieldValue: undefined
75
+            fieldValue: props.initialValue
66
         };
76
         };
67
 
77
 
68
         this._onChangeText = this._onChangeText.bind(this);
78
         this._onChangeText = this._onChangeText.bind(this);
75
      * @inheritdoc
85
      * @inheritdoc
76
      */
86
      */
77
     _renderContent() {
87
     _renderContent() {
78
-        const { _dialogStyles, okDisabled, t } = this.props;
88
+        const { _dialogStyles, messageKey, okDisabled, t } = this.props;
79
 
89
 
80
         return (
90
         return (
81
             <View>
91
             <View>
93
                         underlineColorAndroid = { FIELD_UNDERLINE }
103
                         underlineColorAndroid = { FIELD_UNDERLINE }
94
                         value = { this.state.fieldValue }
104
                         value = { this.state.fieldValue }
95
                         { ...this.props.textInputProps } />
105
                         { ...this.props.textInputProps } />
106
+                    { messageKey && (<Text
107
+                        style = { [
108
+                            styles.formMessage,
109
+                            _dialogStyles.text
110
+                        ] }>
111
+                        { t(messageKey) }
112
+                    </Text>) }
96
                 </View>
113
                 </View>
97
                 <View style = { brandedDialog.buttonWrapper }>
114
                 <View style = { brandedDialog.buttonWrapper }>
98
                     <TouchableOpacity
115
                     <TouchableOpacity

+ 6
- 0
react/features/base/dialog/components/native/styles.js 파일 보기

115
     fieldWrapper: {
115
     fieldWrapper: {
116
         ...brandedDialog.mainWrapper,
116
         ...brandedDialog.mainWrapper,
117
         paddingBottom: BoxModel.padding * 2
117
         paddingBottom: BoxModel.padding * 2
118
+    },
119
+
120
+    formMessage: {
121
+        alignSelf: 'flex-start',
122
+        fontStyle: 'italic',
123
+        margin: BoxModel.margin
118
     }
124
     }
119
 });
125
 });
120
 
126
 

+ 54
- 2
react/features/room-lock/components/PasswordRequiredPrompt.native.js 파일 보기

14
  */
14
  */
15
 type Props = {
15
 type Props = {
16
 
16
 
17
+    /**
18
+     * The previously entered password, if any.
19
+     */
20
+    _password: ?string,
21
+
17
     /**
22
     /**
18
      * The {@code JitsiConference} which requires a password.
23
      * The {@code JitsiConference} which requires a password.
19
      *
24
      *
27
     dispatch: Dispatch<any>
32
     dispatch: Dispatch<any>
28
 };
33
 };
29
 
34
 
35
+type State = {
36
+
37
+    /**
38
+     * The previously entered password, if any.
39
+     */
40
+    password: ?string
41
+}
42
+
30
 /**
43
 /**
31
  * Implements a React {@code Component} which prompts the user when a password
44
  * Implements a React {@code Component} which prompts the user when a password
32
  * is required to join a conference.
45
  * is required to join a conference.
33
  */
46
  */
34
-class PasswordRequiredPrompt extends Component<Props> {
47
+class PasswordRequiredPrompt extends Component<Props, State> {
35
     /**
48
     /**
36
      * Initializes a new {@code PasswordRequiredPrompt} instance.
49
      * Initializes a new {@code PasswordRequiredPrompt} instance.
37
      *
50
      *
41
     constructor(props: Props) {
54
     constructor(props: Props) {
42
         super(props);
55
         super(props);
43
 
56
 
57
+        this.state = {
58
+            password: props._password
59
+        };
60
+
44
         // Bind event handlers so they are only bound once per instance.
61
         // Bind event handlers so they are only bound once per instance.
45
         this._onCancel = this._onCancel.bind(this);
62
         this._onCancel = this._onCancel.bind(this);
46
         this._onSubmit = this._onSubmit.bind(this);
63
         this._onSubmit = this._onSubmit.bind(this);
47
     }
64
     }
48
 
65
 
66
+    /**
67
+     * Implements {@code Component#componentDidUpdate}.
68
+     *
69
+     * @inheritdoc
70
+     */
71
+    componentDidUpdate() {
72
+        const { _password } = this.props;
73
+
74
+        // The previous password in Redux gets cleared after the dialog appears and it ends up breaking the dialog
75
+        // logic. We move the prop into state and only update it if it has an actual value, avoiding loosing the
76
+        // previously received value when Redux updates.
77
+        if (_password && _password !== this.state.password) {
78
+            // eslint-disable-next-line react/no-did-update-set-state
79
+            this.setState({
80
+                password: _password
81
+            });
82
+        }
83
+    }
84
+
49
     /**
85
     /**
50
      * Implements React's {@link Component#render()}.
86
      * Implements React's {@link Component#render()}.
51
      *
87
      *
53
      * @returns {ReactElement}
89
      * @returns {ReactElement}
54
      */
90
      */
55
     render() {
91
     render() {
92
+        const { password } = this.state;
93
+
56
         return (
94
         return (
57
             <InputDialog
95
             <InputDialog
58
                 contentKey = 'dialog.passwordLabel'
96
                 contentKey = 'dialog.passwordLabel'
97
+                initialValue = { password }
98
+                messageKey = { password ? 'dialog.incorrectRoomLockPassword' : undefined }
59
                 onCancel = { this._onCancel }
99
                 onCancel = { this._onCancel }
60
                 onSubmit = { this._onSubmit }
100
                 onSubmit = { this._onSubmit }
61
                 textInputProps = {{
101
                 textInputProps = {{
100
     }
140
     }
101
 }
141
 }
102
 
142
 
103
-export default connect()(PasswordRequiredPrompt);
143
+/**
144
+ * Maps part of the Redux state to the props of this component.
145
+ *
146
+ * @param {Object} state - The Redux state.
147
+ * @returns {Props}
148
+ */
149
+function _mapStateToProps(state) {
150
+    return {
151
+        _password: state['features/base/conference'].password
152
+    };
153
+}
154
+
155
+export default connect(_mapStateToProps)(PasswordRequiredPrompt);

Loading…
취소
저장