Skip to content

Commit

Permalink
Merge branch 'main' into router-issue-solved
Browse files Browse the repository at this point in the history 
Signed-off-by: Anneshu Nag <[email protected]>
  • Loading branch information
@NK-Works
NK-Works authored Nov 7, 2024
2 parents bb7e0e4 + 395c702 commit 865c57c
Show file tree
Hide file tree
Showing 18 changed files with 624 additions and 172 deletions.
4 changes: 1 addition & 3 deletions client/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -140,12 +140,10 @@
input[type="email"] {
width: 100%;
padding: 10px;
margin-bottom: 16px;
border: 1px solid #000000;
border-radius: 5px;
font-size: 14px;
}

.signup-btn1-nl {
width: 100%;
height: 30px;
Expand Down Expand Up @@ -206,7 +204,7 @@
<h1>Subscribe to Newsletter</h1>
<h2 class="h2-nl">Join the Bitbox Community!</h2>
<p class="pop_up-nl">Subscribe to receive the latest updates, tips, and project highlights from the Bitbox community. Whether you’re looking for help or want to share your knowledge, we’ve got you covered!</p>
<form id="emailForm-nl">
<form id="emailForm-nl" style="align-items: center;">
<input type="email" id="email-nl" placeholder="Enter your email" required>
<button type="submit" class="signup-btn1-nl">Subscribe</button>
</form>
Expand Down
67 changes: 37 additions & 30 deletions client/src/App.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -39,6 +39,8 @@ import "aos/dist/aos.css";
import Collab from "./component/Collab";
import FAQ from "./component/Faq";
import CreateBlog from "./component/CreateBlog";
import Projects from "./component/Projects";
import UploadProject from "./component/UploadProject";

const Layout = ({ children, mode, setProgress, toggleMode, showAlert }) => {
return (
Expand All @@ -52,6 +54,7 @@ const Layout = ({ children, mode, setProgress, toggleMode, showAlert }) => {
blog="Blogs"
discussion="Discussion"
contributors="Contributors"
projects="Projects"
Feedback="Feedback"
showAlert={showAlert}
mode={mode}
Expand Down Expand Up @@ -120,37 +123,41 @@ function App() {
<Cursor />
<ProjectState>
<ProfileState>

<LoadingBar color="blue" progress={progress} onLoaderFinished={() => setProgress(0)} />
<div className="alert-container"> <Alert alert={alert} /> </div>
<ProgressBar mode={mode} />
<ScrollTop />
<Layout mode={mode} setProgress={setProgress} toggleMode={toggleMode} showAlert={showAlert} >
<Routes>
<Route exact path="/" element={<Home mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
<Route exact path="/contributors" element={<Contributors mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
<Route exact path="/discussion" element={<Discussion mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
<Route exact path="/community" element={<Community mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
<Route exact path="/about" element={<About mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
<Route exact path="/feedback" element={<Feedback mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
<Route exact path="/blog" element={<BlogPage mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
<Route exact path="/faq" element={<Faq mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
<Route exact path="/collab" element={<Collab mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
<Route exact path='/myprofile' element={<MyProfile mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
<Route exact path='/editprofile' element={<EditProfile mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
<Route exact path="/login" element={<Login mode={mode} setProgress={setProgress} showAlert={showAlert} loggedin={islogged} setloggedin={setloggedin} />} />
<Route exact path='/signup' element={<Signup mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
<Route exact path='/forgot-password' element={<ForgotPassword mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
<Route exact path='/reset-password' element={<ResetPassword mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
<Route exact path='/codeofconduct' element={<CodeOfConduct mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
<Route exact path='/contactus' element={<ContactUs mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
<Route exact path='/privacypolicy' element={<PrivacyPolicy mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
<Route exact path='/termofuse' element={<TermOfUse mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
<Route exact path='/FAQ' element={<FAQ mode={mode} />} />
<Route exact path='/createBlogPost' element={<CreateBlog />} />
<Route exact path='/read-more-blog/:id' element={<ReadMoreBlog mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
<Route exact path='/*' element={<NotFound />} />
</Routes>
</Layout>
<div className="alert-container"> <Alert alert={alert} /> </div>
<ProgressBar mode={mode} />
<ScrollTop />
<Layout mode={mode} setProgress={setProgress} toggleMode={toggleMode} showAlert={showAlert} >
<Routes>
<Route exact path="/" element={<Home mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
<Route exact path="/contributors" element={<Contributors mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
<Route exact path="/discussion" element={<Discussion mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
<Route exact path="/community" element={<Community mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
<Route exact path="/about" element={<About mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
<Route exact path="/feedback" element={<Feedback mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
<Route exact path="/blog" element={<BlogPage mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
<Route exact path="/faq" element={<Faq mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
<Route exact path="/collab" element={<Collab mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
<Route exact path='/myprofile' element={<MyProfile mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
<Route exact path='/editprofile' element={<EditProfile mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
<Route exact path="/login" element={<Login mode={mode} setProgress={setProgress} showAlert={showAlert} loggedin={islogged} setloggedin={setloggedin} />} />
<Route exact path='/signup' element={<Signup mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
<Route exact path='/forgot-password' element={<ForgotPassword mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
<Route exact path='/reset-password' element={<ResetPassword mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
<Route exact path='/codeofconduct' element={<CodeOfConduct mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
<Route exact path='/contactus' element={<ContactUs mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
<Route exact path='/privacypolicy' element={<PrivacyPolicy mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
<Route exact path='/termofuse' element={<TermOfUse mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
<Route exact path='/projects' element={<Projects mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
<Route exact path='/uploadProject' element={<UploadProject mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
<Route exact path='/FAQ' element={<FAQ mode={mode} />} />
<Route exact path='/createBlogPost' element={<CreateBlog />} />
<Route exact path='/read-more-blog/:id' element={<ReadMoreBlog mode={mode} setProgress={setProgress} showAlert={showAlert} />} />
<Route exact path='/*' element={<NotFound />} />
</Routes>
</Layout>

</ProfileState>
</ProjectState>
</div>
Expand Down
132 changes: 87 additions & 45 deletions client/src/component/Contributors.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -223,20 +223,21 @@ StatCard.propTypes = {
onClick: PropTypes.func,
};


export default function Contributor(props) {
const [contributors, setContributors] = useState([]);
const [openIssues, setOpenIssues] = useState([]);
const [showIssue, setShowIssue] = useState(true); // Determine which section to show
const [loading, setLoading] = useState(true);
const [currentPage, setCurrentPage] = useState(1);
const itemsPerPage = 9; // Set the number of items per page (for both contributors and issues)

const [repoStats, setRepoStats] = useState({
stars: 0,
forks: 0,
openIssues: 0,
});
const [searchTerm, setSearchTerm] = useState(''); // State for search term

const itemsPerPage = 9; // Set the number of items per page (for both contributors and issues)

useEffect(() => {
const fetchData = async () => {
Expand All @@ -250,10 +251,8 @@ export default function Contributor(props) {
const contributorsData = await contributorsResponse.json();
setContributors(contributorsData);


// Fetch repo stats
const repoResponse = await fetch('https://api.github.com/repos/Bitbox-Connect/Bitbox');

const repoData = await repoResponse.json();
setRepoStats({
stars: repoData.stargazers_count,
Expand All @@ -279,15 +278,27 @@ export default function Contributor(props) {
const indexOfLastItem = currentPage * itemsPerPage;
const indexOfFirstItem = indexOfLastItem - itemsPerPage;

// Get current items based on selected section
const currentItems = showIssue ? openIssues.slice(indexOfFirstItem, indexOfLastItem) : contributors.slice(indexOfFirstItem, indexOfLastItem);
// Filter contributors or issues based on search term
const filteredContributors = contributors.filter(contributor =>
contributor.login.toLowerCase().includes(searchTerm.toLowerCase())
);

const filteredIssues = openIssues.filter(issue =>
issue.title.toLowerCase().includes(searchTerm.toLowerCase())
);

// Get current items based on selected section and search
const currentItems = showIssue
? filteredIssues.slice(indexOfFirstItem, indexOfLastItem)
: filteredContributors.slice(indexOfFirstItem, indexOfLastItem);

// Determine total pages
const totalPages = showIssue ? Math.ceil(openIssues.length / itemsPerPage) : Math.ceil(contributors.length / itemsPerPage);
const totalPages = showIssue
? Math.ceil(filteredIssues.length / itemsPerPage)
: Math.ceil(filteredContributors.length / itemsPerPage);

const paginate = (pageNumber) => setCurrentPage(pageNumber);


return (
<div
className={`min-h-screen ${props.mode === "dark"
Expand Down Expand Up @@ -370,7 +381,7 @@ export default function Contributor(props) {
/>
</div>

{/* Repository Stars */}
{/* Repository Stats */}
<a href="https://github.com/Bitbox-Connect/Bitbox/stargazers" target="_blank">
<StatCard
mode={props.mode}
Expand All @@ -389,8 +400,8 @@ export default function Contributor(props) {
/>
</a>

{/* Repository Forks */}
<a href="https://github.com/Bitbox-Connect/Bitbox/network/members" target="_blank">
{/* Forks */}
<a href="https://github.com/Bitbox-Connect/Bitbox/network" target="_blank">
<StatCard
mode={props.mode}
label="Forks"
Expand All @@ -402,16 +413,16 @@ export default function Contributor(props) {
viewBox="0 0 20 20"
fill="currentColor"
>
<path d="M6 9a3 3 0 116 0 3 3 0 01-6 0z" />
<path
fillRule="evenodd"
d="M6 5a3 3 0 01-3 3H2a3 3 0 003 3v4a3 3 0 006 0v-4a3 3 0 003-3h-1a3 3 0 01-3-3V2h-2v3H6zm7-3v3a3 3 0 013 3h1a3 3 0 00-3-3h-1V2h-2z"
d="M10 12a4 4 0 10-4-4 4 4 0 004 4zm0 0a4 4 0 104-4 4 4 0 00-4 4z"
clipRule="evenodd"
/>
</svg>
}
/>
</a>

{/* Open Issues */}
<div className="cursor-pointer">
<StatCard
Expand All @@ -438,47 +449,78 @@ export default function Contributor(props) {
</div>
</section>

<section className="py-16 px-4 sm:px-6 lg:px-8">
{/* Search Section */}
<section className="py-8 px-4 sm:px-6 lg:px-8">
<div className="max-w-7xl mx-auto">
<h2 className="text-3xl font-bold text-center mb-12">{showIssue ? 'Your contribution is valuable see all Issues' : 'Contributors'}</h2>
<div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-8">
{currentItems.map(item => showIssue ? (
<IssueCard
key={item.id}
title={item.title}
number={item.number}
html_url={item.html_url}
user={item.user}
state={item.state}
mode={props.mode}
/>
<input
type="text"
placeholder={showIssue ? "Search issues..." : "Search contributors..."}
className={`w-full p-3 text-lg border rounded-lg
${props.mode === 'dark' ? 'bg-gray-800 text-white border-gray-700' : 'bg-white text-gray-900 border-gray-300'}`}
value={searchTerm}
onChange={(e) => setSearchTerm(e.target.value)}
/>
</div>
</section>

{/* Display Issues or Contributors based on `showIssue` */}
<section className="py-8 px-4 sm:px-6 lg:px-8">
<div className="max-w-7xl mx-auto">
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-3 gap-8">
{currentItems.length > 0 ? (
currentItems.map(item => (
showIssue ? (
<IssueCard
key={item.id}
title={item.title}
number={item.number}
html_url={item.html_url}
user={item.user}
state={item.state}
mode={props.mode}
/>
) : (
<ContributorCard
key={item.id}
login={item.login}
avatar_url={item.avatar_url}
html_url={item.html_url}
contributions={item.contributions}
type={item.type}
mode={props.mode}
/>
)
))
) : (
<ContributorCard
key={item.id}
login={item.login}
avatar_url={item.avatar_url}
html_url={item.html_url}
contributions={item.contributions}
type={item.type}
mode={props.mode}
/>
))}
<div className="col-span-full text-center text-xl text-gray-500">No items found</div>
)}
</div>
<div className="flex justify-center mt-8">
{Array.from({ length: totalPages }, (_, i) => (
</div>
</section>

{/* Pagination */}
<section className="py-8 px-4 sm:px-6 lg:px-8">
<div className="max-w-7xl mx-auto text-center">
<div className="inline-flex space-x-2">
{Array.from({ length: totalPages }).map((_, index) => (
<button
key={i}
onClick={() => paginate(i + 1)}
className={`px-4 py-2 mx-1 rounded text-black ${i + 1 === currentPage ? 'bg-blue-500 text-white' : 'bg-gray-200 text-gray-900'}`}
key={index}
onClick={() => paginate(index + 1)}
className={`px-4 py-2 border rounded-lg text-lg ${currentPage === index + 1
? 'bg-blue-500 text-white'
: 'bg-white text-blue-500 border-gray-300'
}`}
>
{i + 1}
{index + 1}
</button>
))}
</div>
</div>
</section>
</div >


</div>
);
}

Contributor.propTypes = {
mode: PropTypes.string.isRequired,
};
4 changes: 2 additions & 2 deletions client/src/component/Footer.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -182,7 +182,7 @@ const Footer = (props) => {

{/* Middle section with About links */}
<div className="col-md-6 col-lg-3 col-12 ft-2" data-aos="fade-up" data-aos-delay="300" data-aos-duration="1800">
<h5>About</h5>
<h5 className='foot'>About</h5>
<ul>
<li className="nav-item">
<Link to="/contactus">Contact Us</Link>
Expand All @@ -204,7 +204,7 @@ const Footer = (props) => {

{/* Right section with Legal links */}
<div className="col-md-7 col-lg-4 col-13 ft-3" data-aos="fade-up" data-aos-delay='500' data-aos-duration="1800">
<h5>Legals</h5>
<h5 className='foot'>Legals</h5>
<ul>
<li className="nav-item">
<Link to="/feedback">Feedback</Link>
Expand Down
2 changes: 1 addition & 1 deletion client/src/component/Footers/VisitorCount.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -54,7 +54,7 @@ const VisitorCounter = () => {
{visitorCount !== null ? (
<p className="font-bold text-2xl text-gray-300">Total Visitors: {visitorCount}</p>
) : (
<p>Loading visitor count...</p>
<p><i>Loading visitor count...........</i></p>
)}
</div>
);
Expand Down
Loading

0 comments on commit 865c57c

Please sign in to comment.