Skip to content

"some changes in app js and side bar js" #18

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 1 commit into from
Sep 15, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
14 changes: 13 additions & 1 deletion public/data/abhishekkumar62000.json
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,19 @@
"bio": "A passion of become a Data Scientists & Artificial Intelligence, Machine Learning learn about technology, Computer Science and programming language. I am always professional in my field.",
"avatar": "https://github.com/abhishekkumar62000.png",
"portfolio": "https://github.com/abhishekkumar62000",
"skills": ["Data Scientists", "Data Analytics", "Python", "Statistics", "Power BI", "Tableau", "SQL", "Machine Learning", "Deep learning", "Generative AI", "Big Data"],
"skills": [
"Data Scientists",
"Data Analytics",
"Python",
"Statistics",
"Power BI",
"Tableau",
"SQL",
"Machine Learning",
"Deep learning",
"Generative AI",
"Big Data"
],
"social": {
"GitHub": "https://github.com/abhishekkumar62000",
"Twitter": "https://twitter.com/",
Expand Down
18 changes: 17 additions & 1 deletion public/data/amanpoddar-dev12.json
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,23 @@
"bio": "A talented BCA student and front-end developer skilled in technologies like React, HTML, CSS, and JavaScript, with experience using frameworks like Tailwind and Bootstrap. I have successfully created numerous projects, showcasing my ability to design and build responsive, user-friendly web applications.",
"avatar": "https://github.com/amanpoddar-dev12.png",
"portfolio": "https://github.com/amanpoddar-dev12",
"skills": ["React", "JavaScript", "Tailwind", "Python", "Java", "C", "C++", "HTML", "CSS", "DBMS", "WebDevelopment", "MernStack", "Bootstrap", "PHP", "mySQL"],
"skills": [
"React",
"JavaScript",
"Tailwind",
"Python",
"Java",
"C",
"C++",
"HTML",
"CSS",
"DBMS",
"WebDevelopment",
"MernStack",
"Bootstrap",
"PHP",
"mySQL"
],
"social": {
"GitHub": "https://github.com/amanpoddar-dev12",
"Twitter": "https://twitter.com/AmanPoddarr",
Expand Down
15 changes: 14 additions & 1 deletion public/data/anux-cyberboy.json
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,20 @@
"bio": "I'm an engineering student at IMT Atlantique and I'm currently doing my final internship at EY as a cybersecurity consultant. I work on both organizational and technical issues. I also have a degree in applied economics from the University of Paris Saclay",
"avatar": "https://github.com/anux-cyberboy.png",
"portfolio": "https://github.com/anux-cyberboy",
"skills": [ "Hacking", "Web Scrapping", "Shell Script", "Cyber Security", "Linux", "Shell", "Firebase", "Supabase", "Webpack", "Babel", "Hacker", "Bug Bounty"],
"skills": [
"Hacking",
"Web Scrapping",
"Shell Script",
"Cyber Security",
"Linux",
"Shell",
"Firebase",
"Supabase",
"Webpack",
"Babel",
"Hacker",
"Bug Bounty"
],
"social": {
"GitHub": "https://github.com/anux-cyberboy",
"Twitter": "https://x.com/AnuxGamerz",
Expand Down
30 changes: 29 additions & 1 deletion public/data/codeaashu.json
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,35 @@
"bio": "A proficient Web Developer & Designer specializing in crafting captivating Websites & Apps. My focus on user-centric design, creative development, and effective collaboration, i can also elevate the brand presence with my design expertise. Till now i build 50+ WEB APP. Most importantly, I'm a reliable designer you can rely on for all your design needs.",
"avatar": "https://github.com/codeaashu.png",
"portfolio": "https://ashutosh-kumar.vercel.app",
"skills": ["React", "Tailwind", "JavaScript", "TypeScript", "NodeJS", "ThreeJS", "NextJS", "AnimeJS", "ExpressJS", "Redux", "GSAP", "MaterialUI", "SASS", "WebDevelopment", "MernStack", "WebDesign", "Figma", "Webflow", "Wix", "framer", "Bootstrap", "PHP", "mySQL", "MongoDB", "SEO", "Shell", "prompt Engineering"],
"skills": [
"React",
"Tailwind",
"JavaScript",
"TypeScript",
"NodeJS",
"ThreeJS",
"NextJS",
"AnimeJS",
"ExpressJS",
"Redux",
"GSAP",
"MaterialUI",
"SASS",
"WebDevelopment",
"MernStack",
"WebDesign",
"Figma",
"Webflow",
"Wix",
"framer",
"Bootstrap",
"PHP",
"mySQL",
"MongoDB",
"SEO",
"Shell",
"prompt Engineering"
],
"social": {
"GitHub": "https://github.com/codeaashu",
"Twitter": "https://twitter.com/warrior_aashuu",
Expand Down
3 changes: 2 additions & 1 deletion public/data/deruxhalter3js.json
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,8 @@
"Git",
"Tailwind CSS",
"REST APIs",
"GraphQL"],
"GraphQL"
],
"social": {
"GitHub": "https://github.com/deruxhalter3js",
"Twitter": "https://twitter.com/DavidMwas2_0",
Expand Down
25 changes: 24 additions & 1 deletion public/data/shubhcoding01.json
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,30 @@
"bio": "I'm Web-Developer, I'm currently working as Freelancer, Open to work as a Software Engineer, I'm currently learning MERN, Funfact: I also do Photo/Video Editing ",
"avatar": "https://github.com/shubhcoding01.png",
"portfolio": "https://github.com/shubhcoding01",
"skills": ["Java", "JavaScript", "HTML", "CSS", "C++", "DSA", "MY SQL", "PYTHON", "C", "React", "Cyber Security", "WebFlow", "Canva", "Figma", "NodeJS", "WebDevelopment", "FullStack", "MernStack", "GSAP", "Git", "GitHub", "KALI LINUX"],
"skills": [
"Java",
"JavaScript",
"HTML",
"CSS",
"C++",
"DSA",
"MY SQL",
"PYTHON",
"C",
"React",
"Cyber Security",
"WebFlow",
"Canva",
"Figma",
"NodeJS",
"WebDevelopment",
"FullStack",
"MernStack",
"GSAP",
"Git",
"GitHub",
"KALI LINUX"
],
"social": {
"GitHub": "https://github.com/shubhcoding01",
"Twitter": "https://x.com/shubh__coding",
Expand Down
156 changes: 10 additions & 146 deletions src/App.js
Original file line number Diff line number Diff line change
@@ -1,150 +1,14 @@
import { useState, useEffect, useRef } from 'react';
import Profile from './components/Profile/Profile';
import ProfileSkeleton from './components/ProfileSkeleton/ProfileSkeleton';
import Search from './components/Search/Search';
import Sidebar from './components/Sidebar/Sidebar';
import ErrorPage from './components/ErrorPage/ErrorPage';
import NoResultFound from './components/NoResultFound/NoResultFound';
import Pagination from './components/Pagination/Pagination';
import './App.css';
import filenames from './ProfilesList.json';

import AboutUS from './components/Sidebar/AboutUs';
import Homepage from './Homepage';
import { BrowserRouter, Navigate, Route, Routes } from 'react-router-dom';
function App() {
const profilesRef = useRef();
const [profiles, setProfiles] = useState([]);
const [searching, setSearching] = useState(false);
const [combinedData, setCombinedData] = useState([]);
const [currentPage, setCurrentPage] = useState(1);
const [shuffledProfiles, setShuffledProfiles] = useState([]);
const [loadingProfiles, setLoadingProfiles] = useState(false);
const recordsPerPage = 20;

const currentUrl = window.location.pathname;
useEffect(() => {
const fetchData = async (file) => {
try {
const response = await fetch(file);
const data = await response.json();
return data;
} catch (error) {
console.error('Error fetching data:', error);
return [];
}
};

const combineData = async () => {
setLoadingProfiles(true);
try {
const promises = filenames.map((file) => fetchData(`/data/${file}`));
const combinedData = await Promise.all(promises);
setCombinedData(combinedData);
setShuffledProfiles(shuffleProfiles(combinedData));
} catch (error) {
console.error('Error combining data:', error);
setCombinedData([]);
setShuffledProfiles([]);
}
setLoadingProfiles(false);
};

combineData();
}, []);

const shuffleProfiles = (array) => {
for (let i = array.length - 1; i > 0; i--) {
const j = Math.floor(Math.random() * (i + 1));
[array[i], array[j]] = [array[j], array[i]];
}
return array;
};

const handleSearch = ({ value, criteria }) => {
const normalizeString = (str) =>
str
.toLowerCase()
.replace(/\s*,\s*/g, ' ')
.replace(/\s+/g, ' ')
.trim();

const normalizedValue = normalizeString(value);

const filteredResults = combinedData.filter((user) => {
if (criteria === 'name') {
return normalizeString(user.name).includes(normalizedValue);
} else if (criteria === 'location') {
return normalizeString(user.location).includes(normalizedValue);
} else if (criteria === 'skill') {
return user.skills.some((skill) => normalizeString(skill).includes(normalizedValue));
}
return false;
});

setProfiles(filteredResults);
setSearching(true);
};

const handleNextPage = () => {
const totalPages = Math.ceil((searching ? profiles.length : combinedData.length) / recordsPerPage);
if (currentPage < totalPages) {
setCurrentPage(currentPage + 1);
}
};

const handlePrevPage = () => {
if (currentPage > 1) {
setCurrentPage(currentPage - 1);
}
};

useEffect(() => {
profilesRef.current.scrollTo({
top: 0,
behavior: 'smooth',
});
}, [currentPage]);

const getPaginatedData = () => {
const data = searching ? profiles : shuffledProfiles;
const startIndex = (currentPage - 1) * recordsPerPage;
const endIndex = startIndex + recordsPerPage;
return data.slice(startIndex, endIndex);
};

const renderProfiles = () => {
if (loadingProfiles) {
return (
<>
{Array(5)
.fill('profile-skeleton')
.map((item, index) => (
<ProfileSkeleton key={index} />
))}
</>
);
}
const paginatedData = getPaginatedData();
return paginatedData.map((currentRecord, index) => <Profile data={currentRecord} key={index} />);
};

return currentUrl === '/' ? (
<div className="App flex flex-col bg-primaryColor dark:bg-secondaryColor md:flex-row">
<Sidebar />
<div className="w-full pl-5 pr-4 md:h-screen md:w-[77%] md:overflow-y-scroll md:py-7" ref={profilesRef}>
<Search onSearch={handleSearch} />
{profiles.length === 0 && searching ? <NoResultFound /> : renderProfiles()}
{combinedData.length > 0 && (
<Pagination
currentPage={currentPage}
totalPages={Math.ceil((searching ? profiles.length : shuffledProfiles.length) / recordsPerPage)}
onNextPage={handleNextPage}
onPrevPage={handlePrevPage}
/>
)}
</div>
</div>
) : (
<ErrorPage />
return (
<BrowserRouter>
<Routes>
<Route path="/" element={<Homepage />} />
<Route path="/about" element={<AboutUS />} />
</Routes>
</BrowserRouter>
);
}

export default App;
Loading
Loading