enh
This commit is contained in:
shafi54
parent
aa900db3e1
commit
ca9eb8a7d2
34 changed files with 863 additions and 901 deletions
4
APIS_TO_REMOVE.md
Normal file
4
APIS_TO_REMOVE.md
Normal file
|
|
@ -0,0 +1,4 @@
|
|||
- trpc.user.tags.getTagsByStore — apps/backend/src/trpc/apis/user-apis/apis/tags.ts
|
||||
- trpc.common.product.getAllProductsSummary — apps/backend/src/trpc/apis/common-apis/common.ts
|
||||
- remove slots from products cache
|
||||
- remove redundant product details like name, description etc from the slots api
|
||||
|
|
@ -21,7 +21,7 @@ S3_BUCKET_NAME=meatfarmer
|
|||
EXPO_ACCESS_TOKEN=Asvpy8cByRh6T4ksnWScO6PLcio2n35-BwES5zK-
|
||||
JWT_SECRET=my_meatfarmer_jwt_secret_key
|
||||
ASSETS_DOMAIN=https://assets.freshyo.in/
|
||||
API_CACHE_KEY='api-cache'
|
||||
API_CACHE_KEY=api-cache-dev
|
||||
# REDIS_URL=redis://default:redis_shafi_password@5.223.55.14:6379
|
||||
REDIS_URL=redis://default:redis_shafi_password@57.128.212.174:6379
|
||||
APP_URL=http://localhost:4000
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
|
|
@ -2,8 +2,13 @@ import { scaffoldProducts } from '@/src/trpc/apis/common-apis/common'
|
|||
import { scaffoldEssentialConsts } from '@/src/trpc/apis/common-apis/common-trpc-index'
|
||||
import { scaffoldStores } from '@/src/trpc/apis/user-apis/apis/stores'
|
||||
import { scaffoldSlotsWithProducts } from '@/src/trpc/apis/user-apis/apis/slots'
|
||||
import { scaffoldBanners } from '@/src/trpc/apis/user-apis/apis/banners'
|
||||
import { scaffoldStoreWithProducts } from '@/src/trpc/apis/user-apis/apis/stores'
|
||||
import { storeInfo } from '@/src/db/schema'
|
||||
import { db } from '@/src/db/db_index'
|
||||
import { imageUploadS3 } from '@/src/lib/s3-client'
|
||||
import { apiCacheKey } from '@/src/lib/env-exporter'
|
||||
import { CACHE_FILENAMES } from '@packages/shared'
|
||||
|
||||
export async function createProductsFile(): Promise<string> {
|
||||
// Get products data from the API method
|
||||
|
|
@ -16,7 +21,7 @@ export async function createProductsFile(): Promise<string> {
|
|||
const buffer = Buffer.from(jsonContent, 'utf-8')
|
||||
|
||||
// Upload to S3 at the specified path using apiCacheKey
|
||||
const s3Key = await imageUploadS3(buffer, 'application/json', `${apiCacheKey}/products.json`)
|
||||
const s3Key = await imageUploadS3(buffer, 'application/json', `${apiCacheKey}/${CACHE_FILENAMES.products}`)
|
||||
|
||||
return s3Key
|
||||
}
|
||||
|
|
@ -32,7 +37,7 @@ export async function createEssentialConstsFile(): Promise<string> {
|
|||
const buffer = Buffer.from(jsonContent, 'utf-8')
|
||||
|
||||
// Upload to S3 at the specified path using apiCacheKey
|
||||
const s3Key = await imageUploadS3(buffer, 'application/json', `${apiCacheKey}/essential-consts.json`)
|
||||
const s3Key = await imageUploadS3(buffer, 'application/json', `${apiCacheKey}/${CACHE_FILENAMES.essentialConsts}`)
|
||||
|
||||
return s3Key
|
||||
}
|
||||
|
|
@ -48,7 +53,7 @@ export async function createStoresFile(): Promise<string> {
|
|||
const buffer = Buffer.from(jsonContent, 'utf-8')
|
||||
|
||||
// Upload to S3 at the specified path using apiCacheKey
|
||||
const s3Key = await imageUploadS3(buffer, 'application/json', `${apiCacheKey}/stores.json`)
|
||||
const s3Key = await imageUploadS3(buffer, 'application/json', `${apiCacheKey}/${CACHE_FILENAMES.stores}`)
|
||||
|
||||
return s3Key
|
||||
}
|
||||
|
|
@ -64,7 +69,52 @@ export async function createSlotsFile(): Promise<string> {
|
|||
const buffer = Buffer.from(jsonContent, 'utf-8')
|
||||
|
||||
// Upload to S3 at the specified path using apiCacheKey
|
||||
const s3Key = await imageUploadS3(buffer, 'application/json', `${apiCacheKey}/slots.json`)
|
||||
const s3Key = await imageUploadS3(buffer, 'application/json', `${apiCacheKey}/${CACHE_FILENAMES.slots}`)
|
||||
|
||||
return s3Key
|
||||
}
|
||||
|
||||
export async function createBannersFile(): Promise<string> {
|
||||
// Get banners data from the API method
|
||||
const bannersData = await scaffoldBanners()
|
||||
|
||||
// Convert to JSON string with pretty formatting
|
||||
const jsonContent = JSON.stringify(bannersData, null, 2)
|
||||
|
||||
// Convert to Buffer for S3 upload
|
||||
const buffer = Buffer.from(jsonContent, 'utf-8')
|
||||
|
||||
// Upload to S3 at the specified path using apiCacheKey
|
||||
const s3Key = await imageUploadS3(buffer, 'application/json', `${apiCacheKey}/${CACHE_FILENAMES.banners}`)
|
||||
|
||||
return s3Key
|
||||
}
|
||||
|
||||
export async function createStoreFile(storeId: number): Promise<string> {
|
||||
// Get store data from the API method
|
||||
const storeData = await scaffoldStoreWithProducts(storeId)
|
||||
|
||||
// Convert to JSON string with pretty formatting
|
||||
const jsonContent = JSON.stringify(storeData, null, 2)
|
||||
|
||||
// Convert to Buffer for S3 upload
|
||||
const buffer = Buffer.from(jsonContent, 'utf-8')
|
||||
|
||||
// Upload to S3 at the specified path using apiCacheKey
|
||||
const s3Key = await imageUploadS3(buffer, 'application/json', `${apiCacheKey}/stores/${storeId}.json`)
|
||||
|
||||
return s3Key
|
||||
}
|
||||
|
||||
export async function createAllStoresFiles(): Promise<string[]> {
|
||||
// Fetch all store IDs from database
|
||||
const stores = await db.select({ id: storeInfo.id }).from(storeInfo)
|
||||
|
||||
// Create cache files for all stores in parallel
|
||||
const results = await Promise.all(
|
||||
stores.map(store => createStoreFile(store.id))
|
||||
)
|
||||
|
||||
console.log(`Created ${results.length} store cache files`)
|
||||
return results
|
||||
}
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@ import { initializeAllStores } from '@/src/stores/store-initializer'
|
|||
import { initializeUserNegativityStore } from '@/src/stores/user-negativity-store'
|
||||
import { startOrderHandler, startCancellationHandler, publishOrder } from '@/src/lib/post-order-handler'
|
||||
import { deleteOrders } from '@/src/lib/delete-orders'
|
||||
import { createProductsFile, createEssentialConstsFile, createStoresFile, createSlotsFile } from '@/src/lib/cloud_cache'
|
||||
import { createProductsFile, createEssentialConstsFile, createStoresFile, createSlotsFile, createBannersFile, createAllStoresFiles } from '@/src/lib/cloud_cache'
|
||||
|
||||
/**
|
||||
* Initialize all application services
|
||||
|
|
@ -32,6 +32,8 @@ export const initFunc = async (): Promise<void> => {
|
|||
createEssentialConstsFile(),
|
||||
createStoresFile(),
|
||||
createSlotsFile(),
|
||||
createBannersFile(),
|
||||
createAllStoresFiles(),
|
||||
]);
|
||||
console.log('Cache files created successfully');
|
||||
|
||||
|
|
|
|||
|
|
@ -1,38 +1,30 @@
|
|||
import { db } from '@/src/db/db_index';
|
||||
import { homeBanners } from '@/src/db/schema';
|
||||
import { publicProcedure, router } from '@/src/trpc/trpc-index';
|
||||
import { generateSignedUrlFromS3Url } from '@/src/lib/s3-client';
|
||||
import { scaffoldAssetUrl } from '@/src/lib/s3-client';
|
||||
import { isNotNull, asc } from 'drizzle-orm';
|
||||
|
||||
export async function scaffoldBanners() {
|
||||
const banners = await db.query.homeBanners.findMany({
|
||||
where: isNotNull(homeBanners.serialNum), // Only show assigned banners
|
||||
orderBy: asc(homeBanners.serialNum), // Order by slot number 1-4
|
||||
});
|
||||
|
||||
// Convert S3 keys to signed URLs for client
|
||||
const bannersWithSignedUrls = banners.map((banner) => ({
|
||||
...banner,
|
||||
imageUrl: banner.imageUrl ? scaffoldAssetUrl(banner.imageUrl) : banner.imageUrl,
|
||||
}));
|
||||
|
||||
return {
|
||||
banners: bannersWithSignedUrls,
|
||||
};
|
||||
}
|
||||
|
||||
export const bannerRouter = router({
|
||||
getBanners: publicProcedure
|
||||
.query(async () => {
|
||||
const banners = await db.query.homeBanners.findMany({
|
||||
where: isNotNull(homeBanners.serialNum), // Only show assigned banners
|
||||
orderBy: asc(homeBanners.serialNum), // Order by slot number 1-4
|
||||
});
|
||||
|
||||
// Convert S3 keys to signed URLs for client
|
||||
const bannersWithSignedUrls = await Promise.all(
|
||||
banners.map(async (banner) => {
|
||||
try {
|
||||
return {
|
||||
...banner,
|
||||
imageUrl: banner.imageUrl ? await generateSignedUrlFromS3Url(banner.imageUrl) : banner.imageUrl,
|
||||
};
|
||||
} catch (error) {
|
||||
console.error(`Failed to generate signed URL for banner ${banner.id}:`, error);
|
||||
return {
|
||||
...banner,
|
||||
imageUrl: banner.imageUrl, // Keep original on error
|
||||
};
|
||||
}
|
||||
})
|
||||
);
|
||||
|
||||
|
||||
return {
|
||||
banners: bannersWithSignedUrls,
|
||||
};
|
||||
const response = await scaffoldBanners();
|
||||
return response;
|
||||
}),
|
||||
});
|
||||
|
|
|
|||
|
|
@ -43,8 +43,27 @@ export async function scaffoldSlotsWithProducts() {
|
|||
})
|
||||
.sort((a, b) => dayjs(a.deliveryTime).valueOf() - dayjs(b.deliveryTime).valueOf());
|
||||
|
||||
// Fetch all products for availability info
|
||||
const allProducts = await db
|
||||
.select({
|
||||
id: productInfo.id,
|
||||
name: productInfo.name,
|
||||
isOutOfStock: productInfo.isOutOfStock,
|
||||
isFlashAvailable: productInfo.isFlashAvailable,
|
||||
})
|
||||
.from(productInfo)
|
||||
.where(eq(productInfo.isSuspended, false));
|
||||
|
||||
const productAvailability = allProducts.map(product => ({
|
||||
id: product.id,
|
||||
name: product.name,
|
||||
isOutOfStock: product.isOutOfStock,
|
||||
isFlashAvailable: product.isFlashAvailable,
|
||||
}));
|
||||
|
||||
return {
|
||||
slots: validSlots,
|
||||
productAvailability,
|
||||
count: validSlots.length,
|
||||
};
|
||||
}
|
||||
|
|
|
|||
|
|
@ -5,6 +5,7 @@ import { storeInfo, productInfo, units } from '@/src/db/schema';
|
|||
import { eq, and, sql } from 'drizzle-orm';
|
||||
import { scaffoldAssetUrl } from '@/src/lib/s3-client';
|
||||
import { ApiError } from '@/src/lib/api-error';
|
||||
import { getTagsByStoreId } from '@/src/stores/product-tag-store';
|
||||
|
||||
export async function scaffoldStores() {
|
||||
const storesData = await db
|
||||
|
|
@ -66,6 +67,82 @@ export async function scaffoldStores() {
|
|||
};
|
||||
}
|
||||
|
||||
export async function scaffoldStoreWithProducts(storeId: number) {
|
||||
// Fetch store info
|
||||
const storeData = await db.query.storeInfo.findFirst({
|
||||
where: eq(storeInfo.id, storeId),
|
||||
columns: {
|
||||
id: true,
|
||||
name: true,
|
||||
description: true,
|
||||
imageUrl: true,
|
||||
},
|
||||
});
|
||||
|
||||
if (!storeData) {
|
||||
throw new ApiError('Store not found', 404);
|
||||
}
|
||||
|
||||
// Generate signed URL for store image
|
||||
const signedImageUrl = storeData.imageUrl ? scaffoldAssetUrl(storeData.imageUrl) : null;
|
||||
|
||||
// Fetch products for this store
|
||||
const productsData = await db
|
||||
.select({
|
||||
id: productInfo.id,
|
||||
name: productInfo.name,
|
||||
shortDescription: productInfo.shortDescription,
|
||||
price: productInfo.price,
|
||||
marketPrice: productInfo.marketPrice,
|
||||
images: productInfo.images,
|
||||
isOutOfStock: productInfo.isOutOfStock,
|
||||
incrementStep: productInfo.incrementStep,
|
||||
unitShortNotation: units.shortNotation,
|
||||
unitNotation: units.shortNotation,
|
||||
productQuantity: productInfo.productQuantity,
|
||||
})
|
||||
.from(productInfo)
|
||||
.innerJoin(units, eq(productInfo.unitId, units.id))
|
||||
.where(and(eq(productInfo.storeId, storeId), eq(productInfo.isSuspended, false)));
|
||||
|
||||
|
||||
// Generate signed URLs for product images
|
||||
const productsWithSignedUrls = await Promise.all(
|
||||
productsData.map(async (product) => ({
|
||||
id: product.id,
|
||||
name: product.name,
|
||||
shortDescription: product.shortDescription,
|
||||
price: product.price,
|
||||
marketPrice: product.marketPrice,
|
||||
incrementStep: product.incrementStep,
|
||||
unit: product.unitShortNotation,
|
||||
unitNotation: product.unitNotation,
|
||||
images: scaffoldAssetUrl((product.images as string[]) || []),
|
||||
isOutOfStock: product.isOutOfStock,
|
||||
productQuantity: product.productQuantity
|
||||
}))
|
||||
);
|
||||
|
||||
const tags = await getTagsByStoreId(storeId);
|
||||
|
||||
return {
|
||||
store: {
|
||||
id: storeData.id,
|
||||
name: storeData.name,
|
||||
description: storeData.description,
|
||||
signedImageUrl,
|
||||
},
|
||||
products: productsWithSignedUrls,
|
||||
tags: tags.map(tag => ({
|
||||
id: tag.id,
|
||||
tagName: tag.tagName,
|
||||
tagDescription: tag.tagDescription,
|
||||
imageUrl: tag.imageUrl,
|
||||
productIds: tag.productIds,
|
||||
})),
|
||||
};
|
||||
}
|
||||
|
||||
export const storesRouter = router({
|
||||
getStores: publicProcedure
|
||||
.query(async () => {
|
||||
|
|
@ -79,70 +156,7 @@ export const storesRouter = router({
|
|||
}))
|
||||
.query(async ({ input }) => {
|
||||
const { storeId } = input;
|
||||
|
||||
// Fetch store info
|
||||
const storeData = await db.query.storeInfo.findFirst({
|
||||
where: eq(storeInfo.id, storeId),
|
||||
columns: {
|
||||
id: true,
|
||||
name: true,
|
||||
description: true,
|
||||
imageUrl: true,
|
||||
},
|
||||
});
|
||||
|
||||
if (!storeData) {
|
||||
throw new ApiError('Store not found', 404);
|
||||
}
|
||||
|
||||
// Generate signed URL for store image
|
||||
const signedImageUrl = storeData.imageUrl ? scaffoldAssetUrl(storeData.imageUrl) : null;
|
||||
|
||||
// Fetch products for this store
|
||||
const productsData = await db
|
||||
.select({
|
||||
id: productInfo.id,
|
||||
name: productInfo.name,
|
||||
shortDescription: productInfo.shortDescription,
|
||||
price: productInfo.price,
|
||||
marketPrice: productInfo.marketPrice,
|
||||
images: productInfo.images,
|
||||
isOutOfStock: productInfo.isOutOfStock,
|
||||
incrementStep: productInfo.incrementStep,
|
||||
unitShortNotation: units.shortNotation,
|
||||
unitNotation: units.shortNotation,
|
||||
productQuantity: productInfo.productQuantity,
|
||||
})
|
||||
.from(productInfo)
|
||||
.innerJoin(units, eq(productInfo.unitId, units.id))
|
||||
.where(and(eq(productInfo.storeId, storeId), eq(productInfo.isSuspended, false)));
|
||||
|
||||
|
||||
// Generate signed URLs for product images
|
||||
const productsWithSignedUrls = await Promise.all(
|
||||
productsData.map(async (product) => ({
|
||||
id: product.id,
|
||||
name: product.name,
|
||||
shortDescription: product.shortDescription,
|
||||
price: product.price,
|
||||
marketPrice: product.marketPrice,
|
||||
incrementStep: product.incrementStep,
|
||||
unit: product.unitShortNotation,
|
||||
unitNotation: product.unitNotation,
|
||||
images: scaffoldAssetUrl((product.images as string[]) || []),
|
||||
isOutOfStock: product.isOutOfStock,
|
||||
productQuantity: product.productQuantity
|
||||
}))
|
||||
);
|
||||
|
||||
return {
|
||||
store: {
|
||||
id: storeData.id,
|
||||
name: storeData.name,
|
||||
description: storeData.description,
|
||||
signedImageUrl,
|
||||
},
|
||||
products: productsWithSignedUrls,
|
||||
};
|
||||
const response = await scaffoldStoreWithProducts(storeId);
|
||||
return response;
|
||||
}),
|
||||
});
|
||||
|
|
|
|||
|
|
@ -4,9 +4,10 @@ import { adminRouter } from '@/src/trpc/apis/admin-apis/apis/admin-trpc-index'
|
|||
import { userRouter } from '@/src/trpc/apis/user-apis/apis/user-trpc-index'
|
||||
import { commonApiRouter } from '@/src/trpc/apis/common-apis/common-trpc-index'
|
||||
import { scaffoldProducts } from './apis/common-apis/common';
|
||||
import { scaffoldStores } from './apis/user-apis/apis/stores';
|
||||
import { scaffoldStores, scaffoldStoreWithProducts } from './apis/user-apis/apis/stores';
|
||||
import { scaffoldSlotsWithProducts } from './apis/user-apis/apis/slots';
|
||||
import { scaffoldEssentialConsts } from './apis/common-apis/common-trpc-index';
|
||||
import { scaffoldBanners } from './apis/user-apis/apis/banners';
|
||||
|
||||
// Create the main app router
|
||||
export const appRouter = router({
|
||||
|
|
@ -28,3 +29,5 @@ export type AllProductsApiType = Awaited<ReturnType<typeof scaffoldProducts>>;
|
|||
export type StoresApiType = Awaited<ReturnType<typeof scaffoldStores>>;
|
||||
export type SlotsApiType = Awaited<ReturnType<typeof scaffoldSlotsWithProducts>>;
|
||||
export type EssentialConstsApiType = Awaited<ReturnType<typeof scaffoldEssentialConsts>>;
|
||||
export type BannersApiType = Awaited<ReturnType<typeof scaffoldBanners>>;
|
||||
export type StoreWithProductsApiType = Awaited<ReturnType<typeof scaffoldStoreWithProducts>>;
|
||||
|
|
|
|||
|
|
@ -33,6 +33,8 @@
|
|||
"shared-types": ["../shared-types"],
|
||||
"@commonTypes": ["../../packages/ui/shared-types"],
|
||||
"@commonTypes/*": ["../../packages/ui/shared-types/*"],
|
||||
"@packages/shared": ["../../packages/shared"],
|
||||
"@packages/shared/*": ["../../packages/shared/*"]
|
||||
},
|
||||
// "rootDirs": [], /* Allow multiple folders to be treated as one when resolving modules. */
|
||||
// "typeRoots": [""], /* Specify multiple folders that act like './node_modules/@types'. */
|
||||
|
|
@ -116,6 +118,6 @@
|
|||
// "skipDefaultLibCheck": true, /* Skip type checking .d.ts files that are included with TypeScript. */
|
||||
"skipLibCheck": true /* Skip type checking all .d.ts files. */
|
||||
},
|
||||
"include": ["src", "types", "index.ts", "../shared-types"]
|
||||
"include": ["src", "types", "index.ts", "../shared-types", "../../packages/shared"]
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -1,9 +0,0 @@
|
|||
import { Stack } from 'expo-router'
|
||||
|
||||
function DeliverySlotsLayout() {
|
||||
return (
|
||||
<Stack screenOptions={{ headerShown: true, title: 'Delivery Slots' }} />
|
||||
)
|
||||
}
|
||||
|
||||
export default DeliverySlotsLayout
|
||||
|
|
@ -1,230 +0,0 @@
|
|||
import React, { useState } from 'react';
|
||||
import { View, ScrollView } from 'react-native';
|
||||
import { Image } from 'expo-image';
|
||||
import { useRouter } from 'expo-router';
|
||||
import { MyFlatList, MyText, tw, useMarkDataFetchers, BottomDialog, theme, MyTouchableOpacity } from 'common-ui';
|
||||
import { trpc } from '@/src/trpc-client';
|
||||
import MaterialIcons from '@expo/vector-icons/MaterialIcons';
|
||||
import dayjs from 'dayjs';
|
||||
|
||||
export default function DeliverySlots() {
|
||||
const router = useRouter();
|
||||
const { data, isLoading, error, refetch } = trpc.user.slots.getSlotsWithProducts.useQuery();
|
||||
const [selectedSlotForDialog, setSelectedSlotForDialog] = useState<any>(null);
|
||||
|
||||
useMarkDataFetchers(() => {
|
||||
refetch();
|
||||
});
|
||||
|
||||
if (isLoading) {
|
||||
return (
|
||||
<MyFlatList
|
||||
data={[]}
|
||||
renderItem={() => null}
|
||||
ListHeaderComponent={() => (
|
||||
<View style={tw`flex-1 justify-center items-center p-8`}>
|
||||
<MyText style={tw`text-gray-600`}>Loading delivery slots...</MyText>
|
||||
</View>
|
||||
)}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
if (error) {
|
||||
return (
|
||||
<MyFlatList
|
||||
data={[]}
|
||||
renderItem={() => null}
|
||||
ListHeaderComponent={() => (
|
||||
<View style={tw`flex-1 justify-center items-center p-8`}>
|
||||
<MyText style={tw`text-red-600`}>Error loading delivery slots</MyText>
|
||||
<MyTouchableOpacity
|
||||
onPress={() => refetch()}
|
||||
style={tw`mt-4 bg-blue-500 px-4 py-2 rounded-lg`}
|
||||
>
|
||||
<MyText style={tw`text-white font-semibold`}>Retry</MyText>
|
||||
</MyTouchableOpacity>
|
||||
</View>
|
||||
)}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
const slots = data?.slots || [];
|
||||
|
||||
if (slots.length === 0) {
|
||||
return (
|
||||
<MyFlatList
|
||||
data={[]}
|
||||
renderItem={() => null}
|
||||
ListHeaderComponent={() => (
|
||||
<View style={tw`flex-1 justify-center items-center p-8`}>
|
||||
<MaterialIcons name="schedule" size={64} color="#D1D5DB" />
|
||||
<MyText style={tw`text-gray-500 text-center mt-4 text-lg`}>
|
||||
No upcoming delivery slots available
|
||||
</MyText>
|
||||
<MyText style={tw`text-gray-400 text-center mt-2`}>
|
||||
Check back later for new delivery schedules
|
||||
</MyText>
|
||||
</View>
|
||||
)}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<>
|
||||
<MyFlatList
|
||||
data={slots}
|
||||
keyExtractor={(item) => item.id.toString()}
|
||||
// ListHeaderComponent={() => (
|
||||
// <View style={tw`p-4 pb-2`}>
|
||||
// <MyText style={tw`text-2xl font-bold text-gray-800`}>Delivery Slots</MyText>
|
||||
// <MyText style={tw`text-gray-600 mt-1`}>
|
||||
// Choose your preferred delivery time
|
||||
// </MyText>
|
||||
// </View>
|
||||
// )}
|
||||
renderItem={({ item: slot }) => (
|
||||
<View style={tw`mx-4 mb-4 bg-white rounded-xl shadow-md overflow-hidden`}>
|
||||
{/* Slot Header */}
|
||||
<View style={tw`bg-pink-50 p-4 border-b border-pink-100`}>
|
||||
<View style={tw`flex-row items-center justify-between`}>
|
||||
<View>
|
||||
<MyText style={tw`text-lg font-bold text-gray-800`}>
|
||||
{dayjs(slot.deliveryTime).format('ddd DD MMM, h:mm a')}
|
||||
</MyText>
|
||||
<MyText style={tw`text-sm text-gray-600 mt-1`}>
|
||||
Orders close by: {dayjs(slot.freezeTime).format('h:mm a')}
|
||||
</MyText>
|
||||
</View>
|
||||
<View style={tw`flex-row items-center`}>
|
||||
<View style={tw`bg-pink-500 px-3 py-1 rounded-full mr-3`}>
|
||||
<MyText style={tw`text-white text-sm font-semibold`}>
|
||||
{slot.products.length} items
|
||||
</MyText>
|
||||
</View>
|
||||
<MyTouchableOpacity
|
||||
onPress={() => router.push(`/(drawer)/(tabs)/home/cart?slot=${slot.id}`)}
|
||||
style={tw`bg-pink-500 p-2 rounded-full`}
|
||||
>
|
||||
<MaterialIcons name="flash-on" size={16} color="white" />
|
||||
</MyTouchableOpacity>
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
|
||||
{/* Products List */}
|
||||
<View style={tw`p-4`}>
|
||||
<MyText style={tw`text-base font-semibold text-gray-700 mb-3`}>
|
||||
Available Products
|
||||
</MyText>
|
||||
<View style={tw`space-y-2`}>
|
||||
{slot.products.slice(0, 2).map((product) => (
|
||||
<MyTouchableOpacity
|
||||
key={product.id}
|
||||
onPress={() => router.push(`/(drawer)/(tabs)/home/product-detail/${product.id}`)}
|
||||
style={tw`bg-gray-50 rounded-lg p-3 flex-row items-center`}
|
||||
>
|
||||
{product.images && product.images.length > 0 ? (
|
||||
<Image
|
||||
source={{ uri: product.images[0] }}
|
||||
style={tw`w-8 h-8 rounded mr-3`}
|
||||
resizeMode="cover"
|
||||
/>
|
||||
) : (
|
||||
<View style={tw`w-8 h-8 bg-gray-200 rounded mr-3 justify-center items-center`}>
|
||||
<MaterialIcons name="image" size={16} color="#9CA3AF" />
|
||||
</View>
|
||||
)}
|
||||
<View style={tw`flex-1`}>
|
||||
<MyText style={tw`text-sm font-medium text-gray-800`} numberOfLines={1}>
|
||||
{product.name}
|
||||
</MyText>
|
||||
<MyText style={tw`text-xs text-gray-600`}>
|
||||
₹{product.price} {product.unit && `per ${product.unit}`}
|
||||
</MyText>
|
||||
</View>
|
||||
{product.isOutOfStock && (
|
||||
<MyText style={tw`text-xs text-red-500 font-medium`}>Out of stock</MyText>
|
||||
)}
|
||||
</MyTouchableOpacity>
|
||||
))}
|
||||
|
||||
{slot.products.length > 2 && (
|
||||
<MyTouchableOpacity
|
||||
onPress={() => setSelectedSlotForDialog(slot)}
|
||||
style={tw`bg-pink-50 rounded-lg p-3 flex-row items-center justify-center border border-pink-200`}
|
||||
>
|
||||
<MyText style={tw`text-sm font-medium text-pink-700`}>
|
||||
+{slot.products.length - 2} more products
|
||||
</MyText>
|
||||
<MaterialIcons name="chevron-right" size={16} color={theme.colors.brand500} style={tw`ml-1`} />
|
||||
</MyTouchableOpacity>
|
||||
)}
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
)}
|
||||
ListFooterComponent={() => <View style={tw`h-4`} />}
|
||||
showsVerticalScrollIndicator={false}
|
||||
contentContainerStyle={tw`pt-2`}
|
||||
/>
|
||||
|
||||
{/* Products Dialog */}
|
||||
<BottomDialog
|
||||
open={!!selectedSlotForDialog}
|
||||
onClose={() => setSelectedSlotForDialog(null)}
|
||||
>
|
||||
<View style={tw`p-6`}>
|
||||
<MyText style={tw`text-xl font-bold text-gray-800 mb-4`}>
|
||||
All Products - {dayjs(selectedSlotForDialog?.deliveryTime).format('ddd DD MMM, h:mm a')}
|
||||
</MyText>
|
||||
|
||||
<ScrollView style={tw`max-h-96`} showsVerticalScrollIndicator={false}>
|
||||
<View style={tw`space-y-3`}>
|
||||
{selectedSlotForDialog?.products.map((product: any) => (
|
||||
<MyTouchableOpacity
|
||||
key={product.id}
|
||||
onPress={() => {
|
||||
setSelectedSlotForDialog(null);
|
||||
router.push(`/(drawer)/(tabs)/home/product-detail/${product.id}`);
|
||||
}}
|
||||
style={tw`bg-gray-50 rounded-lg p-4 flex-row items-center`}
|
||||
>
|
||||
{product.images && product.images.length > 0 ? (
|
||||
<Image
|
||||
source={{ uri: product.images[0] }}
|
||||
style={tw`w-12 h-12 rounded mr-4`}
|
||||
resizeMode="cover"
|
||||
/>
|
||||
) : (
|
||||
<View style={tw`w-12 h-12 bg-gray-200 rounded mr-4 justify-center items-center`}>
|
||||
<MaterialIcons name="image" size={20} color="#9CA3AF" />
|
||||
</View>
|
||||
)}
|
||||
<View style={tw`flex-1`}>
|
||||
<MyText style={tw`text-base font-medium text-gray-800`} numberOfLines={1}>
|
||||
{product.name}
|
||||
</MyText>
|
||||
<MyText style={tw`text-sm text-gray-600 mt-1`}>
|
||||
₹{product.price} {product.unit && `per ${product.unit}`}
|
||||
</MyText>
|
||||
{product.marketPrice && (
|
||||
<MyText style={tw`text-sm text-gray-500 line-through`}>
|
||||
₹{product.marketPrice}
|
||||
</MyText>
|
||||
)}
|
||||
</View>
|
||||
{product.isOutOfStock && (
|
||||
<MyText style={tw`text-xs text-red-500 font-medium`}>Out of stock</MyText>
|
||||
)}
|
||||
</MyTouchableOpacity>
|
||||
))}
|
||||
</View>
|
||||
</ScrollView>
|
||||
</View>
|
||||
</BottomDialog>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
|
@ -1,4 +1,4 @@
|
|||
import React, { useState } from "react";
|
||||
import React, { useMemo, useState } from "react";
|
||||
import { View, Dimensions, ScrollView, TouchableOpacity } from "react-native";
|
||||
import { useRouter, useLocalSearchParams } from "expo-router";
|
||||
import { Image } from 'expo-image';
|
||||
|
|
@ -13,10 +13,10 @@ import {
|
|||
} from "common-ui";
|
||||
import MaterialIcons from "@expo/vector-icons/MaterialIcons";
|
||||
import FontAwesome5 from "@expo/vector-icons/FontAwesome5";
|
||||
import { trpc } from "@/src/trpc-client";
|
||||
import ProductCard from "@/components/ProductCard";
|
||||
import FloatingCartBar from "@/components/floating-cart-bar";
|
||||
import { useStoreHeaderStore } from "@/src/store/storeHeaderStore";
|
||||
import { useAllProducts, useStoreWithProducts } from "@/src/hooks/prominent-api-hooks";
|
||||
|
||||
const { width: screenWidth } = Dimensions.get("window");
|
||||
const itemWidth = (screenWidth - 48) / 2;
|
||||
|
|
@ -63,24 +63,32 @@ export default function StoreDetail() {
|
|||
const [selectedTagId, setSelectedTagId] = useState<number | null>(null);
|
||||
|
||||
const { data: storeData, isLoading, refetch, error } =
|
||||
trpc.user.stores.getStoreWithProducts.useQuery(
|
||||
{ storeId: storeIdNum },
|
||||
{ enabled: !!storeIdNum }
|
||||
);
|
||||
useStoreWithProducts(storeIdNum);
|
||||
|
||||
const { data: tagsData, isLoading: isLoadingTags } =
|
||||
trpc.user.tags.getTagsByStore.useQuery(
|
||||
{ storeId: storeIdNum },
|
||||
{ enabled: !!storeIdNum }
|
||||
);
|
||||
const { data: productsData, isLoading: isProductsLoading } = useAllProducts();
|
||||
|
||||
const productById = useMemo(() => {
|
||||
const map = new Map<number, any>();
|
||||
productsData?.products?.forEach((product) => {
|
||||
map.set(product.id, product);
|
||||
});
|
||||
return map;
|
||||
}, [productsData]);
|
||||
|
||||
const storeProducts = useMemo(() => {
|
||||
if (!storeData?.products) return [];
|
||||
return storeData.products
|
||||
.map((product) => productById.get(product.id))
|
||||
.filter(Boolean);
|
||||
}, [storeData, productById]);
|
||||
|
||||
// Filter products based on selected tag
|
||||
const filteredProducts = selectedTagId
|
||||
? storeData?.products.filter(product => {
|
||||
const selectedTag = tagsData?.tags.find(t => t.id === selectedTagId);
|
||||
? storeProducts.filter(product => {
|
||||
const selectedTag = storeData?.tags.find(t => t.id === selectedTagId);
|
||||
return selectedTag?.productIds?.includes(product.id) ?? false;
|
||||
}) || []
|
||||
: storeData?.products || [];
|
||||
})
|
||||
: storeProducts;
|
||||
|
||||
// Set the store header title
|
||||
const setStoreHeaderTitle = useStoreHeaderStore((state) => state.setTitle);
|
||||
|
|
@ -98,10 +106,12 @@ export default function StoreDetail() {
|
|||
|
||||
useDrawerTitle(storeData?.store?.name || "Store", [storeData?.store?.name]);
|
||||
|
||||
if (isLoading) {
|
||||
if (isLoading || isProductsLoading) {
|
||||
return (
|
||||
<View style={tw`flex-1 justify-center items-center bg-gray-50`}>
|
||||
<MyText style={tw`text-gray-500 font-medium`}>Loading store...</MyText>
|
||||
<MyText style={tw`text-gray-500 font-medium`}>
|
||||
{isLoading ? 'Loading store...' : 'Loading products...'}
|
||||
</MyText>
|
||||
</View>
|
||||
);
|
||||
}
|
||||
|
|
@ -184,13 +194,13 @@ export default function StoreDetail() {
|
|||
)}
|
||||
</View>
|
||||
{/* Tags Section */}
|
||||
{tagsData && tagsData.tags.length > 0 && (
|
||||
{storeData?.tags && storeData.tags.length > 0 && (
|
||||
<ScrollView
|
||||
horizontal
|
||||
showsHorizontalScrollIndicator={false}
|
||||
contentContainerStyle={tw`gap-2 mt-6`}
|
||||
>
|
||||
{tagsData.tags.map((tag) => (
|
||||
{storeData.tags.map((tag) => (
|
||||
<Chip
|
||||
key={tag.id}
|
||||
tag={tag}
|
||||
|
|
@ -206,7 +216,7 @@ export default function StoreDetail() {
|
|||
<MaterialIcons name="grid-view" size={20} color="#374151" />
|
||||
<MyText style={tw`text-lg font-bold text-gray-900 ml-2`}>
|
||||
{selectedTagId
|
||||
? `${tagsData?.tags.find(t => t.id === selectedTagId)?.tagName} items`
|
||||
? `${storeData?.tags.find(t => t.id === selectedTagId)?.tagName} items`
|
||||
: `${filteredProducts.length} products`}
|
||||
</MyText>
|
||||
</View>
|
||||
|
|
|
|||
|
|
@ -22,6 +22,7 @@ import LocationTestWrapper from "@/components/LocationTestWrapper";
|
|||
import HealthTestWrapper from "@/components/HealthTestWrapper";
|
||||
import FirstUserWrapper from "@/components/FirstUserWrapper";
|
||||
import UpdateChecker from "@/components/UpdateChecker";
|
||||
import CentralStoreInitializer from "@/src/components/CentralStoreInitializer";
|
||||
import { RefreshProvider } from "../../../packages/ui/src/lib/refresh-context";
|
||||
import WebViewWrapper from "@/components/WebViewWrapper";
|
||||
import BackHandlerWrapper from "@/components/BackHandler";
|
||||
|
|
@ -68,10 +69,12 @@ export default function RootLayout() {
|
|||
<PaperProvider>
|
||||
<LocationTestWrapper>
|
||||
<RefreshProvider queryClient={queryClient}>
|
||||
<CentralStoreInitializer>
|
||||
<BackHandlerWrapper />
|
||||
<Stack screenOptions={{ headerShown: false }} />
|
||||
<AddToCartDialog />
|
||||
</RefreshProvider>
|
||||
</CentralStoreInitializer>
|
||||
</RefreshProvider>
|
||||
</LocationTestWrapper>
|
||||
</PaperProvider>
|
||||
</NotificationProvider>
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@ import React, { useState, useRef, useEffect } from 'react';
|
|||
import { View, Dimensions, Image, ScrollView, NativeSyntheticEvent, NativeScrollEvent } from 'react-native';
|
||||
import { MyTouchableOpacity, MyText, tw } from 'common-ui';
|
||||
import { useRouter } from 'expo-router';
|
||||
import { trpc } from '@/src/trpc-client';
|
||||
import { useBanners } from '@/src/hooks/prominent-api-hooks';
|
||||
import MaterialIcons from '@expo/vector-icons/MaterialIcons';
|
||||
|
||||
const { width: screenWidth } = Dimensions.get('window');
|
||||
|
|
@ -25,7 +25,7 @@ export default function BannerCarousel() {
|
|||
const [isAutoPlaying, setIsAutoPlaying] = useState(true);
|
||||
|
||||
// Fetch banners data
|
||||
const { data: bannersData, isLoading, error } = trpc.user.banner.getBanners.useQuery();
|
||||
const { data: bannersData, isLoading, error } = useBanners();
|
||||
|
||||
const banners = bannersData?.banners || [];
|
||||
|
||||
|
|
@ -123,7 +123,7 @@ export default function BannerCarousel() {
|
|||
{/* Pagination Dots */}
|
||||
{banners.length > 1 && (
|
||||
<View style={tw`flex-row justify-center mt-3`}>
|
||||
{banners.map((_, index: number) => (
|
||||
{banners.map((_: Banner, index: number) => (
|
||||
<MyTouchableOpacity
|
||||
key={index}
|
||||
onPress={() => goToSlide(index)}
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@ import MaterialIcons from '@expo/vector-icons/MaterialIcons';
|
|||
// import RazorpayCheckout from 'react-native-razorpay';
|
||||
|
||||
import { trpc } from '@/src/trpc-client';
|
||||
import { useAllProducts } from '@/src/hooks/prominent-api-hooks';
|
||||
import { useCentralProductStore } from '@/src/store/centralProductStore';
|
||||
import { clearLocalCart } from '@/hooks/cart-query-hooks';
|
||||
import { useQueryClient } from '@tanstack/react-query';
|
||||
import { FontAwesome5, FontAwesome6 } from '@expo/vector-icons';
|
||||
|
|
@ -55,17 +55,18 @@ const PaymentAndOrderComponent: React.FC<PaymentAndOrderProps> = ({
|
|||
queryClient.invalidateQueries({ queryKey: [`local-cart-${cartType}`] });
|
||||
};
|
||||
|
||||
const { data: productsData } = useAllProducts();
|
||||
const products = useCentralProductStore((state) => state.products);
|
||||
const productsById = useCentralProductStore((state) => state.productsById);
|
||||
|
||||
// Memoized flash-eligible product IDs
|
||||
const flashEligibleProductIds = useMemo(() => {
|
||||
if (!productsData?.products) return new Set<number>();
|
||||
if (!products.length) return new Set<number>();
|
||||
return new Set(
|
||||
productsData.products
|
||||
.filter((product: any) => product.isFlashAvailable)
|
||||
.map((product: any) => product.id)
|
||||
products
|
||||
.filter((product) => product.isFlashAvailable)
|
||||
.map((product) => product.id)
|
||||
);
|
||||
}, [productsData]);
|
||||
}, [products]);
|
||||
|
||||
const placeOrderMutation = trpc.user.order.placeOrder.useMutation({
|
||||
onSuccess: (data) => {
|
||||
|
|
@ -127,7 +128,7 @@ const PaymentAndOrderComponent: React.FC<PaymentAndOrderProps> = ({
|
|||
|
||||
const availableItems = cartItems
|
||||
.filter(item => {
|
||||
if (item.product?.isOutOfStock) return false;
|
||||
if (productsById[item.productId]?.isOutOfStock) return false;
|
||||
// For flash delivery, check if product supports flash delivery
|
||||
if (isFlashDelivery) {
|
||||
return flashEligibleProductIds.has(item.productId);
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
import React, { useMemo } from 'react';
|
||||
import React from 'react';
|
||||
import { View, Alert, TouchableOpacity, Text } from 'react-native';
|
||||
import { Image } from 'expo-image';
|
||||
import { tw, theme, MyText, MyTouchableOpacity, Quantifier, MiniQuantifier } from 'common-ui';
|
||||
|
|
@ -14,7 +14,7 @@ import {
|
|||
} from '@/hooks/cart-query-hooks';
|
||||
import { useProductSlotIdentifier } from '@/hooks/useProductSlotIdentifier';
|
||||
import { useCartStore } from '@/src/store/cartStore';
|
||||
import { trpc } from '@/src/trpc-client';
|
||||
import { useCentralSlotStore } from '@/src/store/centralSlotStore';
|
||||
|
||||
|
||||
interface ProductCardProps {
|
||||
|
|
@ -68,17 +68,18 @@ const ProductCard: React.FC<ProductCardProps> = ({
|
|||
const cartItem = cartData?.items?.find((cartItem: any) => cartItem.productId === item.id);
|
||||
const quantity = cartItem?.quantity || 0;
|
||||
|
||||
// Query all slots with products
|
||||
const { data: slotsData } = trpc.user.slots.getSlotsWithProducts.useQuery();
|
||||
// Get slots data from central store
|
||||
const slots = useCentralSlotStore((state) => state.slots);
|
||||
const productSlotsMap = useCentralSlotStore((state) => state.productSlotsMap);
|
||||
|
||||
// Create slot lookup map
|
||||
const slotMap = useMemo(() => {
|
||||
const slotMap = React.useMemo(() => {
|
||||
const map: Record<number, any> = {};
|
||||
slotsData?.slots?.forEach((slot: any) => {
|
||||
slots?.forEach((slot: any) => {
|
||||
map[slot.id] = slot;
|
||||
});
|
||||
return map;
|
||||
}, [slotsData]);
|
||||
}, [slots]);
|
||||
|
||||
// Get cart item's slot delivery time if item is in cart
|
||||
const cartSlot = cartItem?.slotId ? slotMap[cartItem.slotId] : null;
|
||||
|
|
@ -86,7 +87,11 @@ const ProductCard: React.FC<ProductCardProps> = ({
|
|||
|
||||
// Precompute the next slot and determine display out of stock status
|
||||
const slotId = getQuickestSlot(item.id);
|
||||
const displayIsOutOfStock = item.isOutOfStock || !slotId;
|
||||
|
||||
// Use isOutOfStock from productSlotsMap (all products now included)
|
||||
const productSlotInfo = productSlotsMap[item.id];
|
||||
const isOutOfStockFromSlots = productSlotInfo?.isOutOfStock;
|
||||
const displayIsOutOfStock = isOutOfStockFromSlots || !slotId;
|
||||
|
||||
// if(item.name.startsWith('Mutton Curry Cut')) {
|
||||
// console.log({slotId, displayIsOutOfStock})
|
||||
|
|
|
|||
|
|
@ -12,6 +12,7 @@ import { trpc, trpcClient } from '@/src/trpc-client';
|
|||
import { useAddToCart, useGetCart, useUpdateCartItem, useRemoveFromCart } from '@/hooks/cart-query-hooks';
|
||||
import { useProductSlotIdentifier } from '@/hooks/useProductSlotIdentifier';
|
||||
import { useFlashNavigationStore } from '@/components/stores/flashNavigationStore';
|
||||
import { useSlots } from '@/src/hooks/prominent-api-hooks';
|
||||
import FloatingCartBar from './floating-cart-bar';
|
||||
import { useStoreHeaderStore } from '@/src/store/storeHeaderStore';
|
||||
import { useCartStore } from '@/src/store/cartStore';
|
||||
|
|
@ -57,15 +58,22 @@ const ProductDetail: React.FC<ProductDetailProps> = ({ productId, isFlashDeliver
|
|||
const { getQuickestSlot } = useProductSlotIdentifier();
|
||||
const { setShouldNavigateToCart } = useFlashNavigationStore();
|
||||
const { setAddedToCartProduct } = useCartStore();
|
||||
const { data: slotsData } = useSlots();
|
||||
|
||||
const sortedDeliverySlots = useMemo(() => {
|
||||
if (!productDetail?.deliverySlots) return []
|
||||
return [...productDetail.deliverySlots].sort((a, b) => {
|
||||
if (!slotsData?.slots || !productDetail) return []
|
||||
|
||||
// Filter slots that contain this product
|
||||
const productSlots = slotsData.slots.filter((slot: any) =>
|
||||
slot.products?.some((p: any) => p.id === productDetail.id)
|
||||
)
|
||||
|
||||
return productSlots.sort((a: any, b: any) => {
|
||||
const deliveryDiff = new Date(a.deliveryTime).getTime() - new Date(b.deliveryTime).getTime()
|
||||
if (deliveryDiff !== 0) return deliveryDiff
|
||||
return new Date(a.freezeTime).getTime() - new Date(b.freezeTime).getTime()
|
||||
})
|
||||
}, [productDetail?.deliverySlots])
|
||||
}, [slotsData, productDetail])
|
||||
|
||||
// Find current quantity from cart data
|
||||
const cartItem = productDetail ? cartData?.data?.items?.find((item: any) => item.productId === productDetail.id) : null;
|
||||
|
|
@ -343,13 +351,13 @@ const ProductDetail: React.FC<ProductDetailProps> = ({ productId, isFlashDeliver
|
|||
) : productDetail.isFlashAvailable ? (
|
||||
<MyTouchableOpacity
|
||||
style={[tw`flex-1 py-3.5 rounded-xl items-center shadow-md`, {
|
||||
backgroundColor: productDetail.deliverySlots.length === 0 ? '#9ca3af' : '#FDF2F8'
|
||||
backgroundColor: sortedDeliverySlots.length === 0 ? '#9ca3af' : '#FDF2F8'
|
||||
}]}
|
||||
onPress={() => productDetail.deliverySlots.length > 0 && handleBuyNow(productDetail.id)}
|
||||
disabled={productDetail.deliverySlots.length === 0}
|
||||
onPress={() => sortedDeliverySlots.length > 0 && handleBuyNow(productDetail.id)}
|
||||
disabled={sortedDeliverySlots.length === 0}
|
||||
>
|
||||
<MyText style={tw`text-base font-bold ${productDetail.deliverySlots.length === 0 ? 'text-gray-400' : 'text-pink-600'}`}>
|
||||
{productDetail.deliverySlots.length === 0 ? 'No Slots' : 'Get in 1 Hour'}
|
||||
<MyText style={tw`text-base font-bold ${sortedDeliverySlots.length === 0 ? 'text-gray-400' : 'text-pink-600'}`}>
|
||||
{sortedDeliverySlots.length === 0 ? 'No Slots' : 'Get in 1 Hour'}
|
||||
</MyText>
|
||||
</MyTouchableOpacity>
|
||||
) : (
|
||||
|
|
|
|||
|
|
@ -6,6 +6,7 @@ import { BottomDialog, MyTouchableOpacity, MyText, tw, theme } from 'common-ui';
|
|||
import { useAuth } from '@/src/contexts/AuthContext';
|
||||
import { trpc } from '@/src/trpc-client';
|
||||
import { useAddressStore } from '@/src/store/addressStore';
|
||||
import { useSlots } from '@/src/hooks/prominent-api-hooks';
|
||||
import dayjs from 'dayjs';
|
||||
|
||||
interface QuickDeliveryAddressSelectorProps {
|
||||
|
|
@ -31,13 +32,13 @@ const QuickDeliveryAddressSelector: React.FC<QuickDeliveryAddressSelectorProps>
|
|||
const { data: addressesData } = trpc.user.address.getUserAddresses.useQuery(undefined, {
|
||||
enabled: isAuthenticated,
|
||||
});
|
||||
const { data: slotsData } = trpc.user.slots.getSlotsWithProducts.useQuery();
|
||||
const { data: slotsData } = useSlots();
|
||||
|
||||
const defaultAddress = defaultAddressData?.data;
|
||||
const addresses = addressesData?.data || [];
|
||||
|
||||
// Format time range helper
|
||||
const formatTimeRange = (deliveryTime: string) => {
|
||||
const formatTimeRange = (deliveryTime: string | Date) => {
|
||||
const time = dayjs(deliveryTime);
|
||||
const endTime = time.add(1, 'hour');
|
||||
const startPeriod = time.format('A');
|
||||
|
|
|
|||
|
|
@ -24,7 +24,7 @@ import TestingPhaseNote from "@/components/TestingPhaseNote";
|
|||
|
||||
import dayjs from "dayjs";
|
||||
import { trpc } from "@/src/trpc-client";
|
||||
import { useAllProducts } from "@/src/hooks/prominent-api-hooks";
|
||||
import { useCentralProductStore } from '@/src/store/centralProductStore';
|
||||
import { useGetCart, useUpdateCartItem, useRemoveFromCart } from '@/hooks/cart-query-hooks';
|
||||
import { useGetEssentialConsts } from '@/src/hooks/prominent-api-hooks';
|
||||
|
||||
|
|
@ -81,33 +81,33 @@ export default function CartPage({ isFlashDelivery = false }: CartPageProps) {
|
|||
|
||||
const { data: couponsRaw, error: couponsError } = trpc.user.coupon.getEligible.useQuery();
|
||||
const { data: constsData } = useGetEssentialConsts();
|
||||
const { data: productsData } = useAllProducts();
|
||||
const products = useCentralProductStore((state) => state.products);
|
||||
const productsById = useCentralProductStore((state) => state.productsById);
|
||||
|
||||
const cartItems = cartData?.items || [];
|
||||
|
||||
|
||||
// Memoized flash-eligible product IDs
|
||||
const flashEligibleProductIds = useMemo(() => {
|
||||
if (!productsData?.products) return new Set<number>();
|
||||
if (!products.length) return new Set<number>();
|
||||
return new Set(
|
||||
productsData.products
|
||||
.filter((product: any) => product.isFlashAvailable)
|
||||
.map((product: any) => product.id)
|
||||
products
|
||||
.filter((product) => product.isFlashAvailable)
|
||||
.map((product) => product.id)
|
||||
);
|
||||
}, [productsData]);
|
||||
}, [products]);
|
||||
|
||||
// Base total price without discounts for coupon eligibility check
|
||||
const baseTotalPrice = useMemo(
|
||||
() =>
|
||||
cartItems
|
||||
.filter((item) => !item.product?.isOutOfStock)
|
||||
.reduce(
|
||||
(sum, item) =>
|
||||
sum +
|
||||
(item.product?.price || 0) * (quantities[item.id] || item.quantity),
|
||||
0
|
||||
),
|
||||
[cartItems, quantities]
|
||||
const baseTotalPrice = useMemo(
|
||||
() =>
|
||||
cartItems
|
||||
.filter((item) => !productsById[item.productId]?.isOutOfStock)
|
||||
.reduce((sum, item) => {
|
||||
const product = productsById[item.productId];
|
||||
const price = product?.price || 0;
|
||||
return sum + price * (quantities[item.id] || item.quantity);
|
||||
}, 0),
|
||||
[cartItems, quantities, productsById]
|
||||
);
|
||||
|
||||
const eligibleCoupons = useMemo(() => {
|
||||
|
|
@ -200,13 +200,14 @@ export default function CartPage({ isFlashDelivery = false }: CartPageProps) {
|
|||
[eligibleCoupons, selectedCouponId]
|
||||
);
|
||||
|
||||
const totalPrice = cartItems
|
||||
.filter((item) => !item.product?.isOutOfStock)
|
||||
.reduce((sum, item) => {
|
||||
const quantity = quantities[item.id] || item.quantity;
|
||||
const price = isFlashDelivery ? (item.product?.flashPrice ?? item.product?.price ?? 0) : (item.product?.price || 0);
|
||||
return sum + price * quantity;
|
||||
}, 0);
|
||||
const totalPrice = cartItems
|
||||
.filter((item) => !productsById[item.productId]?.isOutOfStock)
|
||||
.reduce((sum, item) => {
|
||||
const product = productsById[item.productId];
|
||||
const quantity = quantities[item.id] || item.quantity;
|
||||
const price = isFlashDelivery ? (product?.flashPrice ?? product?.price ?? 0) : (product?.price || 0);
|
||||
return sum + price * quantity;
|
||||
}, 0);
|
||||
const dropdownData = useMemo(
|
||||
() =>
|
||||
eligibleCoupons?.map((coupon) => {
|
||||
|
|
@ -274,7 +275,7 @@ export default function CartPage({ isFlashDelivery = false }: CartPageProps) {
|
|||
|
||||
const finalTotalWithDelivery = finalTotal + deliveryCharge;
|
||||
|
||||
const hasAvailableItems = cartItems.some(item => !item.product?.isOutOfStock);
|
||||
const hasAvailableItems = cartItems.some(item => !productsById[item.productId]?.isOutOfStock);
|
||||
|
||||
useEffect(() => {
|
||||
const initial: Record<number, number> = {};
|
||||
|
|
@ -411,10 +412,11 @@ export default function CartPage({ isFlashDelivery = false }: CartPageProps) {
|
|||
const productSlots = getAvailableSlotsForProduct(item.productId);
|
||||
const selectedSlotForItem = selectedSlots[item.id];
|
||||
const isFlashEligible = isFlashDelivery ? flashEligibleProductIds.has(item.productId) : true;
|
||||
const product = productsById[item.productId];
|
||||
// const isAvailable = (productSlots.length > 0 || isFlashDelivery) && !item.product?.isOutOfStock && isFlashEligible;
|
||||
let isAvailable = true;
|
||||
|
||||
if(item.product?.isOutOfStock) {
|
||||
if (product?.isOutOfStock) {
|
||||
isAvailable = false;
|
||||
} else if(isFlashDelivery) {
|
||||
if(!isFlashEligible) {
|
||||
|
|
@ -431,7 +433,7 @@ export default function CartPage({ isFlashDelivery = false }: CartPageProps) {
|
|||
// isAvailable = isFlashEligible;
|
||||
// }
|
||||
const quantity = quantities[item.id] || item.quantity;
|
||||
const price = isFlashDelivery ? (item.product?.flashPrice ?? item.product?.price ?? 0) : (item.product?.price || 0);
|
||||
const price = isFlashDelivery ? (product?.flashPrice ?? product?.price ?? 0) : (product?.price || 0);
|
||||
const itemPrice = price * quantity;
|
||||
|
||||
return (
|
||||
|
|
@ -439,7 +441,7 @@ export default function CartPage({ isFlashDelivery = false }: CartPageProps) {
|
|||
<View style={tw`p-4`}>
|
||||
<View style={tw`flex-row items-center mb-2`}>
|
||||
<Image
|
||||
source={{ uri: item.product.images?.[0] }}
|
||||
source={{ uri: product?.images?.[0] }}
|
||||
style={tw`w-8 h-8 rounded-lg bg-gray-100 mr-3`}
|
||||
/>
|
||||
|
||||
|
|
@ -447,12 +449,12 @@ export default function CartPage({ isFlashDelivery = false }: CartPageProps) {
|
|||
style={tw`text-sm text-gray-900 flex-1 mr-3`}
|
||||
numberOfLines={2}
|
||||
>
|
||||
{item.product.name}
|
||||
{product?.name}
|
||||
</MyText>
|
||||
<MyText style={tw`text-xs text-gray-500 mr-2`}>
|
||||
{(() => {
|
||||
const qty = item.product?.productQuantity || 1;
|
||||
const unit = item.product?.unitNotation || '';
|
||||
const qty = product?.productQuantity || 1;
|
||||
const unit = product?.unitNotation || '';
|
||||
if (unit?.toLowerCase() === 'kg' && qty < 1) {
|
||||
return `${Math.round(qty * 1000)}g`;
|
||||
}
|
||||
|
|
@ -513,8 +515,8 @@ export default function CartPage({ isFlashDelivery = false }: CartPageProps) {
|
|||
});
|
||||
}
|
||||
}}
|
||||
step={item.product.incrementStep}
|
||||
unit={item.product?.unitNotation}
|
||||
step={product?.incrementStep}
|
||||
unit={product?.unitNotation}
|
||||
/>
|
||||
</View>
|
||||
</View>
|
||||
|
|
@ -580,7 +582,7 @@ export default function CartPage({ isFlashDelivery = false }: CartPageProps) {
|
|||
onPress={() => {
|
||||
Alert.alert(
|
||||
"Remove Item",
|
||||
`Remove ${item.product.name} from cart?`,
|
||||
`Remove ${product?.name} from cart?`,
|
||||
[
|
||||
{ text: "Cancel", style: "cancel" },
|
||||
{
|
||||
|
|
@ -631,7 +633,7 @@ export default function CartPage({ isFlashDelivery = false }: CartPageProps) {
|
|||
onPress={() => {
|
||||
Alert.alert(
|
||||
"Remove Item",
|
||||
`Remove ${item.product.name} from cart?`,
|
||||
`Remove ${product?.name} from cart?`,
|
||||
[
|
||||
{ text: "Cancel", style: "cancel" },
|
||||
{
|
||||
|
|
@ -675,8 +677,8 @@ export default function CartPage({ isFlashDelivery = false }: CartPageProps) {
|
|||
style={tw`bg-red-50 self-start px-2 py-1 rounded-md mt-2`}
|
||||
>
|
||||
<MyText style={tw`text-xs font-bold text-red-600`}>
|
||||
{item.product?.isOutOfStock
|
||||
? "Out of Stock"
|
||||
{product?.isOutOfStock
|
||||
? "Out of Stock"
|
||||
: isFlashDelivery && !flashEligibleProductIds.has(item.productId)
|
||||
? "Not available for flash delivery. Please remove"
|
||||
: "No delivery slots available"}
|
||||
|
|
@ -909,7 +911,7 @@ export default function CartPage({ isFlashDelivery = false }: CartPageProps) {
|
|||
onPress={() => {
|
||||
const availableItems = cartItems
|
||||
.filter(item => {
|
||||
if (item.product?.isOutOfStock) return false;
|
||||
if (productsById[item.productId]?.isOutOfStock) return false;
|
||||
if (isFlashDelivery) {
|
||||
// Check if product supports flash delivery
|
||||
return flashEligibleProductIds.has(item.productId);
|
||||
|
|
@ -922,8 +924,8 @@ export default function CartPage({ isFlashDelivery = false }: CartPageProps) {
|
|||
|
||||
if (availableItems.length === 0) {
|
||||
// Determine why no items are available
|
||||
const outOfStockItems = cartItems.filter(item => item.product?.isOutOfStock);
|
||||
const inStockItems = cartItems.filter(item => !item.product?.isOutOfStock);
|
||||
const outOfStockItems = cartItems.filter(item => productsById[item.productId]?.isOutOfStock);
|
||||
const inStockItems = cartItems.filter(item => !productsById[item.productId]?.isOutOfStock);
|
||||
|
||||
let errorTitle = "Cannot Proceed";
|
||||
let errorMessage = "";
|
||||
|
|
@ -962,7 +964,7 @@ export default function CartPage({ isFlashDelivery = false }: CartPageProps) {
|
|||
|
||||
// Check if there are items without slots (for regular delivery)
|
||||
if (!isFlashDelivery && availableItems.length < cartItems.length) {
|
||||
const itemsWithoutSlots = cartItems.filter(item => !selectedSlots[item.id] && !item.product?.isOutOfStock);
|
||||
const itemsWithoutSlots = cartItems.filter(item => !selectedSlots[item.id] && !productsById[item.productId]?.isOutOfStock);
|
||||
if (itemsWithoutSlots.length > 0) {
|
||||
Alert.alert(
|
||||
"Delivery Slot Required",
|
||||
|
|
|
|||
|
|
@ -8,7 +8,7 @@ import AddressForm from '@/src/components/AddressForm';
|
|||
import { useAuthenticatedRoute } from '@/hooks/useAuthenticatedRoute';
|
||||
|
||||
import { trpc } from '@/src/trpc-client';
|
||||
import { useAllProducts } from '@/src/hooks/prominent-api-hooks';
|
||||
import { useCentralProductStore } from '@/src/store/centralProductStore';
|
||||
import { useGetCart } from '@/hooks/cart-query-hooks';
|
||||
import { useGetEssentialConsts } from '@/src/hooks/prominent-api-hooks';
|
||||
import PaymentAndOrderComponent from '@/components/PaymentAndOrderComponent';
|
||||
|
|
@ -36,7 +36,8 @@ const CheckoutPage: React.FC<CheckoutPageProps> = ({ isFlashDelivery = false })
|
|||
const { data: addresses, refetch: refetchAddresses } = trpc.user.address.getUserAddresses.useQuery();
|
||||
const { data: slotsData, refetch: refetchSlots } = trpc.user.slots.getSlots.useQuery();
|
||||
const { data: constsData } = useGetEssentialConsts();
|
||||
const { data: productsData } = useAllProducts();
|
||||
const products = useCentralProductStore((state) => state.products);
|
||||
const productsById = useCentralProductStore((state) => state.productsById);
|
||||
|
||||
useMarkDataFetchers(() => {
|
||||
refetchCart();
|
||||
|
|
@ -53,14 +54,14 @@ const CheckoutPage: React.FC<CheckoutPageProps> = ({ isFlashDelivery = false })
|
|||
const cartItems = cartData?.items || [];
|
||||
|
||||
// Memoized flash-eligible product IDs
|
||||
const flashEligibleProductIds = useMemo(() => {
|
||||
if (!productsData?.products) return new Set<number>();
|
||||
return new Set(
|
||||
productsData.products
|
||||
.filter((product: any) => product.isFlashAvailable)
|
||||
.map((product: any) => product.id)
|
||||
);
|
||||
}, [productsData]);
|
||||
const flashEligibleProductIds = useMemo(() => {
|
||||
if (!products.length) return new Set<number>();
|
||||
return new Set(
|
||||
products
|
||||
.filter((product) => product.isFlashAvailable)
|
||||
.map((product) => product.id)
|
||||
);
|
||||
}, [products]);
|
||||
|
||||
// Parse slots parameter from URL (format: "1:1,2,3;2:4,5")
|
||||
const selectedSlots = useMemo(() => {
|
||||
|
|
@ -124,10 +125,11 @@ const CheckoutPage: React.FC<CheckoutPageProps> = ({ isFlashDelivery = false })
|
|||
|
||||
|
||||
const totalPrice = selectedItems
|
||||
.filter((item) => !item.product?.isOutOfStock)
|
||||
.filter((item) => !productsById[item.productId]?.isOutOfStock)
|
||||
.reduce(
|
||||
(sum, item) => {
|
||||
const price = isFlashDelivery ? (item.product?.flashPrice ?? item.product?.price ?? 0) : (item.product?.price || 0);
|
||||
const product = productsById[item.productId];
|
||||
const price = isFlashDelivery ? (product?.flashPrice ?? product?.price ?? 0) : (product?.price || 0);
|
||||
return sum + price * item.quantity;
|
||||
},
|
||||
0
|
||||
|
|
|
|||
|
|
@ -14,7 +14,6 @@ import {
|
|||
theme,
|
||||
updateStatusBarColor,
|
||||
} from "common-ui";
|
||||
import { trpc } from "@/src/trpc-client";
|
||||
import {
|
||||
useGetCart,
|
||||
useUpdateCartItem,
|
||||
|
|
@ -22,8 +21,9 @@ import {
|
|||
useAddToCart,
|
||||
type CartType,
|
||||
} from "@/hooks/cart-query-hooks";
|
||||
import { useGetEssentialConsts } from "@/src/api-hooks/essential-consts.api";
|
||||
import { useGetEssentialConsts, useSlots } from "@/src/hooks/prominent-api-hooks"
|
||||
import { useProductSlotIdentifier } from "@/hooks/useProductSlotIdentifier";
|
||||
import { useCentralProductStore } from "@/src/store/centralProductStore";
|
||||
import dayjs from "dayjs";
|
||||
import { LinearGradient } from "expo-linear-gradient";
|
||||
|
||||
|
|
@ -36,7 +36,7 @@ interface FloatingCartBarProps {
|
|||
}
|
||||
|
||||
// Smart time window formatting function
|
||||
const formatTimeRange = (deliveryTime: string) => {
|
||||
const formatTimeRange = (deliveryTime: string | Date) => {
|
||||
const time = dayjs(deliveryTime);
|
||||
const endTime = time.add(1, 'hour');
|
||||
const startPeriod = time.format('A');
|
||||
|
|
@ -79,7 +79,8 @@ const FloatingCartBar: React.FC<FloatingCartBarProps> = ({
|
|||
const setIsExpanded = controlledSetIsExpanded ?? setLocalIsExpanded;
|
||||
const { data: cartData, refetch: refetchCart } = useGetCart({}, cartType);
|
||||
const { data: constsData } = useGetEssentialConsts();
|
||||
const { data: slotsData } = trpc.user.slots.getSlotsWithProducts.useQuery();
|
||||
const { data: slotsData } = useSlots();
|
||||
const productsById = useCentralProductStore((state) => state.productsById);
|
||||
const { productSlotsMap } = useProductSlotIdentifier();
|
||||
const cartItems = cartData?.items || [];
|
||||
const itemCount = cartItems.length;
|
||||
|
|
@ -108,21 +109,21 @@ const FloatingCartBar: React.FC<FloatingCartBarProps> = ({
|
|||
setQuantities(initial);
|
||||
}, [cartData]);
|
||||
|
||||
useEffect(() => {
|
||||
useEffect(() => {
|
||||
if (!cartItems.length || !slotsData?.slots || !productSlotsMap) return;
|
||||
|
||||
const itemsToUpdate = cartItems.filter(item => {
|
||||
if (isFlashDelivery || !item.slotId) return false;
|
||||
|
||||
const availableSlots = productSlotsMap.get(item.productId) || [];
|
||||
const isSlotAvailable = availableSlots.includes(item.slotId);
|
||||
const availableSlots = productSlotsMap[item.productId]?.slots || [];
|
||||
const isSlotAvailable = availableSlots.some((slot) => slot.id === item.slotId);
|
||||
return !isSlotAvailable;
|
||||
});
|
||||
|
||||
itemsToUpdate.forEach((item) => {
|
||||
const availableSlots = productSlotsMap.get(item.productId) || [];
|
||||
const availableSlots = productSlotsMap[item.productId]?.slots || [];
|
||||
if (availableSlots.length > 0 && !isFlashDelivery) {
|
||||
const nearestSlotId = availableSlots[0];
|
||||
const nearestSlotId = availableSlots[0].id;
|
||||
removeFromCart.mutate({ itemId: item.id });
|
||||
addToCartHook.addToCart(item.productId, item.quantity, nearestSlotId);
|
||||
}
|
||||
|
|
@ -135,7 +136,9 @@ useEffect(() => {
|
|||
// Calculate total cart value and free delivery info
|
||||
const totalCartValue = cartItems.reduce(
|
||||
(sum, item) => {
|
||||
const price = isFlashDelivery ? (item.product.flashPrice ?? item.product.price) : item.product.price;
|
||||
const product = productsById[item.productId];
|
||||
const basePrice = product?.price ?? 0;
|
||||
const price = isFlashDelivery ? (product?.flashPrice ?? basePrice) : basePrice;
|
||||
return sum + price * item.quantity;
|
||||
},
|
||||
0
|
||||
|
|
@ -256,21 +259,21 @@ useEffect(() => {
|
|||
<React.Fragment key={item.id}>
|
||||
<View style={tw`py-4`}>
|
||||
<View style={tw`flex-row items-center`}>
|
||||
<Image
|
||||
source={{ uri: item.product.images?.[0] }}
|
||||
style={tw`w-8 h-8 rounded-lg bg-slate-50 border border-slate-100`}
|
||||
/>
|
||||
<Image
|
||||
source={{ uri: productsById[item.productId]?.images?.[0] }}
|
||||
style={tw`w-8 h-8 rounded-lg bg-slate-50 border border-slate-100`}
|
||||
/>
|
||||
|
||||
<View style={tw`flex-1 ml-4`}>
|
||||
<View style={tw`flex-row items-center justify-between mb-1`}>
|
||||
<ProductNameWithQuantity
|
||||
name={item.product.name}
|
||||
productQuantity={item.product.productQuantity}
|
||||
unitNotation={item.product.unitNotation}
|
||||
name={productsById[item.productId]?.name || ''}
|
||||
productQuantity={productsById[item.productId]?.productQuantity || 0}
|
||||
unitNotation={productsById[item.productId]?.unitNotation || ''}
|
||||
/>
|
||||
<MiniQuantifier
|
||||
value={quantities[item.id] || item.quantity}
|
||||
onChange={(value) => {
|
||||
<MiniQuantifier
|
||||
value={quantities[item.id] || item.quantity}
|
||||
onChange={(value) => {
|
||||
if (value === 0) {
|
||||
removeFromCart.mutate({ itemId: item.id });
|
||||
} else {
|
||||
|
|
@ -278,21 +281,20 @@ useEffect(() => {
|
|||
updateCartItem.mutate({ itemId: item.id, quantity: value });
|
||||
}
|
||||
}}
|
||||
step={item.product.incrementStep}
|
||||
showUnits={true}
|
||||
unit={item.product?.unitNotation}
|
||||
/>
|
||||
step={productsById[item.productId]?.incrementStep || 1}
|
||||
showUnits={true}
|
||||
unit={productsById[item.productId]?.unitNotation}
|
||||
/>
|
||||
</View>
|
||||
<View style={tw`flex-row items-center justify-between`}>
|
||||
{item.slotId && slotsData && productSlotsMap.has(item.productId) && (
|
||||
{item.slotId && slotsData && productSlotsMap[item.productId] && (
|
||||
<BottomDropdown
|
||||
label="Select Delivery Slot"
|
||||
value={item.slotId}
|
||||
options={(productSlotsMap.get(item.productId) || []).map(slotId => {
|
||||
const slot = slotsData.slots.find(s => s.id === slotId);
|
||||
options={(productSlotsMap[item.productId]?.slots || []).map((slot) => {
|
||||
return {
|
||||
label: slot ? formatTimeRange(slot.deliveryTime) : "N/A",
|
||||
value: slotId,
|
||||
value: slot.id,
|
||||
};
|
||||
})}
|
||||
onValueChange={async (val) => {
|
||||
|
|
@ -325,7 +327,12 @@ useEffect(() => {
|
|||
/>
|
||||
)}
|
||||
<MyText style={tw`text-slate-900 text-sm font-bold`}>
|
||||
₹{(isFlashDelivery ? (item.product.flashPrice ?? item.product.price) : item.product.price) * item.quantity}
|
||||
₹{(() => {
|
||||
const product = productsById[item.productId];
|
||||
const basePrice = product?.price ?? 0;
|
||||
const price = isFlashDelivery ? (product?.flashPrice ?? basePrice) : basePrice;
|
||||
return price * item.quantity;
|
||||
})()}
|
||||
</MyText>
|
||||
</View>
|
||||
</View>
|
||||
|
|
|
|||
|
|
@ -1,16 +1,12 @@
|
|||
import { trpc } from '@/src/trpc-client';
|
||||
import { useAllProducts } from '@/src/hooks/prominent-api-hooks';
|
||||
import { useCentralSlotStore } from '@/src/store/centralSlotStore';
|
||||
import { Alert } from 'react-native';
|
||||
import { useState, useEffect } from 'react';
|
||||
import { useQuery, useMutation, useQueryClient } from '@tanstack/react-query';
|
||||
import { useQuery, useMutation, useQueryClient, UseQueryResult, UseMutationResult } from '@tanstack/react-query';
|
||||
import { StorageServiceCasual } from 'common-ui/src/services/StorageServiceCasual';
|
||||
|
||||
// Cart type definition
|
||||
export type CartType = "regular" | "flash";
|
||||
|
||||
// const CART_MODE: 'remote' | 'local' = 'remote';
|
||||
const CART_MODE: 'remote' | 'local' = 'local';
|
||||
|
||||
const getCartStorageKey = (cartType: CartType = "regular"): string => {
|
||||
return cartType === "flash" ? "flash_cart_items" : "cart_items";
|
||||
};
|
||||
|
|
@ -27,15 +23,114 @@ interface ProductSummary {
|
|||
id: number;
|
||||
price: string;
|
||||
incrementStep: number;
|
||||
isOutOfStock: boolean;
|
||||
isFlashAvailable: boolean;
|
||||
name?: string;
|
||||
flashPrice?: string | null;
|
||||
images?: string[];
|
||||
productQuantity?: number;
|
||||
unitNotation?: string;
|
||||
marketPrice?: string | null;
|
||||
}
|
||||
|
||||
interface CartItem {
|
||||
export interface CartItem {
|
||||
id: number;
|
||||
productId: number;
|
||||
quantity: number;
|
||||
addedAt: string;
|
||||
product: ProductSummary;
|
||||
subtotal: number;
|
||||
slotId: number;
|
||||
}
|
||||
|
||||
interface CartData {
|
||||
items: CartItem[];
|
||||
totalItems: number;
|
||||
totalAmount: number;
|
||||
}
|
||||
|
||||
interface UseGetCartOptions {
|
||||
refetchOnWindowFocus?: boolean;
|
||||
enabled?: boolean;
|
||||
}
|
||||
|
||||
interface UseGetCartReturn {
|
||||
data: CartData | undefined;
|
||||
isLoading: boolean;
|
||||
error: Error | null;
|
||||
refetch: () => Promise<UseQueryResult<CartData, Error>>;
|
||||
cartItems: CartItem[];
|
||||
totalItems: number;
|
||||
totalPrice: number;
|
||||
isEmpty: boolean;
|
||||
hasItems: boolean;
|
||||
}
|
||||
|
||||
interface AddToCartVariables {
|
||||
productId: number;
|
||||
quantity: number;
|
||||
slotId: number;
|
||||
}
|
||||
|
||||
interface UpdateCartVariables {
|
||||
itemId: number;
|
||||
quantity: number;
|
||||
}
|
||||
|
||||
interface RemoveCartVariables {
|
||||
itemId: number;
|
||||
}
|
||||
|
||||
interface MutationOptions<TData, TVariables> {
|
||||
onSuccess?: (data: TData, variables: TVariables) => void;
|
||||
onError?: (error: Error) => void;
|
||||
showSuccessAlert?: boolean;
|
||||
showErrorAlert?: boolean;
|
||||
refetchCart?: boolean;
|
||||
}
|
||||
|
||||
interface UseAddToCartReturn {
|
||||
mutate: UseMutationResult<LocalCartItem[], Error, AddToCartVariables>['mutate'];
|
||||
mutateAsync: UseMutationResult<LocalCartItem[], Error, AddToCartVariables>['mutateAsync'];
|
||||
isLoading: boolean;
|
||||
error: Error | null;
|
||||
data: LocalCartItem[] | undefined;
|
||||
addToCart: (productId: number, quantity?: number, slotId?: number, onSettled?: (data: LocalCartItem[] | undefined, error: Error | null) => void) => void;
|
||||
addToCartAsync: (productId: number, quantity?: number, slotId?: number) => Promise<LocalCartItem[]>;
|
||||
}
|
||||
|
||||
interface UseUpdateCartItemReturn {
|
||||
mutate: UseMutationResult<LocalCartItem[], Error, UpdateCartVariables>['mutate'];
|
||||
mutateAsync: UseMutationResult<LocalCartItem[], Error, UpdateCartVariables>['mutateAsync'];
|
||||
isLoading: boolean;
|
||||
error: Error | null;
|
||||
data: LocalCartItem[] | undefined;
|
||||
updateCartItem: (itemId: number, quantity: number) => void;
|
||||
updateCartItemAsync: (itemId: number, quantity: number) => Promise<LocalCartItem[]>;
|
||||
}
|
||||
|
||||
interface UseRemoveFromCartReturn {
|
||||
mutate: UseMutationResult<LocalCartItem[], Error, RemoveCartVariables>['mutate'];
|
||||
mutateAsync: UseMutationResult<LocalCartItem[], Error, RemoveCartVariables>['mutateAsync'];
|
||||
isLoading: boolean;
|
||||
error: Error | null;
|
||||
data: LocalCartItem[] | undefined;
|
||||
removeFromCart: (itemId: number) => void;
|
||||
removeFromCartAsync: (itemId: number) => Promise<LocalCartItem[]>;
|
||||
}
|
||||
|
||||
interface AllProductsResponse {
|
||||
products: Array<{
|
||||
id: number;
|
||||
price: number;
|
||||
incrementStep: number;
|
||||
marketPrice?: number | null;
|
||||
name?: string;
|
||||
flashPrice?: string | null;
|
||||
images?: string[];
|
||||
productQuantity?: number;
|
||||
unitNotation?: string;
|
||||
}>;
|
||||
}
|
||||
|
||||
const getLocalCart = async (cartType: CartType = "regular"): Promise<LocalCartItem[]> => {
|
||||
|
|
@ -47,8 +142,7 @@ const getLocalCart = async (cartType: CartType = "regular"): Promise<LocalCartIt
|
|||
const saveLocalCart = async (items: LocalCartItem[], cartType: CartType = "regular"): Promise<void> => {
|
||||
const key = getCartStorageKey(cartType);
|
||||
await StorageServiceCasual.setItem(key, JSON.stringify(items));
|
||||
const fetchedItems = await getLocalCart(cartType);
|
||||
|
||||
await getLocalCart(cartType);
|
||||
};
|
||||
|
||||
const getNextCartItemId = (items: LocalCartItem[]): number => {
|
||||
|
|
@ -56,8 +150,7 @@ const getNextCartItemId = (items: LocalCartItem[]): number => {
|
|||
return maxId + 1;
|
||||
};
|
||||
|
||||
const addToLocalCart = async (productId: number, quantity: number, slotId?: number, cartType: CartType = "regular"): Promise<LocalCartItem[]> => {
|
||||
|
||||
const addToLocalCart = async (productId: number, quantity: number, slotId: number | undefined, cartType: CartType = "regular"): Promise<LocalCartItem[]> => {
|
||||
const items = await getLocalCart(cartType);
|
||||
const existingIndex = items.findIndex(item => item.productId === productId);
|
||||
|
||||
|
|
@ -68,13 +161,13 @@ const addToLocalCart = async (productId: number, quantity: number, slotId?: numb
|
|||
}
|
||||
} else {
|
||||
const newId = getNextCartItemId(items);
|
||||
const cartItem = {
|
||||
const cartItem: LocalCartItem = {
|
||||
id: newId,
|
||||
productId,
|
||||
quantity,
|
||||
slotId: slotId ?? 0, // Default to 0 if not provided
|
||||
slotId: slotId ?? 0,
|
||||
addedAt: new Date().toISOString(),
|
||||
}
|
||||
};
|
||||
|
||||
items.push(cartItem);
|
||||
}
|
||||
|
|
@ -105,401 +198,198 @@ const clearLocalCart = async (cartType: CartType = "regular"): Promise<void> =>
|
|||
await StorageServiceCasual.setItem(key, JSON.stringify([]));
|
||||
};
|
||||
|
||||
export function useGetCart(options?: {
|
||||
refetchOnWindowFocus?: boolean;
|
||||
enabled?: boolean;
|
||||
}, cartType: CartType = "regular") {
|
||||
if (CART_MODE === 'remote') {
|
||||
const query = trpc.user.cart.getCart.useQuery(undefined, {
|
||||
refetchOnWindowFocus: options?.refetchOnWindowFocus ?? true,
|
||||
enabled: options?.enabled ?? true,
|
||||
...options
|
||||
});
|
||||
export function useGetCart(options: UseGetCartOptions = {}, cartType: CartType = "regular"): UseGetCartReturn {
|
||||
const { data: products } = useAllProducts() as { data: AllProductsResponse | undefined };
|
||||
const productSlotsMap = useCentralSlotStore((state) => state.productSlotsMap);
|
||||
|
||||
return {
|
||||
// Original tRPC returns
|
||||
data: query.data,
|
||||
isLoading: query.isLoading,
|
||||
error: query.error,
|
||||
refetch: query.refetch,
|
||||
const query: UseQueryResult<CartData, Error> = useQuery({
|
||||
queryKey: [`local-cart-${cartType}`],
|
||||
queryFn: async (): Promise<CartData> => {
|
||||
const cartItems = await getLocalCart(cartType);
|
||||
|
||||
// Computed properties
|
||||
cartItems: query.data?.items || [],
|
||||
totalItems: query.data?.totalItems || 0,
|
||||
totalPrice: query.data?.totalAmount || 0,
|
||||
const productMap: Record<number, Omit<ProductSummary, 'isOutOfStock' | 'isFlashAvailable'>> = Object.fromEntries(
|
||||
products?.products?.map((p) => [
|
||||
p.id,
|
||||
{
|
||||
id: p.id,
|
||||
price: String(p.price),
|
||||
incrementStep: p.incrementStep,
|
||||
marketPrice: p.marketPrice === null || p.marketPrice === undefined ? null : String(p.marketPrice),
|
||||
name: p.name,
|
||||
flashPrice: p.flashPrice,
|
||||
images: p.images,
|
||||
productQuantity: p.productQuantity,
|
||||
unitNotation: p.unitNotation,
|
||||
},
|
||||
]) ?? []
|
||||
);
|
||||
|
||||
// Helper methods
|
||||
isEmpty: !query.data?.items?.length,
|
||||
hasItems: Boolean(query.data?.items?.length),
|
||||
};
|
||||
} else {
|
||||
const items: CartItem[] = cartItems
|
||||
.map((cartItem): CartItem | null => {
|
||||
const productBasic = productMap[cartItem.productId];
|
||||
const productAvailability = productSlotsMap[cartItem.productId];
|
||||
|
||||
const { data: products } = useAllProducts();
|
||||
const query = useQuery({
|
||||
queryKey: [`local-cart-${cartType}`],
|
||||
queryFn: async () => {
|
||||
if (!productBasic || !productAvailability) return null;
|
||||
|
||||
const cartItems = await getLocalCart(cartType);
|
||||
|
||||
const productMap = Object.fromEntries(
|
||||
products?.products?.map((p) => [
|
||||
p.id,
|
||||
{
|
||||
...p,
|
||||
price: String(p.price),
|
||||
marketPrice: p.marketPrice === null || p.marketPrice === undefined ? null : String(p.marketPrice),
|
||||
} as ProductSummary,
|
||||
]) || []
|
||||
);
|
||||
|
||||
const items: CartItem[] = cartItems.map(cartItem => {
|
||||
const product = productMap[cartItem.productId];
|
||||
|
||||
if (!product) return null as any;
|
||||
return {
|
||||
id: cartItem.id,
|
||||
productId: cartItem.productId,
|
||||
quantity: cartItem.quantity,
|
||||
addedAt: cartItem.addedAt,
|
||||
product,
|
||||
incrementStep: product.incrementStep,
|
||||
subtotal: Number(product.price) * cartItem.quantity,
|
||||
product: {
|
||||
...productBasic,
|
||||
isOutOfStock: productAvailability.isOutOfStock,
|
||||
isFlashAvailable: productAvailability.isFlashAvailable,
|
||||
},
|
||||
incrementStep: productBasic.incrementStep,
|
||||
subtotal: Number(productBasic.price) * cartItem.quantity,
|
||||
slotId: cartItem.slotId,
|
||||
};
|
||||
}).filter(Boolean) as CartItem[];
|
||||
const totalAmount = items.reduce((sum, item) => sum + item.subtotal, 0);
|
||||
})
|
||||
.filter((item): item is CartItem => item !== null);
|
||||
|
||||
return {
|
||||
items,
|
||||
totalItems: items.length,
|
||||
totalAmount,
|
||||
};
|
||||
},
|
||||
refetchOnWindowFocus: options?.refetchOnWindowFocus ?? true,
|
||||
enabled: (options?.enabled ?? true) && !!products,
|
||||
const totalAmount = items.reduce((sum, item) => sum + item.subtotal, 0);
|
||||
|
||||
return {
|
||||
items,
|
||||
totalItems: items.length,
|
||||
totalAmount,
|
||||
};
|
||||
},
|
||||
refetchOnWindowFocus: options?.refetchOnWindowFocus ?? true,
|
||||
enabled: (options?.enabled ?? true) && !!products,
|
||||
});
|
||||
|
||||
return {
|
||||
data: query.data,
|
||||
isLoading: query.isLoading,
|
||||
error: query.error,
|
||||
refetch: query.refetch,
|
||||
cartItems: query.data?.items ?? [],
|
||||
totalItems: query.data?.totalItems ?? 0,
|
||||
totalPrice: query.data?.totalAmount ?? 0,
|
||||
isEmpty: !(query.data?.items?.length ?? 0),
|
||||
hasItems: Boolean(query.data?.items?.length),
|
||||
};
|
||||
}
|
||||
|
||||
export function useAddToCart(options: MutationOptions<LocalCartItem[], AddToCartVariables> = {}, cartType: CartType = "regular"): UseAddToCartReturn {
|
||||
const queryClient = useQueryClient();
|
||||
|
||||
const mutation: UseMutationResult<LocalCartItem[], Error, AddToCartVariables> = useMutation({
|
||||
mutationFn: async ({ productId, quantity, slotId }: AddToCartVariables): Promise<LocalCartItem[]> => {
|
||||
return await addToLocalCart(productId, quantity, slotId, cartType);
|
||||
},
|
||||
onSuccess: (data: LocalCartItem[], variables: AddToCartVariables) => {
|
||||
queryClient.invalidateQueries({ queryKey: [`local-cart-${cartType}`] });
|
||||
if (options?.showSuccessAlert !== false) {
|
||||
Alert.alert("Success", "Item added to cart!");
|
||||
}
|
||||
options?.onSuccess?.(data, variables);
|
||||
},
|
||||
onError: (error: Error) => {
|
||||
if (options?.showErrorAlert !== false) {
|
||||
Alert.alert("Error", error.message || "Failed to add item to cart");
|
||||
}
|
||||
options?.onError?.(error);
|
||||
},
|
||||
});
|
||||
|
||||
const addToCart = (productId: number, quantity = 1, slotId?: number, onSettled?: (data: LocalCartItem[] | undefined, error: Error | null) => void): void => {
|
||||
if (slotId == null) {
|
||||
throw new Error('slotId is required for adding to cart');
|
||||
}
|
||||
mutation.mutate({ productId, quantity, slotId }, {
|
||||
onSettled: (data: LocalCartItem[] | undefined, error: Error | null) => {
|
||||
onSettled?.(data, error);
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
return {
|
||||
data: query.data,
|
||||
isLoading: query.isLoading,
|
||||
error: query.error,
|
||||
refetch: query.refetch,
|
||||
|
||||
// Computed properties
|
||||
cartItems: query.data?.items || [],
|
||||
totalItems: query.data?.totalItems || 0,
|
||||
totalPrice: query.data?.totalAmount || 0,
|
||||
|
||||
// Helper methods
|
||||
isEmpty: !query.data?.items?.length,
|
||||
hasItems: Boolean(query.data?.items?.length),
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
interface UseAddToCartReturn {
|
||||
mutate: any;
|
||||
mutateAsync: any;
|
||||
isLoading: boolean;
|
||||
error: any;
|
||||
data: any;
|
||||
addToCart: (productId: number, quantity?: number, slotId?: number, onSettled?: (data: any, error: any) => void) => void;
|
||||
addToCartAsync: (productId: number, quantity?: number, slotId?: number) => Promise<any>;
|
||||
}
|
||||
|
||||
export function useAddToCart(options?: {
|
||||
onSuccess?: (data: any, variables: any) => void;
|
||||
onError?: (error: any) => void;
|
||||
showSuccessAlert?: boolean;
|
||||
showErrorAlert?: boolean;
|
||||
refetchCart?: boolean;
|
||||
}, cartType: CartType = "regular"): UseAddToCartReturn {
|
||||
if (CART_MODE === 'remote') {
|
||||
const utils = trpc.useUtils();
|
||||
|
||||
const mutation = trpc.user.cart.addToCart.useMutation({
|
||||
onSuccess: (data, variables) => {
|
||||
// Default success handling
|
||||
if (options?.showSuccessAlert !== false) {
|
||||
Alert.alert("Success", "Item added to cart!");
|
||||
}
|
||||
|
||||
// Auto-refetch cart if requested
|
||||
if (options?.refetchCart) {
|
||||
utils.user.cart.getCart.invalidate();
|
||||
}
|
||||
|
||||
// Custom success callback
|
||||
options?.onSuccess?.(data, variables);
|
||||
},
|
||||
onError: (error) => {
|
||||
// Default error handling
|
||||
if (options?.showErrorAlert !== false) {
|
||||
Alert.alert("Error", error.message || "Failed to add item to cart");
|
||||
}
|
||||
|
||||
// Custom error callback
|
||||
options?.onError?.(error);
|
||||
},
|
||||
}) as any;
|
||||
|
||||
const addToCart = (productId: number, quantity = 1, slotId?: number, onSettled?: (data: any, error: any) => void) => {
|
||||
|
||||
return {
|
||||
mutate: mutation.mutate,
|
||||
mutateAsync: mutation.mutateAsync,
|
||||
isLoading: mutation.isPending,
|
||||
error: mutation.error,
|
||||
data: mutation.data,
|
||||
addToCart,
|
||||
addToCartAsync: (productId: number, quantity = 1, slotId?: number): Promise<LocalCartItem[]> => {
|
||||
if (slotId == null) {
|
||||
throw new Error('slotId is required for adding to cart');
|
||||
}
|
||||
return mutation.mutate({ productId, quantity, slotId }, {
|
||||
onSettled: (data: any, error: any) => {
|
||||
onSettled?.(data, error);
|
||||
}
|
||||
});
|
||||
};
|
||||
return mutation.mutateAsync({ productId, quantity, slotId });
|
||||
},
|
||||
};
|
||||
}
|
||||
|
||||
return {
|
||||
// Original mutation returns
|
||||
mutate: mutation.mutate,
|
||||
mutateAsync: mutation.mutateAsync,
|
||||
isLoading: mutation.isPending,
|
||||
error: mutation.error,
|
||||
data: mutation.data,
|
||||
export function useUpdateCartItem(options: MutationOptions<LocalCartItem[], UpdateCartVariables> = {}, cartType: CartType = "regular"): UseUpdateCartItemReturn {
|
||||
const queryClient = useQueryClient();
|
||||
|
||||
addToCart,
|
||||
|
||||
addToCartAsync: (productId: number, quantity = 1, slotId?: number) => {
|
||||
if (slotId == null) {
|
||||
throw new Error('slotId is required for adding to cart');
|
||||
}
|
||||
return mutation.mutateAsync({ productId, quantity, slotId });
|
||||
},
|
||||
};
|
||||
} else {
|
||||
|
||||
const queryClient = useQueryClient();
|
||||
|
||||
const mutation = useMutation({
|
||||
mutationFn: async ({ productId, quantity, slotId }: { productId: number, quantity: number, slotId: number }) => {
|
||||
return await addToLocalCart(productId, quantity, slotId, cartType);
|
||||
},
|
||||
onSuccess: (data, variables) => {
|
||||
queryClient.invalidateQueries({ queryKey: [`local-cart-${cartType}`] });
|
||||
if (options?.showSuccessAlert !== false) {
|
||||
Alert.alert("Success", "Item added to cart!");
|
||||
}
|
||||
options?.onSuccess?.(data, variables);
|
||||
},
|
||||
onError: (error) => {
|
||||
if (options?.showErrorAlert !== false) {
|
||||
Alert.alert("Error", error.message || "Failed to add item to cart");
|
||||
}
|
||||
options?.onError?.(error);
|
||||
},
|
||||
});
|
||||
|
||||
const addToCart = (productId: number, quantity = 1, slotId?: number, onSettled?: (data: any, error: any) => void) => {
|
||||
|
||||
if (slotId == null) {
|
||||
throw new Error('slotId is required for adding to cart');
|
||||
const mutation: UseMutationResult<LocalCartItem[], Error, UpdateCartVariables> = useMutation({
|
||||
mutationFn: async ({ itemId, quantity }: UpdateCartVariables): Promise<LocalCartItem[]> => {
|
||||
return await updateLocalCartItem(itemId, quantity, cartType);
|
||||
},
|
||||
onSuccess: (data: LocalCartItem[], variables: UpdateCartVariables) => {
|
||||
queryClient.invalidateQueries({ queryKey: [`local-cart-${cartType}`] });
|
||||
if (options?.showSuccessAlert !== false) {
|
||||
Alert.alert("Success", "Cart item updated!");
|
||||
}
|
||||
return mutation.mutate({ productId, quantity, slotId }, {
|
||||
onSettled: (data: any, error: any) => {
|
||||
onSettled?.(data, error);
|
||||
}
|
||||
});
|
||||
};
|
||||
options?.onSuccess?.(data, variables);
|
||||
},
|
||||
onError: (error: Error) => {
|
||||
if (options?.showErrorAlert !== false) {
|
||||
Alert.alert("Error", error.message || "Failed to update cart item");
|
||||
}
|
||||
options?.onError?.(error);
|
||||
},
|
||||
});
|
||||
|
||||
return {
|
||||
mutate: mutation.mutate,
|
||||
mutateAsync: mutation.mutateAsync,
|
||||
isLoading: mutation.isPending,
|
||||
error: mutation.error,
|
||||
data: mutation.data,
|
||||
addToCart,
|
||||
addToCartAsync: (productId: number, quantity = 1, slotId?: number) => {
|
||||
if (slotId == null) {
|
||||
throw new Error('slotId is required for adding to cart');
|
||||
}
|
||||
return mutation.mutateAsync({ productId, quantity, slotId });
|
||||
},
|
||||
};
|
||||
}
|
||||
return {
|
||||
mutate: mutation.mutate,
|
||||
mutateAsync: mutation.mutateAsync,
|
||||
isLoading: mutation.isPending,
|
||||
error: mutation.error,
|
||||
data: mutation.data,
|
||||
updateCartItem: (itemId: number, quantity: number): void =>
|
||||
mutation.mutate({ itemId, quantity }),
|
||||
updateCartItemAsync: (itemId: number, quantity: number): Promise<LocalCartItem[]> =>
|
||||
mutation.mutateAsync({ itemId, quantity }),
|
||||
};
|
||||
}
|
||||
|
||||
export function useUpdateCartItem(options?: {
|
||||
onSuccess?: (data: any, variables: any) => void;
|
||||
onError?: (error: any) => void;
|
||||
showSuccessAlert?: boolean;
|
||||
showErrorAlert?: boolean;
|
||||
refetchCart?: boolean;
|
||||
}, cartType: CartType = "regular") {
|
||||
if (CART_MODE === 'remote') {
|
||||
const utils = trpc.useUtils();
|
||||
export function useRemoveFromCart(options: MutationOptions<LocalCartItem[], RemoveCartVariables> = {}, cartType: CartType = "regular"): UseRemoveFromCartReturn {
|
||||
const queryClient = useQueryClient();
|
||||
|
||||
const mutation = trpc.user.cart.updateCartItem.useMutation({
|
||||
onSuccess: (data, variables) => {
|
||||
// Default success handling
|
||||
if (options?.showSuccessAlert !== false) {
|
||||
Alert.alert("Success", "Cart item updated!");
|
||||
}
|
||||
const mutation: UseMutationResult<LocalCartItem[], Error, RemoveCartVariables> = useMutation({
|
||||
mutationFn: async ({ itemId }: RemoveCartVariables): Promise<LocalCartItem[]> => {
|
||||
return await removeFromLocalCart(itemId, cartType);
|
||||
},
|
||||
onSuccess: (data: LocalCartItem[], variables: RemoveCartVariables) => {
|
||||
queryClient.invalidateQueries({ queryKey: [`local-cart-${cartType}`] });
|
||||
if (options?.showSuccessAlert !== false) {
|
||||
Alert.alert("Success", "Item removed from cart!");
|
||||
}
|
||||
options?.onSuccess?.(data, variables);
|
||||
},
|
||||
onError: (error: Error) => {
|
||||
if (options?.showErrorAlert !== false) {
|
||||
Alert.alert("Error", error.message || "Failed to remove item from cart");
|
||||
}
|
||||
options?.onError?.(error);
|
||||
},
|
||||
});
|
||||
|
||||
// Auto-refetch cart if requested
|
||||
if (options?.refetchCart) {
|
||||
utils.user.cart.getCart.invalidate();
|
||||
}
|
||||
|
||||
// Custom success callback
|
||||
options?.onSuccess?.(data, variables);
|
||||
},
|
||||
onError: (error) => {
|
||||
// Default error handling
|
||||
if (options?.showErrorAlert !== false) {
|
||||
Alert.alert("Error", error.message || "Failed to update cart item");
|
||||
}
|
||||
|
||||
// Custom error callback
|
||||
options?.onError?.(error);
|
||||
},
|
||||
});
|
||||
|
||||
return {
|
||||
// Original mutation returns
|
||||
mutate: mutation.mutate,
|
||||
mutateAsync: mutation.mutateAsync,
|
||||
isLoading: mutation.isPending,
|
||||
error: mutation.error,
|
||||
data: mutation.data,
|
||||
|
||||
// Helper methods
|
||||
updateCartItem: (itemId: number, quantity: number) =>
|
||||
mutation.mutate({ itemId, quantity }),
|
||||
|
||||
updateCartItemAsync: (itemId: number, quantity: number) =>
|
||||
mutation.mutateAsync({ itemId, quantity }),
|
||||
};
|
||||
} else {
|
||||
const queryClient = useQueryClient();
|
||||
|
||||
const mutation = useMutation({
|
||||
mutationFn: async ({ itemId, quantity }: { itemId: number, quantity: number }) => {
|
||||
return await updateLocalCartItem(itemId, quantity, cartType);
|
||||
},
|
||||
onSuccess: (data, variables) => {
|
||||
queryClient.invalidateQueries({ queryKey: [`local-cart-${cartType}`] });
|
||||
if (options?.showSuccessAlert !== false) {
|
||||
Alert.alert("Success", "Cart item updated!");
|
||||
}
|
||||
options?.onSuccess?.(data, variables);
|
||||
},
|
||||
onError: (error) => {
|
||||
if (options?.showErrorAlert !== false) {
|
||||
Alert.alert("Error", error.message || "Failed to update cart item");
|
||||
}
|
||||
options?.onError?.(error);
|
||||
},
|
||||
});
|
||||
|
||||
return {
|
||||
mutate: mutation.mutate,
|
||||
mutateAsync: mutation.mutateAsync,
|
||||
isLoading: mutation.isPending,
|
||||
error: mutation.error,
|
||||
data: mutation.data,
|
||||
|
||||
updateCartItem: (itemId: number, quantity: number) =>
|
||||
mutation.mutate({ itemId, quantity }),
|
||||
|
||||
updateCartItemAsync: (itemId: number, quantity: number) =>
|
||||
mutation.mutateAsync({ itemId, quantity }),
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
export function useRemoveFromCart(options?: {
|
||||
onSuccess?: (data: any, variables: any) => void;
|
||||
onError?: (error: any) => void;
|
||||
showSuccessAlert?: boolean;
|
||||
showErrorAlert?: boolean;
|
||||
refetchCart?: boolean;
|
||||
}, cartType: CartType = "regular") {
|
||||
if (CART_MODE === 'remote') {
|
||||
const utils = trpc.useUtils();
|
||||
|
||||
const mutation = trpc.user.cart.removeFromCart.useMutation({
|
||||
onSuccess: (data, variables) => {
|
||||
// Default success handling
|
||||
if (options?.showSuccessAlert !== false) {
|
||||
Alert.alert("Success", "Item removed from cart!");
|
||||
}
|
||||
|
||||
// Auto-refetch cart if requested
|
||||
if (options?.refetchCart) {
|
||||
utils.user.cart.getCart.invalidate();
|
||||
}
|
||||
|
||||
// Custom success callback
|
||||
options?.onSuccess?.(data, variables);
|
||||
},
|
||||
onError: (error) => {
|
||||
// Default error handling
|
||||
if (options?.showErrorAlert !== false) {
|
||||
Alert.alert("Error", error.message || "Failed to remove item from cart");
|
||||
}
|
||||
|
||||
// Custom error callback
|
||||
options?.onError?.(error);
|
||||
},
|
||||
});
|
||||
|
||||
return {
|
||||
// Original mutation returns
|
||||
mutate: mutation.mutate,
|
||||
mutateAsync: mutation.mutateAsync,
|
||||
isLoading: mutation.isPending,
|
||||
error: mutation.error,
|
||||
data: mutation.data,
|
||||
|
||||
// Helper methods
|
||||
removeFromCart: (itemId: number) =>
|
||||
mutation.mutate({ itemId }),
|
||||
|
||||
removeFromCartAsync: (itemId: number) =>
|
||||
mutation.mutateAsync({ itemId }),
|
||||
};
|
||||
} else {
|
||||
const queryClient = useQueryClient();
|
||||
|
||||
const mutation = useMutation({
|
||||
mutationFn: async ({ itemId }: { itemId: number }) => {
|
||||
return await removeFromLocalCart(itemId, cartType);
|
||||
},
|
||||
onSuccess: (data, variables) => {
|
||||
queryClient.invalidateQueries({ queryKey: [`local-cart-${cartType}`] });
|
||||
if (options?.showSuccessAlert !== false) {
|
||||
Alert.alert("Success", "Item removed from cart!");
|
||||
}
|
||||
options?.onSuccess?.(data, variables);
|
||||
},
|
||||
onError: (error) => {
|
||||
if (options?.showErrorAlert !== false) {
|
||||
Alert.alert("Error", error.message || "Failed to remove item from cart");
|
||||
}
|
||||
options?.onError?.(error);
|
||||
},
|
||||
});
|
||||
|
||||
return {
|
||||
mutate: mutation.mutate,
|
||||
mutateAsync: mutation.mutateAsync,
|
||||
isLoading: mutation.isPending,
|
||||
error: mutation.error,
|
||||
data: mutation.data,
|
||||
|
||||
removeFromCart: (itemId: number) =>
|
||||
mutation.mutate({ itemId }),
|
||||
|
||||
removeFromCartAsync: (itemId: number) =>
|
||||
mutation.mutateAsync({ itemId }),
|
||||
};
|
||||
}
|
||||
return {
|
||||
mutate: mutation.mutate,
|
||||
mutateAsync: mutation.mutateAsync,
|
||||
isLoading: mutation.isPending,
|
||||
error: mutation.error,
|
||||
data: mutation.data,
|
||||
removeFromCart: (itemId: number): void =>
|
||||
mutation.mutate({ itemId }),
|
||||
removeFromCartAsync: (itemId: number): Promise<LocalCartItem[]> =>
|
||||
mutation.mutateAsync({ itemId }),
|
||||
};
|
||||
}
|
||||
|
||||
// Export clear cart function for direct use
|
||||
|
|
|
|||
|
|
@ -1,46 +1,28 @@
|
|||
import { trpc } from '@/src/trpc-client';
|
||||
import dayjs from 'dayjs';
|
||||
import { useCentralSlotStore } from '@/src/store/centralSlotStore';
|
||||
|
||||
export function useProductSlotIdentifier() {
|
||||
// Fetch all slots with products
|
||||
const { data: slotsData, isLoading: isProductsLoading } = trpc.user.slots.getSlotsWithProducts.useQuery();
|
||||
|
||||
|
||||
const productSlotsMap = new Map<number, number[]>();
|
||||
|
||||
if (slotsData?.slots) {
|
||||
const now = dayjs();
|
||||
|
||||
// Build map of productId to available slot IDs
|
||||
slotsData.slots.forEach(slot => {
|
||||
if (dayjs(slot.deliveryTime).isAfter(now)) {
|
||||
slot.products.forEach(product => {
|
||||
if (!productSlotsMap.has(product.id)) {
|
||||
productSlotsMap.set(product.id, []);
|
||||
}
|
||||
productSlotsMap.get(product.id)!.push(slot.id);
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
// Get slots data from central store
|
||||
const slots = useCentralSlotStore((state) => state.slots);
|
||||
const productSlotsMap = useCentralSlotStore((state) => state.productSlotsMap);
|
||||
|
||||
const getQuickestSlot = (productId: number): number | null => {
|
||||
|
||||
if (!slotsData?.slots) return null;
|
||||
if (!slots?.length) return null;
|
||||
|
||||
const now = dayjs();
|
||||
const productInfo = productSlotsMap[productId];
|
||||
|
||||
if (!productInfo?.slots?.length) return null;
|
||||
|
||||
// Find slots that contain this product and have future delivery time
|
||||
const availableSlots = slotsData.slots.filter(slot =>
|
||||
slot.products.some(product => product.id === productId) &&
|
||||
const availableSlots = productInfo.slots.filter((slot: any) =>
|
||||
dayjs(slot.deliveryTime).isAfter(now)
|
||||
);
|
||||
// if(productId === 98)
|
||||
// console.log(JSON.stringify(slotsData))
|
||||
|
||||
if (availableSlots.length === 0) return null;
|
||||
|
||||
// Return earliest slot ID (sorted by delivery time)
|
||||
const earliestSlot = availableSlots.sort((a, b) =>
|
||||
const earliestSlot = availableSlots.sort((a: any, b: any) =>
|
||||
dayjs(a.deliveryTime).diff(dayjs(b.deliveryTime))
|
||||
)[0];
|
||||
|
||||
|
|
|
|||
|
|
@ -1,6 +1,19 @@
|
|||
// Learn more on how to setup config for the app: https://docs.expo.dev/guides/config-plugins/#metro-config
|
||||
const { getDefaultConfig } = require('expo/metro-config');
|
||||
const path = require('path');
|
||||
|
||||
const config = getDefaultConfig(__dirname);
|
||||
|
||||
// Add the packages directory to watch folders
|
||||
config.watchFolders = [
|
||||
...config.watchFolders || [],
|
||||
path.resolve(__dirname, '../../packages/shared'),
|
||||
];
|
||||
|
||||
// Configure module resolution for @packages/*
|
||||
config.resolver.extraNodeModules = {
|
||||
...config.resolver.extraNodeModules,
|
||||
'@packages/shared': path.resolve(__dirname, '../../packages/shared'),
|
||||
};
|
||||
|
||||
module.exports = config;
|
||||
|
|
|
|||
|
|
@ -5,9 +5,8 @@ import { tw, BottomDialog, MyText, MyTouchableOpacity, Quantifier } from 'common
|
|||
import MaterialIcons from '@expo/vector-icons/MaterialIcons';
|
||||
import { useCartStore } from '@/src/store/cartStore';
|
||||
import { useFlashCartStore } from '@/src/store/flashCartStore';
|
||||
import { trpc } from '@/src/trpc-client';
|
||||
import { useAddToCart, useGetCart, useUpdateCartItem, useRemoveFromCart } from '@/hooks/cart-query-hooks';
|
||||
import { useGetEssentialConsts } from '@/src/hooks/prominent-api-hooks';
|
||||
import { useGetEssentialConsts, useSlots } from '@/src/hooks/prominent-api-hooks';
|
||||
import dayjs from 'dayjs';
|
||||
import { SafeAreaView } from 'react-native-safe-area-context';
|
||||
|
||||
|
|
@ -31,7 +30,7 @@ export default function AddToCartDialog() {
|
|||
const [selectedSlotId, setSelectedSlotId] = useState<number | null>(null);
|
||||
const [selectedFlashDelivery, setSelectedFlashDelivery] = useState(false);
|
||||
|
||||
const { data: slotsData } = trpc.user.slots.getSlotsWithProducts.useQuery();
|
||||
const { data: slotsData } = useSlots();
|
||||
const { data: cartData } = useGetCart();
|
||||
const { data: constsData } = useGetEssentialConsts();
|
||||
// const isFlashDeliveryEnabled = constsData?.isFlashDeliveryEnabled === true;
|
||||
|
|
|
|||
14
apps/user-ui/src/components/CentralStoreInitializer.tsx
Normal file
14
apps/user-ui/src/components/CentralStoreInitializer.tsx
Normal file
|
|
@ -0,0 +1,14 @@
|
|||
import React from 'react';
|
||||
import { useInitializeCentralSlotStore } from '@/src/store/centralSlotStore';
|
||||
import { useInitializeCentralProductStore } from '@/src/store/centralProductStore';
|
||||
|
||||
interface CentralStoreInitializerProps {
|
||||
children: React.ReactNode;
|
||||
}
|
||||
|
||||
export default function CentralStoreInitializer({ children }: CentralStoreInitializerProps) {
|
||||
useInitializeCentralSlotStore();
|
||||
useInitializeCentralProductStore();
|
||||
|
||||
return <>{children}</>;
|
||||
}
|
||||
|
|
@ -1,7 +1,8 @@
|
|||
import { useQuery } from '@tanstack/react-query'
|
||||
import axios from 'axios'
|
||||
import { trpc } from '@/src/trpc-client'
|
||||
import { AllProductsApiType, StoresApiType, SlotsApiType, EssentialConstsApiType } from "@backend/trpc/router";
|
||||
import { AllProductsApiType, StoresApiType, SlotsApiType, EssentialConstsApiType, BannersApiType, StoreWithProductsApiType } from "@backend/trpc/router";
|
||||
import { CACHE_FILENAMES } from "@packages/shared";
|
||||
|
||||
// Local useGetEssentialConsts hook
|
||||
export const useGetEssentialConsts = () => {
|
||||
|
|
@ -15,6 +16,8 @@ type ProductsResponse = AllProductsApiType;
|
|||
type StoresResponse = StoresApiType;
|
||||
type SlotsResponse = SlotsApiType;
|
||||
type EssentialConstsResponse = EssentialConstsApiType;
|
||||
type BannersResponse = BannersApiType;
|
||||
type StoreWithProductsResponse = StoreWithProductsApiType;
|
||||
|
||||
function useCacheUrl(filename: string): string | null {
|
||||
const { data: essentialConsts } = useGetEssentialConsts()
|
||||
|
|
@ -28,7 +31,7 @@ function useCacheUrl(filename: string): string | null {
|
|||
}
|
||||
|
||||
export function useAllProducts() {
|
||||
const cacheUrl = useCacheUrl('products.json')
|
||||
const cacheUrl = useCacheUrl(CACHE_FILENAMES.products)
|
||||
|
||||
return useQuery<ProductsResponse>({
|
||||
queryKey: ['all-products', cacheUrl],
|
||||
|
|
@ -45,7 +48,7 @@ export function useAllProducts() {
|
|||
}
|
||||
|
||||
export function useStores() {
|
||||
const cacheUrl = useCacheUrl('stores.json')
|
||||
const cacheUrl = useCacheUrl(CACHE_FILENAMES.stores)
|
||||
|
||||
return useQuery<StoresResponse>({
|
||||
queryKey: ['stores', cacheUrl],
|
||||
|
|
@ -62,7 +65,7 @@ export function useStores() {
|
|||
}
|
||||
|
||||
export function useSlots() {
|
||||
const cacheUrl = useCacheUrl('slots.json')
|
||||
const cacheUrl = useCacheUrl(CACHE_FILENAMES.slots)
|
||||
|
||||
return useQuery<SlotsResponse>({
|
||||
queryKey: ['slots', cacheUrl],
|
||||
|
|
@ -77,3 +80,46 @@ export function useSlots() {
|
|||
enabled: !!cacheUrl,
|
||||
})
|
||||
}
|
||||
|
||||
export function useBanners() {
|
||||
const cacheUrl = useCacheUrl(CACHE_FILENAMES.banners)
|
||||
|
||||
return useQuery<BannersResponse>({
|
||||
queryKey: ['banners', cacheUrl],
|
||||
queryFn: async () => {
|
||||
|
||||
if (!cacheUrl) {
|
||||
throw new Error('Cache URL not available')
|
||||
}
|
||||
const response = await axios.get<BannersResponse>(cacheUrl)
|
||||
return response.data
|
||||
|
||||
},
|
||||
staleTime: 60000, // 1 minute
|
||||
enabled: !!cacheUrl,
|
||||
})
|
||||
}
|
||||
|
||||
export function useStoreWithProducts(storeId: number) {
|
||||
const { data: essentialConsts } = useGetEssentialConsts()
|
||||
|
||||
const assetsDomain = essentialConsts?.assetsDomain
|
||||
const apiCacheKey = essentialConsts?.apiCacheKey
|
||||
|
||||
const cacheUrl = assetsDomain && apiCacheKey
|
||||
? `${assetsDomain}${apiCacheKey}/stores/${storeId}.json`
|
||||
: null
|
||||
|
||||
return useQuery<StoreWithProductsResponse>({
|
||||
queryKey: ['store-with-products', storeId, cacheUrl],
|
||||
queryFn: async () => {
|
||||
if (!cacheUrl) {
|
||||
throw new Error('Cache URL not available')
|
||||
}
|
||||
const response = await axios.get<StoreWithProductsResponse>(cacheUrl)
|
||||
return response.data
|
||||
},
|
||||
staleTime: 60000, // 1 minute
|
||||
enabled: !!cacheUrl,
|
||||
})
|
||||
}
|
||||
|
|
|
|||
41
apps/user-ui/src/store/centralProductStore.ts
Normal file
41
apps/user-ui/src/store/centralProductStore.ts
Normal file
|
|
@ -0,0 +1,41 @@
|
|||
import { create } from 'zustand'
|
||||
import { useEffect } from 'react'
|
||||
import { useAllProducts } from '@/src/hooks/prominent-api-hooks'
|
||||
import { AllProductsApiType } from '@backend/trpc/router'
|
||||
|
||||
type Product = AllProductsApiType['products'][number] & {
|
||||
flashPrice?: number | null
|
||||
}
|
||||
|
||||
interface CentralProductState {
|
||||
products: Product[]
|
||||
productsById: Record<number, Product>
|
||||
setProducts: (products: Product[]) => void
|
||||
clearProducts: () => void
|
||||
}
|
||||
|
||||
export const useCentralProductStore = create<CentralProductState>((set) => ({
|
||||
products: [],
|
||||
productsById: {},
|
||||
setProducts: (products) => {
|
||||
const productsById: Record<number, Product> = {}
|
||||
|
||||
products.forEach((product) => {
|
||||
productsById[product.id] = product
|
||||
})
|
||||
|
||||
set({ products, productsById })
|
||||
},
|
||||
clearProducts: () => set({ products: [], productsById: {} }),
|
||||
}))
|
||||
|
||||
export function useInitializeCentralProductStore() {
|
||||
const { data: productsData } = useAllProducts()
|
||||
const setProducts = useCentralProductStore((state) => state.setProducts)
|
||||
|
||||
useEffect(() => {
|
||||
if (productsData?.products) {
|
||||
setProducts(productsData.products)
|
||||
}
|
||||
}, [productsData, setProducts])
|
||||
}
|
||||
60
apps/user-ui/src/store/centralSlotStore.ts
Normal file
60
apps/user-ui/src/store/centralSlotStore.ts
Normal file
|
|
@ -0,0 +1,60 @@
|
|||
import { create } from 'zustand';
|
||||
import { useSlots } from '@/src/hooks/prominent-api-hooks';
|
||||
import { useEffect } from 'react';
|
||||
import { SlotsApiType } from "@backend/trpc/router";
|
||||
|
||||
type Slot = SlotsApiType['slots'][number];
|
||||
type ProductAvailability = SlotsApiType['productAvailability'][number];
|
||||
|
||||
interface ProductSlotInfo {
|
||||
slots: Slot[];
|
||||
isOutOfStock: boolean;
|
||||
isFlashAvailable: boolean;
|
||||
}
|
||||
|
||||
interface CentralSlotState {
|
||||
slots: Slot[];
|
||||
productSlotsMap: Record<number, ProductSlotInfo>;
|
||||
setSlotsData: (slots: Slot[], productAvailability: ProductAvailability[]) => void;
|
||||
clearSlotsData: () => void;
|
||||
}
|
||||
|
||||
export const useCentralSlotStore = create<CentralSlotState>((set) => ({
|
||||
slots: [],
|
||||
productSlotsMap: {},
|
||||
setSlotsData: (slots, productAvailability) => {
|
||||
const productSlotsMap: Record<number, ProductSlotInfo> = {};
|
||||
|
||||
// First, create entries for ALL products from productAvailability
|
||||
productAvailability.forEach((product) => {
|
||||
productSlotsMap[product.id] = {
|
||||
slots: [],
|
||||
isOutOfStock: product.isOutOfStock,
|
||||
isFlashAvailable: product.isFlashAvailable,
|
||||
};
|
||||
});
|
||||
|
||||
// Then, populate slots for products that appear in delivery slots
|
||||
slots.forEach((slot) => {
|
||||
slot.products?.forEach((product) => {
|
||||
if (productSlotsMap[product.id]) {
|
||||
productSlotsMap[product.id].slots.push(slot);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
set({ slots, productSlotsMap });
|
||||
},
|
||||
clearSlotsData: () => set({ slots: [], productSlotsMap: {} }),
|
||||
}));
|
||||
|
||||
export function useInitializeCentralSlotStore() {
|
||||
const { data: slotsData } = useSlots();
|
||||
const setSlotsData = useCentralSlotStore((state) => state.setSlotsData);
|
||||
|
||||
useEffect(() => {
|
||||
if (slotsData?.slots) {
|
||||
setSlotsData(slotsData.slots, slotsData.productAvailability || []);
|
||||
}
|
||||
}, [slotsData, setSlotsData]);
|
||||
}
|
||||
|
|
@ -18,6 +18,12 @@
|
|||
],
|
||||
"common-ui/*": [
|
||||
"../../packages/ui/*"
|
||||
],
|
||||
"@packages/shared": [
|
||||
"../../packages/shared"
|
||||
],
|
||||
"@packages/shared/*": [
|
||||
"../../packages/shared/*"
|
||||
]
|
||||
},
|
||||
"moduleSuffixes": [
|
||||
|
|
@ -34,5 +40,6 @@
|
|||
"**/*.tsx",
|
||||
".expo/types/**/*.ts",
|
||||
"expo-env.d.ts",
|
||||
"../../packages/shared"
|
||||
]
|
||||
}
|
||||
8
package-lock.json
generated
8
package-lock.json
generated
|
|
@ -5673,6 +5673,10 @@
|
|||
"node": ">=8.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@packages/shared": {
|
||||
"resolved": "packages/shared",
|
||||
"link": true
|
||||
},
|
||||
"node_modules/@pkgjs/parseargs": {
|
||||
"version": "0.11.0",
|
||||
"resolved": "https://registry.npmjs.org/@pkgjs/parseargs/-/parseargs-0.11.0.tgz",
|
||||
|
|
@ -25541,6 +25545,10 @@
|
|||
}
|
||||
}
|
||||
},
|
||||
"packages/shared": {
|
||||
"name": "@packages/shared",
|
||||
"version": "1.0.0"
|
||||
},
|
||||
"packages/ui": {
|
||||
"name": "common-ui",
|
||||
"version": "1.0.0",
|
||||
|
|
|
|||
9
packages/shared/index.ts
Normal file
9
packages/shared/index.ts
Normal file
|
|
@ -0,0 +1,9 @@
|
|||
export const CACHE_FILENAMES = {
|
||||
products: 'products.json',
|
||||
stores: 'stores.json',
|
||||
slots: 'slots.json',
|
||||
essentialConsts: 'essential-consts.json',
|
||||
banners: 'banners.json',
|
||||
} as const
|
||||
|
||||
export type CacheFilename = typeof CACHE_FILENAMES[keyof typeof CACHE_FILENAMES]
|
||||
7
packages/shared/package.json
Normal file
7
packages/shared/package.json
Normal file
|
|
@ -0,0 +1,7 @@
|
|||
{
|
||||
"name": "@packages/shared",
|
||||
"version": "1.0.0",
|
||||
"main": "index.ts",
|
||||
"types": "index.ts",
|
||||
"private": true
|
||||
}
|
||||
Loading…
Add table
Reference in a new issue