FloatingButton in FloatingButtonGroup should have adaptable borders

[nimraahmed]

Bug Description

The borders of a FloatingButton inside a FloatingButtonGroup should change depending on its position.

(Note that in the documentation there's a problem because both buttons have the focus and there should only be one. Link to other issue : https://github.com/twentyhq/twenty/issues/3161)

Expected behavior

We need to copy the behavior of a FloatingIconButton in a FloatingIconButtonGroup, see FloatingIconButton.tsx

You can see that the button in the middle has different border-radius because its position is middle.

[Kanav-Arora]

Hi @nimraahmed Can I work on this?

[nimraahmed]

@charlesBochet

[BalanaguYashwanth]

Is anyone working on this ?

[charlesBochet]

@BalanaguYashwanth Nobody is working on it as far as I know! Please go ahead!

[charlesBochet]

See here to check the issue: https://docs.twenty.com/contributor/frontend/ui-components/input/button#floating-button-group

[BalanaguYashwanth]

Got it thanks

[a-kud]

can I take this one?

[BalanaguYashwanth]

You can go head @a-kud

[nimraahmed]

@charlesBochet is anyone working on this or can i take this up?

[charlesBochet]

@nimraahmed Not than I know about! Please go ahead :)

[a-kud]

I'm still working on it, can finish this week.

[charlesBochet]

Ok, thank you @a-kud!

@nimraahmed: @a-kud is already working on it :)

[lucasbordeau]

@a-kud I updated the issue to give you more context, could you please make according changes in your PR ?

[a-kud]

I have a high workload right now, feel free to work on this one.