feat: Bloc visualisation tooling

[alestiago]

Description

A tool that allows the conversion from a given state diagram to a bloc, and ideally, vice-versa (generate a diagram from a given bloc).

Desired Solution

An interface (as in human to computer interaction) that allows a given user to model a bloc via a state diagram and generate the appropriate code for it, and vice-versa.

Alternatives Considered

It is very open how this should be done. I don't know which interface would suit better. There are many possible options, for example, an IDE extension, a web similar to https://stately.ai/viz, a CLI, etc.

Additional Context

You might be asking "Why?"

It is usually a good idea to plan your code. Planning can range from a single line to a bunch of diagrams or more. Hence, one can also plan (drumroll please 🥁) blocs!

The planning strategy for a bloc can vary from one individual to another. Personally, I find that defining the initial state, states, and transitions are always a good way to start. Since blocs are very, very similar to state machines and are deeply inspired by automata theory, whilst planning I tend to draw some state diagrams.

For example the following (very simple and dummy) state diagram:

Could possibly translate to:

class FooBloc extends Bloc<FooEvent, FooState> {
  FooBloc() : super(FooInitialState()) {
    on<FooEvent>(_onFooEvent);
  }

  void _onFooEvent(FooEvent event, Emitter emit) {
    if (state is FooInitialState) {
      emit(FooFinalState());
    }
  }
}

class FooEvent {}

abstract class FooState {}

class FooInitialState extends FooState {}

class FooFinalState extends FooState {}

In addition, one could also examine a given bloc and produce a state diagram. Computer Scientists are very familiar with state diagrams and generating a state diagram from a given bloc can simplify (and accelerate) the process of comprehending a given bloc.

This might also allow for automation (or other cool stuff) in the feature.

[zs-dima]

Maybe could be nice to use some existing designer to describe StateMachine to generate BLoC code automatically ? For example https://github.com/SimpleStateMachine/SimpleStateMachineNodeEditor or any other

[alestiago]

This might be interesting for some followers of this issue: https://github.com/tamas-p/hisma/tree/master/packages/hisma