From a0380e43f2cf2cec5bc71810b4f62efd3b7611a9 Mon Sep 17 00:00:00 2001 From: Andrew Weber Date: Wed, 21 Jun 2023 17:47:38 -0400 Subject: [PATCH] feat: addign to prettierrc --- .prettierrc.json | 5 +- src/components/modal/index.tsx | 92 ++++++++++++---------------------- 2 files changed, 37 insertions(+), 60 deletions(-) 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 ? ( - - - - {children} - + + + {children} @@ -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,