refactor: 코드 포맷팅 정리

AUTO-Overnight · Mar 1, 2023 · 471b900 · 471b900
1 parent 30218f4
commit 471b900
Show file tree

Hide file tree

Showing 4 changed files with 203 additions and 205 deletions.
diff --git a/src/components/BonusTable.tsx b/src/components/BonusTable.tsx
@@ -1,14 +1,13 @@
-import React, { Fragment, useEffect } from 'react';
-import { Table, Row } from 'react-native-table-component';
+import React, { Fragment, useEffect, useMemo } from 'react';
 import { StyleSheet } from 'react-native';
-import { makeBonusArray, useBreakpoint } from '../hooks';
-import { dataViewToScreenSize } from './dataViewToScreenSize';
 import { Colors } from 'react-native-paper';
+import { Row, Table } from 'react-native-table-component';
 import { useDispatch, useSelector } from 'react-redux';
-import { getBonus } from '../store/bonus';
-import { RootState } from '../store';
+import { makeBonusArray, useBreakpoint } from '../hooks';
 import type { BonusAPI } from '../interface';
-import { useMemo } from 'react';
+import { RootState } from '../store';
+import { getBonus } from '../store/bonus';
+import { dataViewToScreenSize } from './dataViewToScreenSize';
 
 const head = ['상/벌 구분', '점수', '일자'];
 const list = ['상/벌점', '내역이', '없습니다.'];
