How do you show and control multiple chatheads

[TaimoorHassan]

i am actually trying to build a chat app and can't seem to get multiple chatheads working. The first chathead works as expected but the one after don't

// i have a list of floatyHeads
final List<FloatyHead> allHeads = [];

 if (allHeads.length <= 2) {
              var f = FloatyHead();

              /// the method [updateFloatyHeadContent] comes from floatyHead itself.
              /// it allows customization of the Floating View at runtime.
              await f.updateFloatyHeadContent(
            // This is a custom implementation of header arguments. it works as expected
                header: HeaderWithButtons([
                  HeaderButton('${allHeads.length} ' + 'Open App', 'click'),
                  HeaderButton('${allHeads.length} ' + "I\'ll get back to you in 5", 'new'),
                  HeaderButton('${allHeads.length} ' + 'Close icon', 'close'),
                ],
        ),
              );
              f.setIcon('assets/${allHeads.length + 1}.jpeg');
              // opens the Floating View/Bubble also asks for permission on first execution.
              f.openBubble();
              allHeads.add(f);
}

[Chris-Benn]

Hello, Any idea how to pass a function to the floaty head buttons