Import 'package:flutter_hooks/flutter_hooks.dart' It's made of a List history as well as an index for the current position in history.īasic class for our Quotes, made of uid, text, author, and year.įull source code import 'package:flutter/material.dart' This is the State Model of our pendingQuoteProvider. You will also see that, inside our PendingQuoteNotifier, I debounce the changes for 500 milliseconds to decrease the number of states in the quote history. It even keeps the tracked changes even when you navigate from one quote to other quotes and back. This is a family StateNotifierProvider (check here for more info on family providers), it makes it easy and simple to track changes per quote.

The undo and redo buttons also display the number of undo and redo available. This Widget provides three buttons to trigger undo / reset and redo on our `pendingQuoteProvider. Before (re)building the form, we check if the quote was changed (this happens after a undo/reset/redo) and if so, we reset the values (and cursor position) of the fields that changed. This form is used to modify the selected quote. Very basic display of the selected Quote. but, here are a few important highlights: Structure of the solution:Ī MaterialApp encapsulated inside a Riverpod ProviderScopeĪ HookWidget maintaining the global state: uid of the selected quote and editing, whether or not we display the Form. You'll find the full source code at the end of this post. Easy Debounce, to denounce the history of changes.

Flutter Hooks, as an alternative to StatefulWidgets.

Here is a draft implementation of such a feature. Or, you may just try to implement the feature in your own project and fine-tune it to your specific requirements.

You may have a look at undo or replay_bloc packages.

Reset vs redo quote