chore: update eslint + prettier rules

.eslintrc.js

@@ -3,18 +3,21 @@ module.exports = {
  jest: true
  },
  extends: [
- 'prettier',
- 'prettier/standard',
+ 'plugin:react/recommended',
+ 'plugin:@typescript-eslint/recommended',
  'prettier/@typescript-eslint',
- 'semistandard'
+ 'plugin:prettier/recommended'
  ],
  parser: '@typescript-eslint/parser',
- plugins: ['react', '@typescript-eslint'],
+ plugins: ['react', '@typescript-eslint', 'prettier'],
  rules: {
- // https://stackoverflow.com/questions/55280555/typescript-eslint-eslint-plugin-error-route-is-defined-but-never-used-no-un
- '@typescript-eslint/no-unused-vars': 'error',
- 'no-unused-vars': 'off',
- 'react/jsx-uses-react': 1,
- 'react/jsx-uses-vars': 1
+ // disable the rule for all files
+ '@typescript-eslint/explicit-function-return-type': 'off',
+ '@typescript-eslint/no-explicit-any': 'off'
+ },
+ settings: {
+ react: {
+ version: 'detect'
+ }
  }
 };

.prettierrc.js

@@ -0,0 +1,5 @@
+module.exports = {
+ semi: true,
+ singleQuote: true,
+ tabWidth: 2
+};

App/App.tsx

@@ -43,7 +43,7 @@ if (Constants.manifest.extra.sentryPublicDsn) {
  }
 }
 
