chore(prettier): hit all files and add log ignores

Author: rahsheen

template/src/app/hooks/index.ts

@@ -1,19 +1,19 @@
-import {useRef, useEffect} from 'react';
-import {useWindowDimensions, Animated} from 'react-native';
-import {TypedUseSelectorHook, useDispatch, useSelector} from 'react-redux';
-import {RootState, AppDispatch} from '../store';
+import { useRef, useEffect } from 'react';
+import { useWindowDimensions, Animated } from 'react-native';
+import { TypedUseSelectorHook, useDispatch, useSelector } from 'react-redux';
+import { RootState, AppDispatch } from '../store';
 
 // Use throughout your app instead of plain `useDispatch` and `useSelector`
 export const useAppDispatch = () => useDispatch<AppDispatch>();
 export const useAppSelector: TypedUseSelectorHook<RootState> = useSelector;
 
 export const useViewportUnits = () => {
- const {width, height} = useWindowDimensions();
+ const { width, height } = useWindowDimensions();
 
  const vh = height / 100;
  const vw = width / 100;
 
- return {vh, vw};
+ return { vh, vw };
 };
 
 export const useBounceAnimation = (value = 10) => {

template/src/app/store.ts

@@ -1,4 +1,4 @@
-import {configureStore, ThunkAction, Action} from '@reduxjs/toolkit';
+import { configureStore, ThunkAction, Action } from '@reduxjs/toolkit';
 import counterReducer from '../features/counter/counterSlice';
 
 export const store = configureStore({

template/src/components/AsyncButton.tsx

@@ -1,4 +1,4 @@
-import React, {useRef} from 'react';
+import React, { useRef } from 'react';
 import {
  Animated,
  GestureResponderEvent,
@@ -7,8 +7,12 @@ import {
  StyleSheet,
  View,
  ViewStyle,
+ LogBox,
 } from 'react-native';
 
+// Ignore warnings from built-in Animated components that hate StrictMode
+LogBox.ignoreLogs([/Animated/]);
+
 export function AsyncButton({
  onPress,
  style,
@@ -24,7 +28,6 @@ export function AsyncButton({
 
  onPress?.(e);
 
- // TODO: Maybe change to Animated.sequence
  Animated.sequence([
  Animated.timing(progress, {
  toValue: 1,

template/src/components/Header.tsx

@@ -10,11 +10,11 @@
 'use strict';
 
 import React from 'react';
-import {Animated, StyleSheet, View} from 'react-native';
-import {useViewportUnits, useBounceAnimation} from '../app/hooks';
+import { Animated, StyleSheet, View } from 'react-native';
+import { useViewportUnits, useBounceAnimation } from '../app/hooks';
 
 const Header = () => {
- const {vh} = useViewportUnits();
+ const { vh } = useViewportUnits();
  const bounce = useBounceAnimation();
  const height = 40 * vh;
 
@@ -23,7 +23,7 @@ const Header = () => {
  <Animated.Image
  accessibilityRole={'image'}
  source={require('./logo.gif')}
- style={{height, transform: [{translateY: bounce}]}}
+ style={{ height, transform: [{ translateY: bounce }] }}
  />
  </View>
  );

template/src/components/LearnReduxLinks.tsx

@@ -11,10 +11,10 @@
 'use strict';
 
 import React from 'react';
-import {View, Text, StyleSheet, TouchableOpacity} from 'react-native';
+import { View, Text, StyleSheet, TouchableOpacity } from 'react-native';
 // @ts-ignore
 import openURLInBrowser from 'react-native/Libraries/Core/Devtools/openURLInBrowser';
-import {Colors} from 'react-native/Libraries/NewAppScreen';
+import { Colors } from 'react-native/Libraries/NewAppScreen';
 
 const links = [
  {

template/src/features/counter/Counter.tsx

@@ -1,13 +1,13 @@
-import React, {useState} from 'react';
+import React, { useState } from 'react';
 import {
  StyleSheet,
  Text,
  TextInput,
  TouchableOpacity,
  View,
 } from 'react-native';
-import {useAppDispatch, useAppSelector} from '../../app/hooks';
-import {AsyncButton} from '../../components/AsyncButton';
+import { useAppDispatch, useAppSelector } from '../../app/hooks';
+import { AsyncButton } from '../../components/AsyncButton';
 import {
  decrement,
  increment,

template/src/features/counter/counterAPI.ts

@@ -1,5 +1,5 @@
 export function fetchCount(currentCount = 0, amount = 1) {
- return new Promise<{data: number}>(resolve =>
- setTimeout(() => resolve({data: currentCount + amount}), 1000),
+ return new Promise<{ data: number }>(resolve =>
+ setTimeout(() => resolve({ data: currentCount + amount }), 1000),
  );
 }

template/src/features/counter/counterSlice.ts

@@ -1,6 +1,6 @@
-import {createAsyncThunk, createSlice, PayloadAction} from '@reduxjs/toolkit';
-import {RootState} from '../../app/store';
-import {fetchCount} from './counterAPI';
+import { createAsyncThunk, createSlice, PayloadAction } from '@reduxjs/toolkit';
+import { RootState } from '../../app/store';
+import { fetchCount } from './counterAPI';
 
 interface CounterState {
  value: number;
@@ -19,9 +19,9 @@ const initialState: CounterState = {
 export const incrementAsync = createAsyncThunk<
  number,
  number,
- {state: {counter: CounterState}}
->('counter/fetchCount', async (amount: number, {getState}) => {
- const {value} = getState().counter;
+ { state: { counter: CounterState } }
+>('counter/fetchCount', async (amount: number, { getState }) => {
+ const { value } = getState().counter;
  const response = await fetchCount(value, amount);
  return response.data;
 });
@@ -57,7 +57,7 @@ export const counterSlice = createSlice({
  },
 });
 
-export const {increment, decrement, incrementByAmount} = counterSlice.actions;
+export const { increment, decrement, incrementByAmount } = counterSlice.actions;
 
 // The function below is called a selector and allows us to select a value from
 // the state. Selectors can also be defined inline where they're used instead of