Browse Source

Consistent naming of Component props mapped from the Redux state

Until we make a decision on access modifier hints and adopt a respective
coding style, consistency is king.
j8
Lyubomir Marinov 8 years ago
parent
commit
3aff812ee2

+ 16
- 4
react/features/film-strip/components/FilmStrip.js View File

19
      * @static
19
      * @static
20
      */
20
      */
21
     static propTypes = {
21
     static propTypes = {
22
-        participants: React.PropTypes.array,
22
+        /**
23
+         * The participants in the conference.
24
+         *
25
+         * @private
26
+         * @type {Participant[]}
27
+         */
28
+        _participants: React.PropTypes.array,
23
         visible: React.PropTypes.bool.isRequired
29
         visible: React.PropTypes.bool.isRequired
24
     }
30
     }
25
 
31
 
43
                     showsHorizontalScrollIndicator = { false }
49
                     showsHorizontalScrollIndicator = { false }
44
                     showsVerticalScrollIndicator = { false }>
50
                     showsVerticalScrollIndicator = { false }>
45
                     {
51
                     {
46
-                        this._sort(this.props.participants)
52
+                        this._sort(this.props._participants)
47
                             .map(p =>
53
                             .map(p =>
48
                                 <Thumbnail
54
                                 <Thumbnail
49
                                     key = { p.id }
55
                                     key = { p.id }
94
  *
100
  *
95
  * @param {Object} state - Redux state.
101
  * @param {Object} state - Redux state.
96
  * @returns {{
102
  * @returns {{
97
- *      participants: Participant[],
103
+ *      _participants: Participant[],
98
  *  }}
104
  *  }}
99
  */
105
  */
100
 function mapStateToProps(state) {
106
 function mapStateToProps(state) {
101
     return {
107
     return {
102
-        participants: state['features/base/participants']
108
+        /**
109
+         * The participants in the conference.
110
+         *
111
+         * @private
112
+         * @type {Participant[]}
113
+         */
114
+        _participants: state['features/base/participants']
103
     };
115
     };
104
 }
116
 }
105
 
117
 

+ 14
- 16
react/features/film-strip/components/Thumbnail.js View File

26
      * @static
26
      * @static
27
      */
27
      */
28
     static propTypes = {
28
     static propTypes = {
29
-        audioTrack: React.PropTypes.object,
29
+        _audioTrack: React.PropTypes.object,
30
+        _largeVideo: React.PropTypes.object,
31
+        _videoTrack: React.PropTypes.object,
30
         dispatch: React.PropTypes.func,
32
         dispatch: React.PropTypes.func,
31
-        largeVideo: React.PropTypes.object,
32
-        participant: React.PropTypes.object,
33
-        videoTrack: React.PropTypes.object
33
+        participant: React.PropTypes.object
34
     }
34
     }
35
 
35
 
36
     /**
36
     /**
64
      * @returns {ReactElement}
64
      * @returns {ReactElement}
65
      */
65
      */
66
     render() {
66
     render() {
67
-        const {
68
-            audioTrack,
69
-            largeVideo,
70
-            participant,
71
-            videoTrack
72
-        } = this.props;
67
+        const audioTrack = this.props._audioTrack;
68
+        const largeVideo = this.props._largeVideo;
69
+        const participant = this.props.participant;
70
+        const videoTrack = this.props._videoTrack;
73
 
71
 
74
         let style = styles.thumbnail;
72
         let style = styles.thumbnail;
75
 
73
 
136
  * @param {Object} state - Redux state.
134
  * @param {Object} state - Redux state.
137
  * @param {Object} ownProps - Properties of component.
135
  * @param {Object} ownProps - Properties of component.
138
  * @returns {{
136
  * @returns {{
139
- *      audioTrack: Track,
140
- *      largeVideo: Object,
141
- *      videoTrack: Track
137
+ *      _audioTrack: Track,
138
+ *      _largeVideo: Object,
139
+ *      _videoTrack: Track
142
  *  }}
140
  *  }}
143
  */
141
  */
144
 function mapStateToProps(state, ownProps) {
142
 function mapStateToProps(state, ownProps) {
154
         = getTrackByMediaTypeAndParticipant(tracks, MEDIA_TYPE.VIDEO, id);
152
         = getTrackByMediaTypeAndParticipant(tracks, MEDIA_TYPE.VIDEO, id);
155
 
153
 
156
     return {
154
     return {
157
-        audioTrack,
158
-        largeVideo,
159
-        videoTrack
155
+        _audioTrack: audioTrack,
156
+        _largeVideo: largeVideo,
157
+        _videoTrack: videoTrack
160
     };
158
     };
161
 }
159
 }
162
 
160
 

+ 17
- 9
react/features/toolbar/components/AbstractToolbar.js View File

19
      * @static
19
      * @static
20
      */
20
      */
21
     static propTypes = {
21
     static propTypes = {
22
-        audioMuted: React.PropTypes.bool,
23
-        dispatch: React.PropTypes.func,
22
+        _audioMuted: React.PropTypes.bool,
24
 
23
 
25
         /**
24
         /**
26
          * The indicator which determines whether the conference is
25
          * The indicator which determines whether the conference is
27
          * locked/password-protected.
26
          * locked/password-protected.
27
+         *
28
+         * @protected
29
+         * @type {boolean}
28
          */
30
          */
29
-        locked: React.PropTypes.bool,
30
-        videoMuted: React.PropTypes.bool,
31
+        _locked: React.PropTypes.bool,
32
+        _videoMuted: React.PropTypes.bool,
33
+        dispatch: React.PropTypes.func,
31
         visible: React.PropTypes.bool.isRequired
34
         visible: React.PropTypes.bool.isRequired
32
     }
35
     }
33
 
36
 
65
         let iconStyle;
68
         let iconStyle;
66
         let style = styles.primaryToolbarButton;
69
         let style = styles.primaryToolbarButton;
67
 
70
 
68
-        if (this.props[`${mediaType}Muted`]) {
71
+        if (this.props[`_${mediaType}Muted`]) {
69
             iconName = this[`${mediaType}MutedIcon`];
72
             iconName = this[`${mediaType}MutedIcon`];
70
             iconStyle = styles.whiteIcon;
73
             iconStyle = styles.whiteIcon;
71
             style = {
74
             style = {
135
  * Maps parts of media state to component props.
138
  * Maps parts of media state to component props.
136
  *
139
  *
137
  * @param {Object} state - Redux state.
140
  * @param {Object} state - Redux state.
138
- * @returns {{ audioMuted: boolean, videoMuted: boolean }}
141
+ * @returns {{
142
+ *     _audioMuted: boolean,
143
+ *     _locked: boolean,
144
+ *     _videoMuted: boolean
145
+ * }}
139
  */
146
  */
140
 export function mapStateToProps(state) {
147
 export function mapStateToProps(state) {
141
     const conference = state['features/base/conference'];
148
     const conference = state['features/base/conference'];
142
     const media = state['features/base/media'];
149
     const media = state['features/base/media'];
143
 
150
 
144
     return {
151
     return {
145
-        audioMuted: media.audio.muted,
152
+        _audioMuted: media.audio.muted,
146
 
153
 
147
         /**
154
         /**
148
          * The indicator which determines whether the conference is
155
          * The indicator which determines whether the conference is
149
          * locked/password-protected.
156
          * locked/password-protected.
150
          *
157
          *
158
+         * @protected
151
          * @type {boolean}
159
          * @type {boolean}
152
          */
160
          */
153
-        locked: conference.locked,
154
-        videoMuted: media.video.muted
161
+        _locked: conference.locked,
162
+        _videoMuted: media.video.muted
155
     };
163
     };
156
 }
164
 }

+ 1
- 1
react/features/toolbar/components/Toolbar.native.js View File

123
                     underlayColor = { underlayColor } />
123
                     underlayColor = { underlayColor } />
124
                 <ToolbarButton
124
                 <ToolbarButton
125
                     iconName = {
125
                     iconName = {
126
-                        this.props.locked ? 'security-locked' : 'security'
126
+                        this.props._locked ? 'security-locked' : 'security'
127
                     }
127
                     }
128
                     iconStyle = { iconStyle }
128
                     iconStyle = { iconStyle }
129
                     onClick = { this._onRoomLock }
129
                     onClick = { this._onRoomLock }

+ 9
- 9
react/features/welcome/components/AbstractWelcomePage.js View File

18
      * @static
18
      * @static
19
      */
19
      */
20
     static propTypes = {
20
     static propTypes = {
21
-        dispatch: React.PropTypes.func,
22
-        localVideoTrack: React.PropTypes.object,
23
-        room: React.PropTypes.string
21
+        _localVideoTrack: React.PropTypes.object,
22
+        _room: React.PropTypes.string,
23
+        dispatch: React.PropTypes.func
24
     }
24
     }
25
 
25
 
26
     /**
26
     /**
69
      * @param {Object} nextProps - New props component will receive.
69
      * @param {Object} nextProps - New props component will receive.
70
      */
70
      */
71
     componentWillReceiveProps(nextProps) {
71
     componentWillReceiveProps(nextProps) {
72
-        this.setState({ room: nextProps.room });
72
+        this.setState({ room: nextProps._room });
73
     }
73
     }
74
 
74
 
75
     /**
75
     /**
167
      */
167
      */
168
     _renderLocalVideo() {
168
     _renderLocalVideo() {
169
         return (
169
         return (
170
-            <VideoTrack videoTrack = { this.props.localVideoTrack } />
170
+            <VideoTrack videoTrack = { this.props._localVideoTrack } />
171
         );
171
         );
172
     }
172
     }
173
 
173
 
202
  *
202
  *
203
  * @param {Object} state - Redux state.
203
  * @param {Object} state - Redux state.
204
  * @returns {{
204
  * @returns {{
205
- *      localVideoTrack: (Track|undefined),
206
- *      room: string
205
+ *     _localVideoTrack: (Track|undefined),
206
+ *     _room: string
207
  * }}
207
  * }}
208
  */
208
  */
209
 export function mapStateToProps(state) {
209
 export function mapStateToProps(state) {
211
     const tracks = state['features/base/tracks'];
211
     const tracks = state['features/base/tracks'];
212
 
212
 
213
     return {
213
     return {
214
-        localVideoTrack: getLocalVideoTrack(tracks),
215
-        room: conference.room
214
+        _localVideoTrack: getLocalVideoTrack(tracks),
215
+        _room: conference.room
216
     };
216
     };
217
 }
217
 }

Loading…
Cancel
Save