Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 | // @flow
import type { LoginProps, OnSubmitLogin } from "@bluframe/blublocks"
import Login from "./Login"
import prepareComponent from "@bluframe/grapple/prepareComponent"
import { useRef } from "react"
export type Props = {|
...LoginProps
|}
export type ComponentProps = {|
...$Diff<Props, {| +onSubmitLogin: OnSubmitLogin |}>,
+onSubmit: (event: SyntheticEvent<>) => void,
+passwordRef: { current: null | HTMLInputElement },
+usernameRef: { current: null | HTMLInputElement }
|}
export const usePrepareComponent = ({
isLoading,
name,
onSubmitLogin,
usernameLabel
}: Props): ComponentProps => {
const usernameRef = useRef(null)
const passwordRef = useRef(null)
const onSubmit = (event: SyntheticEvent<>) => {
event.preventDefault()
onSubmitLogin({
password: passwordRef.current?.value ?? "",
username: usernameRef.current?.value ?? ""
})
}
return {
isLoading,
name,
onSubmit,
passwordRef,
usernameLabel,
usernameRef
}
}
export default (prepareComponent<Props, ComponentProps>(usePrepareComponent)(
Login
): React$ComponentType<Props>)
|