Implement collapsible sidebar with smooth animation

[ntninja]

The connection indicator was moved to the right so that it always remains visible everything else is collapsed, when pressing the new menu button. A few places use slightly different spacing to making everything work.

Unfortunately, Chakra does not provide a “Horizontal Collapsible” component (only a vertical collapsible and an horizontal overlay drawer), so a DIY approach inspired by https://v2.chakra-ui.com/community/recipes/horizontal-collapse was needed by to implement this with nice animations.

Updates to React 18 + Chakra 2 + Framer-Motion 11, since animation support needs a newer Framer-Motion version which pulls in newer React which again is only supported by newer Chakra.

Fixes https://github.com/ekzhang/rustpad/issues/61

Based on #75, no real dependency through.

It looks pretty decent :slightly_smiling_face: