import React, { useState } from "react" import type { ComponentType } from "react" import { Eye, EyeSlash } from "phosphor-react" const brandColor = "#6D24FF" export function withPasswordProtection(Component): ComponentType { return (props) => { const PASSWORDS = ["password", "password2"] const [authenticated, setAuthenticated] = useState(false) const [showPassword, setShowPassword] = useState(false) const handlePasswordSubmit = (e) => { e.preventDefault() const inputPassword = e.target.elements.password.value if (PASSWORDS.includes(inputPassword)) { setAuthenticated(true) } else { alert("Incorrect password") } } if (!authenticated) { return (
Password:
setShowPassword(!showPassword)} style={{ position: "absolute", right: "10px", background: "none", border: "none", cursor: "pointer", }} > {showPassword ? (
) : (
)}
Submit
) } return
} }
This page is private
Enter passcode to continue
Unlock
Request Access