-export function App () {
+export function App() {
  const [ready, setReady] = useState(false);
  useEffect(() => {
  Promise.all([

App/Screens/About/About.tsx

@@ -16,17 +16,24 @@
 
 import Constants from 'expo-constants';
 import React from 'react';
-import { Linking, Platform, ScrollView, StyleSheet, Switch, Text, View } from 'react-native';
+import {
+ Linking,
+ Platform,
+ ScrollView,
+ StyleSheet,
+ Switch,
+ Text,
+ View
+} from 'react-native';
 import { ScrollIntoView, wrapScrollView } from 'react-native-scroll-into-view';
 import { scale } from 'react-native-size-matters';
 import { NavigationInjectedProps } from 'react-navigation';
-
-import { Box } from './Box';
 import { BackButton } from '../../components';
 import { i18n } from '../../localization';
+import { useDistanceUnit } from '../../stores/distanceUnit';
 import { trackScreen } from '../../util/amplitude';
 import * as theme from '../../util/theme';
-import { useDistanceUnit } from '../../stores/distanceUnit';
+import { Box } from './Box';
 
 const CustomScrollView = wrapScrollView(ScrollView);
 const scrollViewOptions = {
@@ -51,7 +58,9 @@ const handleOpenAqi = () => {
 };
 
 const handleOpenArticle = () => {
- Linking.openURL('http:https://berkeleyearth.org/air-pollution-and-cigarette-equivalence/');
+ Linking.openURL(
+ 'http:https://berkeleyearth.org/air-pollution-and-cigarette-equivalence/'
+ );
 };
 
 const handleOpenGithub = () => {
@@ -62,33 +71,103 @@ const handleOpenMarcelo = () => {
  Linking.openURL('https://www.behance.net/marceloscoelho');
 };
 
-interface AboutProps
- extends NavigationInjectedProps<{
- scrollInto?: keyof typeof aboutSections;
- }> {}
+type AboutProps = NavigationInjectedProps<{
+ scrollInto?: keyof typeof aboutSections;
+}>;
+
+const styles = StyleSheet.create({
+ articleLink: {
+ ...theme.text,
+ fontSize: scale(8)
+ },
+ backButton: {
+ marginBottom: theme.spacing.normal,
+ marginTop: theme.spacing.normal
+ },
+ credits: {
+ borderTopColor: theme.iconBackgroundColor,
+ borderTopWidth: 1,
+ marginBottom: theme.spacing.normal,
+ paddingTop: theme.spacing.big
+ },
+ distance: {
+ borderTopColor: theme.iconBackgroundColor,
+ borderTopWidth: 1,
+ marginBottom: theme.spacing.big,
+ paddingTop: theme.spacing.big
+ },
+ distanceSwitchWrapper: {
+ display: 'flex',
+ flexDirection: 'row',
+ alignItems: 'center'
+ },
+ distanceText: {
+ ...theme.text,
+ fontSize: scale(14),
+ paddingLeft: theme.spacing.small,
+ textTransform: 'capitalize'
+ },
+ h2: {
+ ...theme.title,
+ fontSize: scale(20),
+ letterSpacing: 0,
+ lineHeight: scale(24),
+ marginBottom: theme.spacing.small
+ },
+ micro: {
+ ...Platform.select({
+ ios: {
+ fontFamily: 'Georgia'
+ },
+ android: {
+ fontFamily: 'normal'
+ }
+ })
+ },
+ section: {
+ marginBottom: theme.spacing.big
+ }
+});
 
-export function About (props: AboutProps) {
+export function About(props: AboutProps) {
  const { navigation } = props;
- const { distanceUnit, localizedDistanceUnit, setDistanceUnit } = useDistanceUnit();
+ const {
+ distanceUnit,
+ localizedDistanceUnit,
+ setDistanceUnit
+ } = useDistanceUnit();
 
  trackScreen('ABOUT');
 
- const toggleDistanceSwitch = (value: boolean) => setDistanceUnit(value ? 'km' : 'mile');
+ const toggleDistanceSwitch = (value: boolean) =>
+ setDistanceUnit(value ? 'km' : 'mile');
 
  return (
- <CustomScrollView scrollIntoViewOptions={scrollViewOptions} style={theme.withPadding}>
- <BackButton onPress={() => navigation.goBack()} style={styles.backButton} />
+ <CustomScrollView
+ scrollIntoViewOptions={scrollViewOptions}
+ style={theme.withPadding}
+ >
+ <BackButton
+ onPress={() => navigation.goBack()}
+ style={styles.backButton}
+ />
 
  <View style={styles.section}>
  <Text style={styles.h2}>
  {i18n.t('about_how_do_you_calculate_the_number_of_cigarettes_title')}
  </Text>
  <Text style={theme.text}>
- {i18n.t('about_how_do_you_calculate_the_number_of_cigarettes_message_1')}{' '}
+ {i18n.t(
+ 'about_how_do_you_calculate_the_number_of_cigarettes_message_1'
+ )}{' '}
  <Text onPress={handleOpenArticle} style={theme.link}>
- {i18n.t('about_how_do_you_calculate_the_number_of_cigarettes_link_1')}
+ {i18n.t(
+ 'about_how_do_you_calculate_the_number_of_cigarettes_link_1'
+ )}
  </Text>
- {i18n.t('about_how_do_you_calculate_the_number_of_cigarettes_message_2')}
+ {i18n.t(
+ 'about_how_do_you_calculate_the_number_of_cigarettes_message_2'
+ )}
  <Text style={styles.micro}>&micro;</Text>
  g/m&sup3;
  {' \u207D'}
@@ -109,11 +188,15 @@ export function About (props: AboutProps) {
  style={styles.section}
  >
  <Text style={styles.h2}>{i18n.t('about_beta_inaccurate_title')}</Text>
- <Text style={theme.text}>{i18n.t('about_beta_inaccurate_message')}</Text>
+ <Text style={theme.text}>
+ {i18n.t('about_beta_inaccurate_message')}
+ </Text>
  </ScrollIntoView>
 
  <View style={styles.section}>
- <Text style={styles.h2}>{i18n.t('about_where_does_data_come_from_title')}</Text>
+ <Text style={styles.h2}>
+ {i18n.t('about_where_does_data_come_from_title')}
+ </Text>
  <Text style={theme.text}>
  {i18n.t('about_where_does_data_come_from_message_1')}{' '}
  <Text onPress={handleOpenAqi} style={theme.link}>
@@ -124,11 +207,17 @@ export function About (props: AboutProps) {
  </View>
 
  <ScrollIntoView
- onMount={navigation.getParam('scrollInto') === 'aboutWhyIsTheStationSoFarTitle'}
+ onMount={
+ navigation.getParam('scrollInto') === 'aboutWhyIsTheStationSoFarTitle'
+ }
  style={styles.section}
  >
- <Text style={styles.h2}>{i18n.t('about_why_is_the_station_so_far_title')}</Text>
- <Text style={theme.text}>{i18n.t('about_why_is_the_station_so_far_message')}</Text>
+ <Text style={styles.h2}>
+ {i18n.t('about_why_is_the_station_so_far_title')}
+ </Text>
+ <Text style={theme.text}>
+ {i18n.t('about_why_is_the_station_so_far_message')}
+ </Text>
  </ScrollIntoView>
 
  <View style={styles.section}>
@@ -147,10 +236,15 @@ export function About (props: AboutProps) {
  <View style={styles.distanceSwitchWrapper}>
  <Switch
  onValueChange={toggleDistanceSwitch}
- trackColor={{ true: theme.primaryColor, false: theme.iconBackgroundColor }}
+ trackColor={{
+ true: theme.primaryColor,
+ false: theme.iconBackgroundColor
+ }}
  value={distanceUnit === 'km'}
  />
- <Text style={styles.distanceText}>{localizedDistanceUnit('long')}</Text>
+ <Text style={styles.distanceText}>
+ {localizedDistanceUnit('long')}
+ </Text>
  </View>
  </View>
 
@@ -179,64 +273,11 @@ export function About (props: AboutProps) {
  </Text>
  .{'\n'}
  {'\n'}
- Sh**t! I Smoke v{Constants.manifest.revisionId || Constants.manifest.version}.
+ Sh**t! I Smoke v
+ {Constants.manifest.revisionId || Constants.manifest.version}.
  </Text>
  {/* Add languages https://github.com/amaurymartiny/shoot-i-smoke/issues/73 */}
  </View>
  </CustomScrollView>
  );
 }
-
-const styles = StyleSheet.create({
- articleLink: {
- ...theme.text,
- fontSize: scale(8)
- },
- backButton: {
- marginBottom: theme.spacing.normal,
- marginTop: theme.spacing.normal
- },
- credits: {
- borderTopColor: theme.iconBackgroundColor,
- borderTopWidth: 1,
- marginBottom: theme.spacing.normal,
- paddingTop: theme.spacing.big
- },
- distance: {
- borderTopColor: theme.iconBackgroundColor,
- borderTopWidth: 1,
- marginBottom: theme.spacing.big,
- paddingTop: theme.spacing.big
- },
- distanceSwitchWrapper: {
- display: 'flex',
- flexDirection: 'row',
- alignItems: 'center'
- },
- distanceText: {
- ...theme.text,
- fontSize: scale(14),
- paddingLeft: theme.spacing.small,
- textTransform: 'capitalize'
- },
- h2: {
- ...theme.title,
- fontSize: scale(20),
- letterSpacing: 0,
- lineHeight: scale(24),
- marginBottom: theme.spacing.small
- },
- micro: {
- ...Platform.select({
- ios: {
- fontFamily: 'Georgia'
- },
- android: {
- fontFamily: 'normal'
- }
- })
- },
- section: {
- marginBottom: theme.spacing.big
- }
-});

App/Screens/About/Box/Box.tsx

@@ -17,34 +17,10 @@
 import React from 'react';
 import { Image, Platform, StyleSheet, Text, View } from 'react-native';
 import { scale } from 'react-native-size-matters';
-
 import cigarette from '../../../../assets/images/cigarette.png';
 import { i18n } from '../../../localization';
 import * as theme from '../../../util/theme';
 
-export function Box () {
- return (
- <View style={styles.box}>
- <View style={styles.equivalence}>
- <View style={styles.statisticsLeft}>
- <Image source={cigarette} style={styles.cigarette} />
- <Text style={styles.value} />
- <Text style={styles.label}>{i18n.t('about_box_per_day')}</Text>
- </View>
- <Text style={styles.equal}>=</Text>
- <View style={styles.statisticsRight}>
- <Text style={styles.value}>22</Text>
- <Text style={styles.label}>
- <Text style={styles.micro}>&micro;</Text>
- g/m&sup3; PM2.5*
- </Text>
- </View>
- </View>
- <Text style={styles.boxDescription}>{i18n.t('about_box_footnote')}</Text>
- </View>
- );
-}
-
 const styles = StyleSheet.create({
  box: {
  alignItems: 'center',
@@ -114,3 +90,26 @@ const styles = StyleSheet.create({
  lineHeight: 44
  }
 });
+
+export function Box() {
+ return (
+ <View style={styles.box}>
+ <View style={styles.equivalence}>
+ <View style={styles.statisticsLeft}>
+ <Image source={cigarette} style={styles.cigarette} />
+ <Text style={styles.value} />
+ <Text style={styles.label}>{i18n.t('about_box_per_day')}</Text>
+ </View>
+ <Text style={styles.equal}>=</Text>
+ <View style={styles.statisticsRight}>
+ <Text style={styles.value}>22</Text>
+ <Text style={styles.label}>
+ <Text style={styles.micro}>&micro;</Text>
+ g/m&sup3; PM2.5*
+ </Text>
+ </View>
+ </View>
+ <Text style={styles.boxDescription}>{i18n.t('about_box_footnote')}</Text>
+ </View>
+ );
+}