Skip to content

Commit 9f661b5

Browse files
committed
Feat: boiler-plate code
1 parent 0958235 commit 9f661b5

File tree

16 files changed

+140
-524
lines changed

16 files changed

+140
-524
lines changed

hackerrank.yml

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,8 +7,8 @@ configuration:
77
- junit.xml
88
readonly_paths:
99
- src/test/*
10+
- src/data/*
1011
- src/index.js
11-
- src/data.json
1212
ide_config:
1313
default_open_files:
1414
- src/App.js

src/App.css

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,4 +3,8 @@ button {
33
}
44
button:hover{
55
box-shadow: none;
6-
}
6+
}
7+
8+
.coupon-modal[disabled]{
9+
display: none;
10+
}

src/components/ContactUs.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ import Navbar from "./Navbar/Navbar";
44
const ContactUs = () => {
55
return (
66
<>
7-
<Navbar searchTerm="" setSearchTerm={() => {}} likedProperties={[]} />
7+
<Navbar/>
88
<div data-testid="contact-us-page" className="max-w-2xl mx-auto p-8 bg-white shadow-lg rounded-lg m-14">
99
<h1 className="text-3xl font-bold mb-8 text-center text-gray-800">
1010
Contact Us

src/components/HomePage.js

Lines changed: 16 additions & 145 deletions
Original file line numberDiff line numberDiff line change
@@ -1,159 +1,30 @@
1-
import React, { useState } from "react";
1+
import React from "react";
22
import PropertyCard from "./PropertyCard";
3-
import FilterModal from "./Modals/FilterModal";
43
import propertiesData from "../data/properties.json";
54
import Navbar from "./Navbar/Navbar";
5+
// import FilterModal from "./Modals/FilterModal";
66

7-
const HomePage = ({ user, setUser }) => {
8-
const [searchTerm, setSearchTerm] = useState("");
9-
const [isFilterModalOpen, setIsFilterModalOpen] = useState(false);
10-
const [likedProperties, setLikedProperties] = useState([]);
11-
12-
const [tempAmenitiesFilter, setTempAmenitiesFilter] = useState([]);
13-
const [tempRatingFilter, setTempRatingFilter] = useState("");
14-
const [tempPriceFilter, setTempPriceFilter] = useState([90, 400]);
15-
16-
const [amenitiesFilter, setAmenitiesFilter] = useState([]);
17-
const [ratingFilter, setRatingFilter] = useState("");
18-
const [priceFilter, setPriceFilter] = useState([90, 400]);
19-
20-
const properties = propertiesData.properties;
21-
22-
const [minPrice, maxPrice] = properties.reduce(
23-
([min, max], property) => {
24-
const price = parseInt(
25-
property.price.replace("$", "").replace("/night", "")
26-
);
27-
return [Math.min(min, price), Math.max(max, price)];
28-
},
29-
[Infinity, -Infinity]
30-
);
31-
32-
const uniqueAmenities = Array.from(
33-
new Set(properties.flatMap((property) => property.amenities))
34-
);
35-
36-
let filteredProperties = properties.filter((property) => {
37-
const matchesAmenities = amenitiesFilter.length
38-
? amenitiesFilter.every((amenity) => property.amenities.includes(amenity))
39-
: true;
40-
41-
const matchesRating = ratingFilter
42-
? (() => {
43-
const [min, max] = ratingFilter.split("-").map(Number);
44-
return property.rating >= min && (max ? property.rating < max : true);
45-
})()
46-
: true;
47-
48-
const matchesPrice = (() => {
49-
const [min, max] = priceFilter;
50-
const price = parseInt(
51-
property.price.replace("$", "").replace("/night", "")
52-
);
53-
return price >= min && price <= max;
54-
})();
55-
56-
const matchesSearch = property.name
57-
.toLowerCase()
58-
.includes(searchTerm.toLowerCase());
59-
60-
return matchesAmenities && matchesRating && matchesSearch && matchesPrice;
61-
});
62-
63-
const handleApplyFilters = () => {
64-
setAmenitiesFilter(tempAmenitiesFilter);
65-
setRatingFilter(tempRatingFilter);
66-
setPriceFilter(tempPriceFilter);
67-
setIsFilterModalOpen(false);
68-
};
69-
70-
const handleClearFilters = () => {
71-
setTempAmenitiesFilter([]);
72-
setTempRatingFilter("");
73-
setTempPriceFilter([90, 400]);
74-
75-
setAmenitiesFilter([]);
76-
setRatingFilter("");
77-
setPriceFilter([90, 400]);
78-
setIsFilterModalOpen(false);
79-
};
80-
81-
const handleCloseModal = () => {
82-
setTempAmenitiesFilter(amenitiesFilter);
83-
setTempRatingFilter(ratingFilter);
84-
setTempPriceFilter(priceFilter);
85-
setIsFilterModalOpen(false);
86-
};
87-
88-
const toggleLikeProperty = (propertyId) => {
89-
setLikedProperties((prevLikedProperties) =>
90-
prevLikedProperties.includes(propertyId)
91-
? prevLikedProperties.filter((id) => id !== propertyId)
92-
: [...prevLikedProperties, propertyId]
93-
);
94-
};
95-
7+
const HomePage = () => {
968
return (
979
<div className="bg-gray-50 min-h-screen">
98-
<Navbar
99-
searchTerm={searchTerm}
100-
setSearchTerm={setSearchTerm}
101-
likedProperties={likedProperties}
102-
amenitiesFilter={tempAmenitiesFilter}
103-
setAmenitiesFilter={setTempAmenitiesFilter}
104-
ratingFilter={tempRatingFilter}
105-
setRatingFilter={setTempRatingFilter}
106-
priceFilter={tempPriceFilter}
107-
setPriceFilter={setTempPriceFilter}
108-
uniqueAmenities={uniqueAmenities}
109-
onClear={handleClearFilters}
110-
onApply={handleApplyFilters}
111-
minPrice={minPrice}
112-
maxPrice={maxPrice}
113-
user={user}
114-
setUser={setUser}
115-
/>
116-
10+
<Navbar />
11711
<main className="max-w-6xl mx-auto mt-20 px-4 pt-12 pb-8">
11812
<div className="grid md:grid-cols-4 gap-6">
119-
{filteredProperties.length > 0 ? (
120-
filteredProperties.map((property) => (
121-
<PropertyCard
122-
key={property.id}
123-
property={property}
124-
isLiked={likedProperties.includes(property.id)}
125-
toggleLike={() => toggleLikeProperty(property.id)}
126-
/>
127-
))
128-
) : (
129-
<div className="col-span-4 text-center py-12">
130-
<p
131-
data-testid="conditional-message"
132-
className="text-xl text-gray-600"
133-
>
134-
No rental properties found
135-
</p>
136-
</div>
137-
)}
13+
{propertiesData.properties.map((property) => (
14+
<PropertyCard key={property.id} property={property} />
15+
))}
16+
<div className="col-span-4 text-center py-12">
17+
{/* <p
18+
data-testid="conditional-message"
19+
className="text-xl text-gray-600"
20+
>
21+
No rental properties found
22+
</p> */}
23+
</div>
13824
</div>
13925
</main>
14026

