Merge pull request #27 from the-collab-lab/mm-qg-predict-next-purchase

Mm qg predict next purchase

package.json

@@ -7,6 +7,7 @@
 		"npm": ">=8.19.0"
 	},
 	"dependencies": {
+		"@the-collab-lab/shopping-list-utils": "^2.2.0",
 		"firebase": "^10.12.5",
 		"react": "^18.3.1",
 		"react-dom": "^18.3.1",

src/api/firebase.js

@@ -7,11 +7,14 @@ import {
 	onSnapshot,
 	updateDoc,
 	addDoc,
+	Timestamp,
 } from 'firebase/firestore';
 import { useEffect, useState } from 'react';
 import { db } from './config';
 import { getFutureDate } from '../utils';
 import toast from 'react-hot-toast';
+import { calculateEstimate } from '@the-collab-lab/shopping-list-utils';
+import { getDaysBetweenDates } from '../utils/dates';
 /**
  * A custom hook that subscribes to the user's shopping lists in our Firestore
  * database and returns new data whenever the lists change.
@@ -181,26 +184,43 @@ export async function addItem(listPath, { itemName, daysUntilNextPurchase }) {
 		// We'll use updateItem to put a Date here when the item is purchased!
 		dateLastPurchased: null,
 		dateNextPurchased: getFutureDate(daysUntilNextPurchase),
+		dayInterval: daysUntilNextPurchase,
 		name: itemName,
 		totalPurchases: 0,
 		checked: false,
 	});
 }
 
-export async function updateItem(listPath, id, checked) {
+// checked is coming from the handleOnChange function in the ListItem.jsx,so it is not part of the item data.
+export async function updateItem(listPath, checked, itemData) {
+	const { id } = itemData;
 	const listCollectionRef = collection(db, listPath, 'items');
 	const itemRef = doc(listCollectionRef, id);
+	const today = new Date();
+	const currentTotalPurchases = itemData.totalPurchases;
+	const currentDayInterval = itemData.dayInterval;
+	const dateLastPurchasedJavaScriptObject = itemData.dateLastPurchased
+		? itemData.dateLastPurchased.toDate()
+		: itemData.dateCreated.toDate();
+
+	const daysSinceLastPurchase = getDaysBetweenDates(
+		today,
+		dateLastPurchasedJavaScriptObject,
+	);
+	const estimate = calculateEstimate(
+		currentDayInterval,
+		daysSinceLastPurchase,
+		currentTotalPurchases,
+	);
 
 	try {
-		const itemDoc = await getDoc(itemRef);
-		const data = itemDoc.data();
-		const currentTotalPurchases = data.totalPurchases;
-
 		if (checked) {
 			await updateDoc(itemRef, {
-				dateLastPurchased: new Date(),
+				dateLastPurchased: today,
 				totalPurchases: currentTotalPurchases + 1,
 				checked: checked,
+				dayInterval: daysSinceLastPurchase,
+				dateNextPurchased: getFutureDate(estimate),
 			});
 		} else {
 			await updateDoc(itemRef, {

src/components/ListItem.jsx

@@ -3,20 +3,41 @@ import { updateItem } from '../api';
 import { useEffect } from 'react';
 import { ONE_DAY_IN_MILLISECONDS } from '../utils/dates';
 
-export function ListItem({ name, listPath, id, isChecked, datePurchased }) {
+export function ListItem({
+	listPath,
+	name,
+	id,
+	isChecked,
+	dateLastPurchased,
+	totalPurchases,
+	dayInterval,
+	dateCreated,
+}) {
 	const handleOnChange = async (event) => {
 		let { checked } = event.target;
 		if (!checked) return;
 
-		await updateItem(listPath, id, checked);
+		await updateItem(listPath, checked, {
+			id,
+			dateLastPurchased,
+			totalPurchases,
+			dayInterval,
+			dateCreated,
+		});
 	};
 
 	useEffect(() => {
 		const today = new Date().getTime();
-		const datePurchasedInMillis = datePurchased?.toMillis();
+		const datePurchasedInMillis = dateLastPurchased?.toMillis();
 
 		if (isChecked && today - datePurchasedInMillis >= ONE_DAY_IN_MILLISECONDS) {
-			updateItem(listPath, id, !isChecked);
+			updateItem(listPath, !isChecked, {
+				id,
+				dateLastPurchased,
+				totalPurchases,
+				dayInterval,
+				dateCreated,
+			});
 		}
 	}, []);
 

src/utils/dates.js

@@ -10,3 +10,11 @@ export const ONE_DAY_IN_MILLISECONDS = 86400000;
 export function getFutureDate(offset) {
 	return new Date(Date.now() + offset * ONE_DAY_IN_MILLISECONDS);
 }
+export function getDaysBetweenDates(startDate, endDate) {
+	const differenceInMillis = startDate.getTime() - endDate.getTime();
+	const daysSinceLastPurchase =
+		Math.round(differenceInMillis / ONE_DAY_IN_MILLISECONDS) === 0
+			? 1
+			: Math.round(differenceInMillis / ONE_DAY_IN_MILLISECONDS);
+	return daysSinceLastPurchase;
+}

src/views/List.jsx

@@ -27,7 +27,10 @@ export function List({ data, listPath }) {
 						listPath={listPath}
 						id={item.id}
 						isChecked={item.checked}
-						datePurchased={item.dateLastPurchased}
+						dateLastPurchased={item.dateLastPurchased}
+						totalPurchases={item.totalPurchases}
+						dayInterval={item.dayInterval}
+						dateCreated={item.dateCreated}
 					/>
 				))}
 			</ul>