initial commit

1 files changed, 174 insertions, 0 deletions

diff --git a/app/login/page.tsx b/app/login/page.tsx
new file mode 100644
index 0000000..8df5b2c
--- /dev/null
+++ b/app/login/page.tsx
@@ -0,0 +1,174 @@
+"use client";
+import {
+  Box,
+  Button,
+  FormControl,
+  FormLabel,
+  TextField,
+  Typography,
+} from "@mui/material";
+import Header from "../lib/camera/component/hedear";
+import odooApi from "../lib/api/odooApi";
+import { getAuth, setAuth } from "../lib/api/auth";
+import { useRouter } from "next/navigation";
+import { useEffect, useState } from "react";
+
+const Login = () => {
+  const router = useRouter();
+  const [emailError, setEmailError] = useState(false);
+  const [emailErrorMessage, setEmailErrorMessage] = useState("");
+  const [passwordError, setPasswordError] = useState(false);
+  const [passwordErrorMessage, setPasswordErrorMessage] = useState("");
+
+  useEffect(() => {
+    const token = getAuth();
+
+    if (token) {
+      router.push("/");
+    }
+  }, [router]);
+
+  const handleSubmit = async (event: React.FormEvent<HTMLFormElement>) => {
+    event.preventDefault();
+    if (emailError || passwordError) {
+      return;
+    }
+    const data = new FormData(event.currentTarget);
+    const email = data.get("email");
+    const password = data.get("password");
+    
+    console.log('ini user', email, password)
+    try {
+      odooApi("POST", "/api/v1/user/login", {
+        email ,
+        password
+      }).then((res) => {
+        const auth = res.result;
+        if (auth.is_auth) {
+          setAuth(auth.user);
+          router.push("/");
+          return;
+        }
+        switch (auth.reason) {
+          case "NOT_FOUND":
+           alert("Email tidak ditemukan");
+            break;
+          case "NOT_ACTIVE":
+           alert("Akun anda belum aktif");
+            break;
+        }
+        console.log('ini akhir',res);
+      });
+    } catch (error) {
+      console.log(error);
+    }
+  };
+
+  const validateInputs = () => {
+    const email = document.getElementById("email") as HTMLInputElement;
+    const password = document.getElementById("password") as HTMLInputElement;
+
+    let isValid = true;
+
+    if (!email.value || !/\S+@\S+\.\S+/.test(email.value)) {
+      setEmailError(true);
+      setEmailErrorMessage("Please enter a valid email address.");
+      isValid = false;
+    } else {
+      setEmailError(false);
+      setEmailErrorMessage("");
+    }
+
+    if (!password.value || password.value.length < 6) {
+      setPasswordError(true);
+      setPasswordErrorMessage("Password must be at least 6 characters long.");
+      isValid = false;
+    } else {
+      setPasswordError(false);
+      setPasswordErrorMessage("");
+    }
+
+    return isValid;
+  };
+  return (
+    <div className="bg-[#fafeff] h-screen overflow-auto">
+      <Header />
+      <div className="py-4 px-4 sm:px-96 pt-20">
+        <div className="bg-white py-6 px-4 sm:px-96 shadow-md rounded-sm">
+          <Typography
+            component="h1"
+            variant="h4"
+            sx={{
+              width: "100%",
+              fontSize: "clamp(2rem, 10vw, 2.15rem)",
+              mb: 4,
+            }}
+          >
+            Sign in
+          </Typography>
+          <Box
+            component="form"
+            onSubmit={handleSubmit}
+            noValidate
+            sx={{
+              display: "flex",
+              flexDirection: "column",
+              width: "100%",
+              gap: 2,
+            }}
+          >
+            <FormControl>
+              <FormLabel htmlFor="email">Email</FormLabel>
+              <TextField
+                error={emailError}
+                helperText={emailErrorMessage}
+                id="email"
+                type="email"
+                name="email"
+                placeholder="your@email.com"
+                autoComplete="email"
+                autoFocus
+                required
+                fullWidth
+                variant="outlined"
+                color={emailError ? "error" : "primary"}
+                sx={{ ariaLabel: "email" }}
+                size="small"
+              />
+            </FormControl>
+            <FormControl>
+              <Box sx={{ display: "flex", justifyContent: "space-between" }}>
+                <FormLabel htmlFor="password">Password</FormLabel>
+              </Box>
+              <TextField
+                error={passwordError}
+                helperText={passwordErrorMessage}
+                name="password"
+                placeholder="••••••"
+                type="password"
+                id="password"
+                autoComplete="current-password"
+                autoFocus
+                required
+                fullWidth
+                variant="outlined"
+                color={passwordError ? "error" : "primary"}
+                size="small"
+              />
+            </FormControl>
+            <Button
+              type="submit"
+              fullWidth
+              variant="contained"
+              onClick={validateInputs}
+            >
+              Sign in
+            </Button>
+          </Box>
+        </div>
+      </div>
+    </div>
+  );
+};
+
+export default Login;