Skip to content

Commit

Permalink
load scraped data
Browse files Browse the repository at this point in the history
  • Loading branch information
@mulundapm
mulundapm committed Aug 28, 2024
1 parent 90aecc8 commit 53cc8f6
Show file tree
Hide file tree
Showing 5 changed files with 41 additions and 46 deletions.
2 changes: 1 addition & 1 deletion .gitignore
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,6 @@ yarn-debug.log*
yarn-error.log*

.env

path
# eslint cache
.eslintcache
37 changes: 18 additions & 19 deletions src/Components/HighlightedDish.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,41 +9,41 @@ import { useEffect } from 'react';
import { FavoriteContext } from '../Contexts/FavoriteDishes';
import { useContext } from 'react';
// import FavouriteDishes from './FavouriteDishes';
import { db , storage} from '../config/firebase'
import { getDocs , getDoc, collectionGroup, doc as firestoreDoc, collection, getCountFromServer, getAggregateFromServer, average} from 'firebase/firestore'
import { getDownloadURL, ref } from 'firebase/storage';
import { db } from '../config/firebase'
import { getDocs , getDoc, collectionGroup, doc as firestoreDoc} from 'firebase/firestore'


function HighlightedDish() {

const [foodList, setFoodList] =useState([])
const [availableDishes, setAvailableDishes] = useState([]);
const {favoriteDishes, setFavoriteDishes} = useContext(FavoriteContext);
const menuItemCollectionRef = collectionGroup(db, "menu-items")
const menuItemCollectionRef = collectionGroup(db, "menu_items")
const [loading, setLoading] = useState(true)


useEffect(()=>{
const getfoodList = async () =>{
try {
const menuItem = await getDocs(menuItemCollectionRef);
const foodListWithUrls = await Promise.all(menuItem.docs.map(async (doc) => {
const loadedFoodList = await Promise.all(menuItem.docs.map(async (doc) => {
const docData = doc.data();

const imageRef = ref(storage, docData.img);
const imageUrl = await getDownloadURL(imageRef);
// const imageRef = ref(storage, docData.img);
// const imageUrl = await getDownloadURL(imageRef);

const restaurantID = doc.ref.parent.parent.id;
const restaurantRef = firestoreDoc(db, 'restaurants', restaurantID);
const restaurantDoc = await getDoc(restaurantRef)
const restaurantData = restaurantDoc.exists() ? restaurantDoc.data() : {};

const reviewsRef = collection(db, 'restaurants', restaurantID, 'reviews');
const reviewsCount = await getCountFromServer(reviewsRef)
const reviewsAverage = await getAggregateFromServer(reviewsRef, {averageRating: average("rating")})
// const reviewsRef = collection(db, 'restaurants', restaurantID, 'reviews');
// const reviewsCount = await getCountFromServer(reviewsRef)
// const reviewsAverage = await getAggregateFromServer(reviewsRef, {averageRating: average("rating")})

return { ...docData, id: doc.id, fullPath: imageUrl, restaurantID: restaurantID, restaurantData, counts: reviewsCount.data().count, ratings: reviewsAverage.data().averageRating};
return { ...docData, id: doc.id, restaurantID: restaurantID, restaurantData};
}));
setFoodList(foodListWithUrls);
setFoodList(loadedFoodList);
// console.log(foodListWithUrls)
} catch (err) {
console.error(err);
Expand All @@ -67,8 +67,7 @@ function HighlightedDish() {
const memoizedAvailableDishes = useMemo(() => randomiseDishes([...foodList]), [foodList]);

useEffect(() => {
setAvailableDishes(memoizedAvailableDishes);
console.log(memoizedAvailableDishes)
setAvailableDishes(memoizedAvailableDishes.slice(0, 30));
}, [memoizedAvailableDishes]);


Expand Down Expand Up @@ -102,17 +101,17 @@ function HighlightedDish() {
{ availableDishes.length > 0 ? availableDishes.map((dish, index) => (
<div key={index} className="card">
<Link to={`restaurant/${dish.restaurantID}` }>
<img className="main-image" alt={dish.name} src={dish.fullPath}/>
<img className="main-image" alt={dish.restaurantData.name} src={dish.image}/>
<div className="float-text">
<Stack direction="row" spacing={1}>
<h2>{dish.name}</h2>
<h3>{dish.restaurantData.name}</h3>
{/* <Chip label={dish.type} variant="outlined" color='primary'/>
<Chip label="Popular" variant="outlined" color='primary'/> */}
</Stack>
<h3>{dish.restaurantData.name}</h3>
<h4>{dish.restaurantData.cuisine}</h4>
<div className="inline">
<Rating name="disabled" value={dish.ratings} readOnly/>
<h6>{dish.counts} reviews</h6>
<Rating name="disabled" value={dish.restaurantData.rating} readOnly/>
<h6>{dish.restaurantData.reviews} reviews</h6>
</div>
</div>
</Link>
Expand Down
5 changes: 2 additions & 3 deletions src/Components/ImageSlider.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,8 +10,7 @@ function ImageSlider({menuItems}) {
const loadMenuItems = async () => {
const updatedItems = await Promise.all(
menuItems.map(async (item) => {
const imageUrl = await getDownloadURL(ref(storage, item.img));
return { ...item, img: imageUrl };
return { ...item };
})
);
setUpdatedMenuItems(updatedItems);
Expand All @@ -24,7 +23,7 @@ function ImageSlider({menuItems}) {
<div className='slider-container'>
{updatedMenuItems.map((item, index) => (
<div key={index} className='slider-item'>
<img src={item.img} alt={item.name} className='slider-image' />
<img src={item.image} alt={item.name} className='slider-image' />
<p className='center'>{item.name}</p>
</div>
))
Expand Down
39 changes: 18 additions & 21 deletions src/Components/RestaurantDetails.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -23,26 +23,23 @@ function RestaurantDetails() {
const restaurantRef = firestoreDoc(db, 'restaurants', restaurantID);
const restaurantDoc = await getDoc(restaurantRef);
const restaurantData = restaurantDoc.exists() ? restaurantDoc.data() : {};
// const environmentImage = await getDownloadURL(ref(storage, restaurantData.interior))

// const reviewsRef = collection(db, 'restaurants', restaurantID, 'reviews');
// const reviewSnap = await getDocs(reviewsRef);
// const reviewsData = reviewSnap.docs.map(doc => doc.data());
const reviewsRef = collection(db, 'restaurants', restaurantID, 'reviews');
const reviewSnap = await getDocs(reviewsRef);
const reviewsData = reviewSnap.docs.map(doc => doc.data());

const menuItemRef = collection(db, 'restaurants', restaurantID, 'menu_items')
const menuItemSnap = await getDocs(menuItemRef)
const menuItemData = menuItemSnap.docs.map(doc => doc.data())

// const menuItemRef = collection(db, 'restaurants', restaurantID, 'menu-items')
// const menuItemSnap = await getDocs(menuItemRef)
// const menuItemData = menuItemSnap.docs.map(doc => doc.data())

// const reviewsCount = await getCountFromServer(reviewsRef)
// const reviewsAverage = await getAggregateFromServer(reviewsRef, {averageRating: average("rating")})


setThisRestaurant({...restaurantData
// interiorUrl: environmentImage,
// reviews: reviewsData,
// menuItems: menuItemData,
// counts: reviewsCount.data().count,
// ratings: reviewsAverage.data().averageRating
setThisRestaurant({...restaurantData,
reviews: reviewsData,
menuItems: menuItemData
});
} catch (err) {
console.error(err);
Expand All @@ -69,19 +66,19 @@ function RestaurantDetails() {
<div>
<img src={thisRestaurant.interior} alt="Restaurant" className='restaurant-image center'/>
<h2>{thisRestaurant.name}</h2>
<p>{thisRestaurant.address}</p>
<p>{thisRestaurant.full_address}</p>
<h4>{thisRestaurant.cuisine}</h4>
{/* <div className="inline">
<Rating name="disabled" value={thisRestaurant.ratings}/>
<h6>{thisRestaurant.counts} Reviews</h6>
</div> */}
<div className="inline">
<Rating name="disabled" value={thisRestaurant.rating}/>
<h6>{thisRestaurant.review_count} Reviews</h6>
</div>
<h2>Featured Dishes</h2>
{/* <ImageSlider menuItems={thisRestaurant.menuItems}/> */}
<ImageSlider menuItems={thisRestaurant.menuItems}/>
<div className="container center">
<Link to={thisRestaurant.website}><button className='primary-button'>Reserve a table</button></Link>
</div>
{/* <Reviews reviews={thisRestaurant.reviews}/> */}
{/* <RestaurantMap address={thisRestaurant.address}/> */}
<Reviews reviews={thisRestaurant.reviews}/>
<RestaurantMap address={thisRestaurant.full_address}/>
</div>
)
}
Expand Down
4 changes: 2 additions & 2 deletions src/Components/Reviews.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,10 +8,10 @@ return (
{reviews.map((review, index)=>(
<div key={index}>
<div className="inline">
<h5>{review.title}</h5>
<h5>{review.name}</h5>
<Rating name="disabled" value={review.rating} readOnly/>
</div>
<p>{review.description}</p>
<p>{review.review_text}</p>
<br />
</div>
))}
Expand Down

0 comments on commit 53cc8f6

Please sign in to comment.