141-
{isFilterModalOpen && (
142-
<FilterModal
143-
onClose={handleCloseModal}
144-
amenitiesFilter={tempAmenitiesFilter}
145-
setAmenitiesFilter={setTempAmenitiesFilter}
146-
ratingFilter={tempRatingFilter}
147-
setRatingFilter={setTempRatingFilter}
148-
priceFilter={tempPriceFilter}
149-
setPriceFilter={setTempPriceFilter}
150-
uniqueAmenities={uniqueAmenities}
151-
onClear={handleClearFilters}
152-
onApply={handleApplyFilters}
153-
minPrice={minPrice}
154-
maxPrice={maxPrice}
155-
/>
156-
)}
27+
{/* <FilterModal/> */}
15728
</div>
15829
);
15930
};

src/components/Login.js

Lines changed: 5 additions & 51 deletions
Original file line numberDiff line numberDiff line change
@@ -1,49 +1,8 @@
1-
import React, { useState } from "react";
2-
import usersData from "../data/users.json";
3-
import { useNavigate } from "react-router-dom";
4-
import { ToastContainer, toast } from "react-toastify";
1+
import React from "react";
2+
import { ToastContainer } from "react-toastify";
3+
// import usersData from "../data/users.json";
54

6-
const Login = ({ setUser }) => {
7-
const [email, setEmail] = useState("");
8-
const [password, setPassword] = useState("");
9-
const [error, setError] = useState("");
10-
const navigate = useNavigate();
11-
12-
const handleLogin = () => {
13-
if (!email && !password) {
14-
setError("Please enter both email and password");
15-
return;
16-
}
17-
18-
if (!email) {
19-
setError("Please enter your email");
20-
return;
21-
}
22-
23-
if (!password) {
24-
setError("Please enter your password");
25-
return;
26-
}
27-
28-
const user = usersData.find(
29-
(u) => u.email === email && u.password === password
30-
);
31-
32-
if (user) {
33-
setUser(user);
34-
toast.success(`${user.name} is logged in`);
35-
setError("");
36-
setTimeout(() => {
37-
navigate("/");
38-
}, 2000);
39-
} else {
40-
if (!usersData.some((u) => u.email === email)) {
41-
setError("Invalid email");
42-
} else {
43-
setError("Invalid password");
44-
}
45-
}
46-
};
5+
const Login = () => {
476

487
return (
498
<div className="min-h-screen flex items-center justify-center">
@@ -55,8 +14,6 @@ const Login = ({ setUser }) => {
5514
id="email"
5615
type="email"
5716
placeholder="Email"
58-
value={email}
59-
onChange={(e) => setEmail(e.target.value)}
6017
className="w-full mb-6 p-2 border rounded"
6118
/>
6219
<label className="block text-gray-700 mb-2" htmlFor="password">Password</label>
@@ -65,14 +22,11 @@ const Login = ({ setUser }) => {
6522
id="password"
6623
type="password"
6724
placeholder="Password"
68-
value={password}
69-
onChange={(e) => setPassword(e.target.value)}
7025
className="w-full mb-6 p-2 border rounded"
7126
/>
72-
{error && <p data-testid="error" className="text-red-500 my-8">{error}</p>}
27+
<p data-testid="error" className="text-red-500 my-8">Error Message</p>
7328
<button
7429
data-testid="login-button"
75-
onClick={handleLogin}
7630
className="w-full bg-green-700 text-white p-2 mt-16 rounded"
7731
>
7832
Login

0 commit comments

Comments
 (0)