',
18 | to: email,
19 | subject: "Verification Link For Notes Account",
20 | text: "Click the link below to verify your account",
21 | html: url,
22 | });
23 | });
24 |
25 | export default sendMail;
--------------------------------------------------------------------------------
/backend/middlewares/user.middlewares.js:
--------------------------------------------------------------------------------
1 | import jwt from "jsonwebtoken";
2 | import { HTTP_STATUS, ERROR_MESSAGES } from "../utils/const.js";
3 | const { ACCESS_TOKEN_SECRET, GOOGLE_API_TOKEN } = process.env;
4 |
5 |
6 | const createAccountMiddleware = async (req, res, next) => {
7 | const { fullName, email, password } = req.body;
8 |
9 | // fullname validations
10 | if (!fullName || fullName.trim() === "") {
11 | return res
12 | .status(HTTP_STATUS.BAD_REQUEST)
13 | .json({ error: true, message: ERROR_MESSAGES.NAME_REQUIRED });
14 | }
15 | const nameRegex = /^[A-Za-z]+(?: [A-Za-z]+)*$/;
16 | if (!nameRegex.test(fullName)) {
17 | return res
18 | .status(HTTP_STATUS.BAD_REQUEST)
19 | .json({ error: true, message: ERROR_MESSAGES.INVALID_NAME_FORMAT });
20 | }
21 |
22 | // email validations
23 | if (!email || email.trim() === "") {
24 | return res
25 | .status(HTTP_STATUS.BAD_REQUEST)
26 | .json({ error: true, message: ERROR_MESSAGES.EMAIL_REQUIRED });
27 | }
28 | const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
29 | if (!emailRegex.test(email)) {
30 | return res
31 | .status(HTTP_STATUS.BAD_REQUEST)
32 | .json({ error: true, message: ERROR_MESSAGES.INVALID_EMAIL_FORMAT });
33 | }
34 |
35 | // password validaitons
36 | if (!password || password.trim() === "") {
37 | return res
38 | .status(HTTP_STATUS.BAD_REQUEST)
39 | .json({ error: true, message: ERROR_MESSAGES.PASSWORD_REQUIRED });
40 | }
41 | if (!/[A-Z]/.test(password)) {
42 | return res.status(HTTP_STATUS.BAD_REQUEST).json({
43 | error: true,
44 | message: ERROR_MESSAGES.PASSWORD_UPPERCASE_REQUIRED,
45 | });
46 | }
47 | if (!/[a-z]/.test(password)) {
48 | return res.status(HTTP_STATUS.BAD_REQUEST).json({
49 | error: true,
50 | message: ERROR_MESSAGES.PASSWORD_LOWERCASE_REQUIRED,
51 | });
52 | }
53 | if (!/[!"#$%&'()*+,-.:;<=>?@[\]^_`{|}~]/.test(password)) {
54 | return res.status(HTTP_STATUS.BAD_REQUEST).json({
55 | error: true,
56 | message: ERROR_MESSAGES.PASSWORD_SPECIAL_CHAR_REQUIRED,
57 | });
58 | }
59 | if (!(password.length >= 8)) {
60 | return res
61 | .status(HTTP_STATUS.BAD_REQUEST)
62 | .json({ error: true, message: ERROR_MESSAGES.PASSWORD_MIN_LENGTH });
63 | }
64 |
65 | next();
66 | };
67 |
68 | const authenticationToken = (req, res, next) => {
69 | // console.log(req.headers)
70 | const token = req.headers["authorization"].split(" ")[1];
71 | // console.log("Authorization header:", token); // Log the token for debugging
72 |
73 | if (!token) {
74 | return res.status(403).json({ message: "No token provided." });
75 | }
76 |
77 | jwt.verify(token, ACCESS_TOKEN_SECRET, (err, user) => {
78 | if (err) {
79 | console.error("Token verification error:", err); // Log the error
80 | return res.status(403).json({ message: "Token verification failed." });
81 | }
82 | req.user = user; // Attach user data to the request object
83 | next(); // Proceed to the next middleware/route handler
84 | });
85 | };
86 |
87 | export { createAccountMiddleware, authenticationToken };
88 |
--------------------------------------------------------------------------------
/backend/models/contactModel.js:
--------------------------------------------------------------------------------
1 | const mongoose = require('mongoose');
2 |
3 | const contactSchema = new mongoose.Schema({
4 | first_name: {
5 | type: String,
6 | required: true,
7 | },
8 | last_name: {
9 | type: String,
10 | required: false, // Make this optional if you don't always collect it
11 | },
12 | user_email: {
13 | type: String,
14 | required: true,
15 | match: /.+\@.+\..+/ // Basic email format validation
16 | },
17 | message: {
18 | type: String,
19 | required: true,
20 | minlength: 1, // Minimum length of message
21 | },
22 | }, {
23 | timestamps: true, // Automatically adds createdAt and updatedAt fields
24 | });
25 |
26 | const Contact = mongoose.model('Contact', contactSchema);
27 |
28 | module.exports = Contact;
29 |
--------------------------------------------------------------------------------
/backend/models/eventModel.js:
--------------------------------------------------------------------------------
1 | // models/Event.js
2 | import mongoose from "mongoose";
3 |
4 | const eventSchema = new mongoose.Schema({
5 | date: {
6 | type: String,
7 | required: true,
8 | },
9 | title: {
10 | type: String,
11 | required: true,
12 | },
13 | color: {
14 | type: String,
15 | required: true,
16 | },
17 | description: {
18 | type: String,
19 | required: false,
20 | },
21 | userId: { type: String, required: true },
22 | });
23 |
24 | const Event = mongoose.model('Event', eventSchema);
25 | export default Event;
26 |
--------------------------------------------------------------------------------
/backend/models/feedbackModel.js:
--------------------------------------------------------------------------------
1 | import mongoose from "mongoose";
2 |
3 | const Schema = mongoose.Schema;
4 |
5 | const feedbackSchema = new Schema({
6 | name: { type: String, required: true },
7 | email: { type: String, required: true },
8 | feedback: { type: String, required: true },
9 | rating:{type:Number,required:true},
10 | createdOn: { type: Date, default: Date.now }
11 | });
12 |
13 | const Feedback = mongoose.model("Feedback", feedbackSchema);
14 | export default Feedback;
--------------------------------------------------------------------------------
/backend/models/noteModel.js:
--------------------------------------------------------------------------------
1 | import mongoose from "mongoose";
2 |
3 | const Schema = mongoose.Schema;
4 |
5 | const noteSchema = new Schema({
6 | title: { type: String, required: true },
7 | content: { type: String, required: true },
8 | tags: { type: [String], default: [] }, // Ensure this is an array
9 | attachments:{type:[String],default:[]},
10 | isPinned: { type: Boolean, required: false },
11 | isArchived:{type:Boolean , default:false},
12 | deleted: {
13 | type: Boolean,
14 | default: false, // Default is false, meaning the note is not deleted
15 | },
16 | userId: { type: String, required: true },
17 | createdOn: { type: Date, default: Date.now },
18 | background: { type: String },
19 | deletedAt: Date,
20 |
21 | });
22 |
23 |
24 | export default mongoose.model("Note", noteSchema);
25 |
--------------------------------------------------------------------------------
/backend/models/userModel.js:
--------------------------------------------------------------------------------
1 | import mongoose from "mongoose";
2 | import bcrypt from "bcrypt"; // Import bcrypt
3 |
4 | const Schema = mongoose.Schema;
5 |
6 | const userSchema = new Schema({
7 | fullName: { type: String },
8 | email: { type: String },
9 | password: { type: String },
10 | phone: { type: String },
11 | createdOn: { type: Date, default: new Date().getTime() },
12 | profilePhoto: { type: String },
13 | verificationCode: {type: String, default: ""},
14 | isEmailVerified: { type: Boolean, default: false },
15 |
16 | });
17 | // hashing the password before saving it to the database by using PRE
18 | userSchema.pre("save", async function (next) {
19 | if (!this.isModified("password")) return next();
20 | //this will hash the password only the password field is bieng modified
21 | this.password = await bcrypt.hash(this.password, 10);
22 | next();
23 | });
24 | //creating a our own method for validating the password entered by the user
25 | userSchema.methods.checkPassword = async function (password) {
26 | return await bcrypt.compare(password, this.password);
27 | };
28 |
29 | export default mongoose.model("User", userSchema);
30 |
--------------------------------------------------------------------------------
/backend/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "notes-app-backend",
3 | "version": "1.0.0",
4 | "description": "",
5 | "main": "index.js",
6 | "scripts": {
7 | "test": "echo \"Error: no test specified\" && exit 1",
8 | "start": "nodemon index.js"
9 | },
10 | "type": "module",
11 | "author": "",
12 | "license": "ISC",
13 | "dependencies": {
14 | "@react-oauth/google": "^0.12.1",
15 | "axios": "^1.7.2",
16 | "bcrypt": "^5.1.1",
17 | "cors": "^2.8.5",
18 | "dotenv": "^16.4.5",
19 | "express": "^4.21.0",
20 | "express-async-handler": "^1.2.0",
21 | "express-rate-limit": "^7.4.1",
22 | "fs": "^0.0.1-security",
23 | "google-auth-library": "^9.11.0",
24 | "jsonwebtoken": "^9.0.2",
25 | "moment": "^2.30.1",
26 | "mongodb": "^6.9.0",
27 | "mongoose": "^8.4.4",
28 | "multer": "^1.4.5-lts.1",
29 | "nodemailer": "^6.9.15",
30 | "notes-app-backend": "file:"
31 | },
32 | "devDependencies": {
33 | "nodemon": "^3.1.7"
34 | }
35 | }
36 |
--------------------------------------------------------------------------------
/backend/uploads/profilePhoto-1721713869259-990478442.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/Scribbie-Notes/notes-app/a5a6d6d0fb634a3b6605a00f37fad8895838df55/backend/uploads/profilePhoto-1721713869259-990478442.png
--------------------------------------------------------------------------------
/backend/uploads/profilePhoto-1721713968989-129215121.jpeg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/Scribbie-Notes/notes-app/a5a6d6d0fb634a3b6605a00f37fad8895838df55/backend/uploads/profilePhoto-1721713968989-129215121.jpeg
--------------------------------------------------------------------------------
/backend/uploads/profilePhoto-1721714084138-572334207.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/Scribbie-Notes/notes-app/a5a6d6d0fb634a3b6605a00f37fad8895838df55/backend/uploads/profilePhoto-1721714084138-572334207.jpg
--------------------------------------------------------------------------------
/backend/utilities.js:
--------------------------------------------------------------------------------
1 | const jwt = require('jsonwebtoken');
2 | const dotenv = require('dotenv')
3 | dotenv.config()
4 | const { ACCESS_TOKEN_SECRET } = process.env;
5 |
6 |
7 | const authenticationToken = (req, res, next) => {
8 | const token = req.headers["authorization"];
9 | if (!token) return res.sendStatus(403);
10 |
11 | jwt.verify(token, ACCESS_TOKEN_SECRET, (err, user) => {
12 | if (err) return res.sendStatus(403);
13 | req.user = user;
14 | next();
15 | });
16 | };
17 |
18 |
19 | module.exports = authenticationToken ;
20 |
--------------------------------------------------------------------------------
/backend/utils/const.js:
--------------------------------------------------------------------------------
1 | // HTTP Status Codes
2 | const HTTP_STATUS = {
3 | OK: 200,
4 | CREATED: 201,
5 | BAD_REQUEST: 400,
6 | UNAUTHORIZED: 401,
7 | NOT_FOUND: 404,
8 | INTERNAL_SERVER_ERROR: 500,
9 | };
10 |
11 | // Success Messages
12 | const MESSAGES = {
13 | USER_REGISTERED_SUCCESSFULLY: "Registration Successful",
14 | LOGIN_SUCCESSFUL: "Login Successful",
15 | NOTE_ADDED_SUCCESSFULLY: "Note added successfully",
16 | NOTE_UPDATED_SUCCESSFULLY: "Note updated successfully",
17 | NOTES_FETCHED_SUCCESSFULLY: "Notes fetched successfully",
18 | NOTE_DELETED_SUCCESSFULLY: "Note deleted successfully",
19 | EMAIL_UPDATED_SUCCESSFULLY: "Email updated successfully",
20 | FULLNAME_UPDATED_SUCCESSFULLY: "Name updated successfully",
21 | PHONE_UPDATED_SUCCESSFULLY: "Phone number updated successfully",
22 | PROFILE_PHOTO_UPDATED_SUCCESSFULLY: "Profile photo updated successfully",
23 | GOOGLE_AUTH_SUCCESSFUL: "Google authentication successful",
24 | FEEDBACK_SUBMITTED_SUCCESSFULLY: "Feedback submitted successfully",
25 | };
26 |
27 | // Error Messages
28 | const ERROR_MESSAGES = {
29 | // User Registration Errors
30 | NAME_REQUIRED: "Name is required",
31 | INVALID_NAME_FORMAT: "Invalid Name format",
32 | EMAIL_REQUIRED: "Email is required",
33 | INVALID_EMAIL_FORMAT: "Invalid Email format",
34 | PASSWORD_REQUIRED: "Password is required",
35 | PASSWORD_UPPERCASE_REQUIRED:
36 | "Password must include at least one Uppercase letter",
37 | PASSWORD_LOWERCASE_REQUIRED:
38 | "Password must include at least one Lowercase letter",
39 | PASSWORD_SPECIAL_CHAR_REQUIRED:
40 | "Password must include at least one special character",
41 | PASSWORD_MIN_LENGTH: "Min password length should be 8",
42 | USER_ALREADY_EXISTS: "User already exists",
43 | EMAIL_NOT_VERIFIED: "Email not verified, Please verify your email.",
44 |
45 | // Authentication Errors
46 | EMAIL_PASSWORD_REQUIRED: "Email and Password are required",
47 | INVALID_CREDENTIALS: "Invalid Credentials",
48 | USER_NOT_AUTHENTICATED: "User not authenticated",
49 |
50 | // Note-related Errors
51 | TITLE_CONTENT_REQUIRED: "Title and Content are required",
52 | PROVIDE_FIELD_TO_UPDATE: "Please provide at least one field to update",
53 | NOTE_NOT_FOUND: "Note not found",
54 | PROVIDE_IS_PINNED_FIELD: "Please provide isPinned field",
55 | PROVIDE_SEARCH_QUERY: "Please provide at least one field to search",
56 |
57 | // User-related Errors
58 | USER_NOT_FOUND: "User not found",
59 |
60 | // Google OAuth Errors
61 | INVALID_GOOGLE_TOKEN: "Invalid Google token",
62 |
63 | // Feedback Errors
64 | FAILED_TO_SUBMIT_FEEDBACK: "Failed to submit feedback",
65 |
66 | // General Errors
67 | INTERNAL_SERVER_ERROR: "Internal server error",
68 | };
69 |
70 | export { HTTP_STATUS, MESSAGES, ERROR_MESSAGES };
71 |
--------------------------------------------------------------------------------
/backend/utils/multer.js:
--------------------------------------------------------------------------------
1 | //util
2 | import fs from "fs";
3 | import multer from "multer";
4 | import path from "path";
5 |
6 | export const storage = multer.diskStorage({
7 | destination: (req, file, cb) => {
8 | const uploadPath = path.join(__dirname, "uploads");
9 | if (!fs.existsSync(uploadPath)) {
10 | fs.mkdirSync(uploadPath);
11 | }
12 | cb(null, uploadPath);
13 | },
14 | filename: (req, file, cb) => {
15 | const uniqueSuffix = Date.now() + "-" + Math.round(Math.random() * 1e9);
16 | cb(
17 | null,
18 | file.fieldname + "-" + uniqueSuffix + path.extname(file.originalname)
19 | );
20 | },
21 | });
--------------------------------------------------------------------------------
/backend/vercel.json:
--------------------------------------------------------------------------------
1 | {
2 | "version": 2,
3 | "builds": [
4 | {
5 | "src": "*.js",
6 | "use": "@vercel/node"
7 | }
8 | ],
9 | "routes": [
10 | {
11 | "src": "/",
12 | "dest": "/"
13 | },
14 | {
15 | "src": "/landing",
16 | "dest": "/"
17 | },
18 | {
19 | "src": "/dashboard",
20 | "dest": "/"
21 | },
22 | {
23 | "src": "/login",
24 | "dest": "/"
25 | },
26 | {
27 | "src": "/signup",
28 | "dest": "/"
29 | },
30 | {
31 | "src": "/about",
32 | "dest": "/"
33 | },
34 | {
35 | "src": "/my-profile",
36 | "dest": "/"
37 | }
38 | ]
39 | }
--------------------------------------------------------------------------------
/frontend/.env.development:
--------------------------------------------------------------------------------
1 | # Frontend Environment Variables
2 |
3 | # Base URL of the backend server
4 | VITE_BACKEND_URL=http://localhost:5000
5 |
6 | # API key for Google services (if used in frontend)
7 | VITE_REACT_APP_GOOGLE_API_TOKEN=114458585610-q8v3k7sdfbu55j876cj11km7h12tpj02.apps.googleusercontent.com
--------------------------------------------------------------------------------
/frontend/.env.example:
--------------------------------------------------------------------------------
1 | # Frontend Environment Variables
2 |
3 | # Base URL of the backend server
4 | VITE_BACKEND_URL=http://localhost:5000
5 |
6 | # API key for Google services (if used in frontend)
7 | VITE_GOOGLE_CLIENT=your_client_id
8 | VITE_GOOGLE_API_TOKEN=your_api_token
9 |
--------------------------------------------------------------------------------
/frontend/.eslintrc.cjs:
--------------------------------------------------------------------------------
1 | module.exports = {
2 | root: true,
3 | env: { browser: true, es2020: true },
4 | extends: [
5 | 'eslint:recommended',
6 | 'plugin:react/recommended',
7 | 'plugin:react/jsx-runtime',
8 | 'plugin:react-hooks/recommended',
9 | ],
10 | ignorePatterns: ['dist', '.eslintrc.cjs'],
11 | parserOptions: { ecmaVersion: 'latest', sourceType: 'module' },
12 | settings: { react: { version: '18.2' } },
13 | plugins: ['react-refresh'],
14 | rules: {
15 | 'react/jsx-no-target-blank': 'off',
16 | 'react-refresh/only-export-components': [
17 | 'warn',
18 | { allowConstantExport: true },
19 | ],
20 | },
21 | }
22 |
--------------------------------------------------------------------------------
/frontend/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 | Scribbie
20 |
21 |
22 |
23 |
24 |
25 |
26 |
27 |
--------------------------------------------------------------------------------
/frontend/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "notes-app",
3 | "private": true,
4 | "version": "0.0.0",
5 | "type": "module",
6 | "scripts": {
7 | "dev": "vite --host 0.0.0.0",
8 | "build": "vite build",
9 | "lint": "eslint . --ext js,jsx --report-unused-disable-directives --max-warnings 0",
10 | "preview": "vite preview"
11 | },
12 | "dependencies": {
13 | "@emotion/react": "^11.13.3",
14 | "@emotion/styled": "^11.13.0",
15 | "@mui/material": "^6.1.6",
16 | "@react-oauth/google": "^0.12.1",
17 | "axios": "^1.7.2",
18 | "cookies-js": "^1.2.3",
19 | "cors": "^2.8.5",
20 | "dotenv": "^16.4.5",
21 | "framer-motion": "^11.11.6",
22 | "gapi-script": "^1.2.0",
23 | "gsap": "^3.12.5",
24 | "http-proxy-middleware": "^3.0.0",
25 | "js-cookie": "^3.0.5",
26 | "moment": "^2.30.1",
27 | "notes-app": "file:",
28 | "react": "^18.2.0",
29 | "react-dom": "^18.2.0",
30 | "react-hot-toast": "^2.4.1",
31 | "react-icons": "^5.3.0",
32 | "react-modal": "^3.16.1",
33 | "react-quill": "^2.0.0",
34 | "react-router-dom": "^6.26.2",
35 | "react-scroll": "^1.9.0",
36 | "react-simple-scroll-up": "^0.2.3"
37 | },
38 | "devDependencies": {
39 | "@types/react": "^18.2.66",
40 | "@types/react-dom": "^18.2.22",
41 | "@vitejs/plugin-react": "^4.2.1",
42 | "autoprefixer": "^10.4.19",
43 | "eslint": "^8.57.0",
44 | "eslint-plugin-react": "^7.34.1",
45 | "eslint-plugin-react-hooks": "^4.6.0",
46 | "eslint-plugin-react-refresh": "^0.4.6",
47 | "postcss": "^8.4.38",
48 | "tailwindcss": "^3.4.3",
49 | "vite": "^5.2.0"
50 | }
51 | }
52 |
--------------------------------------------------------------------------------
/frontend/postcss.config.js:
--------------------------------------------------------------------------------
1 | export default {
2 | plugins: {
3 | tailwindcss: {},
4 | autoprefixer: {},
5 | },
6 | }
7 |
--------------------------------------------------------------------------------
/frontend/public/logo.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/Scribbie-Notes/notes-app/a5a6d6d0fb634a3b6605a00f37fad8895838df55/frontend/public/logo.png
--------------------------------------------------------------------------------
/frontend/public/testimonial-section.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/Scribbie-Notes/notes-app/a5a6d6d0fb634a3b6605a00f37fad8895838df55/frontend/public/testimonial-section.png
--------------------------------------------------------------------------------
/frontend/src/App.css:
--------------------------------------------------------------------------------
1 | body {
2 | font-family: 'Poppins', sans-serif;
3 | }
4 |
5 | .note-content .ql-editor {
6 | font-family: 'Poppins', sans-serif;
7 | }
--------------------------------------------------------------------------------
/frontend/src/App.jsx:
--------------------------------------------------------------------------------
1 | import { useState, useEffect } from "react";
2 | import {
3 | BrowserRouter as Router,
4 | Routes,
5 | Route,
6 | Navigate,
7 | useLocation,
8 | } from "react-router-dom";
9 | import Home from "./pages/Home/Home";
10 | import Signup from "./pages/Signup/Signup";
11 | import Login from "./pages/Login/Login";
12 | import Hero from "./components/Hero/Hero";
13 | import About from "./components/About/About";
14 | import Loading from "./components/Loading";
15 | import ProfilePage from "./pages/ProfilePage/ProfilePage";
16 | import Testimonial from "./components/Testimonial";
17 | import Pricing from "./components/Pricing";
18 | import Footer from "./components/sticky_footer/Footer";
19 | import Contact from "./components/Contact/Contact";
20 | import Contributors from "./components/Contributors/Contributors";
21 | import ArchivedNotes from "./components/ArchivedNotes/ArchivedNotes";
22 | import Preloader from "./components/Preloader";
23 | import VerifyEmail from "./pages/ForgotPassword/VerifyEmail";
24 | import VerifyOtp from "./pages/ForgotPassword/VerifyOtp";
25 | import NewPassword from "./pages/ForgotPassword/NewPassword";
26 | import Calendar from "./components/Calendar/Calendar";
27 | import { ScrollToTop } from "react-simple-scroll-up";
28 |
29 | // currently this component is hide
30 | // import Navbar from './components/Navbar';
31 | // import ProtectedRoute from './utils/ProtectedRoute';
32 | // import ErrorPage from './components/ErrorPage';
33 | // import Footer from './components/Footer';
34 |
35 | const App = () => {
36 | const [loading, setLoading] = useState(false);
37 | const [user, setUser] = useState(null);
38 | const location = useLocation();
39 |
40 | useEffect(() => {
41 | const handleRouteChange = () => {
42 | setLoading(true);
43 | setTimeout(() => {
44 | setLoading(false);
45 | }, 500);
46 | };
47 | handleRouteChange();
48 | }, [location]);
49 |
50 | useEffect(() => {
51 | const storedUser = localStorage.getItem("user");
52 | if (storedUser) {
53 | try {
54 | setUser(JSON.parse(storedUser));
55 | } catch (e) {
56 | console.error("Error parsing stored user", e);
57 | }
58 | }
59 | }, []);
60 |
61 | return (
62 |
63 | {/*
*/}
64 | {loading &&
}
65 | {user && location.pathname === "/" ? (
66 |
67 | ) : (
68 | <>
69 |
70 | } /> */}
88 |
89 | {location.pathname !== "/dashboard" && (
90 |
94 |
113 |
115 | );
116 |
117 | export default AppWithRouter;
--------------------------------------------------------------------------------
/frontend/src/assets/images/add-notes.svg:
--------------------------------------------------------------------------------
1 |
2 |
3 |
--------------------------------------------------------------------------------
/frontend/src/assets/images/addPost.svg:
--------------------------------------------------------------------------------
1 |
4 |
5 |
7 |
--------------------------------------------------------------------------------
/frontend/src/assets/images/noFound.svg:
--------------------------------------------------------------------------------
1 |
75 |
76 |
77 |
{title}
78 |
79 | {moment(date).format("Do MMM YYYY")}
80 |
81 |
82 |
83 |
84 |
{
87 | e.stopPropagation();
88 | onPinNote();
89 | }}
90 | />
91 |
92 | {isPinned ? "Unpin Note" : "Pin Note"}
93 |
94 |
95 |
96 |
97 |
110 |
111 |
112 |
113 | {tags.length > 0 &&
114 | tags.map((tag, index) => (
115 |
119 | {tag !== "" ? `#${tag}` : ""}
120 |
121 | ))}
122 |
123 |
124 |
125 |
126 |
{
129 | e.stopPropagation();
130 | onEdit();
131 | }}
132 | />
133 |
134 | {"Edit Note"}
135 |
136 |
137 |
138 |
139 |
{
142 | e.stopPropagation();
143 | onDelete();
144 | }}
145 | />
146 |
147 | {"Delete Note"}
148 |
149 |
150 |
151 | {/* Export Icon (Download Button) */}
152 |
153 |
{
156 | e.stopPropagation();
157 | downloadNote(content, title, date);
158 | }}
159 | />
160 |
161 | {"Export Note"}
162 |
163 |
164 |
165 | {/* Share Icon */}
166 |
167 |
{
170 | e.stopPropagation();
171 | shareNote(id, title);
172 | }}
173 | />
174 |
175 | {"Share Note"}
176 |
177 |
178 |
179 |
{
181 | e.stopPropagation();
182 | onSelect(id);
183 | }}
184 | >
185 |
186 | {isSelected ? (
187 |
193 |
194 |
195 |
68 |
72 | {getInitials(userInfo?.fullName)}
73 |
74 |
75 | {isDropdownOpen && (
76 |
77 | {/*
81 |
82 |
84 | Profile Settings
85 | */}
86 | {/*
90 |
91 |
93 | Archived Notes
94 | */}
95 |
99 |
100 |
102 | About
103 |
104 |
108 |
109 |
111 | Logout
112 |
113 |
114 | )}
115 |
116 | {/* Modal for logout confirmation */}
117 | {isModalOpen && (
118 |
119 |
120 |
121 |
Confirm Logout
122 |
Are you sure you want to log out?
123 |
124 |
128 | Cancel
129 |
130 |
134 | Logout
136 |
137 |
138 |
139 |
140 | )}
141 |
63 |
64 |
65 |
66 |
Get in touch
67 |
68 |
Visit us
69 |
Come say hello at our office HQ.
70 |
71 | 67 Wistoria Way Croydon South VIC 3136 AU
72 |
73 |
74 |
75 |
Chat to us
76 |
Our friendly team is here to help.
77 |
@Scribbie.com
78 |
79 |
80 |
Call us
81 |
Mon-Fri from 8am to 5pm
82 |
(+995) 555-55-55-55
83 |
84 |
85 |
Social media
86 |
87 |
88 |
90 |
91 |
93 |
94 |
96 |
97 |
99 |
100 |
101 |
102 |
103 |
174 |
175 |
176 | {/* MUI Backdrop with CircularProgress */}
177 |
theme.zIndex.drawer + 1 }} open={loading}>
178 |
180 |
Loading contributors...
;
47 | }
48 |
49 | return (
50 |
51 |
Our Contributors
52 | {error &&
{error}
}
53 |
78 |
6 |
7 |
8 |
9 | {message}
10 |
11 |
12 |
7 |
15 |
{question}
16 |
21 |
22 |
27 |
30 | {answer}
31 |
32 |
33 |
69 |
70 | Frequently Asked Questions
71 |
72 |
73 | {faqData.map((item, index) => (
74 |
{item.question}}
77 | answer={{item.answer} }
78 | isOpen={openIndex === index}
79 | onToggle={() => handleToggle(index)}
80 | />
81 | ))}
82 |
83 |
68 | {/* Search and Filter Tags Section (Left) */}
69 |
70 | {/* Search Input */}
71 |
78 |
79 | {/* Filtered Tags List */}
80 |
81 | {filteredTags.slice(0, 5).map((tag, index) => (
82 | handleTagClick(tag)}
85 | className={`tag px-2 py-1 rounded-md cursor-pointer ${
86 | selectedTags.includes(tag)
87 | ? "bg-blue-500 text-white"
88 | : "bg-gray-200 text-gray-700 hover:bg-gray-300"
89 | } transition`}
90 | >
91 | #{tag}
92 |
93 | ))}
94 |
95 |
96 |
97 | {/* Selected Tags Display (Right) */}
98 |
99 |
Selected Tags:
100 |
101 | {selectedTags.length > 0 ? (
102 | selectedTags.map((tag, index) => (
103 | handleTagClick(tag)}
106 | className="tag bg-blue-500 text-white px-2 py-1 rounded-md cursor-pointer hover:bg-blue-600 transition"
107 | >
108 | #{tag}
109 |
110 | ))
111 | ) : (
112 | No tags selected
113 | )}
114 |
115 |
116 |
65 |
146 |
147 | );
148 | };
149 |
150 | export default GoogleTranslate;
151 |
--------------------------------------------------------------------------------
/frontend/src/components/Hero/Hero.jsx:
--------------------------------------------------------------------------------
1 | import React, { useEffect, useRef } from 'react';
2 | import Navbar2 from '../Navbar-2';
3 | import { Link } from 'react-router-dom';
4 | // import gsap from 'gsap';
5 | // import { ScrollTrigger } from 'gsap/ScrollTrigger';
6 | import hero2 from "../../assets/images/hero2.png";
7 | import { SiTicktick } from "react-icons/si";
8 | import { TbEyeSearch } from "react-icons/tb";
9 | import { FaSync } from "react-icons/fa";
10 | import Testimonial from '../Testimonial';
11 | import Footer from '../Footer';
12 | import Pricing from '../Pricing';
13 | import Faq from '../Faq';
14 | // import ScrollOnTop from '../Scroll-on-top/ScrollOnTop';
15 | import './styles.css';
16 |
17 | // Register ScrollTrigger plugin
18 | // gsap.registerPlugin(ScrollTrigger);
19 |
20 | const Hero = () => {
21 | const user = JSON.parse(localStorage.getItem("user"));
22 | const heroText = useRef();
23 | const heroParagraph = useRef();
24 | const getStartedButton = useRef(); // Ref for the button
25 | const featureCards = useRef([]);
26 | const sectionRef = useRef();
27 | const whiteSectionRef = useRef(); // Ref for the bg-white section
28 |
29 | return (
30 |
31 |
32 |
33 |
34 |
35 |
36 |
40 | Capture Ideas,
41 |
42 |
43 | Unleash Productivity.
44 |
45 |
49 | Capture every thought and organize with ease. Unlock your full potential with Scribbie
50 |
51 |
52 |
57 | Get Started
58 |
64 |
70 |
71 |
72 |
73 |
74 | {/* Hero Image on Desktop, Hidden on Mobile */}
75 |
76 |
77 |
78 |
79 | {/* Hero Image on Mobile */}
80 | {/*
81 |
82 |
*/}
83 |
85 |
86 |
87 |
88 | Unlock Powerful Features to
89 |
90 |
91 | Enhance Your Note-Taking Experience
92 |
93 |
94 |
95 |
(featureCards.current[0] = el)}
97 | className="bg-white p-6 rounded-lg shadow-md hover:shadow-xl transition duration-300 ease-in-out border border-gray-200"
98 | >
99 |
100 |
Organize Effortlessly
102 |
103 |
104 | Keep your notes neatly categorized with customizable folders and tags.
105 |
106 |
107 |
108 |
(featureCards.current[1] = el)}
110 | className="bg-white p-6 rounded-lg shadow-md hover:shadow-xl transition duration-300 ease-in-out border border-gray-200"
111 | >
112 |
113 |
Search with Ease
115 |
116 |
117 | Quickly find any note with a powerful, real-time search engine.
118 |
119 |
120 |
121 |
(featureCards.current[2] = el)}
123 | className="bg-white p-6 rounded-lg shadow-md hover:shadow-xl transition duration-300 ease-in-out border border-gray-200"
124 | >
125 |
126 |
Sync Across Devices
128 |
129 |
130 | Seamlessly sync your notes between all your devices.
131 |
132 |
133 |
134 |
136 |
137 |
138 |
139 |
140 |
141 | {/*
*/}
142 |
26 |
37 |
39 |
40 | );
41 | };
42 |
43 | export default AddAttachmentsInput;
44 |
--------------------------------------------------------------------------------
/frontend/src/components/Input/PasswordInput.jsx:
--------------------------------------------------------------------------------
1 | import React, { useState } from 'react'
2 | import { FaRegEye, FaRegEyeSlash } from 'react-icons/fa';
3 |
4 | const PasswordInput = ({ value, onChange, placeholder }) => {
5 |
6 | const [isShowPassword, setIsShowPassword] = useState(false);
7 |
8 | const toggleShowPassword = () => {
9 | setIsShowPassword(!isShowPassword);
10 | }
11 |
12 | return (
13 |
14 | toggleShowPassword()}
26 | /> : toggleShowPassword()}
30 | />
31 |
32 | }
33 |
34 |
35 | )
36 | }
37 |
38 | export default PasswordInput
--------------------------------------------------------------------------------
/frontend/src/components/Input/TagInput.jsx:
--------------------------------------------------------------------------------
1 | import { useState } from "react";
2 | import { MdAdd, MdClose } from "react-icons/md";
3 |
4 | const TagInput = ({ tags, setTags }) => {
5 | const [inputValue, setInputValue] = useState("");
6 |
7 | const handleInputChange = (e) => {
8 | setInputValue(e.target.value);
9 | };
10 |
11 | const addNewTag = () => {
12 | if (inputValue.trim() !== "") {
13 | setTags([...tags, inputValue.trim()]);
14 |
15 | setInputValue("");
16 | }
17 | };
18 |
19 | const handleKeyDown = (e) => {
20 | if (e.key === "Enter") {
21 | addNewTag();
22 | }
23 | };
24 |
25 | const handleRemoveTag = (tagToRemove) => {
26 | setTags(tags.filter((tag) => tag !== tagToRemove));
27 | };
28 |
29 | return (
30 |
31 | {tags?.length > 0 && (
32 |
33 | {tags.map((tag, index) => (
34 |
38 | #{tag}
39 | {
41 | handleRemoveTag(tag);
42 | }}
43 | >
44 |
46 |
47 | ))}
48 |
49 |
50 | )}
51 |
52 | {
64 | addNewTag();
65 | }}
66 | >
67 |
69 |
70 |
6 |
{/* Semi-transparent background */}
7 |
8 |
25 |
26 | {/* Date in top-right corner */}
27 |
28 | {event.date}
29 |
30 |
31 |
36 | {event.title}
37 |
38 |
42 | {event.description || "No description provided."}
43 |
44 |
45 |
46 |
50 | Close
51 |
52 | onDelete(event._id)}
54 | className="bg-red-500 hover:bg-red-600 text-white p-2 rounded-lg transition-all duration-300"
55 | >
56 | Delete
57 |
58 |
59 |
60 |
83 |
84 |
85 |
86 |
cribbie
87 |
88 |
89 |
90 |
91 |
92 |
93 | {/*
94 | setSearchQuery(target.value)}
99 | onTagChange={({ target }) => setTagQuery(target.value)}
100 | onSearchTypeChange={({ target }) => setSearchType(target.value)}
101 | handleSearch={handleSearch}
102 | onClearSearch={onClearSearch}
103 | />
104 |
*/}
105 |
106 |
107 | {userInfo ? (
108 |
109 | ) : (
110 |
111 | {location.pathname !== "/login" && navigate("/login")} className=" text-white bg-gray-800 hover:bg-gray-700 transition duration-300 ease-in-out font-medium rounded-lg text-md px-4 py-1.5">Login }
112 | {/* {location.pathname !== "/signup" && navigate("/signup")} className="text-zinc-200 bg-black rounded-md py-2 px-3">Signup } */}
113 |
114 | )}
115 |
116 |
90 |
91 |
92 |
93 |
94 | cribbie
95 |
96 |
97 |
98 |
99 | {/*
100 | */}
111 |
112 |
113 | {/* Hide on mobile, show on xl and up */}
114 |
115 |
117 |
118 |
119 | {/*
120 |
121 | Calendar
122 |
123 | */}
124 |
125 |
126 |
127 | Archived Notes
128 |
129 |
130 |
131 |
132 |
133 | My Profile
134 |
135 |
136 |
137 | {/*
138 |
*/}
141 |
142 | {userInfo ? (
143 |
146 | ) : (
147 |
148 | {location.pathname !== "/login" && (
149 | navigate("/login")}
152 | className="text-white bg-gray-800 border hover:bg-gray-700 transition duration-300 ease-in-out font-medium rounded-lg text-md px-4 py-1.5"
153 | >
154 | Login
155 |
156 | )}
157 |
158 | )}
159 |
160 |
161 |
27 | {loading && (
28 |
35 | {/* Loading Percentage */}
36 |
43 | {percentage}
44 |
45 |
46 | {/* Loading Bar */}
47 |
55 | )}
56 |
57 |
58 | );
59 | };
60 |
61 | export default Preloader;
62 |
--------------------------------------------------------------------------------
/frontend/src/components/Progressbar.jsx:
--------------------------------------------------------------------------------
1 | import { useState, useEffect } from "react";
2 |
3 | const ProgressBar = () => {
4 | const [scrollProgress, setScrollProgress] = useState(0);
5 |
6 | // Update progress bar on scroll
7 | useEffect(() => {
8 | const handleScroll = () => {
9 | const totalHeight =
10 | document.documentElement.scrollHeight - window.innerHeight;
11 | const scrollPosition = window.pageYOffset;
12 | const scrollPercentage = (scrollPosition / totalHeight) * 100;
13 | setScrollProgress(scrollPercentage);
14 | };
15 |
16 | window.addEventListener("scroll", handleScroll);
17 | return () => {
18 | window.removeEventListener("scroll", handleScroll);
19 | };
20 | }, []);
21 |
22 | return (
23 | <>
24 |
35 | {/* Glowing Progress Bar */}
36 |
48 |
30 | {
31 | showScroll &&
35 |
37 | }
38 |
39 | );
40 | };
41 |
42 | export default ScrollOnTop;
43 |
--------------------------------------------------------------------------------
/frontend/src/components/SearchBar/SearchBar.jsx:
--------------------------------------------------------------------------------
1 | import React, { useState } from 'react';
2 | import { FaMagnifyingGlass } from 'react-icons/fa6';
3 | import { IoMdClose } from 'react-icons/io';
4 |
5 | const SearchBar = ({ value, tag, searchType, onChange, onTagChange, onClearSearch, handleSearch, onSearchTypeChange }) => {
6 | return (
7 |
10 | {/* Dropdown to select search type */}
11 | {/*
16 | Title
17 | Tag
18 | */}
19 |
20 | {/* Display appropriate input based on search type */}
21 | {searchType === 'text' ? (
22 |
52 | );
53 | };
54 |
55 | export default SearchBar;
--------------------------------------------------------------------------------
/frontend/src/components/Tabs.jsx:
--------------------------------------------------------------------------------
1 | import { useRef, useState } from "react";
2 | import { Link, useLocation } from "react-router-dom";
3 |
4 | // Main component that decides the theme and renders SlideTabs
5 | export const SlideTabsExample = ({ theme }) => {
6 | return (
7 |
8 |
10 | );
11 | };
12 |
13 | // SlideTabs component that handles rendering the tabs
14 | const SlideTabs = ({ theme }) => {
15 | const location = useLocation();
16 | const [position, setPosition] = useState({ left: 0, width: 0, opacity: 0 });
17 | const [hoveredTab, setHoveredTab] = useState(null);
18 | const currentPathName = location.pathname;
19 |
20 | return (
21 | {
23 | setPosition((prev) => ({ ...prev, opacity: 0 }));
24 | setHoveredTab(null);
25 | }}
26 | className={`relative mx-auto flex w-fit p-1 flex-col md:flex-row gap-5 ${
27 | theme === "dark" ? "bg-black" : "bg-white"
28 | }`}
29 | >
30 | {/*
38 | Calendar
39 | */}
40 |
42 | );
43 | };
44 |
45 | // Tab component that renders individual tabs
46 | const Tab = ({
47 | children,
48 | setPosition,
49 | to,
50 | currentPathName,
51 | hoveredTab,
52 | setHoveredTab,
53 | theme,
54 | }) => {
55 | const ref = useRef(null);
56 | const isActive = currentPathName === to;
57 | const isHovered = hoveredTab === to;
58 |
59 | return (
60 | {
63 | if (!ref?.current) return;
64 | const { width } = ref.current.getBoundingClientRect();
65 | setPosition({ left: ref.current.offsetLeft, width, opacity: 1 });
66 | setHoveredTab(to);
67 | }}
68 | className={`relative z-10 mt-1.5 cursor-pointer text-xs
69 | ${isActive ? "bg-black text-white rounded-lg" : "text-black"}
70 | ${isHovered && !isActive ? "bg-gray-700 text-white rounded-lg" : ""}
71 | ${theme === "dark" && !isActive && !isHovered ? "text-white" : ""}
72 | hover:bg-gray-700 hover:text-white`}
73 | >
74 |
78 | );
79 | };
80 |
81 | // Cursor component for the sliding effect
82 | const Cursor = ({ position, theme }) => {
83 | return (
84 |
50 |
51 |
52 | {/* Left Side - Title */}
53 |
54 |
What our customers think
55 |
56 | Lorem ipsum dolor sit amet, consectetur adipisicing elit. Minus commodi sint, similique cupiditate possimus suscipit delectus illum eos iure magnam!
57 |
58 | {/* Progress Bar */}
59 |
65 |
66 |
67 | {/* Right Side - Testimonials */}
68 |
69 | {testimonialsData.map((testimonial, index) => (
70 |
74 |
75 |
{testimonial.text}
76 |
77 |
82 |
83 |
{testimonial.name}
84 |
{testimonial.position}
85 |
86 |
87 |
88 |
89 | ))}
90 |
91 |
92 |
93 |
16 |
18 | );
19 | };
20 |
21 | const SliderToggle = ({ selected, setSelected }) => {
22 | return (
23 |
24 |
{
29 | setSelected("light");
30 | }}
31 | >
32 | Light
34 |
35 |
{
40 | setSelected("dark");
41 | }}
42 | >
43 | Dark
45 |
46 |
51 |
57 |
21 |
22 | {navLinks.map(({ link, name, external }, index) => (
23 |
26 |
29 | );
30 | }
31 |
32 | const NavLink = ({ link, name, external }) => (
33 |
39 | {name}
40 |
41 | );
42 |
43 | const Footer = () => {
44 | const [isWide, setIsWide] = useState(window.innerWidth > 640);
45 | const location = useLocation();
46 | const [showButton, setshowButton] = useState(false);
47 |
48 | //check if the current page is the landing page
49 | useEffect(() => {
50 | if (location.pathname === "/") {
51 | setshowButton(true);
52 | } else {
53 | setshowButton(false);
54 | }
55 | }, [location.pathname]);
56 |
57 | // Scroll to top function
58 | const scrollToTop = () => {
59 | window.scrollTo({ top: 0, behavior: "smooth" });
60 | };
61 |
62 | useEffect(() => {
63 | const handleResize = () => setIsWide(window.innerWidth > 640);
64 | window.addEventListener("resize", handleResize);
65 | return () => window.removeEventListener("resize", handleResize);
66 | }, []);
67 |
68 | return (
69 |
70 | {!isWide && (
71 |
72 |
77 |
84 |
89 | Scribbie {!isWide &&
91 |
©2024 by Scribbie
92 | {showButton && (
93 |
97 |
99 | )}
100 |
102 | );
103 | };
104 |
105 | const Nav = () => {
106 | return (
107 |
108 |
109 |
110 | Unlocking creativity and productivity through intuitive note-taking
111 | and seamless organization.
112 |
113 |
114 |
12 |
13 |
16 |
17 | );
18 |
--------------------------------------------------------------------------------
/frontend/src/pages/ForgotPassword/VerifyEmail.jsx:
--------------------------------------------------------------------------------
1 | import React, { useState } from "react";
2 | import Navbar from "../../components/Navbar";
3 | import { Link, useNavigate } from "react-router-dom";
4 | import { validateEmail } from "../../utils/helper";
5 | import axiosInstance from "../../utils/axiosInstance";
6 | import toast from "react-hot-toast";
7 | import { FaEye, FaEyeSlash } from "react-icons/fa";
8 | import { GoogleLogin } from "@react-oauth/google";
9 | import CircularLoader from "../../components/CircularLoader";
10 |
11 | const VerifyEmail = ({ setUser }) => {
12 | const [email, setEmail] = useState("");
13 | const [password, setPassword] = useState("");
14 | const [showPassword, setShowPassword] = useState(false);
15 | const [loading, setLoading] = useState(false);
16 | const [error, setError] = useState(null);
17 |
18 | const navigate = useNavigate();
19 |
20 | const responseMsg = async (response) => {
21 | try {
22 | setLoading(true);
23 | const token = response.credential;
24 | const res = await axiosInstance.post("/google-auth", { token });
25 |
26 | if (res.data && res.data.accessToken) {
27 | localStorage.setItem("token", res.data.accessToken);
28 | localStorage.setItem("user", JSON.stringify(res.data.user));
29 | navigate("/dashboard");
30 | toast.success("Signed in successfully", {
31 | style: {
32 | fontSize: "13px",
33 | maxWidth: "400px",
34 | boxShadow: "4px 4px 8px rgba(0, 1, 4, 0.1)",
35 | borderRadius: "8px",
36 | borderColor: "rgba(0, 0, 0, 0.8)",
37 | marginTop: "60px",
38 | marginRight: "10px",
39 | },
40 | });
41 | } else {
42 | toast.error("Failed to sign in with Google", {
43 | style: {
44 | fontSize: "13px",
45 | maxWidth: "400px",
46 | boxShadow: "4px 4px 8px rgba(0, 1, 4, 0.1)",
47 | borderRadius: "8px",
48 | borderColor: "rgba(0, 0, 0, 0.8)",
49 | marginTop: "60px",
50 | marginRight: "10px",
51 | },
52 | });
53 | }
54 | } catch (error) {
55 | console.log("Error response:", error.response);
56 | toast.error("Failed to sign in with Google", {
57 | style: {
58 | fontSize: "13px",
59 | maxWidth: "400px",
60 | boxShadow: "4px 4px 8px rgba(0, 1, 4, 0.1)",
61 | borderRadius: "8px",
62 | borderColor: "rgba(0, 0, 0, 0.8)",
63 | marginTop: "60px",
64 | marginRight: "10px",
65 | },
66 | });
67 | } finally {
68 | setLoading(false);
69 | }
70 | };
71 |
72 | const errorMsg = (error) => {
73 | console.log(error);
74 | };
75 |
76 | const handleOtpSend = async (e) => {
77 | e.preventDefault();
78 |
79 | if (!validateEmail(email)) {
80 | toast.error("Please enter a valid email", {
81 | style: {
82 | fontSize: "13px",
83 | maxWidth: "400px",
84 | boxShadow: "px 4px 8px rgba(0, 1, 4, 0.1)",
85 | borderRadius: "8px",
86 | borderColor: "rgba(0, 0, 0, 0.8)",
87 | marginRight: "10px",
88 | },
89 | });
90 | return;
91 | }
92 |
93 | setError(null);
94 |
95 | try {
96 | const response = await axiosInstance.post("http://localhost:5000/verify-email", {
97 | email
98 | });
99 |
100 | if (response.data) {
101 | console.log(response)
102 | const id = response.data.id
103 | navigate(`/verify-otp/${id}`);
104 | toast.success("Otp Sent successfully", {
105 | style: {
106 | fontSize: "13px",
107 | maxWidth: "400px",
108 | boxShadow: "px 4px 8px rgba(0, 1, 4, 0.1)",
109 | borderRadius: "8px",
110 | borderColor: "rgba(0, 0, 0, 0.8)",
111 | marginRight: "10px",
112 | },
113 | });
114 | } else {
115 | toast.error("Login failed, please try again", {
116 | style: {
117 | fontSize: "13px",
118 | maxWidth: "400px",
119 | boxShadow: "px 4px 8px rgba(0, 1, 4, 0.1)",
120 | borderRadius: "8px",
121 | borderColor: "rgba(0, 0, 0, 0.8)",
122 | marginRight: "10px",
123 | },
124 | });
125 | }
126 | } catch (error) {
127 | if (
128 | error.response &&
129 | error.response.data &&
130 | error.response.data.message
131 | ) {
132 | toast.error(error.response.data.message, {
133 | style: {
134 | fontSize: "13px",
135 | maxWidth: "400px",
136 | boxShadow: "px 4px 8px rgba(0, 1, 4, 0.1)",
137 | borderRadius: "8px",
138 | borderColor: "rgba(0, 0, 0, 0.8)",
139 | marginRight: "10px",
140 | },
141 | });
142 | } else {
143 | setError("Something went wrong. Please try again later.");
144 | }
145 | }
146 | };
147 |
148 | const togglePasswordVisibility = () => {
149 | setShowPassword(!showPassword);
150 | };
151 |
152 | return (
153 |
154 |
155 |
157 |
158 |
159 |
160 |
161 |
168 |
169 | Home
170 |
171 |
172 |
173 | Welcome Back!
174 |
175 |
176 |
177 | Smart note-taking for smarter work and better results. Stay
178 | organized, stay inspired, and stay ahead.
179 |
180 |
182 |
183 |
184 |
185 |
186 | Welcome Back!
187 |
188 |
189 |
190 | Smart note-taking for smarter work and better results. Stay
191 | organized, stay inspired, and stay ahead.
192 |
193 |
194 |
195 |
232 |
234 |
236 |
73 |
74 |
76 |
77 |
78 |
79 |
80 |
87 |
88 | Home
89 |
90 |
91 |
92 | Welcome Back!
93 |
94 |
95 |
96 | Smart note-taking for smarter work and better results. Stay
97 | organized, stay inspired, and stay ahead.
98 |
99 |
101 |
102 |
103 |
104 |
105 | Welcome Back!
106 |
107 |
108 |
109 | Smart note-taking for smarter work and better results. Stay
110 | organized, stay inspired, and stay ahead.
111 |
112 |
113 |
114 |
151 |
153 |
155 |
190 | {/*
194 | */}
196 |
197 |
198 |
Title
199 |
200 |
208 | {title.length}/{MAX_TITLE_LENGTH}
209 |
210 |
211 |
212 |
213 |
214 |
Content
215 |
216 |
217 |
226 |
227 | {content.length}/{MAX_CONTENT_LENGTH}
228 |
229 | {/*
234 | {isListening ? */}
236 | {!isSpeechSupported && (
237 |
238 | Speech recognition is not supported in this browser.
239 |
240 | )}
241 |
242 |
243 |
244 |
245 |
246 |
Background Color
247 |
248 | {predefinedColors.map((color) => (
249 | setBackground(color)}
252 | // className="border border-2"
253 | style={{
254 | marginTop: "8px",
255 | backgroundColor: color,
256 | width: "36px",
257 | height: "36px",
258 | borderRadius: "50%",
259 | border: background === color ? "2px solid black" : "1px solid gray",
260 | cursor: "pointer",
261 | }}
262 | >
263 | ))}
264 |
265 |
266 |
267 |
268 |
269 | Tags
270 |
272 |
273 |
274 |
Add Attachments
275 |
276 |
277 |
278 |
279 |
Add Photos
280 |
284 |
285 |
286 |
287 |
Add Videos
288 |
292 |
293 |
294 | {error &&
{error}
}
295 |
296 |
297 |
298 | Close
299 |
300 |
304 | {type === "edit" ? "Update Note" : "Add Note"}
305 |
306 |
307 |
308 | {/* Revert Button */}
309 | {/* {initialData && (
310 |
314 | Revert Changes
315 |
316 | )} */}
317 |
Date: [Enter date]
6 | Attendees: [Enter attendees]
7 |
8 | Agenda:
9 |
10 | [Enter agenda item]
11 | [Enter agenda item]
12 |
13 |
14 | Notes:
15 |
16 | [Enter meeting note]
17 |
18 |
19 | Action Items:
20 |
21 | [Enter action item with owner and due date]
22 |
23 | `,
24 | tags: ["meeting", "notes"]
25 | },
26 | todo: {
27 | title: "To-Do List",
28 | content: `
29 | Tasks:
30 |
35 |
36 | Notes:
37 |
38 | [Enter any additional notes]
39 |
40 | `,
41 | tags: ["to-do", "list"]
42 | },
43 | brainstorming: {
44 | title: "Brainstorming Notes",
45 | content: `
46 | Topic: [Enter topic]
47 |
48 | Ideas:
49 |
50 | [Enter idea 1]
51 | [Enter idea 2]
52 | [Enter idea 3]
53 |
54 |
55 | Next Steps:
56 |
57 | [Enter next step or action]
58 |
59 | `,
60 | tags: ["brainstorming", "ideas"]
61 | }
62 | };
63 |
--------------------------------------------------------------------------------
/frontend/src/setupProxy.js:
--------------------------------------------------------------------------------
1 | const { createProxyMiddleware } = require('http-proxy-middleware');
2 | const apiBaseUrl = import.meta.env.VITE_BACKEND_URL;
3 |
4 | module.exports = function (app) {
5 | app.use(
6 | '/api',
7 | createProxyMiddleware({
8 | target: `${apiBaseUrl}`,
9 | changeOrigin: true
10 | })
11 | )
12 | }
13 |
--------------------------------------------------------------------------------
/frontend/src/utils/ProtectedRoute.jsx:
--------------------------------------------------------------------------------
1 | import React from "react";
2 | import { Navigate } from "react-router-dom";
3 |
4 | const ProtectedRoute = ({ childeren }) => {
5 | const token = localStorage.getItem("token");
6 |
7 | if (!token) {
8 | return 
86 | 
166 |
167 |