diff --git a/.prettierrc.json b/.prettierrc.json
index 2b4067cf..a1732538 100644
--- a/.prettierrc.json
+++ b/.prettierrc.json
@@ -2,5 +2,8 @@
 	"trailingComma": "es5",
 	"useTabs": true,
 	"tabWidth": 4,
-	"semi": false
+	"semi": false,
+	"bracketSpacing": true,
+	"endOfLine": "auto",
+	"printWidth": 120
 }
diff --git a/src/components/modal/index.tsx b/src/components/modal/index.tsx
index 884a8732..9c6cc79d 100644
--- a/src/components/modal/index.tsx
+++ b/src/components/modal/index.tsx
@@ -1,68 +1,56 @@
-import { isIOS } from '@consts'
-import { ThemeContext } from '@src/context/Theme'
-import { highlight as hi, TPref } from '@styles'
-import { useContext } from 'react'
-import { KeyboardAvoidingView, Modal, StyleSheet, View } from 'react-native'
+import { isIOS } from "@consts"
+import { ThemeContext } from "@src/context/Theme"
+import { highlight as hi, TPref } from "@styles"
+import { useContext } from "react"
+import { KeyboardAvoidingView, Modal, StyleSheet, View } from "react-native"
 
 interface IMyModalProps {
-	type: 'bottom' | 'question' | 'success' | 'error' | 'invoiceAmount'
-	animation?: 'slide' | 'fade' | 'none'
+	type: "bottom" | "question" | "success" | "error" | "invoiceAmount"
+	animation?: "slide" | "fade" | "none"
 	visible: boolean
 	success?: boolean
 	isContactList?: boolean
 	children: React.ReactNode
 }
 
-export default function MyModal({
-	type,
-	animation,
-	visible,
-	success,
-	isContactList,
-	children,
-}: IMyModalProps) {
+export default function MyModal({ type, animation, visible, success, isContactList, children }: IMyModalProps) {
 	const { color, highlight } = useContext(ThemeContext)
 
 	const getCorrectStyle = () => {
-		if (type === 'bottom') {
+		if (type === "bottom") {
 			return styles(color, highlight).bottomView
 		}
-		if (
-			type === 'question' ||
-			type === 'success' ||
-			type === 'error' ||
-			type === 'invoiceAmount'
-		) {
+		if (type === "question" || type === "success" || type === "error" || type === "invoiceAmount") {
 			return styles(color, highlight).centeredView
 		}
 	}
 
 	const getViewStyle = () => {
-		if (type === 'bottom') {
+		if (type === "bottom") {
 			return {
 				...styles(color, highlight).common,
 				...styles(color, highlight).modalView,
 			}
 		}
-		if (type === 'question') {
+		if (type === "question") {
 			return {
 				...styles(color, highlight).common,
 				...styles(color, highlight).centeredModalView,
 			}
 		}
-		if (type === 'success') {
+		if (type === "success") {
 			return {
 				...styles(color, highlight).common,
 				...styles(color, highlight).successModalView,
 			}
 		}
-		if (type === 'error') {
+		if (type === "error") {
 			return {
 				...styles(color, highlight).common,
 				...styles(color, highlight).promptModalView,
 			}
 		}
-		if (type === 'invoiceAmount') {
+		if (type === "invoiceAmount") {
 			let styling = {
 				...styles(color, highlight).common,
 				...styles(color, highlight).invoiceAmountModalView,
@@ -79,23 +67,9 @@ export default function MyModal({
 
 	return visible ? (
 		<View style={styles(color, highlight).modalParent}>
-			<Modal
-				animationType={animation}
-				transparent={true}
-				visible={visible}
-			>
-				<KeyboardAvoidingView
-					style={getCorrectStyle()}
-					behavior={isIOS ? 'padding' : 'height'}
-				>
-					<View
-						style={[
-							getViewStyle(),
-							success ? { backgroundColor: hi[highlight] } : {},
-						]}
-					>
-						{children}
-					</View>
+			<Modal animationType={animation} transparent={true} visible={visible}>
+				<KeyboardAvoidingView style={getCorrectStyle()} behavior={isIOS ? "padding" : "height"}>
+					<View style={[getViewStyle(), success ? { backgroundColor: hi[highlight] } : {}]}>{children}</View>
 				</KeyboardAvoidingView>
 			</Modal>
 		</View>
@@ -105,17 +79,17 @@ export default function MyModal({
 const styles = (pref: TPref, h: string) =>
 	StyleSheet.create({
 		modalParent: {
-			position: 'absolute',
+			position: "absolute",
 			top: 0,
 			right: 0,
 			bottom: 0,
 			left: 0,
-			backgroundColor: 'rgba(0, 0, 0, .5)',
+			backgroundColor: "rgba(0, 0, 0, .5)",
 		},
 		common: {
 			backgroundColor: pref.BACKGROUND,
-			alignItems: 'center',
-			shadowColor: '#000',
+			alignItems: "center",
+			shadowColor: "#000",
 			shadowOffset: {
 				width: 0,
 				height: 2,
@@ -127,11 +101,11 @@ const styles = (pref: TPref, h: string) =>
 		// Bottom Modal
 		bottomView: {
 			flex: 1,
-			justifyContent: 'flex-end',
-			alignItems: 'center',
+			justifyContent: "flex-end",
+			alignItems: "center",
 		},
 		modalView: {
-			width: '100%',
+			width: "100%",
 			borderTopLeftRadius: 20,
 			borderTopRightRadius: 20,
 			padding: 20,
@@ -139,11 +113,11 @@ const styles = (pref: TPref, h: string) =>
 		// Centered Modal
 		centeredView: {
 			flex: 1,
-			justifyContent: 'center',
-			alignItems: 'center',
+			justifyContent: "center",
+			alignItems: "center",
 		},
 		centeredModalView: {
-			width: '90%',
+			width: "90%",
 			borderRadius: 20,
 			borderWidth: 3,
 			borderColor: hi[h],
@@ -154,21 +128,21 @@ const styles = (pref: TPref, h: string) =>
 		},
 		// Success Modal
 		successModalView: {
-			width: '90%',
+			width: "90%",
 			borderRadius: 20,
 		},
 		promptModalView: {
-			width: '90%',
+			width: "90%",
 			borderRadius: 20,
 			borderWidth: 3,
 			borderColor: hi[h],
 			padding: 20,
 		},
 		invoiceAmountModalView: {
-			width: '100%',
-			height: '100%',
+			width: "100%",
+			height: "100%",
 			padding: 20,
-			justifyContent: 'space-between',
+			justifyContent: "space-between",
 		},
 		contactList: {
 			paddingHorizontal: 0,