Skip to content
This repository has been archived by the owner on Mar 26, 2024. It is now read-only.

added log in auth middleware #63

Merged
merged 2 commits into from
Mar 10, 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
17 changes: 11 additions & 6 deletions client/src/components/CommunityCard/CommunityCard.jsx
Original file line number Diff line number Diff line change
@@ -1,9 +1,14 @@
import { useNavigate } from "react-router-dom";
import Community from "../../assets/Community.svg";
export default function CommunityCard() {
return (
<div className="text-text flex flex-col items-center justify-center px-28 md:px-12 py-12 rounded-lg cursor-pointer hover:bg-secondary hover:text-primary bg-primary/[0.12]">
<img src={Community} className="w-28" alt="" />
<h1 className="font-bold">Community</h1>
</div>
);
const navigate = useNavigate();
return (
<div
className="text-text flex flex-col items-center justify-center px-28 md:px-12 py-12 rounded-lg cursor-pointer hover:bg-secondary hover:text-primary bg-primary/[0.12]"
onClick={() => navigate("/community")}
>
<img src={Community} className="w-28" alt="" />
<h1 className="font-bold">Community</h1>
</div>
);
}
116 changes: 116 additions & 0 deletions client/src/components/community/NewCommunity.jsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,116 @@
import { Modal } from "flowbite-react";
import { useState } from "react";
import PropTypes from "prop-types";

export default function NewCommunity({ showModal, setShowModal }) {
const [error, setError] = useState("");
const [formData, setFormData] = useState({
community_name: "",
privacy: "public",
about: "",
});

function handleChange(e) {
const { name, value } = e.target;
setFormData({ ...formData, [name]: value });
}

function handleSubmit() {
if (formData.community_name && formData.topic) {
setError("");
} else if (!formData.community_name) {
setError("Please select a name");
} else if (!formData.topic) {
setError("Please select a topic");
}
}
return (
<>
<Modal
show={showModal}
size="2xl"
onClose={() => {
setError("");
setShowModal(false);
}}
popup
>
<Modal.Header>
<div className="p-4">New Community</div>
</Modal.Header>
<Modal.Body>
{error && (
<small className="text-sm text-red-600">
{error}
</small>
)}
<div className="input-group flex flex-col">
<label htmlFor="" className="font-medium">
Community Name
</label>
<input
type="text"
name="community_name"
id=""
className="rounded-md"
onChange={handleChange}
/>
</div>
<div className="flex gap-3 w-full justify-between">
<div className="input-group flex flex-col mt-5 mb-5 w-full">
<label htmlFor="" className="font-medium">
Privacy
</label>
<select
name="privacy"
id=""
className="rounded-md"
onChange={handleChange}
>
<option value="public">Public</option>
<option value="private">Private</option>
</select>
</div>
</div>
<div className="input-group flex flex-col mt-5">
<label htmlFor="" className="font-medium">
About
</label>
<textarea
name="about"
id=""
className="rounded-md"
/>
</div>

<div className="btn py-5">
<button
className="btn px-5 py-1 bg-red-700 hover:bg-red-500 rounded-md text-white"
onClick={() => {
setFormData({
community_name: "",
topic: null,
privacy: "public",
about: "",
});
}}
>
Clear
</button>
<button
className="btn px-5 py-1 bg-primary hover:bg-primary-hover ms-3 rounded-md text-white"
onClick={handleSubmit}
>
Create
</button>
</div>
</Modal.Body>
</Modal>
</>
);
}

NewCommunity.propTypes = {
showModal: PropTypes.bool.isRequired,
setShowModal: PropTypes.func.isRequired,
};
Empty file.
123 changes: 123 additions & 0 deletions client/src/pages/UserPages/Community/Community.jsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,123 @@
import AddCircle from "@mui/icons-material/AddCircle";
import "./Community.css";
import MenuIcon from "@mui/icons-material/Menu";
import { useState } from "react";
// import NewCommunity from "../../components/Modal/NewCommunity";
// import YourCommunity from "../../components/community/YourCommunity";
// import DiscoverCommunity from "../../components/community/DiscoverCommunity";
import { useNavigate, useParams } from "react-router-dom";
// import RecentDiscussions from "../../components/community/RecentDiscussions";
import NewCommunity from "../../../components/community/NewCommunity";

