浏览代码

feat(transcriptions): add TranscribingLabel.native

master
paweldomas 7 年前
父节点
当前提交
008fb868a6

+ 14
- 3
react/features/large-video/components/AbstractLabels.js 查看文件

@@ -20,6 +20,11 @@ export type Props = {
20 20
      */
21 21
     _filmstripVisible: boolean,
22 22
 
23
+    /**
24
+     * Whether the video quality label should be displayed.
25
+     */
26
+    _showTranscribingLabel: boolean,
27
+
23 28
     /**
24 29
      * Whether the video quality label should be displayed.
25 30
      */
@@ -66,9 +71,13 @@ export default class AbstractLabels<P: Props, S> extends Component<P, S> {
66 71
      * @returns {React$Element}
67 72
      */
68 73
     _renderTranscribingLabel() {
69
-        return (
70
-            <TranscribingLabel />
71
-        );
74
+        if (this.props._showTranscribingLabel) {
75
+            return (
76
+                <TranscribingLabel />
77
+            );
78
+        }
79
+
80
+        return null;
72 81
     }
73 82
 
74 83
     /**
@@ -92,12 +101,14 @@ export default class AbstractLabels<P: Props, S> extends Component<P, S> {
92 101
  * @private
93 102
  * @returns {{
94 103
  *     _filmstripVisible: boolean,
104
+ *     _showTranscribingLabel: boolean,
95 105
  *     _showVideoQualityLabel: boolean
96 106
  * }}
97 107
  */
98 108
 export function _abstractMapStateToProps(state: Object) {
99 109
     return {
100 110
         _filmstripVisible: isFilmstripVisible(state),
111
+        _showTranscribingLabel: state['features/transcribing'].isTranscribing,
101 112
         _showVideoQualityLabel: !shouldDisplayTileView(state)
102 113
     };
103 114
 }

+ 5
- 0
react/features/large-video/components/Labels.native.js 查看文件

@@ -58,6 +58,9 @@ class Labels extends AbstractLabels<Props, *> {
58 58
                     this._renderRecordingLabel(
59 59
                         JitsiRecordingConstants.mode.STREAM)
60 60
                 }
61
+                {
62
+                    this._renderTranscribingLabel()
63
+                }
61 64
                 {/*
62 65
                   * Emil, Lyubomir, Nichole, and Zoli said that the Labels
63 66
                   * should not be rendered in Picture-in-Picture. Saul argued
@@ -73,6 +76,8 @@ class Labels extends AbstractLabels<Props, *> {
73 76
 
74 77
     _renderRecordingLabel: string => React$Element<*>;
75 78
 
79
+    _renderTranscribingLabel: () => React$Element<*>
80
+
76 81
     _renderVideoQualityLabel: () => React$Element<*>;
77 82
 }
78 83
 

+ 12
- 0
react/features/transcribing/components/AbstractTranscribingLabel.js 查看文件

@@ -0,0 +1,12 @@
1
+// @flow
2
+
3
+/**
4
+ * The type of the React {@code Component} props of {@link TranscribingLabel}.
5
+ */
6
+export type Props = {
7
+
8
+    /**
9
+     * Invoked to obtain translated strings.
10
+     */
11
+    t: Function
12
+};

+ 31
- 0
react/features/transcribing/components/TranscribingLabel.native.js 查看文件

@@ -0,0 +1,31 @@
1
+// @flow
2
+
3
+import React, { Component } from 'react';
4
+
5
+import { translate } from '../../base/i18n';
6
+import { CircularLabel } from '../../base/label';
7
+
8
+import { type Props } from './AbstractTranscribingLabel';
9
+
10
+/**
11
+ * React {@code Component} for displaying a label when a transcriber is in the
12
+ * conference.
13
+ *
14
+ * @extends Component
15
+ */
16
+class TranscribingLabel extends Component<Props> {
17
+
18
+    /**
19
+     * Renders the platform-specific label component.
20
+     *
21
+     * @inheritdoc
22
+     */
23
+    render() {
24
+        return (
25
+            <CircularLabel
26
+                label = { this.props.t('transcribing.tr') } />
27
+        );
28
+    }
29
+}
30
+
31
+export default translate(TranscribingLabel);

+ 6
- 42
react/features/transcribing/components/TranscribingLabel.web.js 查看文件

@@ -1,30 +1,15 @@
1 1
 // @flow
2 2
 
3
+import Tooltip from '@atlaskit/tooltip';
3 4
 import React, { Component } from 'react';
4
-import { connect } from 'react-redux';
5
-import { translate } from '../../base/i18n/index';
6 5
 
7
-import { CircularLabel } from '../../base/label/index';
8
-import Tooltip from '@atlaskit/tooltip';
6
+import { translate } from '../../base/i18n';
7
+import { CircularLabel } from '../../base/label';
9 8
 
10
-/**
11
- * The type of the React {@code Component} props of {@link TranscribingLabel}.
12
- */
13
-type Props = {
14
-
15
-    /**
16
-     * Invoked to obtain translated strings.
17
-     */
18
-    t: Function,
19
-
20
-    /**
21
-     * Boolean value indicating current transcribing status
22
-     */
23
-    _transcribing: boolean
24
-};
9
+import { type Props } from './AbstractTranscribingLabel';
25 10
 
26 11
 /**
27
- * React Component for displaying a label when a transcriber is in the
12
+ * React {@code Component} for displaying a label when a transcriber is in the
28 13
  * conference.
29 14
  *
30 15
  * @extends Component
@@ -38,10 +23,6 @@ class TranscribingLabel extends Component<Props> {
38 23
      * @returns {ReactElement}
39 24
      */
40 25
     render() {
41
-        if (!this.props._transcribing) {
42
-            return null;
43
-        }
44
-
45 26
         return (
46 27
             <Tooltip
47 28
                 content = { this.props.t('transcribing.labelToolTip') }
@@ -55,21 +36,4 @@ class TranscribingLabel extends Component<Props> {
55 36
 
56 37
 }
57 38
 
58
-/**
59
- * Maps (parts of) the Redux state to the associated props for the
60
- * {@code TranscribingLabel} component.
61
- *
62
- * @param {Object} state - The Redux state.
63
- * @private
64
- * @returns {{
65
- * }}
66
- */
67
-function _mapStateToProps(state) {
68
-    const { isTranscribing } = state['features/transcribing'];
69
-
70
-    return {
71
-        _transcribing: isTranscribing
72
-    };
73
-}
74
-
75
-export default translate(connect(_mapStateToProps)(TranscribingLabel));
39
+export default translate(TranscribingLabel);

正在加载...
取消
保存