diff options
Diffstat (limited to 'storefront/pages/login.js')
| -rw-r--r-- | storefront/pages/login.js | 164 |
1 files changed, 82 insertions, 82 deletions
diff --git a/storefront/pages/login.js b/storefront/pages/login.js index 033f9b5..9539a51 100644 --- a/storefront/pages/login.js +++ b/storefront/pages/login.js @@ -1,82 +1,82 @@ -import { useState } from "react" -import { useRouter } from "next/router" -import { medusaClient } from "../lib/medusa-client" -import { setStoredToken } from "../lib/storefront" - -export default function LoginPage() { - const router = useRouter() - const [form, setForm] = useState({ email: "", password: "" }) - const [status, setStatus] = useState("") - const [isLoading, setIsLoading] = useState(false) - - const handleChange = (event) => { - const { name, value } = event.target - setForm((prev) => ({ ...prev, [name]: value })) - } - - const handleSubmit = async (event) => { - event.preventDefault() - setStatus("") - setIsLoading(true) - - try { - const { access_token: accessToken } = await medusaClient.auth.getToken({ - email: form.email, - password: form.password, - }) - - setStoredToken(accessToken) - medusaClient.setToken(accessToken) - setStatus("Connexion réussie.") - router.push("/") - } catch (error) { - setStatus("Identifiants invalides ou indisponibles.") - } finally { - setIsLoading(false) - } - } - - return ( - <div style={{ maxWidth: "420px", margin: "0 auto" }}> - <h1>Se connecter</h1> - <form onSubmit={handleSubmit} style={{ display: "grid", gap: "1rem" }}> - <label> - Email - <input - name="email" - type="email" - value={form.email} - onChange={handleChange} - required - style={{ width: "100%", padding: "0.5rem", marginTop: "0.5rem" }} - /> - </label> - <label> - Mot de passe - <input - name="password" - type="password" - value={form.password} - onChange={handleChange} - required - style={{ width: "100%", padding: "0.5rem", marginTop: "0.5rem" }} - /> - </label> - <button - type="submit" - disabled={isLoading} - style={{ - border: "1px solid #ccc", - background: "#fff", - borderRadius: "6px", - padding: "0.6rem", - cursor: "pointer", - }} - > - {isLoading ? "Connexion..." : "Se connecter"} - </button> - {status && <p>{status}</p>} - </form> - </div> - ) -} +import { useState } from "react"
+import { useRouter } from "next/router"
+import { medusaClient } from "../lib/medusa-client"
+import { setStoredToken } from "../lib/storefront"
+
+export default function LoginPage() {
+ const router = useRouter()
+ const [form, setForm] = useState({ email: "", password: "" })
+ const [status, setStatus] = useState("")
+ const [isLoading, setIsLoading] = useState(false)
+
+ const handleChange = (event) => {
+ const { name, value } = event.target
+ setForm((prev) => ({ ...prev, [name]: value }))
+ }
+
+ const handleSubmit = async (event) => {
+ event.preventDefault()
+ setStatus("")
+ setIsLoading(true)
+
+ try {
+ const { access_token: accessToken } = await medusaClient.auth.getToken({
+ email: form.email,
+ password: form.password,
+ })
+
+ setStoredToken(accessToken)
+ medusaClient.setToken(accessToken)
+ setStatus("Connexion réussie.")
+ router.push("/")
+ } catch (error) {
+ setStatus("Identifiants invalides ou indisponibles.")
+ } finally {
+ setIsLoading(false)
+ }
+ }
+
+ return (
+ <div style={{ maxWidth: "420px", margin: "0 auto" }}>
+ <h1>Se connecter</h1>
+ <form onSubmit={handleSubmit} style={{ display: "grid", gap: "1rem" }}>
+ <label>
+ Email
+ <input
+ name="email"
+ type="email"
+ value={form.email}
+ onChange={handleChange}
+ required
+ style={{ width: "100%", padding: "0.5rem", marginTop: "0.5rem" }}
+ />
+ </label>
+ <label>
+ Mot de passe
+ <input
+ name="password"
+ type="password"
+ value={form.password}
+ onChange={handleChange}
+ required
+ style={{ width: "100%", padding: "0.5rem", marginTop: "0.5rem" }}
+ />
+ </label>
+ <button
+ type="submit"
+ disabled={isLoading}
+ style={{
+ border: "1px solid #ccc",
+ background: "#fff",
+ borderRadius: "6px",
+ padding: "0.6rem",
+ cursor: "pointer",
+ }}
+ >
+ {isLoading ? "Connexion..." : "Se connecter"}
+ </button>
+ {status && <p>{status}</p>}
+ </form>
+ </div>
+ )
+}
|
