fix linting

Author: rahsheen

.prettierrc.js

@@ -0,0 +1,7 @@
+module.exports = {
+  arrowParens: 'avoid',
+  bracketSameLine: true,
+  bracketSpacing: false,
+  singleQuote: true,
+  trailingComma: 'all',
+};

template/index.js

@@ -2,12 +2,12 @@
  * @format
  */
 
-import { AppRegistry } from "react-native";
-import App from "./App";
-import { name as appName } from "./app.json";
-import { store } from "./src/app/store";
-import { Provider } from "react-redux";
-import React from "react";
+import {AppRegistry} from 'react-native';
+import App from './App';
+import {name as appName} from './app.json';
+import {store} from './src/app/store';
+import {Provider} from 'react-redux';
+import React from 'react';
 
 AppRegistry.registerComponent(appName, () => () => (
   <Provider store={store}>

template/src/components/AsyncButton.tsx

@@ -35,7 +35,7 @@ export function AsyncButton({
         toValue: 0,
         duration: 200,
         useNativeDriver: false,
-      })
+      }),
     ]).start();
   };
 
@@ -52,10 +52,12 @@ export function AsyncButton({
 
   return (
     <Pressable style={style} onPress={_onPress} {...restProps}>
-      <View style={StyleSheet.absoluteFill}>
-        <Animated.View style={[styles.progress, progressStyle]} />
-      </View>
-      {children}
+      <>
+        <View style={StyleSheet.absoluteFill}>
+          <Animated.View style={[styles.progress, progressStyle]} />
+        </View>
+        {children}
+      </>
     </Pressable>
   );
 }

template/src/features/counter/Counter.tsx

@@ -21,7 +21,7 @@ export function Counter() {
 
   // The `state` arg is correctly typed as `RootState` already
   const count = useAppSelector(selectCount);
-  const status = useAppSelector((state) => state.counter.status);
+  const status = useAppSelector(state => state.counter.status);
   const dispatch = useAppDispatch();
 
   return (
@@ -79,6 +79,7 @@ const styles = StyleSheet.create({
     fontSize: 78,
     paddingHorizontal: 16,
     marginTop: 2,
+    color: 'rgb(112, 76, 182)',
   },
   button: {
     backgroundColor: 'rgba(112, 76, 182, 0.1)',
@@ -101,5 +102,6 @@ const styles = StyleSheet.create({
     marginRight: 8,
     borderWidth: 1,
     justifyContent: 'center',
+    color: 'rgb(112, 76, 182)',
   },
 });

template/src/features/counter/counterAPI.ts

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

template/src/features/counter/counterSlice.ts

@@ -30,24 +30,24 @@ export const counterSlice = createSlice({
   name: 'counter',
   initialState,
   reducers: {
-    increment: (state) => {
+    increment: state => {
       // Redux Toolkit allows us to write "mutating" logic in reducers. It
       // doesn't actually mutate the state because it uses the Immer library,
       // which detects changes to a "draft state" and produces a brand new
       // immutable state based off those changes
       state.value += 1;
     },
-    decrement: (state) => {
+    decrement: state => {
       state.value -= 1;
     },
     // Use the PayloadAction type to declare the contents of `action.payload`
     incrementByAmount: (state, action: PayloadAction<number>) => {
       state.value += action.payload;
     },
   },
-  extraReducers: (builder) => {
+  extraReducers: builder => {
     builder
-      .addCase(incrementAsync.pending, (state) => {
+      .addCase(incrementAsync.pending, state => {
         state.status = 'loading';
       })
       .addCase(incrementAsync.fulfilled, (state, action) => {