Skip to content

Commit 4c5083a

Browse files
watanabeyufacebook-github-bot
authored andcommitted
Flow strict StatusBar (facebook#22282)
Summary: Related to facebook#22100 `Libraries/Components/StatusBar/StatusBar.js` Enhance StatusBar with mergePropsStack and _defaultProps. - [x] npm run prettier - [x] npm run flow - [x] npm run flow-check-ios - [x] npm run flow-check-android - [x] npm run lint - [x] npm run test - [x] ./scripts/run-android-local-unit-tests.sh [GENERAL][ENHANCEMENT][StatusBar.js] - apply flow strict-local Pull Request resolved: facebook#22282 Reviewed By: TheSavior Differential Revision: D13103971 Pulled By: RSNara fbshipit-source-id: 27f69c6df3a8a7792fcd595c0ff362943ccab8ca
1 parent 9e48430 commit 4c5083a

File tree

1 file changed

+70
-38
lines changed

1 file changed

+70
-38
lines changed

Libraries/Components/StatusBar/StatusBar.js

+70-38
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
* LICENSE file in the root directory of this source tree.
66
*
77
* @format
8-
* @flow
8+
* @flow strict-local
99
*/
1010

1111
'use strict';
@@ -103,53 +103,88 @@ type Props = $ReadOnly<{|
103103
barStyle?: ?('default' | 'light-content' | 'dark-content'),
104104
|}>;
105105

106+
type StackEntryProps = {|
107+
/**
108+
* The background color of the status bar.
109+
*
110+
* @platform android
111+
*/
112+
backgroundColor: {|
113+
value: ?string,
114+
animated: ?boolean,
115+
|},
116+
/**
117+
* Sets the color of the status bar text.
118+
*/
119+
barStyle: {|
120+
value: ?string,
121+
animated: ?boolean,
122+
|},
123+
/**
124+
* If the status bar is translucent.
125+
* When translucent is set to true, the app will draw under the status bar.
126+
* This is useful when using a semi transparent status bar color.
127+
*/
128+
translucent: ?boolean,
129+
/**
130+
*
131+
*/
132+
hidden: {|
133+
value: ?boolean,
134+
animated: boolean,
135+
transition: ?('slide' | 'fade'),
136+
|},
137+
/**
138+
* If the network activity indicator should be visible.
139+
*
140+
* @platform ios
141+
*/
142+
networkActivityIndicatorVisible: ?boolean,
143+
|};
144+
106145
/**
107146
* Merges the prop stack with the default values.
108147
*/
109148
function mergePropsStack(
110-
propsStack: Array<Object>,
111-
defaultValues: Object,
112-
): Object {
149+
propsStack: $ReadOnlyArray<StackEntryProps>,
150+
defaultValues: StackEntryProps,
151+
): StackEntryProps {
152+
const init: StackEntryProps = {
153+
...defaultValues,
154+
};
155+
113156
return propsStack.reduce((prev, cur) => {
114157
for (const prop in cur) {
115158
if (cur[prop] != null) {
116159
prev[prop] = cur[prop];
117160
}
118161
}
119162
return prev;
120-
}, Object.assign({}, defaultValues));
163+
}, init);
121164
}
122165

123166
/**
124167
* Returns an object to insert in the props stack from the props
125168
* and the transition/animation info.
126169
*/
127-
function createStackEntry(props: any): any {
170+
function createStackEntry(props: Props): StackEntryProps {
128171
return {
129-
backgroundColor:
130-
props.backgroundColor != null
131-
? {
132-
value: props.backgroundColor,
133-
animated: props.animated,
134-
}
135-
: null,
136-
barStyle:
137-
props.barStyle != null
138-
? {
139-
value: props.barStyle,
140-
animated: props.animated,
141-
}
142-
: null,
143-
translucent: props.translucent,
144-
hidden:
145-
props.hidden != null
146-
? {
147-
value: props.hidden,
148-
animated: props.animated,
149-
transition: props.showHideTransition,
150-
}
151-
: null,
152-
networkActivityIndicatorVisible: props.networkActivityIndicatorVisible,
172+
backgroundColor: {
173+
value: props.backgroundColor,
174+
animated: props.animated,
175+
},
176+
barStyle: {
177+
value: props.barStyle,
178+
animated: props.animated,
179+
},
180+
translucent: props.translucent || false,
181+
hidden: {
182+
value: props.hidden,
183+
animated: props.animated || false,
184+
transition: props.showHideTransition,
185+
},
186+
networkActivityIndicatorVisible:
187+
props.networkActivityIndicatorVisible || false,
153188
};
154189
}
155190

@@ -193,9 +228,9 @@ function createStackEntry(props: any): any {
193228
* `currentHeight` (Android only) The height of the status bar.
194229
*/
195230
class StatusBar extends React.Component<Props> {
196-
static _propsStack = [];
231+
static _propsStack: Array<StackEntryProps> = [];
197232

198-
static _defaultProps = createStackEntry({
233+
static _defaultProps: StackEntryProps = createStackEntry({
199234
animated: false,
200235
showHideTransition: 'fade',
201236
backgroundColor: 'black',
@@ -230,10 +265,9 @@ class StatusBar extends React.Component<Props> {
230265
* changing the status bar hidden property.
231266
*/
232267
static setHidden(hidden: boolean, animation?: StatusBarAnimation) {
233-
animation = animation || 'none';
234268
StatusBar._defaultProps.hidden.value = hidden;
235269
if (Platform.OS === 'ios') {
236-
StatusBarManager.setHidden(hidden, animation);
270+
StatusBarManager.setHidden(hidden, animation || 'none');
237271
} else if (Platform.OS === 'android') {
238272
StatusBarManager.setHidden(hidden);
239273
}
@@ -245,10 +279,9 @@ class StatusBar extends React.Component<Props> {
245279
* @param animated Animate the style change.
246280
*/
247281
static setBarStyle(style: StatusBarStyle, animated?: boolean) {
248-
animated = animated || false;
249282
StatusBar._defaultProps.barStyle.value = style;
250283
if (Platform.OS === 'ios') {
251-
StatusBarManager.setStyle(style, animated);
284+
StatusBarManager.setStyle(style, animated || false);
252285
} else if (Platform.OS === 'android') {
253286
StatusBarManager.setStyle(style);
254287
}
@@ -279,9 +312,8 @@ class StatusBar extends React.Component<Props> {
279312
console.warn('`setBackgroundColor` is only available on Android');
280313
return;
281314
}
282-
animated = animated || false;
283315
StatusBar._defaultProps.backgroundColor.value = color;
284-
StatusBarManager.setColor(processColor(color), animated);
316+
StatusBarManager.setColor(processColor(color), animated || false);
285317
}
286318

287319
/**

0 commit comments

Comments
 (0)