Merge pull request #351 from react-native-community/@vonovak/actually-use-prettier

enable prettier by default

Author: msand

.prettierrc

@@ -1,8 +1,6 @@
 {
-  "requirePragma": true,
   "singleQuote": true,
   "trailingComma": "all",
   "bracketSpacing": false,
-  "jsxBracketSameLine": true,
-  "parser": "flow"
+  "jsxBracketSameLine": true
 }

example/App.js

@@ -2,7 +2,7 @@
  * Basic [iOS] Example for react-native-blur
  * https://github.com/react-native-community/react-native-blur
  */
-import React, { Component } from 'react';
+import React, {Component} from 'react';
 import {
   Image,
   SegmentedControlIOS,
@@ -13,7 +13,7 @@ import {
   View,
 } from 'react-native';
 
-import { BlurView, VibrancyView } from '@react-native-community/blur';
+import {BlurView, VibrancyView} from '@react-native-community/blur';
 
 export default class Basic extends Component {
   constructor(props) {
@@ -37,7 +37,9 @@ export default class Basic extends Component {
   }
 
   _onVibrancyChange(event) {
-    this.setState({vibrancyActiveSegment: event.nativeEvent.selectedSegmentIndex});
+    this.setState({
+      vibrancyActiveSegment: event.nativeEvent.selectedSegmentIndex,
+    });
   }
 
   _onVibrancyValueChange(value) {
@@ -62,17 +64,22 @@ export default class Basic extends Component {
             blurAmount={100}
             reducedTransparencyFallbackColor={'pink'}
             style={[styles.blurView]}>
-            <Text style={[styles.text, { color: tintColor }]}>
+            <Text style={[styles.text, {color: tintColor}]}>
               Blur component ({platform})
             </Text>
-            {Platform.OS === 'ios' &&
-            <SegmentedControlIOS
-              values={['xlight', 'light', 'dark', 'regular', 'prominent']}
-              selectedIndex={this.state.blurActiveSegment}
-              onChange={(event) => {this._onBlurChange(event);}}
-              onValueChange={(value) => {this._onBlurValueChange(value);}}
-              tintColor={tintColor}
-            />}
+            {Platform.OS === 'ios' && (
+              <SegmentedControlIOS
+                values={['xlight', 'light', 'dark', 'regular', 'prominent']}
+                selectedIndex={this.state.blurActiveSegment}
+                onChange={(event) => {
+                  this._onBlurChange(event);
+                }}
+                onValueChange={(value) => {
+                  this._onBlurValueChange(value);
+                }}
+                tintColor={tintColor}
+              />
+            )}
           </BlurView>
         </View>
 
@@ -81,48 +88,49 @@ export default class Basic extends Component {
             VibrancyView is only supported on iOS, and must contain child views,
             otherwise the vibrancy effect doesn't work.
           */
-          Platform.OS === 'ios' &&
-          <VibrancyView
-            blurType={this.state.vibrancyBlurType}
-            blurAmount={10}
-            reducedTransparencyFallbackColor={'pink'}
-            style={[styles.container, styles.blurContainer]}>
-
-            <Text style={styles.text}>
-              Vibrancy component (iOS-only)
-            </Text>
-
-            <SegmentedControlIOS
-              values={['xlight', 'light', 'dark', 'regular', 'prominent']}
-              selectedIndex={this.state.vibrancyActiveSegment}
-              onChange={(event) => {this._onVibrancyChange(event);}}
-              onValueChange={(value) => {this._onVibrancyValueChange(value);}}
-              tintColor="white"
-            />
-          </VibrancyView>
+          Platform.OS === 'ios' && (
+            <VibrancyView
+              blurType={this.state.vibrancyBlurType}
+              blurAmount={10}
+              reducedTransparencyFallbackColor={'pink'}
+              style={[styles.container, styles.blurContainer]}>
+              <Text style={styles.text}>Vibrancy component (iOS-only)</Text>
+
+              <SegmentedControlIOS
+                values={['xlight', 'light', 'dark', 'regular', 'prominent']}
+                selectedIndex={this.state.vibrancyActiveSegment}
+                onChange={(event) => {
+                  this._onVibrancyChange(event);
+                }}
+                onValueChange={(value) => {
+                  this._onVibrancyValueChange(value);
+                }}
+                tintColor="white"
+              />
+            </VibrancyView>
+          )
         }
       </View>
     );
   }
 
   render() {
     return (
-      <View
-        style={styles.container}>
+      <View style={styles.container}>
         <Image
           source={require('./bgimage.jpeg')}
           resizeMode="cover"
-          style={styles.img}/>
+          style={styles.img}
+        />
 
-        { this.state.showBlurs ? this.renderBlurs() : null }
+        {this.state.showBlurs ? this.renderBlurs() : null}
 
-        <View
-          style={styles.blurToggle}>
+        <View style={styles.blurToggle}>
           <Switch
             onValueChange={(value) => this.setState({showBlurs: value})}
-            value={this.state.showBlurs} />
+            value={this.state.showBlurs}
+          />
         </View>
-
       </View>
     );
   }

example/index.js

@@ -1,7 +1,3 @@
-/**
- * @format
- */
-
 import {AppRegistry} from 'react-native';
 import App from './App';
 import {name as appName} from './app.json';

package.json

@@ -5,7 +5,7 @@
   "main": "index.js",
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1",
-    "lint": "eslint src index.js"
+    "lint": "eslint src index.js example"
   },
   "repository": {
     "type": "git",
@@ -42,8 +42,7 @@
   },
   "lint-staged": {
     "*.{js,json,css,md}": [
-      "prettier --write",
-      "git add"
+      "prettier --write"
     ]
   }
 }

src/BlurView.android.js

@@ -1,4 +1,4 @@
-import React, { Component } from 'react';
+import React, {Component} from 'react';
 import PropTypes from 'prop-types';
 import {
   View,
@@ -16,7 +16,7 @@ const OVERLAY_COLORS = {
 
 class BlurView extends Component {
   componentDidMount() {
-    DeviceEventEmitter.addListener('ReactNativeBlurError', message => {
+    DeviceEventEmitter.addListener('ReactNativeBlurError', (message) => {
       throw new Error(`[ReactNativeBlur]: ${message}`);
     });
   }
@@ -33,12 +33,12 @@ class BlurView extends Component {
   }
 
   blurRadius() {
-    const { blurRadius, blurAmount } = this.props;
+    const {blurRadius, blurAmount} = this.props;
 
     if (blurRadius != null) {
       if (blurRadius > 25) {
         throw new Error(
-          `[ReactNativeBlur]: blurRadius cannot be greater than 25! (was: ${blurRadius})`
+          `[ReactNativeBlur]: blurRadius cannot be greater than 25! (was: ${blurRadius})`,
         );
       }
       return blurRadius;
@@ -55,32 +55,31 @@ class BlurView extends Component {
   }
 
   downsampleFactor() {
-    const { downsampleFactor, blurRadius } = this.props;
+    const {downsampleFactor, blurRadius} = this.props;
     if (downsampleFactor != null) {
       return downsampleFactor;
     }
     return blurRadius;
   }
 
   render() {
-    const { style } = this.props;
+    const {style} = this.props;
 
     return (
       <NativeBlurView
         blurRadius={this.blurRadius()}
         downsampleFactor={this.downsampleFactor()}
         overlayColor={this.overlayColor()}
         pointerEvents="none"
-        style={StyleSheet.compose(styles.transparent, style)}
-      >
+        style={StyleSheet.compose(styles.transparent, style)}>
         {this.props.children}
       </NativeBlurView>
     );
   }
 }
 
 const styles = StyleSheet.create({
-  transparent: { backgroundColor: 'transparent' },
+  transparent: {backgroundColor: 'transparent'},
 });
 
 BlurView.propTypes = {

src/BlurView.ios.js

@@ -1,9 +1,14 @@
-import React, { Component } from 'react';
+import React, {Component} from 'react';
 import PropTypes from 'prop-types';
-import {View, requireNativeComponent, ViewPropTypes, StyleSheet} from 'react-native';
+import {
+  View,
+  requireNativeComponent,
+  ViewPropTypes,
+  StyleSheet,
+} from 'react-native';
 
 class BlurView extends Component {
-  setNativeProps = nativeProps => {
+  setNativeProps = (nativeProps) => {
     if (this._root) {
       this._root.setNativeProps(nativeProps);
     }
@@ -12,7 +17,7 @@ class BlurView extends Component {
   render() {
     return (
       <NativeBlurView
-        ref={e => (this._root = e)}
+        ref={(e) => (this._root = e)}
         {...this.props}
         style={StyleSheet.compose(styles.transparent, this.props.style)}
       />
@@ -21,7 +26,7 @@ class BlurView extends Component {
 }
 
 const styles = StyleSheet.create({
-  transparent: { backgroundColor: 'transparent' },
+  transparent: {backgroundColor: 'transparent'},
 });
 
 BlurView.propTypes = {

src/VibrancyView.ios.js

@@ -1,9 +1,9 @@
-import React, { Component } from 'react';
+import React, {Component} from 'react';
 import PropTypes from 'prop-types';
 import {requireNativeComponent, StyleSheet} from 'react-native';
 
 class VibrancyView extends Component {
-  setNativeProps = nativeProps => {
+  setNativeProps = (nativeProps) => {
     if (this._root) {
       this._root.setNativeProps(nativeProps);
     }
@@ -20,7 +20,7 @@ class VibrancyView extends Component {
 }
 
 const styles = StyleSheet.create({
-  transparent: { backgroundColor: 'transparent' },
+  transparent: {backgroundColor: 'transparent'},
 });
 
 VibrancyView.propTypes = {