13 |
24 | {siteConfig.title}
14 |{siteConfig.tagline}
15 |
16 |
20 | Check out now ! 📝
21 |
22 |
23 |
15 | {value === index && (
16 |
17 | {children}
18 |
19 | )}
20 |
21 | );
22 | };
23 |
24 | export const CustomTabs = ({ value, handleChange, items = [] }) => {
25 | function a11yProps(index) {
26 | return {
27 | id: `simple-tab-${index}`,
28 | "aria-controls": `simple-tabpanel-${index}`,
29 | };
30 | }
31 | return (
32 | Hey! Mock API Backend is up !
`); 49 | }); 50 | 51 | app.listen(PORT, () => console.log(`server up and running at ${PORT}`)); 52 | -------------------------------------------------------------------------------- /frontend/src/components/CustomModal.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import { 3 | Box, 4 | Button, 5 | Modal, 6 | Stack, 7 | Typography, 8 | useMediaQuery, 9 | } from "@mui/material"; 10 | import { MdClose } from "react-icons/md"; 11 | 12 | const CustomModal = ({ open, setOpen, title = "", width = 400, children }) => { 13 | const mobileMatches = useMediaQuery("(max-width:425px)"); 14 | 15 | const style = { 16 | position: "absolute", 17 | top: "50%", 18 | left: "50%", 19 | transform: "translate(-50%, -50%)", 20 | width: mobileMatches ? "80%" : width, 21 | bgcolor: "background.paper", 22 | boxShadow: 24, 23 | p: mobileMatches ? 1 : 4, 24 | maxHeight: "80vh", 25 | overflowY: "auto", 26 | }; 27 | 28 | return ( 29 |
34 | {value === index && (
35 | {children}
36 | )}
37 |
38 | );
39 | };
40 |
41 | const ViewAnalytics = ({ open, setOpen }) => {
42 | const [value, setValue] = React.useState(0);
43 |
44 | const handleChange = (event, newValue) => {
45 | setValue(newValue);
46 | };
47 |
48 | const data = [
49 | {
50 | date: "22/10",
51 | requests: 1,
52 | },
53 | {
54 | date: "23/10",
55 | requests: 2,
56 | },
57 | {
58 | date: "24/10",
59 | requests: 4,
60 | },
61 | {
62 | date: "25/10",
63 | requests: 1,
64 | },
65 | {
66 | date: "26/10",
67 | requests: 3,
68 | },
69 | {
70 | date: "27/10",
71 | requests: 4,
72 | },
73 | {
74 | date: "28/10",
75 | requests: 5,
76 | },
77 | ];
78 |
79 | const tabData = [
80 | {
81 | method: "GET",
82 | data: data,
83 | color: "#82ca9d",
84 | },
85 | {
86 | method: "GET Single",
87 | data: data,
88 | color: "#A798FF",
89 | },
90 | {
91 | method: "POST",
92 | data: data,
93 | color: "#FF9777",
94 | },
95 | {
96 | method: "PUT",
97 | data: data,
98 | color: "#2499EF",
99 | },
100 | {
101 | method: "DELETE",
102 | data: data,
103 | color: "#3f51b5",
104 | },
105 | ];
106 |
107 | return (
108 | -
139 | {featureList.map((feature) => (
140 |
cd backend
86 |
87 | - Run npm install
88 |
89 | - Then run node index.js or nodemon index.js
90 |
91 | - To start frontend cd frontend
92 |
93 | - Run npm install
94 |
95 | - Then run npm run dev
96 |
97 | Addtionally within BE folder you will have to include MongoDB URL and Token in .env for local work
98 |
99 | ```md
100 | DB_CONNECT = mongodb+srv://{username}:{password}@cluster0.hfdhy.mongodb.net/{collectio_name}?retryWrites=true&w=majority
101 |
102 | TOKEN_SECRET = {some gibberish}
103 |
104 | EMAIL_ID={email}
105 |
106 | EMAIL_PWD={password}
107 | ```
108 |
109 | ## 💼 Code of Conduct
110 |
111 | We want to facilitate a healthy and constructive community behavior by adopting and enforcing our code of conduct.
112 |
--------------------------------------------------------------------------------
/frontend/src/pages/auth/Signup.jsx:
--------------------------------------------------------------------------------
1 | import React, { useState, useEffect } from "react";
2 | import axios from "axios";
3 | import { Box, Button, TextField, Typography } from "@mui/material";
4 | import { Link, useNavigate } from "react-router-dom";
5 | import { apiAuth } from "../../services/models/authModel";
6 | import { toast } from "react-hot-toast";
7 | import * as Yup from "yup";
8 | import { useFormik } from "formik";
9 | import { CustomLoaderButton } from "../../components/CustomButtons";
10 | import { CustomPwdField } from "../../components/CustomInputFields";
11 |
12 | const Signup = () => {
13 | let [hasToken, setHasToken] = useState(false);
14 | useEffect(() => {
15 | const userToken = localStorage.getItem("MockAPI-Token");
16 | const headers = {
17 | "auth-token": `${userToken}`,
18 | };
19 | axios
20 | .get("https://mocker-backend.vercel.app/api/auth/verify", {
21 | headers,
22 | })
23 | .then((res) => {
24 | if (res.data.message === "ok") {
25 | setHasToken(true);
26 | }
27 | })
28 | .catch((err) => {
29 | setHasToken(false);
30 | });
31 | }, []);
32 | const navigate = useNavigate();
33 | const [loading, setLoading] = useState(false);
34 |
35 | const initialValues = {
36 | email: "",
37 | password: "",
38 | submit: null,
39 | }; // form field value validation schema
40 |
41 | const validationSchema = Yup.object().shape({
42 | email: Yup.string()
43 | .email("Must be a valid email")
44 | .max(255)
45 | .required("Email is required"),
46 | password: Yup.string()
47 | .min(6, "Minimum 6 characters required")
48 | .required("Password is required"),
49 | });
50 |
51 | const { errors, values, touched, handleBlur, handleChange, handleSubmit } =
52 | useFormik({
53 | initialValues,
54 | validationSchema,
55 | onSubmit: (values) => {
56 | setLoading(true);
57 | registerUser(values.email, values.password);
58 | },
59 | });
60 |
61 | const registerUser = (email, password) => {
62 | const body = {
63 | email: email,
64 | password: password,
65 | };
66 |
67 | apiAuth.post(body, "register").then((res) => {
68 | if (res.status === "200") {
69 | navigate("/");
70 | toast.success(
71 | "We have sent you verification mail. Please verify and come back"
72 | );
73 | } else if (res.status === "400") {
74 | toast.error(res.message);
75 | } else {
76 | toast.error("Error");
77 | }
78 | setLoading(false);
79 | });
80 | };
81 | const logout = () => {
82 | localStorage.clear();
83 | setHasToken(false);
84 | navigate("/");
85 | };
86 | if (hasToken) {
87 | return (
88 |
91 | );
92 | }
93 | return (
94 | | Option | 75 |Description | 76 |Default | 77 |
|---|---|---|
| min | 82 |Upper bound for milliseconds since base date. When not provided or larger than 8640000000000000, 2100-01-01 is considered as maximum generated date. | 83 |631152000000 | 84 |
| max | 87 |Lower bound for milliseconds since base date. When not provided or smaller than -8640000000000000, 1990-01-01 is considered as minimum generated date. | 88 |4102444800000 | 89 |
8 | 
15 | 
cd backend
86 |
87 | - Run npm install
88 |
89 | - Then run node index.js or nodemon index.js
90 |
91 | - To start frontend cd frontend
92 |
93 | - Run npm install
94 |
95 | - Then run npm run dev
96 |
97 | Addtionally within BE folder you will have to include MongoDB URL and Token in .env for local work
98 |
99 | ```
100 | DB_CONNECT = mongodb+srv://{username}:{password}@cluster0.hfdhy.mongodb.net/{collectio_name}?retryWrites=true&w=majority
101 |
102 | TOKEN_SECRET = {some gibberish}
103 |
104 | EMAIL_ID={email}
105 |
106 | EMAIL_PWD={password}
107 |
108 | ```
109 |
110 | ## 💼 Code of Conduct
111 |
112 | We want to facilitate a healthy and constructive community behavior by adopting and enforcing our code of conduct.
113 |
114 | # 🧑💻 CONTRIBUTION 👏
115 | 116 | - Contributions make the open source community such an amazing place to learn, inspire, and create. 117 | - Any contributions you make are greatly appreciated. 118 | - Check out our [contribution guidelines](/CONTRIBUTING.md) for more information. 119 | 120 |121 | 122 |
Project Admin 💻
123 | 124 |
125 | 
Our Amazing Contributors 👨👨👦👦❤️
129 | 130 | Thanks to all the contributors who worked for this project to stay alive! 😊😎 131 | 132 | 133 |137 | 138 | --- 139 |
140 |
143 |
144 |
145 |
146 |
147 |
148 |
--------------------------------------------------------------------------------
/backend/templates/resetPwdTemplate.js:
--------------------------------------------------------------------------------
1 | const resetPwdTemplate = (link) =>
2 | `
3 |
4 |
5 |
6 |
7 |
8 |
9 |
10 |
11 | Take a moment to star ⭐ the project if you like it
141 |Do checkout the other repos 💫
142 |
28 |
|
117 |
28 |
|
125 |
There are two modes available 'age' and 'year':
'age': The min and max options define the age of the person (e.g. 18 - 42).
'year': The min and max options define the range the birthdate may be in (e.g. 1900 - 2000). | 68 | 69 | #### Input: 70 | 71 | | minimum age | maximum age | mode | Output | 72 | | :---------: | :---------: | :----: | :----------------------: | 73 | | 18 | 65 | "age" | 2003-11-02T20:03:20.116Z | 74 | | 1900 | 2000 | "year" | 1940-08-20T08:53:07.538Z | 75 | 76 | ### future 77 | 78 | Generates a random date in the future. 79 | 80 | | Option | Description | 81 | | :----: | ------------------------------------------------- | 82 | | years | The range of years the date may be in the future. | 83 | 84 | #### Input: 85 | 86 | | years | 87 | | :---: | 88 | | 10 | 89 | 90 | #### output 91 | 92 | ```json 93 | 2030-11-23T09:38:28.710Z 94 | ``` 95 | 96 | ### month 97 | 98 | Returns a random name of a month. 99 | 100 | | Option | Description | 101 | | :----: | ---------------------------------- | 102 | | abbr | Whether to return an abbreviation. | 103 | 104 | #### Input: 105 | 106 | | abbr | Output | 107 | | :------------: | :-----: | 108 | | "abbreviation" | Feb | 109 | | "long form" | October | 110 | 111 | ### past 112 | 113 | Generates a random date in the past. 114 | 115 | | Option | Description | 116 | | :--------: | ----------------------------------------------- | 117 | | past years | The range of years the date may be in the past. | 118 | 119 | #### Input: 120 | 121 | | past years | 122 | | :--------: | 123 | | 10 | 124 | 125 | #### output 126 | 127 | ```json 128 | 2017-10-25T21:34:19.488Z 129 | ``` 130 | 131 | ### recent 132 | 133 | Generates a random date in the recent past. 134 | 135 | | Option | Description | 136 | | :-------------: | --------------------------------------------------------------------------------- | 137 | | days | The range of days the date may be in the past. | 138 | | reference point | The date to use as reference point for the newly generated date. Defaults to now. | 139 | 140 | #### Input: 141 | 142 | | days | reference point | 143 | | :--: | :-----------------: | 144 | | 10 | 2020-01-01 00:00:00 | 145 | 146 | #### output 147 | 148 | ```json 149 | 2019-12-27T18:11:19.117Z 150 | ``` 151 | 152 | ### soon 153 | 154 | Generates a random date in the near future. 155 | 156 | | Option | Description | 157 | | :-------------: | --------------------------------------------------------------------------------- | 158 | | days | The range of days the date may be in the future. | 159 | | reference point | The date to use as reference point for the newly generated date. Defaults to now. | 160 | 161 | #### Input: 162 | 163 | | days | reference point | 164 | | :--: | :-----------------: | 165 | | 10 | 2020-01-01 00:00:00 | 166 | 167 | #### output 168 | 169 | ```json 170 | 2020-01-01T02:40:44.990Z 171 | ``` 172 | 173 | ### weekday 174 | 175 | Returns a random day of the week. 176 | 177 | | Option | Description | 178 | | :----: | ---------------------------------- | 179 | | abbr | Whether to return an abbreviation. | 180 | 181 | #### Input: 182 | 183 | | abbr | output | 184 | | :----------: | :------: | 185 | | long form | Thursday | 186 | | abbreviation | Thu | 187 | -------------------------------------------------------------------------------- /backend/routes/user/user.js: -------------------------------------------------------------------------------- 1 | const router = require("express").Router(); 2 | // const Joi = require("joi"); 3 | const Resource = require("../../models/Resource"); 4 | const { v4: uuidv4 } = require("uuid"); 5 | // const { trackAPIRequest } = require("../../utils/trackAPIRequests"); 6 | 7 | router.use((req, res, next) => { 8 | const endpoint = req.originalUrl; 9 | Resource.findOneAndUpdate( 10 | { _id: req.params.id }, 11 | { $push: { analytics: { date: new Date() } } }, 12 | { upsert: true, new: true } 13 | ).exec((err, endpointRequest) => { 14 | if (err) { 15 | console.error("Error updating request history:", err); 16 | } else { 17 | console.log( 18 | `Request history for ${endpointRequest}.${endpoint}:`, 19 | endpointRequest.analytics 20 | ); 21 | } 22 | }); 23 | next(); 24 | }); 25 | 26 | router.get("/:id", async (req, res) => { 27 | try { 28 | const resource = await Resource.findById(req.params.id); 29 | if (resource === null) { 30 | res.status(200).send({ 31 | status: "400", 32 | message: 'Seems like resourceId doesn"t exist !', 33 | }); 34 | return; 35 | } 36 | res.status(200).send({ status: "200", message: resource.data }); 37 | } catch (err) { 38 | res.status(200).send({ status: "500", message: err }); 39 | } 40 | }); 41 | 42 | router.get("/:id/:objectId", async (req, res) => { 43 | try { 44 | const resource = await Resource.findById(req.params.id); 45 | if (resource === null) { 46 | res.status(200).send({ 47 | status: "400", 48 | message: 'Seems like resourceId doesn"t exist !', 49 | }); 50 | return; 51 | } 52 | const response = resource.data.filter( 53 | (item) => item.id === req.params.objectId 54 | ); 55 | if (response.length === 0) { 56 | res.status(200).send({ 57 | status: "400", 58 | message: 'Seems like objectId doesn"t exist !', 59 | }); 60 | return; 61 | } 62 | res.status(200).send({ status: "200", message: response }); 63 | } catch (err) { 64 | res.status(200).send({ status: "500", message: err }); 65 | } 66 | }); 67 | 68 | router.post("/:id", async (req, res) => { 69 | try { 70 | if (typeof req.body !== "object") { 71 | res.status(200).send({ 72 | status: "400", 73 | message: "Wrong format", 74 | }); 75 | return; 76 | } 77 | 78 | const resource = await Resource.findById(req.params.id); 79 | if (resource === null) { 80 | res.status(200).send({ 81 | status: "400", 82 | message: 'Seems like resourceId doesn"t exist !', 83 | }); 84 | return; 85 | } 86 | const requiredLabel = resource.schema.map((item) => item.label); 87 | 88 | const reqLabel = Object.keys(req.body); 89 | 90 | if ( 91 | requiredLabel 92 | .map((label) => (reqLabel.includes(label) ? true : false)) 93 | .includes(false) 94 | ) { 95 | res.status(200).send({ 96 | status: "400", 97 | message: "Some fields appear to be mismatched (check the schema)", 98 | }); 99 | return; 100 | } 101 | 102 | if (reqLabel.length !== requiredLabel.length) { 103 | res.status(200).send({ 104 | status: "400", 105 | message: "Some fields seems to be extra/missing", 106 | }); 107 | } 108 | 109 | const newData = { ...req.body, id: uuidv4() }; 110 | 111 | const body = { 112 | name: resource.name, 113 | schema: resource.schema, 114 | data: [...resource.data, newData], 115 | number: resource.number + 1, 116 | userId: resource.userId, 117 | projectId: resource.projectId, 118 | }; 119 | 120 | resource.set(body); 121 | await resource.save(); 122 | res.status(200).send({ status: "200", message: "Successfully Added !" }); 123 | } catch (err) { 124 | res.status(200).send({ status: "500", message: err }); 125 | } 126 | }); 127 | 128 | router.put("/:id/:objectId", async (req, res) => { 129 | try { 130 | if (typeof req.body !== "object") { 131 | res.status(200).send({ 132 | status: "400", 133 | message: "Wrong format", 134 | }); 135 | return; 136 | } 137 | 138 | const resource = await Resource.findById(req.params.id); 139 | if (resource === null) { 140 | res.status(200).send({ 141 | status: "400", 142 | message: 'Seems like resourceId doesn"t exist !', 143 | }); 144 | return; 145 | } 146 | const requiredLabel = resource.schema.map((item) => item.label); 147 | 148 | const reqLabel = Object.keys(req.body); 149 | 150 | if ( 151 | requiredLabel 152 | .map((label) => (reqLabel.includes(label) ? true : false)) 153 | .includes(false) 154 | ) { 155 | res.status(200).send({ 156 | status: "400", 157 | message: "Some fields appear to be mismatched (check the schema)", 158 | }); 159 | return; 160 | } 161 | 162 | if (reqLabel.length !== requiredLabel.length) { 163 | res.status(200).send({ 164 | status: "400", 165 | message: "Some fields seems to be extra/missing", 166 | }); 167 | } 168 | 169 | const response = resource.data.map((item) => { 170 | if (item.id === req.params.objectId) { 171 | return { ...req.body, id: uuidv4() }; 172 | } 173 | return item; 174 | }); 175 | 176 | if (response.length === 0) { 177 | res.status(200).send({ 178 | status: "400", 179 | message: 'Seems like objectId doesn"t exist !', 180 | }); 181 | return; 182 | } 183 | 184 | const body = { 185 | name: resource.name, 186 | schema: resource.schema, 187 | data: response, 188 | number: resource.number, 189 | userId: resource.userId, 190 | projectId: resource.projectId, 191 | }; 192 | 193 | resource.set(body); 194 | await resource.save(); 195 | res.status(200).send({ status: "200", message: "Successfully Edited !" }); 196 | // res.status(200).send({ status: "200", message: body }); 197 | } catch (err) { 198 | res.status(200).send({ status: "500", message: err }); 199 | } 200 | }); 201 | 202 | router.delete("/:id/:objectId", async (req, res) => { 203 | try { 204 | const resource = await Resource.findById(req.params.id); 205 | if (resource === null) { 206 | res.status(200).send({ 207 | status: "400", 208 | message: 'Seems like resourceId doesn"t exist !', 209 | }); 210 | return; 211 | } 212 | const required = resource.data.filter( 213 | (item) => item.id !== req.params.objectId 214 | ); 215 | 216 | if (required.length === resource.data.length) { 217 | res.status(200).send({ 218 | status: "400", 219 | message: 'Seems like objectId doesn"t exist !', 220 | }); 221 | return; 222 | } 223 | 224 | const body = { 225 | name: resource.name, 226 | schema: resource.schema, 227 | data: required, 228 | number: resource.number, 229 | userId: resource.userId, 230 | projectId: resource.projectId, 231 | }; 232 | resource.set(body); 233 | await resource.save(); 234 | 235 | // res.status(200).send({ status: "200", message: body }); 236 | res.status(200).send({ status: "200", message: "Successfully Deleted" }); 237 | } catch (err) { 238 | res.status(200).send({ status: "500", message: err }); 239 | } 240 | }); 241 | 242 | module.exports = router; 243 | --------------------------------------------------------------------------------