From 466c99c34e773627e07ace7de3566310d5b4ac76 Mon Sep 17 00:00:00 2001 From: katayama800 Date: Fri, 14 Jun 2024 00:19:20 +0900 Subject: [PATCH] refactor --- app/(auth)/sign-in.tsx | 10 ++++------ app/(modal)/payment-modal.tsx | 8 ++++---- app/(tabs)/_layout.tsx | 4 ++-- app/(tabs)/index.tsx | 18 +++++++++--------- app/(tabs)/past-invoices.tsx | 24 ++++++++++++------------ app/_layout.tsx | 2 +- app/hooks/useInvoice.ts | 14 +++++++------- app/hooks/usePayment.ts | 10 +++++----- app/past-invoice-details.tsx | 14 +++++++------- lib/supabase.ts | 2 +- 10 files changed, 52 insertions(+), 54 deletions(-) diff --git a/app/(auth)/sign-in.tsx b/app/(auth)/sign-in.tsx index f42eee8..a12b013 100644 --- a/app/(auth)/sign-in.tsx +++ b/app/(auth)/sign-in.tsx @@ -4,23 +4,21 @@ import { defaultFontSize, defaultFontWeight } from "@/style/defaultStyle"; import { useRouter } from "expo-router"; import React, { useState } from "react"; import { - Alert, + ActivityIndicator, KeyboardAvoidingView, + Platform, ScrollView, StyleSheet, - TextInput, - View, Text, - Platform, + TextInput, TouchableOpacity, - ActivityIndicator, + View, } from "react-native"; const SignInScreen = () => { const [email, setEmail] = useState(""); const [password, setPassword] = useState(""); const [loading, setLoading] = useState(false); - const { push } = useRouter(); const signInWithEmail = async () => { setLoading(true); diff --git a/app/(modal)/payment-modal.tsx b/app/(modal)/payment-modal.tsx index 251086e..d394e79 100644 --- a/app/(modal)/payment-modal.tsx +++ b/app/(modal)/payment-modal.tsx @@ -1,9 +1,9 @@ -import React, { useEffect } from "react"; -import { Platform, StyleSheet, Text, TextInput, View, SafeAreaView, TouchableOpacity } from "react-native"; -import { usePayment } from "../hooks/usePayment"; -import { useLocalSearchParams, useNavigation } from "expo-router"; import { Colors } from "@/constants/Colors"; import { defaultFontSize } from "@/style/defaultStyle"; +import { useLocalSearchParams, useNavigation } from "expo-router"; +import React, { useEffect } from "react"; +import { Platform, SafeAreaView, StyleSheet, Text, TextInput, TouchableOpacity, View } from "react-native"; +import { usePayment } from "../hooks/usePayment"; export default function PaymentModalScreen() { const { payments, addPayment, updatePayment, setName, setAmount, name, amount, fetchPaymentsAll } = usePayment(); diff --git a/app/(tabs)/_layout.tsx b/app/(tabs)/_layout.tsx index e5b41a3..1239148 100644 --- a/app/(tabs)/_layout.tsx +++ b/app/(tabs)/_layout.tsx @@ -1,7 +1,7 @@ -import { Tabs } from "expo-router"; -import React from "react"; import { TabBarIcon } from "@/components/navigation/TabBarIcon"; import { Colors } from "@/constants/Colors"; +import { Tabs } from "expo-router"; +import React from "react"; export default function TabLayout() { return ( diff --git a/app/(tabs)/index.tsx b/app/(tabs)/index.tsx index 544a468..40a9fc9 100644 --- a/app/(tabs)/index.tsx +++ b/app/(tabs)/index.tsx @@ -1,16 +1,16 @@ -import { View, Text, FlatList, TouchableOpacity, Alert, StyleSheet } from "react-native"; -import { AntDesign } from "@expo/vector-icons"; -import type { FC } from "react"; -import type { Couple, Payment as PaymentRow } from "@/types/Row"; -import { usePayment } from "../hooks/usePayment"; import { Colors } from "@/constants/Colors"; -import { useRouter } from "expo-router"; -import type { ExpoRouter } from "expo-router/types/expo-router"; +import { supabase } from "@/lib/supabase"; import { defaultFontSize, defaultShadowColor } from "@/style/defaultStyle"; +import type { Couple, Payment as PaymentRow } from "@/types/Row"; +import { AntDesign } from "@expo/vector-icons"; import dayjs from "dayjs"; -import { useInvoice } from "../hooks/useInvoice"; -import { supabase } from "@/lib/supabase"; +import { useRouter } from "expo-router"; +import type { ExpoRouter } from "expo-router/types/expo-router"; +import type { FC } from "react"; +import { Alert, FlatList, StyleSheet, Text, TouchableOpacity, View } from "react-native"; import { useCouple } from "../hooks/useCouple"; +import { useInvoice } from "../hooks/useInvoice"; +import { usePayment } from "../hooks/usePayment"; const HomeScreen: FC = () => { const { payments, isRefreshing, fetchPaymentsAll, deletePayment } = usePayment(); diff --git a/app/(tabs)/past-invoices.tsx b/app/(tabs)/past-invoices.tsx index e9c30ca..e88bab5 100644 --- a/app/(tabs)/past-invoices.tsx +++ b/app/(tabs)/past-invoices.tsx @@ -1,21 +1,21 @@ -import { useRouter } from "expo-router"; -import { useEffect, useState, type FC } from "react"; -import { View, Text, TouchableOpacity, FlatList, ActivityIndicator, StyleSheet } from "react-native"; -import dayjs from "dayjs"; +import { defaultFontSize, defaultShadowColor } from "@/style/defaultStyle"; +import type { Invoice } from "@/types/Row"; import { MaterialIcons } from "@expo/vector-icons"; +import dayjs from "dayjs"; +import { useRouter } from "expo-router"; +import type { ExpoRouter } from "expo-router/types/expo-router"; +import { type FC, useEffect, useState } from "react"; +import { ActivityIndicator, FlatList, StyleSheet, Text, TouchableOpacity, View } from "react-native"; import { useInvoice } from "../hooks/useInvoice"; import { usePayment } from "../hooks/usePayment"; -import type { ExpoRouter } from "expo-router/types/expo-router"; -import type { Invoice } from "@/types/Row"; -import { defaultFontSize, defaultShadowColor } from "@/style/defaultStyle"; const PastInvoicesScreen = () => { - const { invoices, isRefreshing, fetchInvoices } = useInvoice(); + const { invoices, isRefreshing, fetchInvoicesAll } = useInvoice(); const { push } = useRouter(); // biome-ignore lint/correctness/useExhaustiveDependencies: useEffect(() => { - fetchInvoices(); + fetchInvoicesAll(); }, []); return ( @@ -32,7 +32,7 @@ const PastInvoicesScreen = () => { ItemSeparatorComponent={() => } ListEmptyComponent={() => No items} contentContainerStyle={{ paddingBottom: 100 }} - onRefresh={fetchInvoices} + onRefresh={fetchInvoicesAll} refreshing={isRefreshing} /> @@ -46,12 +46,12 @@ type MonthlyInvoiceProps = { const MonthlyInvoice: FC = ({ invoice, routerPush }) => { const [totalAmount, setTotalAmount] = useState(null); - const { getTotalPayment } = usePayment(); + const { fetchPaymentTotal } = usePayment(); // biome-ignore lint/correctness/useExhaustiveDependencies: useEffect(() => { const fetchData = async () => { - const totalAmount = await getTotalPayment(invoice.id); + const totalAmount = await fetchPaymentTotal(invoice.id); setTotalAmount(totalAmount); }; fetchData(); diff --git a/app/_layout.tsx b/app/_layout.tsx index e3c222f..1c1b8f0 100644 --- a/app/_layout.tsx +++ b/app/_layout.tsx @@ -24,7 +24,7 @@ export default function RootLayout() { }, [loaded]); const authState = () => { - supabase.auth.onAuthStateChange((event, session) => { + supabase.auth.onAuthStateChange((event, _session) => { switch (event) { case "SIGNED_IN": push({ pathname: "/" }); diff --git a/app/hooks/useInvoice.ts b/app/hooks/useInvoice.ts index 2bbc008..766a14e 100644 --- a/app/hooks/useInvoice.ts +++ b/app/hooks/useInvoice.ts @@ -1,23 +1,23 @@ +import { dev_monthly_invoices } from "@/constants/Table"; import { supabase } from "@/lib/supabase"; -import { useAtom } from "jotai"; -import { useState, useCallback } from "react"; -import { invoiceAtom } from "../state/invoice.state"; import type { Invoice } from "@/types/Row"; -import { dev_monthly_invoices } from "@/constants/Table"; import dayjs from "dayjs"; +import { useAtom } from "jotai"; +import { useCallback, useState } from "react"; +import { invoiceAtom } from "../state/invoice.state"; export const useInvoice = () => { const [invoices, setInvoices] = useAtom(invoiceAtom); const [isRefreshing, setIsRefreshing] = useState(false); - const getCurrentMonthInvoice = useCallback((invoices: Invoice[]): Invoice | undefined => { + const fetchCurrentMonthInvoice = useCallback((invoices: Invoice[]): Invoice | undefined => { return invoices.find( (invoice) => dayjs(invoice.created_at).month() === dayjs().month() && dayjs(invoice.created_at).year() === dayjs().year(), ); }, []); - const getActiveInvoice = async () => { + const fetchActiveInvoice = async () => { const { data, error } = await supabase.from(dev_monthly_invoices).select("*").eq("active", true); if (error) throw error; @@ -99,7 +99,7 @@ export const useInvoice = () => { fetchInvoicesAll, fetchInvoiceByCoupleId, addInvoice, - getActiveInvoice, + fetchActiveInvoice, unActiveInvoicesAll, turnInvoicePaid, }; diff --git a/app/hooks/usePayment.ts b/app/hooks/usePayment.ts index f5cd22a..221709a 100644 --- a/app/hooks/usePayment.ts +++ b/app/hooks/usePayment.ts @@ -1,13 +1,13 @@ import { dev_payments } from "@/constants/Table"; import { supabase } from "@/lib/supabase"; +import type { Invoice, Payment } from "@/types/Row"; import dayjs from "dayjs"; import { useRouter } from "expo-router"; import { useAtom } from "jotai"; -import { useEffect, useState, useCallback } from "react"; +import { useCallback, useEffect, useState } from "react"; import { paymentsAtom } from "../state/payment.state"; -import type { Invoice, Payment } from "@/types/Row"; -import { useInvoice } from "./useInvoice"; import { useCouple } from "./useCouple"; +import { useInvoice } from "./useInvoice"; export const usePayment = () => { const [payments, setPayments] = useAtom(paymentsAtom); @@ -147,7 +147,7 @@ export const usePayment = () => { [fetchPaymentsAll], ); - const fetchPaymentToal = async (monthly_invoice_id: Payment["monthly_invoice_id"]) => { + const fetchPaymentTotal = async (monthly_invoice_id: Payment["monthly_invoice_id"]) => { const { data, error } = await supabase .from(dev_payments) .select("amount") @@ -180,7 +180,7 @@ export const usePayment = () => { fetchPaymentById, updatePayment, deletePayment, - fetchPaymentToal, + fetchPaymentTotal, fetchPaymentsByMonthlyInvoiceId, }; }; diff --git a/app/past-invoice-details.tsx b/app/past-invoice-details.tsx index 53631f8..223b2a4 100644 --- a/app/past-invoice-details.tsx +++ b/app/past-invoice-details.tsx @@ -1,16 +1,16 @@ -import { useLocalSearchParams, useNavigation } from "expo-router"; -import { useEffect, useState } from "react"; -import { StyleSheet, View, Text, FlatList } from "react-native"; -import dayjs from "dayjs"; import { Colors } from "@/constants/Colors"; +import { defaultFontSize, defaultShadowColor } from "@/style/defaultStyle"; import type { Payment } from "@/types/Row"; +import dayjs from "dayjs"; +import { useLocalSearchParams, useNavigation } from "expo-router"; +import { useEffect, useState } from "react"; +import { FlatList, StyleSheet, Text, View } from "react-native"; import { usePayment } from "./hooks/usePayment"; -import { defaultFontSize, defaultShadowColor } from "@/style/defaultStyle"; export default function PastInvoiceDetailsScreen() { const [payments, setPayments] = useState([]); const { id, date } = useLocalSearchParams(); - const { getPaymentsByMonthlyInvoiceId } = usePayment(); + const { fetchPaymentsByMonthlyInvoiceId } = usePayment(); const { setOptions } = useNavigation(); useEffect(() => { if (typeof date === "string") { @@ -22,7 +22,7 @@ export default function PastInvoiceDetailsScreen() { useEffect(() => { (async () => { if (typeof id === "string") { - const data = await getPaymentsByMonthlyInvoiceId(Number(id)); + const data = await fetchPaymentsByMonthlyInvoiceId(Number(id)); if (data) { setPayments(data); } diff --git a/lib/supabase.ts b/lib/supabase.ts index e2dac8f..712ffa2 100644 --- a/lib/supabase.ts +++ b/lib/supabase.ts @@ -1,7 +1,7 @@ import "react-native-url-polyfill/auto"; +import type { Database } from "@/types/supabase"; import AsyncStorage from "@react-native-async-storage/async-storage"; import { createClient } from "@supabase/supabase-js"; -import type { Database } from "@/types/supabase"; const supabaseUrl = "https://jqovxmsueffhddmyqcew.supabase.co"; const supabaseKey = process.env.EXPO_PUBLIC_SUPABASE_KEY;