Skip to content

Commit

Permalink
Merge branch 'HimanshuNarware:main' into algomonster
Browse files Browse the repository at this point in the history
  • Loading branch information
@maradadivyasree020
maradadivyasree020 committed Jun 28, 2024
2 parents 6a7c84e + 7fcef73 commit e897920
Show file tree
Hide file tree
Showing 18 changed files with 534 additions and 101 deletions.
12 changes: 10 additions & 2 deletions frontend/package-lock.json
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

5 changes: 5 additions & 0 deletions frontend/package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,8 @@
"@fortawesome/free-brands-svg-icons": "^6.5.2",
"@fortawesome/free-solid-svg-icons": "^6.5.2",
"@fortawesome/react-fontawesome": "^0.2.2",
"@mui/material": "^5.15.20",
"@mui/styled-engine-sc": "^6.0.0-alpha.18",
"@reduxjs/toolkit": "^1.9.5",
"@testing-library/jest-dom": "^5.16.5",
"@testing-library/react": "^13.4.0",
Expand All @@ -29,12 +31,15 @@
"react-dom": "^18.3.1",
"react-hot-toast": "^2.4.1",
"react-icons": "^4.12.0",
"react-loading-skeleton": "^3.4.0",
"react-paginate": "^8.2.0",
"react-parallax-tilt": "^1.7.228",
"react-redux": "^8.1.2",
"react-router-dom": "^6.16.0",
"react-scripts": "^5.0.1",
"react-spinners": "^0.13.8",
"react-toastify": "^10.0.5",
"styled-components": "^6.1.11",
"web-vitals": "^2.1.4"
},
"scripts": {
Expand Down
Binary file added frontend/public/gun-io.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added frontend/public/toptal.webp
View file
Binary file not shown.
Binary file added frontend/public/turing.jpg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added frontend/public/x-team.jpg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
76 changes: 61 additions & 15 deletions frontend/src/Component/Home.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,10 @@ import "../style/Home.css";
import Devlabs from "../image/hero_img.svg";
import NavbarItem from "./Navbar/NavbarItem";
import toast from "react-hot-toast";

import NavbarRight from "./Navbar/NavbarRight";
import Tilt from 'react-parallax-tilt';
import Skeleton, { SkeletonTheme } from 'react-loading-skeleton'
import 'react-loading-skeleton/dist/skeleton.css'
const BACKEND = process.env.REACT_APP_BACKEND;

function Home(props) {
Expand All @@ -33,6 +36,7 @@ function Home(props) {
const [showPopup, setShowPopup] = useState(false);
const [showRemovePopup, setShowRemovePopup] = useState(false);
const [contributors, setContributors] = useState([]);
const [searchQuery, setSearchQuery] = useState("");

const currentPost1 = dataBaseData;
let allvalue = [];
Expand Down Expand Up @@ -64,7 +68,9 @@ function Home(props) {
} else {
setDataBaseData(jsonTools);
}
setTimeout(() => {
setLoading(false);
}, 2000);
};

const fetchContributors = async () => {
Expand Down Expand Up @@ -98,11 +104,11 @@ function Home(props) {
}
}

const filteredData = !!props.searchQuery
const filteredData = !!searchQuery
? allvalue.filter((datalist) => {
return datalist.productName
.toLowerCase()
.includes(props.searchQuery.toLowerCase());
.includes(searchQuery.toLowerCase());
})
: allvalue;

Expand Down Expand Up @@ -212,7 +218,8 @@ function Home(props) {
};

return (
<div>
<SkeletonTheme>
<div>
<div className="hero">
<div className="hero-text">
<div id="hero" className="hero-container">
Expand All @@ -239,22 +246,59 @@ function Home(props) {
</div>
</div>
<div className="hero-image">
<img src={Devlabs} alt="devlabs-removebg-preview" />
<Tilt>
<img src={Devlabs} alt="devlabs-removebg-preview" />
</Tilt>
</div>
</div>
</div>
</div>
<br/>
<h3> Lets Get, What You seek!</h3>
<NavbarRight setSearchQuery={setSearchQuery} />

<div ref={ref} className="page-container">
<div className={loading ? "loading-container" : "main-container"}>
<ClipLoader
color="#808080"
loading={loading}
size={50}
aria-label="Loading Spinner"
data-testid="loader"
/>

{currentPost.map((datalist) => {
{loading && <div style={{display:"flex",gap:"100px",width:"100vw",height:"300px",justifyContent:"center"}}>
<div style={{width:"250px",height:"300px",border:"gray solid 2px",borderRadius:"20px",padding:"40px"}}>

<Skeleton circle={"true"} height={90} width={90}/>
<Skeleton width={130}/>
<Skeleton count={5}/>

</div>
<div style={{width:"250px",height:"300px",border:"gray solid 2px",borderRadius:"20px",padding:"40px"}}>

<Skeleton circle={"true"} height={90} width={90}/>
<Skeleton width={130}/>
<Skeleton count={5}/>

</div>
<div style={{width:"250px",height:"300px",border:"gray solid 2px",borderRadius:"20px",padding:"40px"}}>

<Skeleton circle={"true"} height={90} width={90}/>
<Skeleton width={130}/>
<Skeleton count={5}/>

</div>
<div style={{width:"250px",height:"300px",border:"gray solid 2px",borderRadius:"20px",padding:"40px"}}>

<Skeleton circle={"true"} height={90} width={90}/>
<Skeleton width={130}/>
<Skeleton count={5}/>

</div>
<div style={{width:"250px",height:"300px",border:"gray solid 2px",borderRadius:"20px",padding:"40px"}}>

<Skeleton circle={"true"} height={90} width={90}/>
<Skeleton width={130}/>
<Skeleton count={5}/>

</div>
</div>}


{!loading && currentPost.map((datalist) => {
return (
<div className="content-box-home" key={datalist.productName}>
<img
Expand Down Expand Up @@ -291,7 +335,7 @@ function Home(props) {
)}
</div>
);
})}
})}
</div>
<div className="pagination">
<ul>
Expand All @@ -316,6 +360,8 @@ function Home(props) {
</div>
</div>
</div>
</SkeletonTheme>

);
}

Expand Down
6 changes: 4 additions & 2 deletions frontend/src/Component/Navbar/Navbar.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ import "../../style/Navbar.css";
import Sidebar from "../Sidebar/Sidebar";
import NavbarLeft from "./NavbarLeft";
import NavbarCenter from "./NavbarCenter";
import NavbarRight from "./NavbarRight";
//import NavbarRight from "./NavbarRight";

function Navbar(props) {
const [showSideNav, setShowSideNav] = useState(false);
Expand All @@ -13,8 +13,10 @@ function Navbar(props) {
<div className="navbar">
<NavbarLeft showSideNav={showSideNav} setShowSideNav={setShowSideNav} />
<NavbarCenter />

{/* Pass setSearchQuery directly
<NavbarRight setSearchQuery={props.setSearchQuery} />
{/* Pass setSearchQuery directly */}
*/}
</div>
<Sidebar showSideNav={showSideNav} />
</header>
Expand Down
20 changes: 9 additions & 11 deletions frontend/src/Component/Navbar/NavbarRight.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,9 +4,8 @@ import { RxCross2 } from "react-icons/rx";
import "../../style/Navbar.css";

function NavbarRight(props) {
const [searchQuery, setSearchQuery] = useState(""); // Local state to manage search query
const [searchQuery, setSearchQuery] = useState("");

//debounce search query
useEffect(() => {
let timer = setTimeout(() => {
props.setSearchQuery(searchQuery);
Expand All @@ -17,41 +16,40 @@ function NavbarRight(props) {
}, [searchQuery]);

const handleInputChange = (e) => {
setSearchQuery(e.target.value); // Update the search query when input changes
setSearchQuery(e.target.value);
};

const handleSearch = (e) => {
e.preventDefault();
props.setSearchQuery(searchQuery); // Pass the search query to the parent component (App)
props.setSearchQuery(searchQuery);
};

const clearSearchHandler = (e) => {
e.preventDefault();
setSearchQuery("");
props.setSearchQuery(""); // Pass the empty search query to the parent component (App)
props.setSearchQuery("");
};

return (
<div className="navbar-right" id="navbarTogglerDemo03">
<div className="navbar-right">
<div className="search">
<form role="search" className="search-bar" onSubmit={handleSearch}>
<div className="box" focus>
<div className="box">
<input
type="text"
className="input"
placeholder="Search . . ."
value={searchQuery} // Set input value to the search query
value={searchQuery}
onChange={handleInputChange}
/>

<button
className={`span ${!searchQuery && "invisible"}`}
className={`clear-button ${!searchQuery && "invisible"}`}
type="button"
onClick={clearSearchHandler}
>
<RxCross2 />
</button>
<button className="span" type="submit">
<button className="search-button" type="submit">
<BsSearch />
</button>
</div>
Expand Down
5 changes: 5 additions & 0 deletions frontend/src/Component/Rateus.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,10 +14,15 @@ function RateUsComponent({ previousContent }) {
};

const handleSubmit = () => {
// Check if both rating and feedback are provided
if (rating !== 0 && feedback.trim() !== "") {
// Reset the state after submitting
setRating(0);
setFeedback("");
// Show success message (console.log or any other method you prefer)
console.log("Thanks For Your Feedback :)");
} else {
console.error("Please Enter All Details :(");
}
};

Expand Down
Loading

0 comments on commit e897920

Please sign in to comment.