React native props typescript

Is this correct way to pass the interface? If not please guide me. Thanks!

This is my interface

export interface Props {  username: string;  password: string;  usernameTouched: boolean;  passwordTouched: boolean;}

This is the part I want to know if this is good or not

export const Login: React.FC<Props> = (props) => {  const [user, setUser] = useState<props.username>('');  const [pass, setPass] = useState<props.password>('');  const [userTouch, setUserTouch] = useState<props.usernameTouched>(false);  const [passTouch, setPassTouch] = useState<props.passwordTouched>(false);  const handleUsername = (username: string) => {    setUser(username);  };  const handlePassword = (password: string) => {    setPass(password);  };  const handleUserBlur = () => {    setUserTouch(true);  };  const handlePassBlur = () => {    setPassTouch(true)  };  const userError = !user && userTouch ? strings.username_required : undefined;  const passError = !pass && passTouch ? strings.password_required : undefined;  return (<KeyboardAvoidingView style={styles.container} behavior="padding"><Logo label="Fitness" style={styles.imageLogo} /><View style={styles.form}><TextField          onChangeText={handleUsername}          value={user}          placeholder={strings.user_placeholder}          returnKeyType="next"          onBlur={handleUserBlur}          error={userError}        /><TextField          onChangeText={handlePassword}          value={pass}          placeholder={strings.pass_placeholder}          returnKeyType="done"          secureTextEntry={true}          onBlur={handlePassBlur}          error={passError}        /></View></KeyboardAvoidingView>  );}

This is working by the way I just want to clarify if this is good or not, if not please help me thanks!