Flutter: how can use hooks to change the visibility of text in textformfield?

Question

I'm trying to move my TextFormField logic to hooks but what I'm trying is doesn't seem to work.

my custom hook,

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_hooks/flutter_hooks.dart';

enum Index { email, password }

TextFormField useTextFormField(Index index) {
  return use(_CustomHook(index: index));
}

class _CustomHook extends Hook<TextFormField> {
  final Index index;
  _CustomHook({@required this.index});

  @override
  _CustomHookState createState() => _CustomHookState();
}

class _CustomHookState extends HookState<TextFormField, _CustomHook> {
  Index index;

  @override
  TextFormField build(BuildContext context) {
    final visible = useState(false);
   // useEffect((){
    //  print('in');
   //visible.value=!visible.value;
     // print(visible.value.toString());
     // return;
   // },const []);
    return TextFormField(
      decoration: InputDecoration(
          hintText: 'some help',
          suffixIcon: IconButton(
            onPressed: () { 
              visible.value = !visible.value;}, //<--- here
            icon: Icon(visible.value ? Icons.visibility : Icons.visibility_off),
          )),
      validator: (text) {
        if (text.isEmpty) return 'enter something';

        return null;
      },
      obscureText: index == Index.email ? visible.value : true,
    );
  }
}

i'm new to hooks and I don't know I can use useState() and useEffect(), if anyone can help