Improve remaining files to match linter

App.js

@@ -10,7 +10,7 @@ import {OverflowMenuProvider} from 'react-navigation-header-buttons';
 import LocaleManager from './src/managers/LocaleManager';
 import AsyncStorageManager from './src/managers/AsyncStorageManager';
 import CustomIntroSlider from './src/components/Overrides/CustomIntroSlider';
-import type {CustomTheme} from './src/managers/ThemeManager';
+import type {CustomThemeType} from './src/managers/ThemeManager';
 import ThemeManager from './src/managers/ThemeManager';
 import MainNavigator from './src/navigation/MainNavigator';
 import AprilFoolsManager from './src/managers/AprilFoolsManager';
@@ -35,7 +35,7 @@ type StateType = {
   showIntro: boolean,
   showUpdate: boolean,
   showAprilFools: boolean,
-  currentTheme: CustomTheme | null,
+  currentTheme: CustomThemeType | null,
 };
 
 export default class App extends React.Component<null, StateType> {

index.js

@@ -6,4 +6,5 @@ import {AppRegistry} from 'react-native';
 import App from './App';
 import {name as appName} from './app.json';
 
+// eslint-disable-next-line flowtype/require-return-type
 AppRegistry.registerComponent(appName, () => App);

metro.config.js

@@ -7,6 +7,7 @@
 
 module.exports = {
   transformer: {
+    // eslint-disable-next-line flowtype/require-return-type
     getTransformOptions: async () => ({
       transform: {
         experimentalImportSupport: false,

src/components/Amicale/Vote/VoteNotAvailable.js

@@ -4,10 +4,10 @@ import * as React from 'react';
 import {View} from 'react-native';
 import {Headline, withTheme} from 'react-native-paper';
 import i18n from 'i18n-js';
-import type {CustomTheme} from '../../../managers/ThemeManager';
+import type {CustomThemeType} from '../../../managers/ThemeManager';
 
 type PropsType = {
-  theme: CustomTheme,
+  theme: CustomThemeType,
 };
 
 class VoteNotAvailable extends React.Component<PropsType> {

src/components/Amicale/Vote/VoteResults.js

@@ -12,12 +12,12 @@ import {
 import {FlatList, StyleSheet} from 'react-native';
 import i18n from 'i18n-js';
 import type {VoteTeamType} from '../../../screens/Amicale/VoteScreen';
-import type {CustomTheme} from '../../../managers/ThemeManager';
+import type {CustomThemeType} from '../../../managers/ThemeManager';
 
 type PropsType = {
   teams: Array<VoteTeamType>,
   dateEnd: string,
-  theme: CustomTheme,
+  theme: CustomThemeType,
 };
 
 const styles = StyleSheet.create({

src/components/Amicale/Vote/VoteWait.js

@@ -9,14 +9,14 @@ import {
 } from 'react-native-paper';
 import {StyleSheet} from 'react-native';
 import i18n from 'i18n-js';
-import type {CustomTheme} from '../../../managers/ThemeManager';
+import type {CustomThemeType} from '../../../managers/ThemeManager';
 
 type PropsType = {
   startDate: string | null,
   justVoted: boolean,
   hasVoted: boolean,
   isVoteRunning: boolean,
-  theme: CustomTheme,
+  theme: CustomThemeType,
 };
 
 const styles = StyleSheet.create({

src/components/Animations/AnimatedAccordion.js

@@ -5,10 +5,10 @@ import {View} from 'react-native';
 import {List, withTheme} from 'react-native-paper';
 import Collapsible from 'react-native-collapsible';
 import * as Animatable from 'react-native-animatable';
-import type {CustomTheme} from '../../managers/ThemeManager';
+import type {CustomThemeType} from '../../managers/ThemeManager';
 
 type PropsType = {
-  theme: CustomTheme,
+  theme: CustomThemeType,
   title: string,
   subtitle?: string,
   left?: () => React.Node,

src/components/Animations/AnimatedBottomBar.js

@@ -7,13 +7,14 @@ import * as Animatable from 'react-native-animatable';
 import {StackNavigationProp} from '@react-navigation/stack';
 import AutoHideHandler from '../../utils/AutoHideHandler';
 import CustomTabBar from '../Tabbar/CustomTabBar';
-import type {CustomTheme} from '../../managers/ThemeManager';
+import type {CustomThemeType} from '../../managers/ThemeManager';
+import type {OnScrollType} from '../../utils/AutoHideHandler';
 
 const AnimatedFAB = Animatable.createAnimatableComponent(FAB);
 
 type PropsType = {
   navigation: StackNavigationProp,
-  theme: CustomTheme,
+  theme: CustomThemeType,
   onPress: (action: string, data?: string) => void,
   seekAttention: boolean,
 };
@@ -94,7 +95,7 @@ class AnimatedBottomBar extends React.Component<PropsType, StateType> {
     }
   };
 
-  onScroll = (event: SyntheticEvent<EventTarget>) => {
+  onScroll = (event: OnScrollType) => {
     this.hideHandler.onScroll(event);
   };
 

src/components/Collapsible/CollapsibleComponent.js

@@ -2,7 +2,7 @@
 
 import * as React from 'react';
 import {Collapsible} from 'react-navigation-collapsible';
-import {withCollapsible} from '../../utils/withCollapsible';
+import withCollapsible from '../../utils/withCollapsible';
 import CustomTabBar from '../Tabbar/CustomTabBar';
 
 export type CollapsibleComponentPropsType = {

src/components/Home/ActionsDashboardItem.js

@@ -5,11 +5,11 @@ import {List, withTheme} from 'react-native-paper';
 import {View} from 'react-native';
 import i18n from 'i18n-js';
 import {StackNavigationProp} from '@react-navigation/stack';
-import type {CustomTheme} from '../../managers/ThemeManager';
+import type {CustomThemeType} from '../../managers/ThemeManager';
 
 type PropsType = {
   navigation: StackNavigationProp,
-  theme: CustomTheme,
+  theme: CustomThemeType,
 };
 
 class ActionsDashBoardItem extends React.Component<PropsType> {

src/components/Home/EventDashboardItem.js

@@ -10,12 +10,12 @@ import {
 } from 'react-native-paper';
 import {StyleSheet, View} from 'react-native';
 import i18n from 'i18n-js';
-import type {CustomTheme} from '../../managers/ThemeManager';
+import type {CustomThemeType} from '../../managers/ThemeManager';
 
 type PropsType = {
   eventNumber: number,
   clickAction: () => void,
-  theme: CustomTheme,
+  theme: CustomThemeType,
   children?: React.Node,
 };
 

src/components/Home/SmallDashboardItem.js

@@ -4,13 +4,13 @@ import * as React from 'react';
 import {Badge, TouchableRipple, withTheme} from 'react-native-paper';
 import {Dimensions, Image, View} from 'react-native';
 import * as Animatable from 'react-native-animatable';
-import type {CustomTheme} from '../../managers/ThemeManager';
+import type {CustomThemeType} from '../../managers/ThemeManager';
 
 type PropsType = {
   image: string | null,
   onPress: () => void | null,
   badgeCount: number | null,
-  theme: CustomTheme,
+  theme: CustomThemeType,
 };
 
 const AnimatableBadge = Animatable.createAnimatableComponent(Badge);

src/components/Lists/Clubs/ClubListItem.js

@@ -7,14 +7,14 @@ import type {
   ClubCategoryType,
   ClubType,
 } from '../../../screens/Amicale/Clubs/ClubListScreen';
-import type {CustomTheme} from '../../../managers/ThemeManager';
+import type {CustomThemeType} from '../../../managers/ThemeManager';
 
 type PropsType = {
   onPress: () => void,
   categoryTranslator: (id: number) => ClubCategoryType,
   item: ClubType,
   height: number,
-  theme: CustomTheme,
+  theme: CustomThemeType,
 };
 
 class ClubListItem extends React.Component<PropsType> {

src/components/Lists/DashboardEdit/DashboardEditAccordion.js

@@ -10,13 +10,13 @@ import type {
   ServiceCategoryType,
   ServiceItemType,
 } from '../../../managers/ServicesManager';
-import type {CustomTheme} from '../../../managers/ThemeManager';
+import type {CustomThemeType} from '../../../managers/ThemeManager';
 
 type PropsType = {
   item: ServiceCategoryType,
   activeDashboard: Array<string>,
   onPress: (service: ServiceItemType) => void,
-  theme: CustomTheme,
+  theme: CustomThemeType,
 };
 
 const LIST_ITEM_HEIGHT = 64;

src/components/Lists/DashboardEdit/DashboardEditItem.js

@@ -3,7 +3,7 @@
 import * as React from 'react';
 import {Image} from 'react-native';
 import {List, withTheme} from 'react-native-paper';
-import type {CustomTheme} from '../../../managers/ThemeManager';
+import type {CustomThemeType} from '../../../managers/ThemeManager';
 import type {ServiceItemType} from '../../../managers/ServicesManager';
 
 type PropsType = {
@@ -11,7 +11,7 @@ type PropsType = {
   isActive: boolean,
   height: number,
   onPress: () => void,
-  theme: CustomTheme,
+  theme: CustomThemeType,
 };
 
 class DashboardEditItem extends React.Component<PropsType> {

src/components/Lists/DashboardEdit/DashboardEditPreviewItem.js

@@ -3,13 +3,13 @@
 import * as React from 'react';
 import {TouchableRipple, withTheme} from 'react-native-paper';
 import {Dimensions, Image, View} from 'react-native';
-import type {CustomTheme} from '../../../managers/ThemeManager';
+import type {CustomThemeType} from '../../../managers/ThemeManager';
 
 type PropsType = {
   image: string,
   isActive: boolean,
   onPress: () => void,
-  theme: CustomTheme,
+  theme: CustomThemeType,
 };
 
 /**

src/components/Lists/Equipment/EquipmentListItem.js

@@ -4,7 +4,7 @@ import * as React from 'react';
 import {Avatar, List, withTheme} from 'react-native-paper';
 import i18n from 'i18n-js';
 import {StackNavigationProp} from '@react-navigation/stack';
-import type {CustomTheme} from '../../../managers/ThemeManager';
+import type {CustomThemeType} from '../../../managers/ThemeManager';
 import type {DeviceType} from '../../../screens/Amicale/Equipment/EquipmentListScreen';
 import {
   getFirstEquipmentAvailability,
@@ -17,7 +17,7 @@ type PropsType = {
   userDeviceRentDates: [string, string],
   item: DeviceType,
   height: number,
-  theme: CustomTheme,
+  theme: CustomThemeType,
 };
 
 class EquipmentListItem extends React.Component<PropsType> {

src/components/Lists/PlanexGroups/GroupListAccordion.js

@@ -10,7 +10,7 @@ import type {
   PlanexGroupType,
   PlanexGroupCategoryType,
 } from '../../../screens/Planex/GroupSelectionScreen';
-import type {CustomTheme} from '../../../managers/ThemeManager';
+import type {CustomThemeType} from '../../../managers/ThemeManager';
 
 type PropsType = {
   item: PlanexGroupCategoryType,
@@ -19,7 +19,7 @@ type PropsType = {
   currentSearchString: string,
   favoriteNumber: number,
   height: number,
-  theme: CustomTheme,
+  theme: CustomThemeType,
 };
 
 const LIST_ITEM_HEIGHT = 64;

src/components/Lists/PlanexGroups/GroupListItem.js

@@ -2,11 +2,11 @@
 
 import * as React from 'react';
 import {IconButton, List, withTheme} from 'react-native-paper';
-import type {CustomTheme} from '../../../managers/ThemeManager';
+import type {CustomThemeType} from '../../../managers/ThemeManager';
 import type {PlanexGroupType} from '../../../screens/Planex/GroupSelectionScreen';
 
 type PropsType = {
-  theme: CustomTheme,
+  theme: CustomThemeType,
   onPress: () => void,
   onStarPress: () => void,
   item: PlanexGroupType,

src/components/Mascot/MascotPopup.js

@@ -18,12 +18,12 @@ import {
   View,
 } from 'react-native';
 import Mascot from './Mascot';
-import type {CustomTheme} from '../../managers/ThemeManager';
+import type {CustomThemeType} from '../../managers/ThemeManager';
 import SpeechArrow from './SpeechArrow';
 import AsyncStorageManager from '../../managers/AsyncStorageManager';
 
 type PropsType = {
-  theme: CustomTheme,
+  theme: CustomThemeType,
   icon: string,
   title: string,
   message: string,

src/components/Overrides/CustomAgenda.js

@@ -4,10 +4,10 @@ import * as React from 'react';
 import {View} from 'react-native';
 import {withTheme} from 'react-native-paper';
 import {Agenda} from 'react-native-calendars';
-import type {CustomTheme} from '../../managers/ThemeManager';
+import type {CustomThemeType} from '../../managers/ThemeManager';
 
 type PropsType = {
-  theme: CustomTheme,
+  theme: CustomThemeType,
   onRef: (ref: Agenda) => void,
 };
 

src/components/Overrides/CustomHTML.js

@@ -5,10 +5,10 @@ import * as React from 'react';
 import {Text, withTheme} from 'react-native-paper';
 import HTML from 'react-native-render-html';
 import {Linking} from 'react-native';
-import type {CustomTheme} from '../../managers/ThemeManager';
+import type {CustomThemeType} from '../../managers/ThemeManager';
 
 type PropsType = {
-  theme: CustomTheme,
+  theme: CustomThemeType,
   html: string,
 };
 

src/components/Overrides/CustomHeaderButton.js

@@ -4,10 +4,10 @@ import * as React from 'react';
 import MaterialCommunityIcons from 'react-native-vector-icons/MaterialCommunityIcons';
 import {HeaderButton, HeaderButtons} from 'react-navigation-header-buttons';
 import {withTheme} from 'react-native-paper';
-import type {CustomTheme} from '../../managers/ThemeManager';
+import type {CustomThemeType} from '../../managers/ThemeManager';
 
 const MaterialHeaderButton = (props: {
-  theme: CustomTheme,
+  theme: CustomThemeType,
   color: string,
 }): React.Node => {
   const {color, theme} = props;

src/components/Overrides/CustomModal.js

@@ -5,7 +5,7 @@ import {withTheme} from 'react-native-paper';
 import {Modalize} from 'react-native-modalize';
 import {View} from 'react-native-animatable';
 import CustomTabBar from '../Tabbar/CustomTabBar';
-import type {CustomTheme} from '../../managers/ThemeManager';
+import type {CustomThemeType} from '../../managers/ThemeManager';
 
 /**
  * Abstraction layer for Modalize component, using custom configuration
@@ -14,7 +14,7 @@ import type {CustomTheme} from '../../managers/ThemeManager';
  * @return {*}
  */
 function CustomModal(props: {
-  theme: CustomTheme,
+  theme: CustomThemeType,
   onRef: (re: Modalize) => void,
   children?: React.Node,
 }): React.Node {

src/components/Overrides/CustomSlider.js

@@ -4,10 +4,10 @@ import * as React from 'react';
 import {Text, withTheme} from 'react-native-paper';
 import {View} from 'react-native-animatable';
 import Slider, {SliderProps} from '@react-native-community/slider';
-import type {CustomTheme} from '../../managers/ThemeManager';
+import type {CustomThemeType} from '../../managers/ThemeManager';
 
 type PropsType = {
-  theme: CustomTheme,
+  theme: CustomThemeType,
   valueSuffix?: string,
   ...SliderProps,
 };

src/components/Screens/BasicLoadingScreen.js

@@ -3,7 +3,7 @@
 import * as React from 'react';
 import {View} from 'react-native';
 import {ActivityIndicator, withTheme} from 'react-native-paper';
-import type {CustomTheme} from '../../managers/ThemeManager';
+import type {CustomThemeType} from '../../managers/ThemeManager';
 
 /**
  * Component used to display a header button
@@ -12,7 +12,7 @@ import type {CustomTheme} from '../../managers/ThemeManager';
  * @return {*}
  */
 function BasicLoadingScreen(props: {
-  theme: CustomTheme,
+  theme: CustomThemeType,
   isAbsolute: boolean,
 }): React.Node {
   const {theme, isAbsolute} = props;

src/components/Screens/ErrorView.js

@@ -8,11 +8,11 @@ import i18n from 'i18n-js';
 import * as Animatable from 'react-native-animatable';
 import {StackNavigationProp} from '@react-navigation/stack';
 import {ERROR_TYPE} from '../../utils/WebData';
-import type {CustomTheme} from '../../managers/ThemeManager';
+import type {CustomThemeType} from '../../managers/ThemeManager';
 
 type PropsType = {
   navigation: StackNavigationProp,
-  theme: CustomTheme,
+  theme: CustomThemeType,
   route: {name: string},
   onRefresh?: () => void,
   errorCode?: number,
@@ -47,7 +47,7 @@ const styles = StyleSheet.create({
 
 class ErrorView extends React.PureComponent<PropsType> {
   static defaultProps = {
-    onRefresh: (): void => null,
+    onRefresh: () => {},
     errorCode: 0,
     icon: '',
     message: '',
@@ -141,10 +141,12 @@ class ErrorView extends React.PureComponent<PropsType> {
           this.icon = 'alert-circle-outline';
           break;
       }
-      this.message += `\n\nCode ${props.errorCode}`;
+      this.message += `\n\nCode ${
+        props.errorCode != null ? props.errorCode : -1
+      }`;
     } else {
-      this.message = props.message;
+      this.message = props.message != null ? props.message : '';
-      this.icon = props.icon;
+      this.icon = props.icon != null ? props.icon : '';
     }
   }
 
@@ -168,6 +170,7 @@ class ErrorView extends React.PureComponent<PropsType> {
         <View style={styles.inner}>
           <View style={styles.iconContainer}>
             <MaterialCommunityIcons
+              // $FlowFixMe
               name={this.icon}
               size={150}
               color={props.theme.colors.textDisabled}

src/components/Screens/WebSectionList.js

@@ -9,7 +9,7 @@ import {Collapsible} from 'react-navigation-collapsible';
 import {StackNavigationProp} from '@react-navigation/stack';
 import ErrorView from './ErrorView';
 import BasicLoadingScreen from './BasicLoadingScreen';
-import {withCollapsible} from '../../utils/withCollapsible';
+import withCollapsible from '../../utils/withCollapsible';
 import CustomTabBar from '../Tabbar/CustomTabBar';
 import {ERROR_TYPE, readData} from '../../utils/WebData';
 import CollapsibleSectionList from '../Collapsible/CollapsibleSectionList';

src/components/Screens/WebViewScreen.js

@@ -14,7 +14,7 @@ import {withTheme} from 'react-native-paper';
 import {StackNavigationProp} from '@react-navigation/stack';
 import {Collapsible} from 'react-navigation-collapsible';
 import type {CustomThemeType} from '../../managers/ThemeManager';
-import {withCollapsible} from '../../utils/withCollapsible';
+import withCollapsible from '../../utils/withCollapsible';
 import MaterialHeaderButtons, {Item} from '../Overrides/CustomHeaderButton';
 import {ERROR_TYPE} from '../../utils/WebData';
 import ErrorView from './ErrorView';

src/components/Tabbar/CustomTabBar.js

@@ -7,7 +7,7 @@ import {Collapsible} from 'react-navigation-collapsible';
 import {StackNavigationProp} from '@react-navigation/stack';
 import TabIcon from './TabIcon';
 import TabHomeIcon from './TabHomeIcon';
-import type {CustomTheme} from '../../managers/ThemeManager';
+import type {CustomThemeType} from '../../managers/ThemeManager';
 
 type RouteType = {
   name: string,
@@ -33,7 +33,7 @@ type PropsType = {
     },
   },
   navigation: StackNavigationProp,
-  theme: CustomTheme,
+  theme: CustomThemeType,
 };
 
 type StateType = {

src/components/Tabbar/TabHomeIcon.js

@@ -6,13 +6,13 @@ import {FAB, TouchableRipple, withTheme} from 'react-native-paper';
 import * as Animatable from 'react-native-animatable';
 import FOCUSED_ICON from '../../../assets/tab-icon.png';
 import UNFOCUSED_ICON from '../../../assets/tab-icon-outline.png';
-import type {CustomTheme} from '../../managers/ThemeManager';
+import type {CustomThemeType} from '../../managers/ThemeManager';
 
 type PropsType = {
   focused: boolean,
   onPress: () => void,
   onLongPress: () => void,
-  theme: CustomTheme,
+  theme: CustomThemeType,
   tabBarHeight: number,
 };
 

src/components/Tabbar/TabIcon.js

@@ -6,7 +6,7 @@ import {TouchableRipple, withTheme} from 'react-native-paper';
 import type {MaterialCommunityIconsGlyphs} from 'react-native-vector-icons/MaterialCommunityIcons';
 import MaterialCommunityIcons from 'react-native-vector-icons/MaterialCommunityIcons';
 import * as Animatable from 'react-native-animatable';
-import type {CustomTheme} from '../../managers/ThemeManager';
+import type {CustomThemeType} from '../../managers/ThemeManager';
 
 type PropsType = {
   focused: boolean,
@@ -15,7 +15,7 @@ type PropsType = {
   icon: MaterialCommunityIconsGlyphs,
   onPress: () => void,
   onLongPress: () => void,
-  theme: CustomTheme,
+  theme: CustomThemeType,
   extraData: null | boolean | number | string,
 };
 

src/screens/About/AboutScreen.js

@@ -145,9 +145,7 @@ class AboutScreen extends React.Component<PropsType> {
    */
   additionalDevData = [
     {
-      onPressCallback: () => {
+      onPressCallback: () => {},
-        console.log('Meme this');
-      },
       icon: 'account',
       text: 'Yohan SIMARD',
       showChevron: false,

src/screens/Game/logic/Piece.js

@@ -1,14 +1,16 @@
-import ShapeL from "../Shapes/ShapeL";
+// @flow
-import ShapeI from "../Shapes/ShapeI";
+
-import ShapeJ from "../Shapes/ShapeJ";
+import ShapeL from '../Shapes/ShapeL';
-import ShapeO from "../Shapes/ShapeO";
+import ShapeI from '../Shapes/ShapeI';
-import ShapeS from "../Shapes/ShapeS";
+import ShapeJ from '../Shapes/ShapeJ';
-import ShapeT from "../Shapes/ShapeT";
+import ShapeO from '../Shapes/ShapeO';
-import ShapeZ from "../Shapes/ShapeZ";
+import ShapeS from '../Shapes/ShapeS';
-import type {Coordinates} from '../Shapes/BaseShape';
+import ShapeT from '../Shapes/ShapeT';
-import BaseShape from "../Shapes/BaseShape";
+import ShapeZ from '../Shapes/ShapeZ';
-import type {Grid} from "../components/GridComponent";
+import type {CoordinatesType} from '../Shapes/BaseShape';
-import type {CustomTheme} from "../../../managers/ThemeManager";
+import BaseShape from '../Shapes/BaseShape';
+import type {GridType} from '../components/GridComponent';
+import type {CustomThemeType} from '../../../managers/ThemeManager';
 
 /**
  * Class used as an abstraction layer for shapes.
@@ -16,27 +18,20 @@ import type {CustomTheme} from "../../../managers/ThemeManager";
  *
  */
 export default class Piece {
+  shapes = [ShapeL, ShapeI, ShapeJ, ShapeO, ShapeS, ShapeT, ShapeZ];
 
-    #shapes = [
+  currentShape: BaseShape;
-        ShapeL,
+
-        ShapeI,
+  theme: CustomThemeType;
-        ShapeJ,
-        ShapeO,
-        ShapeS,
-        ShapeT,
-        ShapeZ,
-    ];
-    #currentShape: BaseShape;
-    #theme: CustomTheme;
 
   /**
    * Initializes this piece's color and shape
    *
    * @param theme Object containing current theme
    */
-    constructor(theme: CustomTheme) {
+  constructor(theme: CustomThemeType) {
-        this.#currentShape = this.getRandomShape(theme);
+    this.currentShape = this.getRandomShape(theme);
-        this.#theme = theme;
+    this.theme = theme;
   }
 
   /**
@@ -44,8 +39,8 @@ export default class Piece {
    *
    * @param theme Object containing current theme
    */
-    getRandomShape(theme: CustomTheme) {
+  getRandomShape(theme: CustomThemeType): BaseShape {
-        return new this.#shapes[Math.floor(Math.random() * 7)](theme);
+    return new this.shapes[Math.floor(Math.random() * 7)](theme);
   }
 
   /**
@@ -53,15 +48,18 @@ export default class Piece {
    *
    * @param grid The grid to remove the piece from
    */
-    removeFromGrid(grid: Grid) {
+  removeFromGrid(grid: GridType) {
-        const pos: Array<Coordinates> = this.#currentShape.getCellsCoordinates(true);
+    const pos: Array<CoordinatesType> = this.currentShape.getCellsCoordinates(
-        for (let i = 0; i < pos.length; i++) {
+      true,
-            grid[pos[i].y][pos[i].x] = {
+    );
-                color: this.#theme.colors.tetrisBackground,
+    pos.forEach((coordinates: CoordinatesType) => {
+      // eslint-disable-next-line no-param-reassign
+      grid[coordinates.y][coordinates.x] = {
+        color: this.theme.colors.tetrisBackground,
         isEmpty: true,
-                key: grid[pos[i].y][pos[i].x].key
+        key: grid[coordinates.y][coordinates.x].key,
       };
-        }
+    });
   }
 
   /**
@@ -70,15 +68,18 @@ export default class Piece {
    * @param grid The grid to add the piece to
    * @param isPreview Should we use this piece's current position to determine the cells?
    */
-    toGrid(grid: Grid, isPreview: boolean) {
+  toGrid(grid: GridType, isPreview: boolean) {
-        const pos: Array<Coordinates> = this.#currentShape.getCellsCoordinates(!isPreview);
+    const pos: Array<CoordinatesType> = this.currentShape.getCellsCoordinates(
-        for (let i = 0; i < pos.length; i++) {
+      !isPreview,
-            grid[pos[i].y][pos[i].x] = {
+    );
-                color: this.#currentShape.getColor(),
+    pos.forEach((coordinates: CoordinatesType) => {
+      // eslint-disable-next-line no-param-reassign
+      grid[coordinates.y][coordinates.x] = {
+        color: this.currentShape.getColor(),
         isEmpty: false,
-                key: grid[pos[i].y][pos[i].x].key
+        key: grid[coordinates.y][coordinates.x].key,
       };
-        }
+    });
   }
 
   /**
@@ -89,15 +90,19 @@ export default class Piece {
    * @param height The grid's height
    * @return {boolean} If the position is valid
    */
-    isPositionValid(grid: Grid, width: number, height: number) {
+  isPositionValid(grid: GridType, width: number, height: number): boolean {
     let isValid = true;
-        const pos: Array<Coordinates> = this.#currentShape.getCellsCoordinates(true);
+    const pos: Array<CoordinatesType> = this.currentShape.getCellsCoordinates(
-        for (let i = 0; i < pos.length; i++) {
+      true,
-            if (pos[i].x >= width
+    );
-                || pos[i].x < 0
+    for (let i = 0; i < pos.length; i += 1) {
-                || pos[i].y >= height
+      if (
-                || pos[i].y < 0
+        pos[i].x >= width ||
-                || !grid[pos[i].y][pos[i].x].isEmpty) {
+        pos[i].x < 0 ||
+        pos[i].y >= height ||
+        pos[i].y < 0 ||
+        !grid[pos[i].y][pos[i].x].isEmpty
+      ) {
         isValid = false;
         break;
       }
@@ -116,24 +121,31 @@ export default class Piece {
    * @param freezeCallback Callback to use if the piece should freeze itself
    * @return {boolean} True if the move was valid, false otherwise
    */
-    tryMove(x: number, y: number, grid: Grid, width: number, height: number, freezeCallback: () => void) {
+  tryMove(
-        if (x > 1) x = 1; // Prevent moving from more than one tile
+    x: number,
-        if (x < -1) x = -1;
+    y: number,
-        if (y > 1) y = 1;
+    grid: GridType,
-        if (y < -1) y = -1;
+    width: number,
-        if (x !== 0 && y !== 0) y = 0; // Prevent diagonal movement
+    height: number,
+    freezeCallback: () => void,
+  ): boolean {
+    let newX = x;
+    let newY = y;
+    if (x > 1) newX = 1; // Prevent moving from more than one tile
+    if (x < -1) newX = -1;
+    if (y > 1) newY = 1;
+    if (y < -1) newY = -1;
+    if (x !== 0 && y !== 0) newY = 0; // Prevent diagonal movement
 
     this.removeFromGrid(grid);
-        this.#currentShape.move(x, y);
+    this.currentShape.move(newX, newY);
-        let isValid = this.isPositionValid(grid, width, height);
+    const isValid = this.isPositionValid(grid, width, height);
 
-        if (!isValid)
+    if (!isValid) this.currentShape.move(-newX, -newY);
-            this.#currentShape.move(-x, -y);
 
-        let shouldFreeze = !isValid && y !== 0;
+    const shouldFreeze = !isValid && newY !== 0;
     this.toGrid(grid, false);
-        if (shouldFreeze)
+    if (shouldFreeze) freezeCallback();
-            freezeCallback();
     return isValid;
   }
 
@@ -145,11 +157,11 @@ export default class Piece {
    * @param height The grid's height
    * @return {boolean} True if the rotation was valid, false otherwise
    */
-    tryRotate(grid: Grid, width: number, height: number) {
+  tryRotate(grid: GridType, width: number, height: number): boolean {
     this.removeFromGrid(grid);
-        this.#currentShape.rotate(true);
+    this.currentShape.rotate(true);
     if (!this.isPositionValid(grid, width, height)) {
-            this.#currentShape.rotate(false);
+      this.currentShape.rotate(false);
       this.toGrid(grid, false);
       return false;
     }
@@ -160,13 +172,13 @@ export default class Piece {
   /**
    * Gets this piece used cells coordinates
    *
-     * @return {Array<Coordinates>} An array of coordinates
+   * @return {Array<CoordinatesType>} An array of coordinates
    */
-    getCoordinates(): Array<Coordinates> {
+  getCoordinates(): Array<CoordinatesType> {
-        return this.#currentShape.getCellsCoordinates(true);
+    return this.currentShape.getCellsCoordinates(true);
   }
 
-    getCurrentShape() {
+  getCurrentShape(): BaseShape {
-        return this.#currentShape;
+    return this.currentShape;
   }
 }

src/screens/Home/HomeScreen.js

@@ -19,7 +19,7 @@ import MaterialHeaderButtons, {
   Item,
 } from '../../components/Overrides/CustomHeaderButton';
 import AnimatedFAB from '../../components/Animations/AnimatedFAB';
-import type {CustomTheme} from '../../managers/ThemeManager';
+import type {CustomThemeType} from '../../managers/ThemeManager';
 import ConnectionManager from '../../managers/ConnectionManager';
 import LogoutDialog from '../../components/Amicale/LogoutDialog';
 import AsyncStorageManager from '../../managers/AsyncStorageManager';
@@ -78,7 +78,7 @@ type RawDashboardType = {
 type PropsType = {
   navigation: StackNavigationProp,
   route: {params: {nextScreen: string, data: {...}}},
-  theme: CustomTheme,
+  theme: CustomThemeType,
 };
 
 type StateType = {

src/screens/Planex/PlanexScreen.js

@@ -6,7 +6,7 @@ import i18n from 'i18n-js';
 import {View} from 'react-native';
 import {CommonActions} from '@react-navigation/native';
 import {StackNavigationProp} from '@react-navigation/stack';
-import type {CustomTheme} from '../../managers/ThemeManager';
+import type {CustomThemeType} from '../../managers/ThemeManager';
 import ThemeManager from '../../managers/ThemeManager';
 import WebViewScreen from '../../components/Screens/WebViewScreen';
 import AsyncStorageManager from '../../managers/AsyncStorageManager';
@@ -22,7 +22,7 @@ import MascotPopup from '../../components/Mascot/MascotPopup';
 type PropsType = {
   navigation: StackNavigationProp,
   route: {params: {group: PlanexGroupType}},
-  theme: CustomTheme,
+  theme: CustomThemeType,
 };
 
 type StateType = {

src/screens/Services/ServicesSectionScreen.js

@@ -6,7 +6,7 @@ import {CommonActions} from '@react-navigation/native';
 import {StackNavigationProp} from '@react-navigation/stack';
 import CardList from '../../components/Lists/CardList/CardList';
 import CustomTabBar from '../../components/Tabbar/CustomTabBar';
-import {withCollapsible} from '../../utils/withCollapsible';
+import withCollapsible from '../../utils/withCollapsible';
 import type {ServiceCategoryType} from '../../managers/ServicesManager';
 
 type PropsType = {

src/utils/AutoHideHandler.js

@@ -1,18 +1,28 @@
 // @flow
 
-import * as React from 'react';
-
 const speedOffset = 5;
 
+type ListenerFunctionType = (shouldHide: boolean) => void;
+
+export type OnScrollType = {
+  nativeEvent: {
+    contentInset: {bottom: number, left: number, right: number, top: number},
+    contentOffset: {x: number, y: number},
+    contentSize: {height: number, width: number},
+    layoutMeasurement: {height: number, width: number},
+    zoomScale: number,
+  },
+};
+
 /**
  * Class used to detect when to show or hide a component based on scrolling
  */
 export default class AutoHideHandler {
-
   lastOffset: number;
+
   isHidden: boolean;
 
-    listeners: Array<Function>;
+  listeners: Array<ListenerFunctionType>;
 
   constructor(startHidden: boolean) {
     this.listeners = [];
@@ -24,7 +34,7 @@ export default class AutoHideHandler {
    *
    * @param listener
    */
-    addListener(listener: Function) {
+  addListener(listener: (shouldHide: boolean) => void) {
     this.listeners.push(listener);
   }
 
@@ -34,9 +44,9 @@ export default class AutoHideHandler {
    * @param shouldHide
    */
   notifyListeners(shouldHide: boolean) {
-        for (let i = 0; i < this.listeners.length; i++) {
+    this.listeners.forEach((func: ListenerFunctionType) => {
-            this.listeners[i](shouldHide);
+      func(shouldHide);
-        }
+    });
   }
 
   /**
@@ -53,18 +63,23 @@ export default class AutoHideHandler {
    * this can trigger the hide event as it scrolls down the list to show the refresh indicator.
    * Android shows the refresh indicator on top of the list so this is not an issue.
    *
-     * @param nativeEvent The scroll event generated by the animated component onScroll prop
+   * @param event The scroll event generated by the animated component onScroll prop
    */
-    onScroll({nativeEvent}: Object) {
+  onScroll(event: OnScrollType) {
-        const speed = nativeEvent.contentOffset.y < 0 ? 0 : this.lastOffset - nativeEvent.contentOffset.y;
+    const {nativeEvent} = event;
-        if (speed < -speedOffset && !this.isHidden) { // Go down
+    const speed =
+      nativeEvent.contentOffset.y < 0
+        ? 0
+        : this.lastOffset - nativeEvent.contentOffset.y;
+    if (speed < -speedOffset && !this.isHidden) {
+      // Go down
       this.notifyListeners(true);
       this.isHidden = true;
-        } else if (speed > speedOffset && this.isHidden) { // Go up
+    } else if (speed > speedOffset && this.isHidden) {
+      // Go up
       this.notifyListeners(false);
       this.isHidden = false;
     }
     this.lastOffset = nativeEvent.contentOffset.y;
   }
-
 }

src/utils/CollapsibleUtils.js

@@ -1,9 +1,9 @@
 // @flow
 
 import * as React from 'react';
-import {useTheme} from "react-native-paper";
+import {useTheme} from 'react-native-paper';
-import {createCollapsibleStack} from "react-navigation-collapsible";
+import {createCollapsibleStack} from 'react-navigation-collapsible';
-import StackNavigator, {StackNavigationOptions} from "@react-navigation/stack";
+import StackNavigator, {StackNavigationOptions} from '@react-navigation/stack';
 
 /**
  * Creates a navigation stack with the collapsible library, allowing the header to collapse on scroll.
@@ -24,11 +24,13 @@ import StackNavigator, {StackNavigationOptions} from "@react-navigation/stack";
 export function createScreenCollapsibleStack(
   name: string,
   Stack: StackNavigator,
+  // eslint-disable-next-line flowtype/no-weak-types
   component: React.ComponentType<any>,
   title: string,
   useNativeDriver?: boolean,
   options?: StackNavigationOptions,
-    headerColor?: string) {
+  headerColor?: string,
+): React.Node {
   const {colors} = useTheme();
   const screenOptions = options != null ? options : {};
   return createCollapsibleStack(
@@ -36,18 +38,18 @@ export function createScreenCollapsibleStack(
       name={name}
       component={component}
       options={{
-                title: title,
+        title,
         headerStyle: {
-                    backgroundColor: headerColor!=null ? headerColor :colors.surface,
+          backgroundColor: headerColor != null ? headerColor : colors.surface,
         },
         ...screenOptions,
       }}
     />,
     {
-            collapsedColor: headerColor!=null ? headerColor :colors.surface,
+      collapsedColor: headerColor != null ? headerColor : colors.surface,
       useNativeDriver: useNativeDriver != null ? useNativeDriver : true, // native driver does not work with webview
-        }
+    },
-    )
+  );
 }
 
 /**
@@ -62,6 +64,12 @@ export function createScreenCollapsibleStack(
  * @param title
  * @returns {JSX.Element}
  */
-export function getWebsiteStack(name: string, Stack: any, component: any, title: string) {
+export function getWebsiteStack(
+  name: string,
+  Stack: StackNavigator,
+  // eslint-disable-next-line flowtype/no-weak-types
+  component: React.ComponentType<any>,
+  title: string,
+): React.Node {
   return createScreenCollapsibleStack(name, Stack, component, title, false);
 }