Feat tab view #327
Feat tab view #327
Conversation
|
@animator please review |
|
The UI can be made better. It is not looking professional. |
|
Sure will work on it. |
|
How does this look? 
|
|
The line below the tabs is not looking good. |
|
|
Looks better .. but the goal is not to make it like chrome tabs (smaller & smaller), but more like VS Code tabs that do not shrink beyond a certain width (so that it does not hamper readability) & is scrollable. |
|
The mentioned issue is not merged with main yet. But ill keep that bar in ming and redesign accordingly. Thanks for the clarity of design implementation. |
|
VS code has an Edgy and sharp look which conflicts with the current app curved designs. |
|
@yashas-hm Only the protocol selection dropdown is not merged. The top bar containing the name of the request and the button to rename it is already in the main branch. |
|
You are not suggested to copy the exact design of VS Code tabs .. You should take a look at it as to how it functions and adapt it to our design. |
|
I had removed that for testing purposes. Will include the rename button besides the tab as having a separate column below the tab view doesn't look good with the name of the request coming multiple times. Also can the feature #307 be redesigned like the image below as it would be much better option to place the dropdown in request editor pane.
|
|
|
Will push changes once design finalised. |
|
Hi @yashas-hm! |
# Conflicts: # lib/consts.dart
Hi @mmjsmohit can the dropdown be shifted in the request editor pane? As when including the tab view the name of request coming multiple times would not look pleasing according to me. If @animator @ashitaprasad and you are ok with the double names under the tabview then I can Implement accordingly. Current: With topbar for protocol selection And I am proposing something like this: |
|
Since the type of protocol used alters the rest of the UI, including that of the request and response pane, I think it is not appropriate to put it inside the request pane. |
|
Ok then will make the changes accordingly thanks. |
|
Final Design: 
|
|
How is it looking on Windows .. We have the minimize maximize and close buttons on the top right. |
|
I have a Mac Silicon so not able to run Windows as a VM but will get a friend to test and will send the screenshot. |
|
Windows
|
|
The padding at the top above the tabs is not looking good. |
|
I have added the top padding to collection panel too for windows before it was not there only in mac. We can add name of the app (APIDash and logo in the top space so that it is not empty., most desktop apps have that. Else the tabs will be merged with the action buttons on top in windows. |
|
Windows: MacOS: |
# Conflicts: # lib/consts.dart # lib/screens/dashboard.dart # lib/screens/home_page/collection_pane.dart # lib/screens/home_page/editor_pane/editor_pane.dart # lib/screens/home_page/editor_pane/editor_request.dart # lib/screens/home_page/editor_pane/url_card.dart # lib/screens/home_page/home_page.dart # lib/screens/settings_page.dart # lib/services/hive_services.dart # lib/widgets/card_sidebar_request.dart # pubspec.lock
PR Description
Tab View implementation for requests
Related Issues
Checklist
mainbranch before making this PRflutter test) and all tests are passingAdded/updated tests?
Screen.Recording.2024-03-20.at.12.58.40.AM.mov