feat: signup, feed ui and api

db.json

@@ -1,12 +1,115 @@
 {
-  "user": {
-    "id": 1,
-    "name": "Anup",
-    "email": "anup.singh@gmail.com",
-    "password": "123123123",
-    "profilePhoto": "",
-    "phonme": "98181311488"
-  },
+  "user": [
+    {
+      "name": "Niraj yadav",
+      "phone": "8102162627",
+      "email": "Niraj@gamil.com",
+      "password": "123456",
+      "profilePhoto": {
+        "0": {}
+      },
+      "id": "11ad4790-33bb-4fb1-84e1-c2d3dbfcedd5"
+    },
+    {
+      "name": "vikash",
+      "phone": "8102162627",
+      "email": "Rupesh@gamil.com",
+      "password": "123123123",
+      "profilePhoto": {
+        "0": {}
+      },
+      "id": "8d62203a-2e0f-45bf-b0b0-094da9d78758"
+    },
+    {
+      "name": "md maaz",
+      "phone": "08102162627",
+      "email": "Maa12@gmail.com",
+      "password": "123456",
+      "profilePhoto": {
+        "0": {}
+      },
+      "id": "b733170b-039c-44e8-8561-964d7b4cd986"
+    },
+    {
+      "name": "Anup",
+      "phone": "12312313",
+      "email": "anup.singh2071@gmail.com",
+      "password": "12312313",
+      "profilePhoto": {
+        "0": {}
+      },
+      "id": "a615e268-bd88-4f70-a9c6-822d92261cf5"
+    },
+    {
+      "name": "Anup Kumar Singh",
+      "phone": "699999",
+      "email": "anup.singh71@gmail.com",
+      "password": "123123123",
+      "profilePhoto": {
+        "0": {}
+      },
+      "id": "d2100bb1-009e-4ea3-b92a-66fb440987d1"
+    }
+  ],
+  "blog": [
+    {
+      "id": 1,
+      "user_id": 12,
+      "title": "Art",
+      "description": "User Interface Designer",
+      "location": "New York",
+      "workType": "Full-Time",
+      "createdAt": "2h ago"
+    },
+    {
+      "title": "Finance",
+      "description": "Upgrade your finacial score",
+      "location": "Gremany",
+      "workType": "Full Time",
+      "createdAt": "09:12",
+      "id": "047d6e54-4d0e-4c00-a895-9036f522c7ce"
+    },
+    {
+      "title": "Medical",
+      "description": "Medical Science",
+      "location": "India",
+      "workType": "Part Time",
+      "createdAt": "09:16",
+      "id": "327198a3-088d-47c5-a536-5a708a6d04cf"
+    },
+    {
+      "title": "Marketing",
+      "description": "Markeing experience",
+      "location": "Norway",
+      "workType": "Full Time",
+      "createdAt": "21:17",
+      "id": "27f45704-b9aa-464b-911a-e0170d2045cb"
+    },
+    {
+      "title": "sports",
+      "description": "cricket",
+      "location": "Banglore ",
+      "workType": "Full Time",
+      "createdAt": "20:49",
+      "id": "a4d03cfb-b51e-4287-aebc-f9f956adf8f1"
+    },
+    {
+      "title": "Java Developer",
+      "description": "FullStack Java Developer",
+      "location": "INdia",
+      "workType": "Full Time",
+      "createdAt": "07:32",
+      "id": "e41fbadc-7fef-4c18-bd1c-cfef262cfc74"
+    },
+    {
+      "title": "Sports",
+      "description": "Football",
+      "location": "India",
+      "workType": "Full Time",
+      "createdAt": "16:06",
+      "id": "14a3f625-9386-4e78-a200-9f2ac9973afe"
+    }
+  ],
   "employees": [
     {
       "_id": 1,

src/api/auth.js

@@ -6,8 +6,12 @@ class AuthApi {
         return axios.get(`/user/`, params)
     }
 
-    static signup = (params) => {
-        return axios.post(`/user/`, params)
+    static signup = (data) => {
+        return axios({
+            method: 'post',
+            url: `${BASE_URL}/user`,
+            data: data
+        })
     }
 
     static createBlog = (blog) => {
@@ -18,23 +22,19 @@ class AuthApi {
         })
     }
 
-    static getBlog = (blog) => {
-        return axios.get(`${BASE_URL}/blog`, blog)
+    static getBlog = (blog, page=1, limit=10) => {
+        return axios.get(`${BASE_URL}/blog?_page=${page}&_limit=${limit}`, blog)
     }
 
     static signin = (data) => {
         return axios.post(`${base}/auth/signin`,data)
     }
-
     static Register = (data) => {
         return axios.post(`${base}/register`, data);
     };
-
     static Logout = (data) => {
         return axios.post(`${base}/logout`, data, { headers: { Authorization: `${data.token}` } });
     };
 }
-
 let base = "users";
-
-export default AuthApi;
+export default AuthApi;

src/api/profile .js

@@ -0,0 +1,10 @@
+import axios from "./index";
+
+class ProfileApi {
+
+    static edit = (id, body) => {
+        return axios.put(`/user/${id}`, body)
+    }
+}
+
+export default ProfileApi;

src/components/fields/Button.js

@@ -5,11 +5,11 @@ const Button = (props) => {
     props;
   return (
     <button
-      className={className}
+      className={`btn ${className}`}
       type={type}
       {...rest}
     >
-      {icon && <i className={`${icon} mr-2`}></i>}{{text}}
+      {icon && <i className={`${icon} mr-2`}></i>}{text}
     </button>
   );
 };

src/config/url.js

@@ -10,5 +10,6 @@ const PROFILE_URL = '/profile';
 
 // Auth
 const LOGIN_URL = '/login';
+const SIGNUP_URL = '/signup';
 
-export {ROOT_URL, EMPLOYEE_FORM, EMPLOYEE_LIST_URL, LOGIN_URL, FEED_URL, PROFILE_URL};
+export {ROOT_URL, EMPLOYEE_FORM, EMPLOYEE_LIST_URL, LOGIN_URL, FEED_URL, PROFILE_URL, SIGNUP_URL};

src/index.js

@@ -5,6 +5,8 @@ import App from "./App";
 import { BrowserRouter as Router, Routes, Route } from "react-router-dom";
 import Feed from "./views/feed";
 import Login from "./views/auth/Login";
+import Signup from "./views/auth/Signup/index";
+import CreateBlog from "./views/feed/CreateBlog"
 import Dashboard from "./views/dashboard";
 import EmployeeForm from "./views/employees/Form";
 import { Profile } from "./views/employees/Profile";
@@ -38,6 +40,8 @@ root.render(
               <Route path={FEED_URL} element={<Feed />} />
               <Route path={PROFILE_URL} element={<Profile />} />
               <Route path={LOGIN_URL} element={<Login />} />
+              <Route path="/Signup" element={<Signup />} />
+              <Route path="/CreateBlog" element={<CreateBlog />} />
             </Routes>
           </Router>
         </QueryClientProvider>

src/views/auth/Login/Form.js

@@ -3,10 +3,10 @@ import { useForm } from "react-hook-form";
 import AuthApi from "../../../api/auth";
 import Swal from "sweetalert2";
 import { useAuth } from "../../../context/AuthProvider";
-import { useNavigate } from "react-router-dom";
-import Button from "../../../components/fields/Button";
+import { useNavigate, Link } from "react-router-dom";
 import { PROFILE_URL } from "../../../config/url";
 import InputField from "../../../components/fields/InputField";
+import Button from "../../../components/fields/Button";
 
 const LoginForm = () => {
   const {
@@ -17,22 +17,25 @@ const LoginForm = () => {
   const { user, setUser } = useAuth();
   const navigate = useNavigate();
 
-  useEffect(() => {
-    if (user) {
-      console.log("user", user);
-      navigate(PROFILE_URL);
-    }
-  }, [user]);
+  // useEffect(() => {
+  //   if (user) {
+  //     console.log("user", user);
+  //     // navigate(PROFILE_URL);
+  //   }
+  // }, [user]);
+
 
+
   const onSubmit = (data) => {
     // setUser(data);
-    console.log("user =---->", JSON.stringify(data));
+    localStorage.setItem("user =---->", JSON.stringify(data));
 
-    // call an API to login
+      // call an API to login
       // when api gives success response, navigate to root url
-    AuthApi.login(data).then((result) => {
-      console.log("signin -> ", result);
+      AuthApi.login(data).then((result) => {
+        console.log("signin -> ", result);
       if (result.status === 200) {
+        navigate(PROFILE_URL);
         Swal.fire({
           timer: 1500,
           showConfirmButton: false,
@@ -105,21 +108,28 @@ const LoginForm = () => {
           }}
           placeholder="Password"
           errors={errors}
-          required
         />
       </div>
       <div className="d-flex custom-control custom-checkbox mb-3">
         <label className="custom-control-label" for="customCheck1">
           Forgot password?
         </label>
       </div>
-      <button
-        className="btn btn-lg btn-primary btn-block text-uppercase"
-        type="submit"
-      >
-        Sign in
+      <div style={{display:"flex", gap :"1.5rem"}}>
+
+      <Button
+      className="btn-lg btn-primary btn-block text-uppercase"
+      type="submit"
+      text="SIGN IN"
+      />
+      <Link to="/Signup">
+      <button className="btn btn-lg btn-primary btn-block text-uppercase" >
+        Sign up
       </button>
-      <hr class="my-4" />
+      </Link>
+
+      </div>
+      <hr className="my-4" />
       <div className="social-login">
         <Button
           type="submit"

src/views/auth/Login/index.js

@@ -4,12 +4,12 @@ import "../auth.scss";
 
 const Login = () => {
   return (
-    <div class="auth-container">
-      <div class="row">
-        <div class="col-sm-9 col-md-7 col-lg-5 mx-auto">
-          <div class="card card-signin my-5">
-            <div class="card-body">
-              <h5 class="card-title text-center">Sign In</h5>
+    <div className="auth-container">
+      <div className="row">
+        <div className="col-sm-9 col-md-7 col-lg-5 mx-auto">
+          <div className="card card-signin my-5">
+            <div className="card-body">
+              <h5 className="card-title text-center">Sign In</h5>
               <LoginForm />
             </div>
           </div>