How to show an 'Update' button below TextFormField when i click on 'edit' button in ListTile in flutter?

Question

This is some of the code for UI. My requirement is to add an Update button below textFormField when the user clicks on edit button in the ListTile. I am able to pass name and age data from database to TextFormField. But how do i bring up an update button in UI on clicking edit button?

class ScreenHome extends StatelessWidget {
  const ScreenHome({super.key});

  @override
  Widget build(BuildContext context) {
    getAllStudents();
    return Scaffold(
      body: SafeArea(
          child: Column(
        children: [
          AddStudentWidget(),
          const Expanded(child: ListStudentWidget())
        ],
      )),
    );
  }
}


TextEditingController nameController = TextEditingController();
TextEditingController ageController = TextEditingController();

class AddStudentWidget extends StatelessWidget {
  const AddStudentWidget({super.key});

  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: const EdgeInsets.all(10),
      child: Column(
        children: [
          TextFormField(
            controller: nameController,
            decoration: const InputDecoration(
              border: OutlineInputBorder(),
              hintText: 'Name',
            ),
          ),
          const SizedBox(
            height: 10,
          ),
          TextFormField(
            controller: ageController,
            decoration: const InputDecoration(
              border: OutlineInputBorder(),
              hintText: 'Age',
            ),
          ),
          const SizedBox(
            height: 10,
          ),
          Row(
            mainAxisAlignment: MainAxisAlignment.end,
            children: [
              ElevatedButton.icon(
                onPressed: () {
                  onAddStudentButtonClicked();
                },
                icon: const Icon(Icons.add),
                label: const Text('Add Student'),
              ),
              SizedBox(
                width: 20,
              ),
            ],
          )
        ],
      ),
    );
  }


class ListStudentWidget extends StatelessWidget {
  const ListStudentWidget({super.key});

  @override
  Widget build(BuildContext context) {
    return ValueListenableBuilder(
      valueListenable: studentListNotifier,
      builder:
          (BuildContext ctx, List<StudentModel> studentList, Widget? child) {
        return ListView.separated(
            itemBuilder: (ctx, index) {
              final data = studentList[index];
              return ListTile(
                title: Text(data.name),
                subtitle: Text(data.age),
                trailing: Row(
                  mainAxisAlignment: MainAxisAlignment.end,
                  mainAxisSize: MainAxisSize.min,
                  children: [
                    IconButton(
                      onPressed: () {
                        deleteStudent(data.id!);
                      },
                      icon: const Icon(Icons.delete),
                      color: Colors.red,
                    ),
                    IconButton(
                      onPressed: () {
                        editStudent(data.id!);
                      },
                      icon: const Icon(Icons.edit),
                      color: Colors.green,
                    ),
                  ],
                ),
              );
            },
            separatorBuilder: (ctx, index) {
              return const Divider(
                thickness: 2,
              );
            },
            itemCount: studentList.length);
      },
    );
  }
}

This is my expected output. When i click on edit button, a new update button needs to appear below textfield. Any leads would be greatly appreciated. Thanks you