From ef167a6c37b39e8c1e179491cae68f23dc82caac Mon Sep 17 00:00:00 2001 From: Ruidy Date: Fri, 16 Jul 2021 16:40:32 +0200 Subject: [PATCH] feat: edit bill --- src/api/index.ts | 16 +++++++++++++--- src/pages/bill/index.tsx | 28 +++++++++++++++++++--------- 2 files changed, 32 insertions(+), 12 deletions(-) diff --git a/src/api/index.ts b/src/api/index.ts index d7ec82b..f9b4b14 100644 --- a/src/api/index.ts +++ b/src/api/index.ts @@ -4,6 +4,11 @@ import { Bill, BillFormType } from '../types/bill'; const BASE_URL = process.env.REACT_APP_API_URL; const client = axios.create({ baseURL: BASE_URL }); +type Response = { + data?: T; + error?: any; +}; + export const createBill = async (data: BillFormType) => { try { const { data: response } = await client.post('/', data); @@ -14,9 +19,14 @@ export const createBill = async (data: BillFormType) => { } }; -type Response = { - data?: T; - error?: any; +export const updateBill = async (id: number, data: BillFormType): Promise> => { + try { + const { data: response } = await client.put(`/${id}`, data); + return { data: response }; + } catch (error) { + console.error(error); + return { error }; + } }; const billFrom = (bill: any): Bill => diff --git a/src/pages/bill/index.tsx b/src/pages/bill/index.tsx index 0bee6e4..1d3d707 100644 --- a/src/pages/bill/index.tsx +++ b/src/pages/bill/index.tsx @@ -1,8 +1,8 @@ import { Button, Col, Divider, message, PageHeader, Space, Typography } from 'antd'; -import { useEffect, useState } from 'react'; +import { useCallback, useEffect, useState } from 'react'; import { useForm } from 'react-hook-form'; import { useHistory, useParams } from 'react-router-dom'; -import { createBill, fetchOneBill, sendBillAsPDF } from '../../api'; +import { fetchOneBill, sendBillAsPDF, updateBill } from '../../api'; import { BillForm } from '../../components/billForm'; import { withLayout } from '../../layouts/main'; import { Bill, BillFormType } from '../../types/bill'; @@ -12,7 +12,7 @@ export type QueryParams = { id: string }; const BillPage = () => { // Hooks - const { id } = useParams(); + let { id } = useParams(); const history = useHistory(); const { handleSubmit, control, reset } = useForm(); @@ -22,17 +22,22 @@ const BillPage = () => { const [bill, setBill] = useState({} as Bill); // Effects - useEffect(() => { - (async (id: string) => { + const loadBill = useCallback( + async (id: string) => { const billID = parseInt(id); const { data: loadedBill, error } = await fetchOneBill(billID); - if (loadedBill && error) { + if (loadedBill && !error) { setBill(() => loadedBill); const { id, ...values } = loadedBill; reset(values); } - })(id); - }, [id, reset]); + }, + [reset] + ); + + useEffect(() => { + loadBill(id); + }, [id, loadBill, reset]); // Logic const handleSendPDF = (id: number) => { @@ -42,7 +47,12 @@ const BillPage = () => { }; const onSubmit = handleSubmit(async (data) => { - await createBill(data); + const { error } = await updateBill(parseInt(id), data); + if (error) { + message.error(`Update failed because of ${error}`); + } + setEdit(() => false); + loadBill(id); }); const content = edit ? (