Merge pull request #24 from builtbysuraj/feat/user-auth

Feat/user auth

.gitignore

@@ -1,2 +1 @@
 node_modules
-dist

.husky/pre-commit

@@ -6,7 +6,16 @@ echo '
 '
 
 # Check tsconfig standards
-npm run check-types ||
+npm run check-types-client ||
+(
+    echo '
+    TypeScript Check Failed. ❌ 
+    Make the required changes listed above, add changes and try to commit again.
+    '
+    false;
+)
+
+npm run check-types-server ||
 (
     echo '
     TypeScript Check Failed. ❌ 
@@ -17,7 +26,7 @@ npm run check-types ||
 
 
 # Check ESLint Standards
-npm run check-lint ||
+npm run check-lint-client ||
 (
     echo ' 
     ESLint Check Failed. ❌

.vscode/extensions.json

@@ -0,0 +1,3 @@
+{
+  "recommendations": ["esbenp.prettier-vscode", "dbaeumer.vscode-eslint"]
+}

client/src/components/form/Form.tsx

@@ -1,6 +1,11 @@
+import axios from 'axios'
 import { Link } from 'react-router-dom'
+
+import { ENV } from '@/conf'
 import styles from './Form.module.css'
 
+axios.defaults.withCredentials = true
+
 type FormProps = {
   mode: string
   promptText: string
@@ -14,6 +19,21 @@ export default function From({
   promptLink,
   promptLinkText,
 }: FormProps) {
+  const endpoint = mode === 'Signup' ? '/register' : '/login'
+
+  const handleSubmit = async (evt: React.FormEvent<HTMLFormElement>) => {
+    evt.preventDefault()
+    const form = evt.target as HTMLFormElement
+    const formData = new FormData(form)
+
+    // Extracting form values through 'name' property, in 'data'
+    const data = Object.fromEntries(formData)
+    const res = await axios.post(`${ENV.SERVER_URL}/${endpoint}`, data)
+    console.log(res.data)
+
+    form.reset()
+  }
+
   return (
     <div className={styles.formContainer}>
       <div className={styles.left}>
@@ -26,16 +46,21 @@ export default function From({
         </div>
       </div>
       <div className={styles.right}>
-        <form className={styles.form}>
-          <input type="text" placeholder="Username" />
-          <input type="password" placeholder="Password" />
+        <form onSubmit={handleSubmit} className={styles.form}>
+          <input type="text" placeholder="Username" name="username" required />
+          <input
+            type="password"
+            placeholder="Password"
+            name="password"
+            required
+          />
           <small className={styles.fromSmall}>
             By continuing, you agree to Flipkart's
             <span className={styles.demoLink}> Terms of Use </span>
             and
             <span className={styles.demoLink}> Privacy Policy.</span>
           </small>
-          <button>{mode}</button>
+          <button type="submit">{mode}</button>
           <p>
             {promptText}{' '}
             <Link to={promptLink} className={styles.demoLink}>

client/src/context/ServerStatusProvider.tsx

@@ -19,7 +19,7 @@ export default function ServerStatusProvider({ children }: PropsWithChildren) {
   useEffect(() => {
     const checkServerStatus = async () => {
       try {
-        const { data } = await axios.get(`${ENV.SERVER_URL}/api/v1/status`)
+        const { data } = await axios.get(`${ENV.SERVER_URL}/status`)
 
         if (data.status) {
           setServerStatus(data)

client/src/pages/cart/components/place-order/PlaceOrder.tsx

@@ -13,6 +13,8 @@ declare global {
   }
 }
 
+axios.defaults.withCredentials = true
+
 export default function PlaceOrder() {
   const cartData = useAppSelector((state) => state.cart)
   const serverStatus = useServerStatus()
@@ -36,7 +38,7 @@ export default function PlaceOrder() {
       currency: 'INR',
       name: 'RazorPay',
       description: 'Secure payment through RazorPay',
-      // image: 'https://avatars.githubusercontent.com/u/25058652?v=4',
+      // image: '',
       order_id: order.id,
       callback_url: 'http://localhost:5000/api/v1/paymentverification',
       notes: {

client/vite.config.ts

@@ -34,10 +34,5 @@ export default (args: ViteConfigInput) => {
         generateScopedName,
       },
     },
-    server: {
-      proxy: {
-        '/api': 'http://localhost:5000',
-      },
-    },
   })
 }