13 | {props.name}
14 | {props.description}
15 |
16 |
18 | );
19 | };
20 |
21 | export default Panel;
22 |
--------------------------------------------------------------------------------
/backend/Readme.md:
--------------------------------------------------------------------------------
1 | # Running the project
2 |
3 | ## Required:
4 |
5 | - .env file (with ACCESS_TOKEN_SECRET and REFRESH_TOKEN_SECRET variables)
6 | - mysql database (edit the ormconfig.json)
7 |
8 | ## Run migration with:
9 |
10 | ```
11 | npm run typeorm migration:run
12 | ```
13 |
14 | ## API End-Points
15 |
16 | - /auth/login
17 | - /auth/check
18 | - /auth/logout
19 | - /auth/signup
20 | - /polls/
21 | - /polls/start
22 | - /polls/status
23 | - /polls/end
24 | - /polls/reset
25 | - /polls/voters
26 | - /polls/vote
27 | - /users/all
28 | - /users/verify
29 | - /users/delete/:id
30 |
--------------------------------------------------------------------------------
/backend/src/entity/User.ts:
--------------------------------------------------------------------------------
1 | import { BaseEntity, Column, Entity, PrimaryGeneratedColumn } from "typeorm";
2 |
3 | @Entity()
4 | export class User extends BaseEntity {
5 | @PrimaryGeneratedColumn()
6 | id!: number;
7 |
8 | @Column({ length: 100 })
9 | name!: string;
10 |
11 | @Column({ unique: true })
12 | citizenshipNumber!: string;
13 |
14 | @Column({ length: 180, unique: true })
15 | email!: string;
16 |
17 | @Column()
18 | password!: string;
19 |
20 | @Column()
21 | admin!: boolean;
22 |
23 | @Column({ default: false })
24 | verified!: boolean;
25 | }
26 |
--------------------------------------------------------------------------------
/backend/src/migration/1645175354681-user-update.ts:
--------------------------------------------------------------------------------
1 | import {MigrationInterface, QueryRunner} from "typeorm";
2 |
3 | export class userUpdate1645175354681 implements MigrationInterface {
4 | name = 'userUpdate1645175354681'
5 |
6 | public async up(queryRunner: QueryRunner): Promise{props.children}
17 |
24 |
27 |
28 |
31 |
32 | );
33 | };
34 |
35 | export default Verify;
36 |
--------------------------------------------------------------------------------
/frontend/src/styles/components/Polls/Chart.scss:
--------------------------------------------------------------------------------
1 | .bars-container {
2 | min-width: 800px;
3 | display: flex;
4 | justify-content: center;
5 |
6 | .bar-wrapper {
7 | width: 50px;
8 | margin-left: 50px;
9 | margin-right: 50px;
10 | background-color: $theme-gray;
11 | height: 300px;
12 | display: flex;
13 | flex-direction: column;
14 | justify-content: flex-end;
15 | border-radius: 10px;
16 | overflow: hidden;
17 | }
18 | }
19 |
20 | .buttons-wrapper {
21 | min-width: 800px;
22 | display: flex;
23 | justify-content: center;
24 |
25 | .button-wrapper {
26 | margin-top: 20px;
27 | // width: 50px;
28 | margin-left: 50px;
29 | margin-right: 50px;
30 | }
31 | }
32 |
33 | .names-wrapper {
34 | min-width: 800px;
35 | display: flex;
36 | justify-content: center;
37 |
38 | .name-wrapper {
39 | padding-top: 20px;
40 | width: 50px;
41 | margin-left: 50px;
42 | margin-right: 50px;
43 | }
44 | }
45 |
--------------------------------------------------------------------------------
/frontend/src/components/Home/Landing.tsx:
--------------------------------------------------------------------------------
1 | import React from "react";
2 | import { Link } from "react-router-dom";
3 |
4 | const Landing = () => {
5 | return (
6 |
7 |
31 | );
32 | };
33 |
34 | export default Landing;
35 |
--------------------------------------------------------------------------------
/backend/src/seed/users.ts:
--------------------------------------------------------------------------------
1 | type UserType = {
2 | name: string;
3 | email: string;
4 | password: string;
5 | citizenshipNumber: string;
6 | admin: boolean;
7 | verified: boolean;
8 | };
9 |
10 | const users: UserType[] = [
11 | {
12 | name: "John",
13 | citizenshipNumber: "9860777906",
14 | email: "john@gmail.com",
15 | password: "$2b$10$6sdkothEwAguhA0FytsGF.gcWPmTDB5hosif6rGX5FFJK8PdBgRHu",
16 | admin: true,
17 | verified: true,
18 | },
19 | {
20 | name: "Liza",
21 | citizenshipNumber: "9860777907",
22 | email: "liza@gmail.com",
23 | password: "$2b$10$70yLw0dPhAD0py/iiGUInO7kklGUmbMfa5BmXKGCXEID1ufTsqSQ6",
24 | admin: false,
25 | verified: true,
26 | },
27 | {
28 | name: "Ben",
29 | citizenshipNumber: "9860777908",
30 | email: "ben@gmail.com",
31 | password: "$2b$10$1DsQFSqUs3ufyDDRBd9wYuU5i9ihbnYR4GCYJsI3IzGXamwFWnr4S",
32 | admin: false,
33 | verified: true,
34 | },
35 | ];
36 |
37 | export default users;
38 |
--------------------------------------------------------------------------------
/frontend/src/components/Features/Feature.tsx:
--------------------------------------------------------------------------------
1 | import React from "react";
2 |
3 | type FeatureProps = {
4 | icon: JSX.Element;
5 | title: string;
6 | align: "left" | "right";
7 | children: JSX.Element;
8 | };
9 |
10 | const Feature = (props: FeatureProps) => {
11 | const iconContainer =
8 |
26 |
27 |
9 | 
10 |
11 |
12 |
10 | Blockchain Based
13 | Voting System
14 | the future of voting
15 |
16 |
17 |
18 |
19 |
20 |
21 |
22 |
23 |
24 |
25 |
28 | 
29 |
30 |
29 | {props.icon}
;
12 |
13 | const featureInfo = (
14 |
15 |
18 | );
19 | return (
20 | {props.title}
16 | {props.children}
17 |
21 | {props.align === "left" ? (
22 | <>
23 | {iconContainer}
24 |
33 | );
34 | };
35 |
36 | export default Feature;
37 |
--------------------------------------------------------------------------------
/frontend/src/pages/Admin/Home.tsx:
--------------------------------------------------------------------------------
1 | import React, { useEffect, useState } from "react";
2 | import { RouteProps } from "react-router";
3 | import axios from "../../axios";
4 | import StartPage from "./Start";
5 | import PollsPage from "./Polls";
6 | import ResultPage from "./Result";
7 |
8 | const Home = (props: RouteProps): JSX.Element => {
9 | const [loading, setLoading] = useState{featureInfo}
25 |
26 | ) : (
27 | <>
28 | {featureInfo}
29 | {iconContainer}
30 |
31 | )}
32 |
12 |
31 | );
32 | };
33 |
34 | export default Profile;
35 |
--------------------------------------------------------------------------------
/frontend/src/components/Navbar.tsx:
--------------------------------------------------------------------------------
1 | import React, { useContext } from "react";
2 | import { useNavigate } from "react-router";
3 | import { AuthContext } from "../contexts/Auth";
4 |
5 | type NavbarContainerProps = {
6 | children: JSX.Element;
7 | };
8 |
9 | const NavbarContainer = (props: NavbarContainerProps) => {
10 | const navigate = useNavigate();
11 |
12 | return (
13 |
18 | );
19 | };
20 |
21 | const Navbar = () => {
22 | const authContext = useContext(AuthContext);
23 |
24 | const getNavbar = (): JSX.Element => {
25 | if (!authContext.authenticated) {
26 | return ;
27 | }
28 |
29 | if (authContext.isAdmin) {
30 | return (
31 |
13 |
21 |
22 |
14 |
15 |
16 | {authContext.name}
17 |
20 |
23 | Profile
24 |
25 |
26 |
27 |
28 |
29 |
30 | admin
33 | user
40 |
38 | navigate("/")} />
39 |
41 | );
42 | };
43 |
44 | export default View;
45 |
--------------------------------------------------------------------------------
/frontend/src/styles/layouts/Default.scss:
--------------------------------------------------------------------------------
1 | .default-container {
2 | min-height: 80vh;
3 | display: flex;
4 |
5 | .default-sidebar-container {
6 | width: 100px;
7 |
8 | .hamburger {
9 | font-size: 2rem;
10 | color: $theme-black;
11 | padding: 20px;
12 | cursor: pointer;
13 | }
14 |
15 | .default-sidebar {
16 | position: fixed;
17 | z-index: 1000;
18 | left: 0;
19 | top: 0;
20 | height: 100vh;
21 | width: 30vw;
22 | transition: 0.3s;
23 | background-color: $theme-primary;
24 | color: white;
25 | box-shadow: 0 0 10px rgba(50, 50, 50, 0.4);
26 |
27 | .hamburger {
28 | font-size: 2rem;
29 | color: white;
30 | }
31 |
32 | .default-sidebar-link {
33 | padding: 20px;
34 | text-transform: uppercase;
35 | cursor: pointer;
36 | }
37 | }
38 | }
39 |
40 | .default-content {
41 | flex: 1;
42 | padding-right: 100px;
43 | display: flex;
44 | justify-content: center;
45 | align-items: center;
46 | }
47 | }
48 |
49 | .display {
50 | // visibility: visible;
51 | // opacity: 1;
52 | transform: translateX(0);
53 | }
54 |
55 | .hide {
56 | // visibility: hidden;
57 | // opacity: 0;
58 | transform: translateX(-800px);
59 | }
60 |
61 | .active {
62 | background-color: $theme-secondary;
63 | }
64 |
--------------------------------------------------------------------------------
/backend/src/controllers/polls/start.ts:
--------------------------------------------------------------------------------
1 | import { Request, Response } from "express";
2 | import * as yup from "yup";
3 | import ElectionContract, { web3 } from "../../web3";
4 |
5 | const schema = yup.object({
6 | body: yup.object({
7 | name: yup.string().min(3).required(),
8 | description: yup.string().min(10).required(),
9 | candidates: yup.array(
10 | yup.object({
11 | name: yup.string().min(3),
12 | info: yup.string().min(10),
13 | })
14 | ),
15 | }),
16 | });
17 |
18 | export default async (req: Request, res: Response) => {
19 | try {
20 | await schema.validate(req);
21 | } catch (error: any) {
22 | return res.status(400).send(error.errors);
23 | }
24 |
25 | const instance = await ElectionContract.deployed();
26 |
27 | const status = await instance.getStatus();
28 | if (status !== "not-started")
29 | return res.status(400).send("election already started or not reset");
30 |
31 | const accounts = await web3.eth.getAccounts();
32 |
33 | await instance.setElectionDetails(req.body.name, req.body.description, {
34 | from: accounts[0],
35 | });
36 |
37 | for (let i = 0; i < req.body.candidates.length; i++) {
38 | const candidate = req.body.candidates[i];
39 | await instance.addCandidate(candidate.name, candidate.info, {
40 | from: accounts[0],
41 | });
42 | }
43 |
44 | return res.send(req.body);
45 | };
46 |
--------------------------------------------------------------------------------
/frontend/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "frontend",
3 | "version": "0.1.0",
4 | "private": true,
5 | "dependencies": {
6 | "@testing-library/jest-dom": "^5.16.1",
7 | "@testing-library/react": "^12.1.2",
8 | "@testing-library/user-event": "^13.5.0",
9 | "@types/jest": "^27.4.0",
10 | "@types/node": "^16.11.18",
11 | "@types/react": "^17.0.38",
12 | "@types/react-dom": "^17.0.11",
13 | "@types/react-router": "^5.1.18",
14 | "@types/react-router-dom": "^5.3.3",
15 | "axios": "^0.25.0",
16 | "bootstrap-icons": "^1.8.1",
17 | "formik": "^2.2.9",
18 | "node-sass": "^7.0.1",
19 | "react": "^17.0.2",
20 | "react-dom": "^17.0.2",
21 | "react-icons": "^4.3.1",
22 | "react-router-dom": "^6.2.1",
23 | "react-scripts": "5.0.0",
24 | "typescript": "^4.5.4",
25 | "web-vitals": "^2.1.2",
26 | "yup": "^0.32.11"
27 | },
28 | "scripts": {
29 | "start": "react-scripts start",
30 | "build": "react-scripts build",
31 | "test": "react-scripts test",
32 | "eject": "react-scripts eject"
33 | },
34 | "eslintConfig": {
35 | "extends": [
36 | "react-app",
37 | "react-app/jest"
38 | ]
39 | },
40 | "browserslist": {
41 | "production": [
42 | ">0.2%",
43 | "not dead",
44 | "not op_mini all"
45 | ],
46 | "development": [
47 | "last 1 chrome version",
48 | "last 1 firefox version",
49 | "last 1 safari version"
50 | ]
51 | }
52 | }
53 |
--------------------------------------------------------------------------------
/frontend/src/layouts/Login.tsx:
--------------------------------------------------------------------------------
1 | import React from "react";
2 | import { useNavigate } from "react-router";
3 | import BackButton from "../components/Back";
4 |
5 | interface LayoutProps {
6 | error: string;
7 | success?: string;
8 | children: JSX.Element;
9 | }
10 |
11 | const Login = (props: LayoutProps) => {
12 | const navigate = useNavigate();
13 |
14 | return (
15 | {comp}
40 |
16 |
46 | );
47 | };
48 |
49 | export default Login;
50 |
--------------------------------------------------------------------------------
/backend/src/migration/1645167790939-initial.ts:
--------------------------------------------------------------------------------
1 | import {MigrationInterface, QueryRunner} from "typeorm";
2 |
3 | export class initial1645167790939 implements MigrationInterface {
4 | name = 'initial1645167790939'
5 |
6 | public async up(queryRunner: QueryRunner): Promise
17 | navigate("/")} />
18 |
19 |
23 |
24 | Blockchain Based
20 | Voting System
21 | the future of voting
22 |
25 | {props.error !== "" ? (
26 |
45 |
27 |
28 |
29 |
30 | {props.error} ...
31 |
32 | ) : null}
33 |
34 | {props.success && props.success !== "" ? (
35 |
36 |
37 |
38 |
39 | {props.success} ...
40 |
41 | ) : null}
42 |
43 | {props.children}
44 |
52 | {users.map((user, index) => (
53 |
74 | );
75 | };
76 |
77 | export default Users;
78 |
--------------------------------------------------------------------------------
/frontend/src/pages/User/Polls.tsx:
--------------------------------------------------------------------------------
1 | import React, { useContext, useEffect, useState } from "react";
2 | import axios from "../../axios";
3 | import Chart from "../../components/Polls/Chart";
4 | import Finished from "../../components/Polls/Finished";
5 | import Panel from "../../components/Polls/Panel";
6 | import Running from "../../components/Polls/Running";
7 | import Waiting from "../../components/Waiting";
8 | import { AuthContext } from "../../contexts/Auth";
9 |
10 | const User = () => {
11 | const [voteState, setVoteStatus] = useState<
12 | "finished" | "running" | "not-started" | "checking"
13 | >("checking");
14 | const [loading, setLoading] = useState(true);
15 | const [data, setData] = useState({ name: "", description: "", votes: {} });
16 | const [votable, setVotable] = useState("");
17 |
18 | const authContext = useContext(AuthContext);
19 |
20 | useEffect(() => {
21 | console.log("called here ?");
22 |
23 | axios
24 | .get("/polls/status")
25 | .then((res) => {
26 | setVoteStatus(res.data.status);
27 | setLoading(false);
28 | })
29 | .catch((error) => console.log({ error }));
30 | }, []);
31 |
32 | useEffect(() => {
33 | if (voteState !== "checking") {
34 | axios.get("/polls/").then((res) => {
35 | setData(res.data);
36 | console.log(res);
37 | setLoading(false);
38 | });
39 |
40 | axios
41 | .post("/polls/check-voteability", {
42 | id: authContext.id.toString(),
43 | })
44 | .then((res) => {
45 | setVotable(res.data);
46 | })
47 | .catch((err) => console.log(err));
48 | }
49 | });
50 |
51 | if (loading || voteState === "checking") return ;
52 |
53 | if (voteState === "not-started") return
54 | {user.name}
55 |
56 |
72 | ))}
73 |
57 |
63 |
64 |
70 |
71 | loading...
;
20 |
21 | if (authContext.authenticated) {
22 | // if the user is authenticated then
23 |
24 | const adminMenu = [
25 | { name: "Home", link: "/" },
26 | { name: "Verify Users", link: "/users" },
27 | { name: "Profile", link: "/profile" },
28 | ];
29 |
30 | const userMenu = [
31 | { name: "Polls", link: "/" },
32 | { name: "Profile", link: "/profile" },
33 | ];
34 |
35 | if (authContext.isAdmin) {
36 | // if the user is admin
37 | return (
38 |
49 |
78 | );
79 | };
80 |
81 | export default Default;
82 |
--------------------------------------------------------------------------------
/frontend/src/components/Home/Features.tsx:
--------------------------------------------------------------------------------
1 | import React from "react";
2 | import Feature from "../Features/Feature";
3 | import { MdGppGood, MdLibraryAddCheck, MdLock, MdShare } from "react-icons/md";
4 |
5 | const Features = () => {
6 | return (
7 |
50 |
75 |
76 |
51 |
52 |
53 |
54 |
74 | {props.children}
77 |
8 |
65 | );
66 | };
67 |
68 | export default Features;
69 |
--------------------------------------------------------------------------------
/backend/src/controllers/auth/login.ts:
--------------------------------------------------------------------------------
1 | import { Request, Response } from "express";
2 | import * as yup from "yup";
3 | import { User } from "../../entity/User";
4 | import bcrypt from "bcrypt";
5 | import jwt from "jsonwebtoken";
6 | import dayjs from "dayjs";
7 |
8 | const schema = yup.object({
9 | body: yup.object({
10 | email: yup.string().email().required(),
11 | password: yup.string().min(3).required(),
12 | }),
13 | });
14 |
15 | export default async (req: Request, res: Response) => {
16 | let user = null;
17 |
18 | // throws error when the POST-ed queries are invalide (email and password)
19 | try {
20 | await schema.validate(req);
21 | } catch (error: any) {
22 | return res.status(400).send(error.errors);
23 | }
24 |
25 | // throws error if user with provided email not found
26 | try {
27 | user = await User.findOneOrFail({ email: req.body.email });
28 | } catch (error: any) {
29 | return res.status(404).send(error);
30 | }
31 |
32 | if (!user.verified) return res.status(400).send("Not verified");
33 |
34 | const match = await bcrypt.compare(req.body.password, user.password);
35 | //exits if password doesn't match
36 | if (!match) return res.status(400).send("password doesn't match");
37 |
38 | // if the code reaches here then the user is authenticated
39 | // hurray :D
40 |
41 | const accessTokenSecret = process.env.ACCESS_TOKEN_SECRET;
42 | const refreshTokenSecret = process.env.REFRESH_TOKEN_SECRET;
43 |
44 | if (!accessTokenSecret || !refreshTokenSecret) {
45 | console.log("you forgot to add .env file to the project?");
46 | console.log(`
47 | add the following:
48 |
49 | ACCESS_TOKEN_SECRET=976a66a5bd23b2050019f380c4decbbefdf8ff91cf502c68a3fe1ced91d7448cc54ce6c847657d53294e40889cef5bd996ec5b0fefc1f56270e06990657eeb6e
50 |
51 | REFRESH_TOKEN_SECRET=5f567afa6406225c4a759daae77e07146eca5df8149353a844fa9ab67fba22780cb4baa5ea508214934531a6f35e67e96f16a0328559111c597856c660f177c2
52 | `);
53 |
54 | return res.status(500).send("server error");
55 | }
56 |
57 | const plainUserObject = {
58 | id: user.id,
59 | name: user.name,
60 | citizenshipNumber: user.citizenshipNumber,
61 | email: user.email,
62 | admin: user.admin,
63 | };
64 | const accessToken = jwt.sign(plainUserObject, accessTokenSecret, {
65 | expiresIn: 60,
66 | });
67 | const refreshToken = jwt.sign(plainUserObject, refreshTokenSecret, {
68 | expiresIn: "7d",
69 | });
70 |
71 | res.cookie("refreshToken", refreshToken, {
72 | expires: dayjs().add(7, "days").toDate(),
73 | });
74 |
75 | return res.send({ user, accessToken });
76 | };
77 |
--------------------------------------------------------------------------------
/frontend/src/contexts/Auth.tsx:
--------------------------------------------------------------------------------
1 | import React, { createContext, useEffect, useState } from "react";
2 | import { useNavigate } from "react-router";
3 | import axios from "../axios";
4 |
5 | type ContextProps = {
6 | children: JSX.Element;
7 | };
8 |
9 | type User = {
10 | id: number;
11 | name: string;
12 | admin: boolean;
13 | };
14 |
15 | export const AuthContext = createContext({
16 | id: 0,
17 | name: "",
18 | isAdmin: false,
19 | authenticated: false,
20 | accessToken: "",
21 | loading: true,
22 | authenticate: (user: User, token: string) => {},
23 | logout: () => {},
24 | });
25 |
26 | export default (props: ContextProps): JSX.Element => {
27 | const navigate = useNavigate();
28 |
29 | const [authentication, setAuthentication] = useState({
30 | id: 0,
31 | name: "",
32 | isAdmin: false,
33 | authenticated: false,
34 | accessToken: "",
35 | loading: true,
36 | });
37 |
38 | const checkAuthentication = () => {
39 | axios
40 | .post("/auth/check")
41 | .then((res) => authenticate(res.data.user, res.data.accessToken, false))
42 | .catch((error) => {
43 | console.log(error);
44 | setAuthentication({ ...authentication, loading: false });
45 | });
46 | };
47 |
48 | useEffect(() => {
49 | checkAuthentication();
50 |
51 | const interval = setInterval(checkAuthentication, 5 * 1000);
52 |
53 | return () => clearInterval(interval);
54 | }, []);
55 |
56 | const authenticate = (
57 | user: User,
58 | token: string,
59 | redirect: boolean = true
60 | ) => {
61 | setAuthentication({
62 | id: user.id,
63 | name: user.name,
64 | isAdmin: user.admin,
65 | authenticated: true,
66 | accessToken: token,
67 | loading: false,
68 | });
69 |
70 | if (redirect) navigate("/");
71 | };
72 |
73 | const logout = async () => {
74 | await axios.post("/auth/logout");
75 |
76 | setAuthentication({
77 | id: 0,
78 | name: "",
79 | isAdmin: false,
80 | authenticated: false,
81 | accessToken: "",
82 | loading: false,
83 | });
84 |
85 | navigate("/");
86 | };
87 |
88 | return (
89 | Amazing Features
9 |
10 | lorem ipsum dosa is posa and gosa is the best thing i can come up with
11 |
12 |
13 |
14 |
64 |
15 |
24 |
25 | 17 | Immutability means something that can’t be changed or altered. 18 | This is one of the top blockchain features that help to ensure 19 | that the technology will remain as it is, a permanent, unalterable 20 | network. 21 |
22 | 23 |
26 | 
27 |
28 |
29 |
27 |
30 |
39 | 32 | Immutability means something that can’t be changed or altered. 33 | This is one of the top blockchain features that help to ensure 34 | that the technology will remain as it is, a permanent, unalterable 35 | network. 36 |
37 | 38 |
40 |
49 | 42 | Immutability means something that can’t be changed or altered. 43 | This is one of the top blockchain features that help to ensure 44 | that the technology will remain as it is, a permanent, unalterable 45 | network. 46 |
47 | 48 |
50 |
63 | 56 | Immutability means something that can’t be changed or altered. 57 | This is one of the top blockchain features that help to ensure 58 | that the technology will remain as it is, a permanent, unalterable 59 | network. 60 |
61 | 62 |
49 | {name}
50 |
51 | );
52 | }
53 |
54 | return names;
55 | };
56 |
57 | const getTotal = () => {
58 | let total = 0;
59 |
60 | for (const name in votes) {
61 | total += parseInt(votes[name]);
62 | }
63 |
64 | return total;
65 | };
66 |
67 | const getBars = () => {
68 | const bars = [];
69 | const total = getTotal();
70 |
71 | for (const name in votes) {
72 | const count = votes[name];
73 | bars.push(
74 |
75 |
92 | );
93 | }
94 |
95 | return bars;
96 | };
97 |
98 | return (
99 |
89 | {votes[name]}
90 |
91 |
100 |
107 | );
108 | };
109 |
110 | export default Chart;
111 |
--------------------------------------------------------------------------------
/frontend/src/styles/index.scss:
--------------------------------------------------------------------------------
1 | @import url("https://fonts.googleapis.com/css2?family=Josefin+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&family=Ubuntu:ital,wght@0,300;0,400;0,500;0,700;1,300;1,400;1,500;1,700&display=swap");
2 | @import url("https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap");
3 | @import "~bootstrap-icons/font/bootstrap-icons.css";
4 |
5 | $theme-gray: #f6f6f6;
6 | $theme-black: #333333;
7 | $theme-primary: #4daaa7;
8 | $theme-secondary: #3f8f8b;
9 |
10 | @mixin box-shadow {
11 | box-shadow: 2px 2px 10px rgba(50, 50, 50, 0.1);
12 | }
13 |
14 | body,
15 | html {
16 | position: relative;
17 | margin: 0;
18 | padding: 0;
19 | // font-family: "Inter", sans-serif;
20 | font-family: "Josefin Sans", sans-serif;
21 | -webkit-font-smoothing: antialiased;
22 | -moz-osx-font-smoothing: grayscale;
23 | color: $theme-black;
24 | }
25 |
26 | code {
27 | font-family: source-code-pro, Menlo, Monaco, Consolas, "Courier New",
28 | monospace;
29 | }
30 |
31 | button {
32 | border: none;
33 | outline: none;
34 | border-radius: 5px;
35 | padding: 10px;
36 | margin-right: 5px;
37 | cursor: pointer;
38 | transition: 0.3s;
39 | }
40 |
41 | .button-black {
42 | background-color: $theme-black;
43 | color: white;
44 | }
45 | .button-primary {
46 | background-color: $theme-primary;
47 | color: white;
48 | }
49 |
50 | .button-secondary {
51 | background-color: $theme-secondary;
52 | color: white;
53 | }
54 |
55 | button,
56 | .title-large,
57 | .title-small {
58 | text-transform: uppercase;
59 | }
60 |
61 | .title-large {
62 | font-size: 2.8rem;
63 | font-weight: 900;
64 | }
65 |
66 | .title-small {
67 | font-size: 1.6rem;
68 | font-weight: 300;
69 | }
70 |
71 | .text-normal {
72 | font-weight: 300;
73 | }
74 |
75 | .success-message,
76 | .error-message {
77 | box-sizing: border-box;
78 | width: 400px;
79 | padding: 20px 30px 20px 30px;
80 | border-radius: 10px;
81 | margin-bottom: 50px;
82 | color: white;
83 |
84 | span {
85 | margin-right: 10px;
86 | }
87 | }
88 |
89 | .success-message {
90 | background-color: $theme-primary;
91 | }
92 |
93 | .error-message {
94 | background-color: red;
95 | }
96 |
97 | @import "./layouts/Boxes.scss";
98 |
99 | @import "./form.scss";
100 | @import "./vote-status.scss";
101 | @import "./pages/View.scss";
102 | @import "./pages/Landing.scss";
103 | @import "./pages/Features.scss";
104 | @import "./pages/Admin/Create.scss";
105 | @import "./pages/Admin/Polls.scss";
106 | @import "./pages/User/Profile.scss";
107 | @import "./layouts/Login.scss";
108 | @import "./layouts/Default.scss";
109 | @import "./layouts/Users.scss";
110 | @import "./layouts/Polls.scss";
111 | @import "./components/Back.scss";
112 | @import "./components/Waiting.scss";
113 | @import "./components/Features/Feature.scss";
114 | @import "./components/Polls/Chart.scss";
115 | @import "./components/Polls/Panel.scss";
116 |
--------------------------------------------------------------------------------
/frontend/src/pages/Login.tsx:
--------------------------------------------------------------------------------
1 | import React, { useState, useContext } from "react";
2 | import { useNavigate } from "react-router";
3 | import { Formik } from "formik";
4 | import { RouteProps } from "react-router";
5 | import LoginLayout from "../layouts/Login";
6 | import * as Yup from "yup";
7 | import axios from "../axios";
8 | import { AuthContext } from "../contexts/Auth";
9 |
10 | const schema = Yup.object().shape({
11 | email: Yup.string().email("Invalid email").required("Required"),
12 | password: Yup.string().min(3).required("Required"),
13 | });
14 |
15 | const Login = (props: RouteProps): JSX.Element => {
16 | const navigate = useNavigate();
17 | const authContext = useContext(AuthContext);
18 |
19 | const [error, setError] = useState{getBars()}
101 | {getNames()}
102 |
103 | {props.enableVote ? (
104 | {getButtons()}
105 | ) : null}
106 |
23 |
24 |
92 |
93 | );
94 | };
95 |
96 | export default Login;
97 |
--------------------------------------------------------------------------------
/backend/contracts/Election.sol:
--------------------------------------------------------------------------------
1 | //SPDX-License-Identifier: UNLICENSED
2 | pragma solidity >=0.4.22 <0.9.0;
3 |
4 | contract Election {
5 | mapping(address => bool) admins;
6 | string name; // name of the election. example: for president
7 | string description; // description of the election
8 | bool started;
9 | bool ended;
10 |
11 | constructor() {
12 | admins[msg.sender] = true;
13 | started = false;
14 | ended = false;
15 | }
16 |
17 | modifier onlyAdmin() {
18 | //require(admins[msg.sender] == true, "Only Admin");
19 | _;
20 | }
21 |
22 | function addAdmin(address _address) public onlyAdmin {
23 | admins[_address] = true;
24 | }
25 |
26 | /*****************************CANDIDATES SECTION*****************************/
27 |
28 | struct Candidate {
29 | string name;
30 | string info;
31 | bool exists;
32 | }
33 | mapping(string => Candidate) public candidates;
34 | string[] candidateNames;
35 |
36 | function addCandidate(string memory _candidateName, string memory _info)
37 | public
38 | onlyAdmin
39 | {
40 | Candidate memory newCandidate = Candidate({
41 | name: _candidateName,
42 | info: _info,
43 | exists: true
44 | });
45 |
46 | candidates[_candidateName] = newCandidate;
47 | candidateNames.push(_candidateName);
48 | }
49 |
50 | function getCandidates() public view returns (string[] memory) {
51 | return candidateNames;
52 | }
53 |
54 | /*****************************CANDIDATES SECTION*****************************/
55 |
56 | /*****************************ELECTION SECTION*****************************/
57 |
58 | function setElectionDetails(string memory _name, string memory _description)
59 | public
60 | onlyAdmin
61 | {
62 | name = _name;
63 | description = _description;
64 | started = true;
65 | ended = false;
66 | }
67 |
68 | function getElectionName() public view returns (string memory) {
69 | return name;
70 | }
71 |
72 | function getElectionDescription() public view returns (string memory) {
73 | return description;
74 | }
75 |
76 | function getTotalCandidates() public view returns (uint256) {
77 | return candidateNames.length;
78 | }
79 |
80 | /*****************************ELECTION SECTION*****************************/
81 |
82 | /*****************************VOTER SECTION*****************************/
83 |
84 | struct Vote {
85 | address voterAddress;
86 | string voterId;
87 | string voterName;
88 | string candidate;
89 | }
90 | Vote[] votes;
91 | mapping(string => bool) public voterIds;
92 | string[] votersArray;
93 |
94 | function vote(
95 | string memory _voterId,
96 | string memory _voterName,
97 | string memory _candidateName
98 | ) public {
99 | require(started == true && ended == false);
100 | require(candidates[_candidateName].exists, "No such candidate");
101 | require(!voterIds[_voterId], "Already Voted");
102 |
103 | Vote memory newVote = Vote({
104 | voterAddress: msg.sender,
105 | voterId: _voterId,
106 | voterName: _voterName,
107 | candidate: _candidateName
108 | });
109 |
110 | votes.push(newVote);
111 | voterIds[_voterId] = true;
112 | votersArray.push(_voterId);
113 | }
114 |
115 | function getVoters() public view returns (string[] memory) {
116 | return votersArray;
117 | }
118 |
119 | /*****************************VOTER SECTION*****************************/
120 |
121 | function getVotes() public view onlyAdmin returns (Vote[] memory) {
122 | return votes;
123 | }
124 |
125 | function getTotalVoter() public view returns (uint256) {
126 | return votersArray.length;
127 | }
128 |
129 | function endElection() public onlyAdmin {
130 | require(started == true && ended == false);
131 |
132 | started = true;
133 | ended = true;
134 | }
135 |
136 | function resetElection() public onlyAdmin {
137 | require(started == true && ended == true);
138 |
139 | for (uint32 i = 0; i < candidateNames.length; i++) {
140 | delete candidates[candidateNames[i]];
141 | }
142 |
143 | for (uint32 i = 0; i < votersArray.length; i++) {
144 | delete voterIds[votersArray[i]];
145 | }
146 |
147 | name = "";
148 | description = "";
149 |
150 | delete votes;
151 | delete candidateNames;
152 | delete votersArray;
153 |
154 | started = false;
155 | ended = false;
156 | }
157 |
158 | function getStatus() public view returns (string memory) {
159 | if (started == true && ended == true) {
160 | return "finished";
161 | }
162 |
163 | if (started == true && ended == false) {
164 | return "running";
165 | }
166 |
167 | return "not-started";
168 | }
169 | }
170 |
--------------------------------------------------------------------------------
/backend/truffle-config.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Use this file to configure your truffle project. It's seeded with some
3 | * common settings for different networks and features like migrations,
4 | * compilation and testing. Uncomment the ones you need or modify
5 | * them to suit your project as necessary.
6 | *
7 | * More information about configuration can be found at:
8 | *
9 | * trufflesuite.com/docs/advanced/configuration
10 | *
11 | * To deploy via Infura you'll need a wallet provider (like @truffle/hdwallet-provider)
12 | * to sign your transactions before they're sent to a remote public node. Infura accounts
13 | * are available for free at: infura.io/register.
14 | *
15 | * You'll also need a mnemonic - the twelve word phrase the wallet uses to generate
16 | * public/private key pairs. If you're publishing your code to GitHub make sure you load this
17 | * phrase from a file you've .gitignored so it doesn't accidentally become public.
18 | *
19 | */
20 |
21 | // const HDWalletProvider = require('@truffle/hdwallet-provider');
22 | //
23 | // const fs = require('fs');
24 | // const mnemonic = fs.readFileSync(".secret").toString().trim();
25 |
26 | module.exports = {
27 | /**
28 | * Networks define how you connect to your ethereum client and let you set the
29 | * defaults web3 uses to send transactions. If you don't specify one truffle
30 | * will spin up a development blockchain for you on port 9545 when you
31 | * run `develop` or `test`. You can ask a truffle command to use a specific
32 | * network from the command line, e.g
33 | *
34 | * $ truffle test --network
25 | {
32 | axios
33 | .post("/auth/login", { ...values })
34 | .then((res) => {
35 | authContext.authenticate(res.data.user, res.data.accessToken);
36 | })
37 | .catch((err) => {
38 | let error = err.message;
39 | if (err?.response?.data)
40 | error = JSON.stringify(err.response.data);
41 | setError(error);
42 | });
43 | }}
44 | >
45 | {({ errors, touched, getFieldProps, handleSubmit }) => (
46 |
77 | )}
78 |
79 |
80 |
83 | 84 | 90 |
91 | Forgot Password?
81 |
82 | 83 | 84 | 90 |
26 |
27 |
142 |
143 | );
144 | };
145 |
146 | export default Signup;
147 |
--------------------------------------------------------------------------------
/frontend/src/pages/Admin/Start.tsx:
--------------------------------------------------------------------------------
1 | import React, { useRef, useState } from "react";
2 | import { Formik } from "formik";
3 | import axios from "../../axios";
4 | import * as yup from "yup";
5 |
6 | const schema = yup.object({
7 | name: yup.string().min(3).required(),
8 | description: yup.string().min(10).required(),
9 | });
10 |
11 | interface Candidate {
12 | name: string;
13 | info: string;
14 | }
15 |
16 | const Start = () => {
17 | const [candidates, setCandidates] = useState
28 | {
38 | axios
39 | .post("/auth/signup", {
40 | name,
41 | email,
42 | citizenshipNumber,
43 | password,
44 | })
45 | .then((res) => {
46 | setError("");
47 | setSuccess("Signup Successful!");
48 | })
49 | .catch((err) => {
50 | let error: string = err.message;
51 | if (err?.response?.data)
52 | error = JSON.stringify(err.response.data);
53 | setError(error.slice(0, 50));
54 | });
55 | }}
56 | >
57 | {({ errors, touched, getFieldProps, handleSubmit }) => (
58 |
127 | )}
128 |
129 |
130 |
131 |
141 | 131 |
Already have an account?
132 |
133 |
140 |
28 | {error !== "" ? {
37 | setLoading(true);
38 |
39 | let candidatesError = "";
40 |
41 | if (candidates.length < 2) candidatesError = "Not Enough Candidates";
42 |
43 | for (let i = 0; i < candidates.length; i++) {
44 | const candidate = candidates[i];
45 |
46 | if (candidate.name.length < 3) {
47 | candidatesError = "invalid name " + candidate.name;
48 | break;
49 | }
50 |
51 | if (candidate.info.length < 10) {
52 | candidatesError = "invalid info for " + candidate.name;
53 | break;
54 | }
55 | }
56 |
57 | setError(candidatesError);
58 |
59 | if (candidatesError === "") {
60 | axios
61 | .post("/polls/start", { name, description, candidates })
62 | .then((_) => {
63 | window.location.reload();
64 | })
65 | .catch((err) => {
66 | let error = err.message;
67 | if (err?.response?.data) error = err.response.data;
68 | setError(error.slice(0, 50));
69 | setLoading(false);
70 | });
71 | }
72 | }}
73 | >
74 | {({ errors, touched, getFieldProps, handleSubmit }) => (
75 |
171 | )}
172 |
173 |
174 | );
175 | };
176 |
177 | export default Start;
178 |
--------------------------------------------------------------------------------
/backend/tsconfig.json:
--------------------------------------------------------------------------------
1 | {
2 | "compilerOptions": {
3 | /* Visit https://aka.ms/tsconfig.json to read more about this file */
4 |
5 | /* Projects */
6 | // "incremental": true, /* Enable incremental compilation */
7 | // "composite": true, /* Enable constraints that allow a TypeScript project to be used with project references. */
8 | // "tsBuildInfoFile": "./", /* Specify the folder for .tsbuildinfo incremental compilation files. */
9 | // "disableSourceOfProjectReferenceRedirect": true, /* Disable preferring source files instead of declaration files when referencing composite projects */
10 | // "disableSolutionSearching": true, /* Opt a project out of multi-project reference checking when editing. */
11 | // "disableReferencedProjectLoad": true, /* Reduce the number of projects loaded automatically by TypeScript. */
12 |
13 | /* Language and Environment */
14 | "target": "es2016", /* Set the JavaScript language version for emitted JavaScript and include compatible library declarations. */
15 | // "lib": ["es2019"], /* Specify a set of bundled library declaration files that describe the target runtime environment. */
16 | // "jsx": "preserve", /* Specify what JSX code is generated. */
17 | "experimentalDecorators": true, /* Enable experimental support for TC39 stage 2 draft decorators. */
18 | "emitDecoratorMetadata": true, /* Emit design-type metadata for decorated declarations in source files. */
19 | // "jsxFactory": "", /* Specify the JSX factory function used when targeting React JSX emit, e.g. 'React.createElement' or 'h' */
20 | // "jsxFragmentFactory": "", /* Specify the JSX Fragment reference used for fragments when targeting React JSX emit e.g. 'React.Fragment' or 'Fragment'. */
21 | // "jsxImportSource": "", /* Specify module specifier used to import the JSX factory functions when using `jsx: react-jsx*`.` */
22 | // "reactNamespace": "", /* Specify the object invoked for `createElement`. This only applies when targeting `react` JSX emit. */
23 | // "noLib": true, /* Disable including any library files, including the default lib.d.ts. */
24 | // "useDefineForClassFields": true, /* Emit ECMAScript-standard-compliant class fields. */
25 |
26 | /* Modules */
27 | "module": "commonjs", /* Specify what module code is generated. */
28 | // "rootDir": "./", /* Specify the root folder within your source files. */
29 | // "moduleResolution": "node", /* Specify how TypeScript looks up a file from a given module specifier. */
30 | // "baseUrl": ".", /* Specify the base directory to resolve non-relative module names. */
31 | // "paths": {
32 | // "*": ["./@types/*"]
33 | // }, /* Specify a set of entries that re-map imports to additional lookup locations. */
34 | // "rootDirs": [], /* Allow multiple folders to be treated as one when resolving modules. */
35 | // "typeRoots": [], /* Specify multiple folders that act like `./node_modules/@types`. */
36 | // "types": [], /* Specify type package names to be included without being referenced in a source file. */
37 | // "allowUmdGlobalAccess": true, /* Allow accessing UMD globals from modules. */
38 | "resolveJsonModule": true, /* Enable importing .json files */
39 | // "noResolve": true, /* Disallow `import`s, `require`s or `{error}
: null}
29 |
30 |