@@ -19,129 +18,131 @@ export const smallScreenIndices = [0, 1, 2];
 export const mediumScreenIndices = [0, 1, 2, 3, 4, 5];
 
 export const BonusTable = ({ isDark }) => {
-	const breakpoint = useBreakpoint();
-	const {
-		id,
-		name,
-		cookies,
-		loadingBonus,
-		tmGbn,
-		thisYear,
-		ardInptDt,
-		cmpScr,
-		lifSstArdCtnt,
-		lifSstArdGbn
-	} = useSelector(({ login, bonus, loading }: RootState) => ({
-		id: login.id,
-		name: login.name,
-		tmGbn: login.tmGbn,
-		thisYear: login.thisYear,
-		cookies: login.loginState.cookies,
-		loadingBonus: loading['bonus/GET_BONUS'],
-		ardInptDt: bonus.ardInptDt,
-		cmpScr: bonus.cmpScr,
-		lifSstArdCtnt: bonus.lifSstArdCtnt,
-		lifSstArdGbn: bonus.lifSstArdGbn
-	}));
-	const dispatch = useDispatch();
+  const breakpoint = useBreakpoint();
+  const {
+    id,
+    name,
+    cookies,
+    loadingBonus,
+    tmGbn,
+    thisYear,
+    ardInptDt,
+    cmpScr,
+    lifSstArdCtnt,
+    lifSstArdGbn,
+  } = useSelector(({ login, bonus, loading }: RootState) => ({
+    id: login.id,
+    name: login.name,
+    tmGbn: login.tmGbn,
+    thisYear: login.thisYear,
+    cookies: login.loginState.cookies,
+    loadingBonus: loading['bonus/GET_BONUS'],
+    ardInptDt: bonus.ardInptDt,
+    cmpScr: bonus.cmpScr,
+    lifSstArdCtnt: bonus.lifSstArdCtnt,
+    lifSstArdGbn: bonus.lifSstArdGbn,
+  }));
+  const dispatch = useDispatch();
 
-	let bonusList = useMemo(
-		() => makeBonusArray({ ardInptDt, cmpScr, lifSstArdCtnt, lifSstArdGbn }),
-		[ardInptDt]
-	);
-	useEffect(() => {
-		if (!ardInptDt.length) {
-			bonusList.push(list);
-		}
-	}, [ardInptDt]);
-	useEffect(() => {
-		const data: BonusAPI = {
-			cookies,
-			id,
-			name,
-			thisYear,
-			tmGbn
-		};
-		dispatch(getBonus(data));
-	}, [cookies, id, name, tmGbn, thisYear]);
+  let bonusList = useMemo(
+    () => makeBonusArray({ ardInptDt, cmpScr, lifSstArdCtnt, lifSstArdGbn }),
+    [ardInptDt],
+  );
+  useEffect(() => {
+    if (!ardInptDt.length) {
+      bonusList.push(list);
+    }
+  }, [ardInptDt]);
+  useEffect(() => {
+    const data: BonusAPI = {
+      cookies,
+      id,
+      name,
+      thisYear,
+      tmGbn,
+    };
+    dispatch(getBonus(data));
+  }, [cookies, id, name, tmGbn, thisYear]);
 
-	return (
-		<Fragment>
-			<Table
-				borderStyle={{
-					borderColor: isDark ? '#171b22' : Colors.blue400,
-					borderRightWidth: 10,
-					borderLeftWidth: 10,
-					borderBottomWidth: 10,
-					borderTopWidth: 10
-				}}
-				style={styles.table}
-			>
-				<Row
-					data={dataViewToScreenSize(
-						head,
-						breakpoint,
-						smallScreenIndices,
-						mediumScreenIndices
-					)}
-					style={{
-						height: 40,
-						backgroundColor: isDark ? '#2b323d' : Colors.blue300,
-						borderTopLeftRadius: 5,
-						borderTopRightRadius: 5
-					}}
-					textStyle={{
-						textAlign: 'center',
-						color: isDark ? Colors.white : Colors.grey900,
-						fontSize: 14
-					}}
-				/>
+  return (
+    <Fragment>
+      <Table
+        borderStyle={{
+          borderColor: isDark ? '#171b22' : Colors.blue400,
+          borderRightWidth: 10,
+          borderLeftWidth: 10,
+          borderBottomWidth: 10,
+          borderTopWidth: 10,
+        }}
+        style={styles.table}
+      >
+        <Row
+          data={dataViewToScreenSize(
+            head,
+            breakpoint,
+            smallScreenIndices,
+            mediumScreenIndices,
+          )}
+          style={{
+            height: 40,
+            backgroundColor: isDark ? '#2b323d' : Colors.blue300,
+            borderTopLeftRadius: 5,
+            borderTopRightRadius: 5,
+          }}
+          textStyle={{
+            textAlign: 'center',
+            color: isDark ? Colors.white : Colors.grey900,
+            fontSize: 14,
+          }}
+        />
 
-				{bonusList.map((entry, index) => (
-					<Row
-						key={index}
-						data={dataViewToScreenSize(
-							entry,
-							breakpoint,
-							smallScreenIndices,
-							mediumScreenIndices
-						)}
-						style={[
-							styles.dataRow,
-							{ backgroundColor: isDark ? '#222831' : Colors.blue100 }
-						]}
-						textStyle={{
-							textAlign: 'center',
-							color: isDark ? Colors.white : Colors.grey900,
-							fontSize: 14
-						}}
-					/>
-				))}
-			</Table>
-		</Fragment>
-	);
+        {bonusList.map((entry, index) => (
+          <Row
+            key={index}
+            data={dataViewToScreenSize(
+              entry,
+              breakpoint,
+              smallScreenIndices,
+              mediumScreenIndices,
+            )}
+            style={{
+              backgroundColor: isDark ? '#222831' : Colors.blue100,
+              height: 25,
+              borderBottomRightRadius: 5,
+              borderBottomLeftRadius: 5,
+            }}
+            textStyle={{
+              textAlign: 'center',
+              color: isDark ? Colors.white : Colors.grey900,
+              fontSize: 14,
+            }}
+          />
+        ))}
+      </Table>
+    </Fragment>
+  );
 };
 
 const styles = StyleSheet.create({
-	text: {
-		textAlign: 'center',
-		color: Colors.white,
-		fontSize: 14
-	},
-	head: {
-		height: 35,
-		backgroundColor: '#222831'
-	},
-	dataRow: {
-		height: 25,
-		borderBottomRightRadius: 5,
-		borderBottomLeftRadius: 5
-	},
-	border: {},
-	table: {
-		marginBottom: 10,
-		width: '90%',
-		justifyContent: 'center',
-		alignSelf: 'center'
-	}
+  text: {
+    textAlign: 'center',
+    color: Colors.white,
+    fontSize: 14,
+  },
+  head: {
+    height: 35,
+    backgroundColor: '#222831',
+  },
+  dataRow: {
+    height: 25,
+    borderBottomRightRadius: 5,
+    borderBottomLeftRadius: 5,
+  },
+  border: {},
+  table: {
+    marginBottom: 10,
+    width: '90%',
+    justifyContent: 'center',
+    alignSelf: 'center',
+  },
 });
