ui(compact-bar): mode indicator not centered

[cristiand391]

2. Issues with the Zellij UI / behavior / crash

Issue description

I noticed the mode indicator isn't correctly centered when the mode name length > 6, you can see in this video how when switching to renametab/renamepane the text isn't padded (IIRC it's not noticeable on the left side because the Zellij (session-name) section includes a whitespace).
Screencast from 04-06-2024 05:32:06 PM.webm

This is how I improved the padding in my fork of compact-bar, you can see the mode name is always centered (even short ones like pane):
Screencast from 04-06-2024 05:44:54 PM.webm

cristiand391/zj-status-bar@2de3d60

If the current padding behavior in zellij's compact-bar isn't the intended and the maintainer agrees, I'm happy to contribute the fix upstream.

Minimal reproduction

save this as layout

layout {
  pane size=1 borderless=true {
    plugin location="zellij:compact-bar"
  }
  pane
}

switch to renametab or any mode name > 6:

zellij action switch-mode renametab

Other relevant information

zellij --version
zellij 0.39.2

stty size
35 159

[Zykino]

Love that fix, looks elegant to me. Not sure what maintainers would think of it.

Edit: Just thinking about it, another/easier fix would be: let mode_part_padded = format!(" {} ", mode_part); isn’t it?

[cristiand391]

Just thinking about it, another/easier fix would be: let mode_part_padded = format!(" {} ", mode_part); isn’t it?

ha, yes that should work too, good catch. I probably went with the aligment solution because I read that was a thing in the docs 😄
https://doc.rust-lang.org/std/fmt/index.html#fillalignment

[Zykino]

Yup, and the starting code you had was like this, so I think I would have done the same at first too ^^.

[jaeheonji]

@cristiand391

That's great!, I love it too. It seems like your code can cover a variety of cases considering the two empty paddings. If possible, can you make a PR?

[cristiand391]

@jaeheonji
Here it is: #3260
with @Zykino's suggestion to just use whitespaces instead of dynamic alignment :)