Skip to content

Organization main #4

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

Open
wants to merge 3 commits into
base: main
Choose a base branch
from
Open
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
34 changes: 31 additions & 3 deletions app/(auth)/login/page.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,29 @@
import { Button, Checkbox, Label, Popover, TextInput } from "flowbite-react";
import { DarkThemeToggle } from "flowbite-react";

import {useState} from "react";
import instance from "@/app/services/Axios/AxiosOrder";

export default function Home() {

const [loginEmail, setLoginEmail] = useState('')
const [loginPassword, setLoginPassword] = useState('')
const loginHandleClick = () => {
instance.post('/admin/login', {
email: loginEmail,
password: loginPassword
})
.then(function (response) {
console.log(response.data.token);
localStorage.setItem('stToken',response.data.token)
window.location.reload();
})
.catch(function (error) {
console.log(error);
});

}

return (

<main className="flex flex-col min-h-screen items-center justify-center gap-5 dark:bg-gray-800 ">
Expand All @@ -19,7 +41,9 @@ export default function Home() {
<div className="mb-2 block">
<Label htmlFor="email1" value="Your email" />
</div>
<TextInput id="email1" type="email" placeholder="[email protected]" required />
<TextInput
onChange={(e) => setLoginEmail(e.target.value)}
id="email1" type="email" placeholder="[email protected]" required />
</div>
<div>
<div className="mb-2 block">
Expand Down Expand Up @@ -96,14 +120,18 @@ export default function Home() {
</div>
}
>
<TextInput id="password1" type="password" required />
<TextInput
onChange={(e) => setLoginPassword(e.target.value)}
id="password1" type="password" required />
</Popover>
</div>
<div className="flex items-center gap-2">
<Checkbox id="remember" />
<Label htmlFor="remember">Remember me</Label>
</div>
<Button type="submit">Submit</Button>
<Button
onclick={() => loginHandleClick()}
type="submit">Submit</Button>
</form>
</div>
<DarkThemeToggle />
Expand Down
61 changes: 55 additions & 6 deletions app/(auth)/register/page.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -3,9 +3,48 @@
import { Button, Checkbox, Label, TextInput } from "flowbite-react";
import Link from "next/link";
import { DarkThemeToggle } from "flowbite-react";
import instance from "@/app/services/Axios/AxiosOrder";
import {useState} from "react";


export default function Home() {
return (

const [email, setEmail] = useState('')
const [firstName, setFirstName] = useState('')
const [secName, setSecName] = useState('')
const [password, setPassword] = useState('')


const registerHandle = () =>{
if(firstName !== '' && secName !== '' && password !== '' && email !== ''){
instance.post('/admin/register', {
firstName: firstName,
secName: secName,
email: email,
password:password,
})
.then(function (response) {
console.log(firstName);
console.log(secName);
console.log(email);
console.log(password);
})
.catch(function (error) {
console.log(error);
});

}else {
alert("Please input all info")
}

setEmail("");
setPassword("");
setFirstName("");
setSecName("");
}


return (
<main className="flex flex-col min-h-screen items-center justify-center gap-5 dark:bg-gray-800 ">
<div className="flex flex-col">
<h1 className="text-4xl font-bold">Register</h1>
Expand All @@ -17,25 +56,33 @@ export default function Home() {
<div className="mb-2 block">
<Label htmlFor="small" value="First Name" />
</div>
<TextInput id="small" type="text" sizing="sm" />
<TextInput
onChange={(e) => setFirstName(e.target.value)}
id="small" type="text" sizing="sm" />
</div>
<div>
<div className="mb-2 block">
<Label htmlFor="small" value="Last Name" />
</div>
<TextInput id="small" type="text" sizing="sm" />
<TextInput
onChange={(e) => setSecName(e.target.value)}
id="small" type="text" sizing="sm" />
</div>
<div>
<div className="mb-2 block">
<Label htmlFor="email2" value="Your email" />
</div>
<TextInput id="email2" type="email" placeholder="[email protected]" required shadow />
<TextInput
onChange={(e) => setEmail(e.target.value)}
id="email2" type="email" placeholder="[email protected]" required shadow />
</div>
<div>
<div className="mb-2 block">
<Label htmlFor="password2" value="Your password" />
</div>
<TextInput id="password2" type="password" required shadow />
<TextInput
onChange={(e) => setPassword(e.target.value)}
id="password2" type="password" required shadow />
</div>
<div>
<div className="mb-2 block">
Expand All @@ -52,7 +99,9 @@ export default function Home() {
</Link>
</Label>
</div>
<Button type="submit">Register new account</Button>
<Button
onclick={() => registerHandle()}
type="submit">Register new account</Button>
</form>
</div>

Expand Down
117 changes: 117 additions & 0 deletions app/communities/communityinfo/page.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,117 @@
'use client';
import { useState } from 'react';
import { Breadcrumb, ButtonGroup, Button, Card } from 'flowbite-react';
import InitiativeCard from "@/components/organization/Components/Card4/InitiativeCard";
import ProjectCard from "@/components/organization/Components/Card5/ProjectCard";
import UserProfile from "@/components/organization/Components/UserProfile/UserProfile";

const CommunityInfo = () => {
const [activeTab, setActiveTab] = useState('about'); // Default active tab is 'about'

const handleTabChange = (tabName: string) => {
setActiveTab(tabName);
};

return (
<div className="container">
<Breadcrumb aria-label="Solid background breadcrumb example" className="bg-gray-50 px-5 py-3 dark:bg-gray-800">
<Breadcrumb.Item href="/communities">
Communities
</Breadcrumb.Item>
<Breadcrumb.Item>Community Name</Breadcrumb.Item>
</Breadcrumb>

<div className="text-center">
<Button.Group>
<Button color="gray" onClick={() => handleTabChange('about')}>About</Button>
<Button color="gray" onClick={() => handleTabChange('projects')}>Projects</Button>
<Button color="gray" onClick={() => handleTabChange('members')}>Members</Button>
</Button.Group>
</div>
<br></br>


{activeTab === 'about' && (
<div className="bg-image relative h-96">
{/* Background Image */}
<img src="/images/image-3.jpg" alt="Background Image" className="absolute inset-0 w-full h-full object-cover z-0" />

{/* Conditional rendering based on activeTab */}
<div className="absolute top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2 z-10">
<Card className="bg-white rounded-lg shadow-lg p-8 max-w-4xl overflow-auto">
<div className="flex gap-8">
<div className="flex flex-col justify-start items-start gap-5">
<div className="badge bg-green-100 rounded-full px-3 py-0.5">
<span className="text-emerald-900 text-sm font-semibold">Habitat Restoration</span>
</div>
<p className="text-gray-700 text-base font-normal w-60 leading-normal">Volunteer to restore and rehabilitate natural habitats such as forests, wetlands, and coastal areas to promote biodiversity and ecosystem health.</p>
</div>
<div className="flex flex-col justify-start items-start gap-5">
<div className="badge bg-sky-100 rounded-full px-3 py-0.5">
<span className="text-blue-800 text-sm font-medium">Tree Planting</span>
</div>
<p className="text-gray-700 text-base font-normal w-60 leading-normal">Participate in tree planting initiatives to combat deforestation, improve air quality, and enhance carbon sequestration.</p>
</div>
<div className="flex flex-col justify-start items-start gap-5">
<div className="badge bg-rose-100 rounded-full px-3 py-0.5">
<span className="text-red-800 text-sm font-medium">Wildlife Conservation</span>
</div>
<p className="text-gray-700 text-base font-normal w-60 leading-normal">Volunteer for projects focused on protecting and monitoring wildlife species, including endangered animals, to prevent habitat loss and extinction.</p>
</div>
</div>
</Card>
</div>
</div>
)}


{activeTab === 'projects' && (
<div className="grid grid-cols-2 md:grid-cols-3 gap-4 ">
<InitiativeCard />
<InitiativeCard />
<InitiativeCard />
<ProjectCard />
<ProjectCard />
<ProjectCard />
</div>
)}
{activeTab === 'members' && (
<div className="grid grid-cols-2 md:grid-cols-3 gap-4 ">
<UserProfile userName="John Doe" profilePicture="/images/image-4.jpg" />
<UserProfile userName="Jane Smith" profilePicture="/images/image-4.jpg" />
<UserProfile userName="Michael Johnson" profilePicture="/images/image-4.jpg" />
<UserProfile userName="Emily Brown" profilePicture="/images/image-4.jpg" />
<UserProfile userName="David Williams" profilePicture="/images/image-4.jpg" />
<UserProfile userName="Sarah Miller" profilePicture="/images/image-4.jpg" />
<UserProfile userName="Daniel Davis" profilePicture="/images/image-4.jpg" />
<UserProfile userName="Olivia Wilson" profilePicture="/images/image-4.jpg" />
<UserProfile userName="William Martinez" profilePicture="/images/image-4.jpg" />
<UserProfile userName="Emma Thompson" profilePicture="/images/image-4.jpg" />
<UserProfile userName="Noah Anderson" profilePicture="/images/image-4.jpg" />
<UserProfile userName="Ava White" profilePicture="/images/image-4.jpg" />
<UserProfile userName="Liam Harris" profilePicture="/images/image-4.jpg" />
<UserProfile userName="Sophia Clark" profilePicture="/images/image-4.jpg" />
<UserProfile userName="Mason Walker" profilePicture="/images/image-4.jpg" />
<UserProfile userName="Isabella Turner" profilePicture="/images/image-4.jpg" />
<UserProfile userName="Lucas King" profilePicture="/images/image-4.jpg" />
<UserProfile userName="Mia Cooper" profilePicture="/images/image-4.jpg" />
<UserProfile userName="Oliver Jackson" profilePicture="/images/image-4.jpg" />
<UserProfile userName="Amelia Hill" profilePicture="/images/image-4.jpg" />
<UserProfile userName="Ethan Wright" profilePicture="/images/image-4.jpg" />
<UserProfile userName="Harper Scott" profilePicture="/images/image-4.jpg" />
<UserProfile userName="Logan Green" profilePicture="/images/image-4.jpg" />
<UserProfile userName="Aria Adams" profilePicture="/images/image-4.jpg" />
<UserProfile userName="James Baker" profilePicture="/images/image-4.jpg" />
<UserProfile userName="Avery Nelson" profilePicture="/images/image-4.jpg" />
<UserProfile userName="Benjamin Carter" profilePicture="/images/image-4.jpg" />
<UserProfile userName="Sofia Evans" profilePicture="/images/image-4.jpg" />
<UserProfile userName="William Garcia" profilePicture="/images/image-4.jpg" />
</div>

)}
</div>

);
};

export default CommunityInfo;
76 changes: 44 additions & 32 deletions app/communities/page.tsx
Original file line number Diff line number Diff line change
@@ -1,38 +1,50 @@

import React, { useRef } from "react";
import Link from "next/link";
import React from "react";
import { Carousel } from "flowbite-react";
import CardNA from "@/components/organization/Components/Card/CardNA";
import ComCard from "@/components/organization/Components/Card2/ComCard";


export default function FindCommunitiesAndJoin(props: any) {
return (

<div >
<br/>
<form className="max-w-5xl mx-auto relative w-full rounded-full overflow-hidden bg-white shadow-lg">
<label htmlFor="default-search" className="sr-only">Search</label>
<div className="flex items-center pl-2">
<svg className="w-6 h-6 text-gray-500 dark:text-gray-400" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 20 20">
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m19 19-4-4m0-7A7 7 0 1 1 1 8a7 7 0 0 1 14 0Z"/>
</svg>
<input type="search" id="default-search" className="block w-full px-4 py-2 text-sm text-gray-900 bg-transparent border-none focus:outline-none dark:text-white" placeholder="Search Communities..." required />
</div>
</form>

<br/>
<div className="p-4 border-2 border-gray-200 grid grid-cols-1 md:grid-cols-3 gap-4 justify-center">
<ComCard />
<ComCard />
<ComCard />
<ComCard />
<ComCard />
<ComCard />
</div>


return (
<div>
<br />
<form className="max-w-5xl mx-auto relative w-full rounded-full overflow-hidden bg-white shadow-lg">
<label htmlFor="default-search" className="sr-only">
Search
</label>
<div className="flex items-center pl-2">
<svg
className="w-6 h-6 text-gray-500 dark:text-gray-400"
aria-hidden="true"
xmlns="http://www.w3.org/2000/svg"
fill="none"
viewBox="0 0 20 20"
>
<path
stroke="currentColor"
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth="2"
d="m19 19-4-4m0-7A7 7 0 1 1 1 8a7 7 0 0 1 14 0Z"
/>
</svg>
<input
type="search"
id="default-search"
className="block w-full px-4 py-2 text-sm text-gray-900 bg-transparent border-none focus:outline-none dark:text-white"
placeholder="Search Communities..."
required
/>
</div>

);
</form>

<br />
<div className="grid grid-cols-3 gap-4">
<ComCard />
<ComCard />
<ComCard />
<ComCard />
<ComCard />
<ComCard />
</div>
</div>
);
}
2 changes: 1 addition & 1 deletion app/firebase/storage.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -49,7 +49,7 @@
/**
* Storage module from Firebase SDK.
*/
const storage = getStorage();
export const storage = getStorage();

/**
* Class representing Firebase Storage operations.
Expand Down
Loading