diff --git a/src/components/LeftSwipe.tsx b/src/components/LeftSwipe.tsx
@@ -1,13 +1,12 @@
+import type { ComponentProps, FC, ReactNode } from 'react';
 import React from 'react';
-import type {ReactNode, FC, ComponentProps} from 'react';
-import {Platform, View, Animated, StyleSheet} from 'react-native';
+import { Animated, Platform, StyleSheet, View } from 'react-native';
 // prettier-ignore
-import type {GestureResponderEvent, PanResponderGestureState} from 'react-native';
-import type {LayoutChangeEvent} from 'react-native';
-import {useScrollEnabled} from '../contexts';
+import type { GestureResponderEvent, LayoutChangeEvent, PanResponderGestureState } from 'react-native';
+import { useScrollEnabled } from '../contexts';
 // prettier-ignore
-import {useLayout, usePanResponder, useToggle, useAnimatedValue, useTransformStyle}
-from '../hooks';
+import { useAnimatedValue, useLayout, usePanResponder, useTransformStyle } from '../hooks';
+import { useToggle } from '../hooks/useToggle';
 
 type Event = GestureResponderEvent;
 type State = PanResponderGestureState;
@@ -26,7 +25,7 @@ export const LeftSwipe: FC<LeftSwipeProps> = ({
   ...viewProps
 }) => {
   const [scrollEnabled, setScrollEnabled] = useScrollEnabled();
-  const [{width: leftWidth}, setLayout] = useLayout();
+  const [{ width: leftWidth }, setLayout] = useLayout();
   const translateX = useAnimatedValue(0);
   const transformStyle = useTransformStyle(
     {
@@ -44,15 +43,15 @@ export const LeftSwipe: FC<LeftSwipeProps> = ({
         ios && setScrollEnabled(false);
       },
       onPanResponderMove(e: Event, s: State) {
-        const {dx} = s;
+        const { dx } = s;
         if (!show && dx < 0) {
           return; // 이 움직임을 무시합니다.
         }
         translateX.setValue(dx);
       },
       onPanResponderRelease(e: Event, s: State) {
         ios && setScrollEnabled(true);
-        const {dx} = s;
+        const { dx } = s;
         if (!show && dx < 0) {
           return; // 이 움직임을 무시합니다.
         }
@@ -67,14 +66,15 @@ export const LeftSwipe: FC<LeftSwipeProps> = ({
   return (
     <Animated.View
       style={[transformStyle, styles.animViewStyle, style]}
-      {...viewProps}>
+      {...viewProps}
+    >
       {left && left(setLayout)}
-      <View style={[{width: '100%'}]} {...panResponder.panHandlers}>
+      <View style={[{ width: '100%' }]} {...panResponder.panHandlers}>
         {children}
       </View>
     </Animated.View>
   );
 };
 const styles = StyleSheet.create({
-  animViewStyle: {flexDirection: 'row', width: '100%'},
+  animViewStyle: { flexDirection: 'row', width: '100%' },
 });