logic for writing to db after adding receipt item
This commit is contained in:
parent
54948fd695
commit
ebc400b908
7 changed files with 1116 additions and 3945 deletions
5
.gitignore
vendored
5
.gitignore
vendored
|
@ -18,6 +18,7 @@
|
|||
# misc
|
||||
.DS_Store
|
||||
*.pem
|
||||
.vscode
|
||||
|
||||
# debug
|
||||
npm-debug.log*
|
||||
|
@ -26,7 +27,9 @@ yarn-error.log*
|
|||
.pnpm-debug.log*
|
||||
|
||||
# local env files
|
||||
.env*.local
|
||||
.env*
|
||||
.local
|
||||
|
||||
|
||||
# vercel
|
||||
.vercel
|
||||
|
|
17
lib/getMongoDBClient.ts
Normal file
17
lib/getMongoDBClient.ts
Normal file
|
@ -0,0 +1,17 @@
|
|||
import { MongoClient } from 'mongodb';
|
||||
|
||||
const USERNAME = process.env.MONGO_USERNAME
|
||||
const PASSWORD = process.env.MONGO_PASSWORD
|
||||
const HOSTNAME = process.env.MONGO_HOSTNAME
|
||||
|
||||
const URI =
|
||||
`mongodb://${USERNAME}:${PASSWORD}@${HOSTNAME ?? 'localhost'}:3001`;
|
||||
|
||||
export const getMongoDBClient = async () => {
|
||||
const client = new MongoClient(URI);
|
||||
|
||||
await client.connect();
|
||||
const receiptdb = client.db("receipt");
|
||||
|
||||
return receiptdb.collection('receipt');
|
||||
}
|
4958
package-lock.json
generated
4958
package-lock.json
generated
File diff suppressed because it is too large
Load diff
|
@ -12,6 +12,7 @@
|
|||
"@reduxjs/toolkit": "^1.8.6",
|
||||
"bootstrap": "^5.2.2",
|
||||
"jotai": "^1.8.6",
|
||||
"mongodb": "^4.11.0",
|
||||
"next": "12.3.1",
|
||||
"react": "18.2.0",
|
||||
"react-bootstrap": "^2.5.0",
|
||||
|
|
|
@ -1,13 +0,0 @@
|
|||
// Next.js API route support: https://nextjs.org/docs/api-routes/introduction
|
||||
import type { NextApiRequest, NextApiResponse } from 'next'
|
||||
|
||||
type Data = {
|
||||
name: string
|
||||
}
|
||||
|
||||
export default function handler(
|
||||
req: NextApiRequest,
|
||||
res: NextApiResponse<Data>
|
||||
) {
|
||||
res.status(200).json({ name: 'John Doesdfsdf' })
|
||||
}
|
20
pages/api/updateReceipt.ts
Normal file
20
pages/api/updateReceipt.ts
Normal file
|
@ -0,0 +1,20 @@
|
|||
import type { NextApiRequest, NextApiResponse } from 'next'
|
||||
import { getMongoDBClient } from '../../lib/getMongoDBClient';
|
||||
|
||||
|
||||
export default async function handler(
|
||||
req: NextApiRequest,
|
||||
res: NextApiResponse<Record<string, string>[] | Record<string, string>>
|
||||
) {
|
||||
const receipt = req.body;
|
||||
const client = await getMongoDBClient();
|
||||
|
||||
console.log('called', receipt);
|
||||
|
||||
try {
|
||||
// TODO implement this
|
||||
res.status(200).json(receipt);
|
||||
} catch (e) {
|
||||
res.status(500).json({message: (e as Error).message});
|
||||
}
|
||||
}
|
|
@ -1,5 +1,6 @@
|
|||
import { useAtom } from "jotai";
|
||||
import { useAtom, atom } from "jotai";
|
||||
import type { NextPage } from "next";
|
||||
import { useEffect, useRef } from "react";
|
||||
import { SyntheticEvent, useState } from "react";
|
||||
import { Form } from "react-bootstrap";
|
||||
import NumberEditBox from "../components/NumberEditBox";
|
||||
|
@ -18,19 +19,61 @@ const Home: NextPage = () => {
|
|||
const [input, setInput] = useState("");
|
||||
const [total] = useAtom(totalAtom);
|
||||
const [calculated] = useAtom(receiptTotalAtom);
|
||||
const isAddCalled = useRef(false);
|
||||
|
||||
const [receiptJson] = useAtom(
|
||||
atom((get) => {
|
||||
const receiptJson: any[] = [];
|
||||
for (const itemAtom of receipt) {
|
||||
const receiptItemFromAtom = get(itemAtom);
|
||||
const splitBetweenArray = get(receiptItemFromAtom.splitBetween).map(
|
||||
(personAtom) => ({
|
||||
name: get(get(personAtom).name),
|
||||
})
|
||||
);
|
||||
const receiptItemParsed = {
|
||||
name: get(receiptItemFromAtom.name),
|
||||
price: get(receiptItemFromAtom.price),
|
||||
splitBetween: splitBetweenArray,
|
||||
};
|
||||
receiptJson.push(receiptItemParsed);
|
||||
}
|
||||
|
||||
return receiptJson;
|
||||
})
|
||||
);
|
||||
|
||||
const formatter = new Intl.NumberFormat("en-US", {
|
||||
style: "currency",
|
||||
currency: "USD",
|
||||
});
|
||||
|
||||
const add = (e: SyntheticEvent) => {
|
||||
const add = async (e: SyntheticEvent) => {
|
||||
e.preventDefault();
|
||||
isAddCalled.current = true;
|
||||
|
||||
addLine(input, receipt, setReceipt);
|
||||
setInput("");
|
||||
return false;
|
||||
};
|
||||
|
||||
const receiptJSONString = JSON.stringify(receiptJson);
|
||||
console.log("ASDFASDF", receiptJSONString);
|
||||
|
||||
useEffect(() => {
|
||||
const updateDb = async () => {
|
||||
const response = await fetch("/api/createReceipt", {
|
||||
method: "POST",
|
||||
body: JSON.stringify({ receipts: receiptJson }),
|
||||
});
|
||||
console.log(receiptJSONString);
|
||||
};
|
||||
|
||||
if (isAddCalled.current) {
|
||||
updateDb();
|
||||
}
|
||||
}, [receiptJSONString]);
|
||||
|
||||
return (
|
||||
<main>
|
||||
<h1>Items</h1>
|
||||
|
|
Loading…
Reference in a new issue