gitbutler
gitbutler copied to clipboard
gitbutlerapp
update navigation component to support collapsing and expanding
I updated the navigation pane on the left side of the app to allow it to be collapsed and expanded. I also refactored the DomainButton component to make it simpler to implement in both places.
I can make the suggested changes. Though most of the parts you have commented on I copied directly from the lane collapse code for the vbranches. So you may want to refractor that code too.
Sorry for the extra commits for formatting. I thought I had got the linter to pass but must have accidently undid the change or something.
Hey sorry for the delay, but great work! I've added some feedback. Would you mind having a look and then I'll try this out locally?
*edit: @PavelLaptev would you mind taking a look to see if we want to integrate this?
@KroniK907 Thank you for the PR! I like the idea. Before merging, I would like to tweak these design issues.
- The fold button is small, but it takes too much space in the sidebar. The focus on the button should be secondary or even tertiary.
- The button looks the same as the lane folding button.
- Traffic lights overlay the folded sidebar
- I would like to distinguish folded sidebar from the folded lane design.
I'll get on this ASAP :-)
Makes sense! I was also not sure about where exactly to place the button when the nav was open. I knew you would probably want to fit it into the design better.
Also on Linux I don't have the traffic light, so I didn't realize that would overlap on Mac.
Glad you are willing to consider the functionality though! Thanks!
@PavelLaptev would you like me to address @mtsgrd's comments or would you like to do that when you make your adjustments?
@KroniK907 let me update the design, and then you can refine the code 🙂. What do you think, does that make sense?
@KroniK907 can you please send a screenshot how the sidebar looks on Linux? if you don't have the traffic lights, you probably have this empty space here, right?
Yes, that is how it looks. I'm not at my desk but here is a short video that I posted a while back on discord for an unrelated issue that shows what the window looks like for me: https://cdn.discordapp.com/attachments/1073202153163857920/1209972011468591204/msrdc_2024-02-21_12-14-16.mp4?ex=65e8dd3f&is=65d6683f&hm=077e1850c57548a3e8732f1586fa24bf51d874b0a249d925ae520b5a6792d83d&
@KroniK907 I'm finished with my changes 🙂 We can proceed with other fixes
https://github.com/gitbutlerapp/gitbutler/assets/18498712/45067fb2-74a3-4437-906f-6b419617bd13
Changes I made:
- The folding button now appears when hovering over the sidebar.
- Updated the
ResizerUI. - Added a project icon to the selector so you can identify the project when the navigation is folded.
- Updated sidebar components, mostly styles.
- Implemented a check for the current OS to remove extra padding at the top.
@KroniK907 one thing I noticed is when I switch between projects, it doesn't remember the state and show the sidebar open again. And looks like after that, I need to click twice on the folding button in order to switch true to false and to true again.
https://github.com/gitbutlerapp/gitbutler/assets/18498712/40e68e04-e766-4173-b58f-7d6a16bd2d23
@KroniK907 thanks :-) Meanwhile I'll investigate how to add a hotkey for this and add the action to the menu bar.
Sorry for the delay, but this is great stuff. 🎉 I also love the attention to detail in e.g. how when you resize beyond min-width it switches state to collapsed.
I can make the suggested changes. Though most of the parts you have commented on I copied directly from the lane collapse code for the vbranches. So you may want to refractor that code too.
Thanks for flagging, I'll have a look. 🙏