export default function Community() {
const { tab } = useParams();
const navigate = useNavigate();
const [showSidebar, setShowSidebar] = useState("hidden");
const [currentTab, setCurrentTab] = useState(tab.toUpperCase());
const [showNewCommunity, setShowNewCommunity] = useState(false);
return (
<div className="grid grid-cols-12 h-screen">
<NewCommunity
showModal={showNewCommunity}
setShowModal={setShowNewCommunity}
/>
<div className="flex gap-2 col-span-12">
<button
className="p-2 sm:hidden flex rounded-sm mb-3"
onClick={() =>
setShowSidebar(
showSidebar === "block" ? "hidden" : "block"
)
}
>
<MenuIcon />
</button>
<h1
className={`${
showSidebar === "block" ? "hidden" : "block"
} sm:hidden text-xl mt-2`}
>
Community
</h1>
</div>
<section
className={`sidebar col-span-12 sm:col-span-3 bg-gray-900 flex flex-col p-5 py-8 ${showSidebar} sm:block`}
>
<h1 className="text-2xl mb-10">Community</h1>
{/* <div className="search my-5">
<input
type="text"
placeholder="search communities"
className="bg-gray-800 rounded-md w-full"
/>
</div> */}
<div
className="nav flex flex-col gap-3"
onClick={() =>
setShowSidebar(
showSidebar === "block" ? "hidden" : "block"
)
}
>
<div
className={`item hover:bg-gray-800 ${
currentTab === "RECENT_DISCUSSIONS" &&
"bg-gray-800"
} rounded-md p-5 py-3`}
onClick={() => {
setCurrentTab("RECENT_DISCUSSIONS");
navigate("/community/recent_discussions");
}}
>
<h2 className="text-lg">Recent Discussions</h2>
</div>
<div
className={`item hover:bg-gray-800 ${
currentTab === "DISCOVER" && "bg-gray-800"
} rounded-md p-5 py-3`}
onClick={() => {
setCurrentTab("DISCOVER");
navigate("/community/discover");
}}
>
<h2 className="text-lg">Discover</h2>
</div>
<div
className={`item hover:bg-gray-800 ${
currentTab === "YOUR_COMMUNITY" &&
"bg-gray-800"
} rounded-md p-5 py-3`}
onClick={() => {
setCurrentTab("YOUR_COMMUNITY");
navigate("/community/your_community");
}}
>
<h2 className="text-lg">Your Community</h2>
</div>
</div>
<div className="new-community mt-7 px-5 py-3 bg-gray-800 hover:bg-gray-600 cursor-pointer rounded-md">
<button
className="text-lg flex gap-3"
onClick={() => setShowNewCommunity(true)}
>
<div className="text-primary">
<AddCircle />
</div>
Community
</button>
</div>
</section>
<section className="page-body col-span-12 sm:col-span-9 bg-blue-700">
{currentTab === "RECENT_DISCUSSIONS" ? (
<h1>recent discussion</h1>
) : // <RecentDiscussions />
// : currentTab === "DISCOVER" ? (
// <DiscoverCommunity />
// ) : currentTab === "YOUR_COMMUNITY" ? (
// <YourCommunity />
// )
null}
</section>
</div>
);
}
58 changes: 36 additions & 22 deletions client/src/routes/UserRoute.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -3,38 +3,52 @@ import { Route, Routes } from "react-router";
import Loader from "../components/Loader/Loader1/Loader";
import Authenticate from "../components/Auth/Authenticate";
import Protect from "../components/Auth/Protect";
import Community from "../pages/UserPages/Community/Community";

const Home = lazy(() => import("../pages/UserPages/Home/Home"));
const Signup = lazy(() => import("../pages/UserPages/Signup/Signup"));
const Login = lazy(() => import("../pages/UserPages/Login/Login"));
const MyMindPage = lazy(() =>
import("../pages/UserPages/MyMindPage/MyMindPage")
import("../pages/UserPages/MyMindPage/MyMindPage")
);
const MyLawsPage = lazy(() =>
import("../pages/UserPages/MyLawsPage/MyLawsPage")
import("../pages/UserPages/MyLawsPage/MyLawsPage")
);
const MyBodyPage = lazy(() =>
import("../pages/UserPages/MyBodyPage/MyBodyPage")
import("../pages/UserPages/MyBodyPage/MyBodyPage")
);

export default function UserRoute() {
return (
<>
<Suspense fallback={<Loader />}>
<Routes>
<Route element={<Authenticate />}>
<Route path={"/"} element={<Home />} />
<Route path={"/signup"} element={<Signup />} />
<Route path={"/login"} element={<Login />} />
</Route>
<Route element={<Protect role="USER" />}>
<Route path={"/home"} element={<Home />} />
<Route path={"/my-mind"} element={<MyMindPage />} />
<Route path={"/my-rights"} element={<MyLawsPage />} />
<Route path={"/my-body"} element={<MyBodyPage />} />
</Route>
</Routes>
</Suspense>
</>
);
return (
<>
<Suspense fallback={<Loader />}>
<Routes>
<Route element={<Authenticate />}>
<Route path={"/"} element={<Home />} />
<Route path={"/signup"} element={<Signup />} />
<Route path={"/login"} element={<Login />} />
</Route>
<Route element={<Protect role="USER" />}>
<Route path={"/home"} element={<Home />} />
<Route
path={"/my-mind"}
element={<MyMindPage />}
/>
<Route
path={"/my-rights"}
element={<MyLawsPage />}
/>
<Route
path={"/my-body"}
element={<MyBodyPage />}
/>
<Route
path={"/community/:tab"}
element={<Community />}
/>
</Route>
</Routes>
</Suspense>
</>
);
}
1 change: 1 addition & 0 deletions server/middlewares/authMiddleware.js
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@ const mongoose = require('mongoose');
const isLogedIn = async (req, res, next) => {
try {
const token = req.cookies.token;
console.log(token)
if (token) {
const decoded = jwt.verify(token, process.env.JWT_SECRET);
const userId = new mongoose.Types.ObjectId(decoded.id)
Expand Down