refactor: move general configuration tab to configuration window first

[anwarulislam]

This PR reorders the tabs in the configuration window to prioritize the "General" tab.

Motivation:

The "General" tab contains core settings that are fundamental to the application's behavior. It's typically the most frequently accessed tab, making it logical to place it first for ease of navigation and user experience.

Changes:

• The "General" tab is now the first tab displayed in the configuration window.
• The order of other tabs remains unchanged.

Benefits:

• Improved user experience by placing the most frequently used tab first.
• Increased clarity and intuitiveness of the configuration window.
• More streamlined workflow for users configuring the application.

This change contributes to a more user-friendly and efficient configuration experience.

[borgmanJeremy]

@mmahmoudian I am fine with this, did you have thoughts on it?

[mmahmoudian]

@borgmanJeremy I agree with the sentiment and motivation, but here are my [minor] concerns:

1. The General tab is very busy (high information density) and a new user "spawning" in that tab might make them uncomfortable
2. The Interface tab is the most aesthetically appealing one due to spacious design and colors
3. The Interface tab contains the most basic settings one might care about (the buttons to see and their colors), but the General tab is more detail-oriented

Considering that the logic make sense to me, I suggest merging this for now and revamp the General tab later. What do you think?

---

More elaboration

I like the idea of having the general tab first because I believe users would rarely change the settings in the Interface tab, but they would more frequently change the settings in the General tab. But we should perhaps later think about re-designing the General tab to make it less of a mess, especially for new users.

For instance I think we can create sub-tabs inside the General for different types of options (similar to what we have for the Interface tab). For example I quickly grabbed the visible view or my settings and color coded them:

UI/UX : Green
Clipboard: Blue
File: Maroon
Application related: Yellow

If you think this is a viable approach, I can spend more time on this and try to come up with proper categories and suggest them in a feature request.

[anwarulislam]

@mmahmoudian Thank you for sharing your thoughts!

I appreciate your insights regarding the General and Interface tabs. I agree that the General tab currently has a high information density, which could be overwhelming for new users.

Moving less frequently changed settings to an Advanced tab (we can create a new one later on) could help streamline the General tab, making it more user-friendly. This way, the most commonly adjusted settings remain easily accessible, while the more detailed options are tucked away for those who need them.

I also like your idea of color-coding sections within the General tab to enhance clarity. However, we should be cautious about adding too much visual clutter, as it might detract from the user experience.

[borgmanJeremy]

@anwarulislam Do you want me to merge as is, or do you want to do further refactoring of the settings page. If you want me to merge as is could you please rebase on master to get the CI to run?

[anwarulislam]

@borgmanJeremy, I think we can go ahead and merge this as it stands for now. We can consider the advanced tab later since it would introduce more discussions and changes to the codebase, which could delay our decision. I would love to contribute to that part as well, but I think it would be better to do it in a separate PR.

[borgmanJeremy]

Sounds good, once you push the rebase it should kick of CI.

[anwarulislam]

@borgmanJeremy, I accidentally pressed the GitHub sync button on the branch where I made the changes. That's why it merged, not rebased. Hope it's not a big deal, right?

[borgmanJeremy]

All good, looks like the code format check failed, I expect everything else to pass.

[mmahmoudian]

@anwarulislam

I also like your idea of color-coding sections within the General tab to enhance clarity. However, we should be cautious about adding too much visual clutter, as it might detract from the user experience.

The color-coding in the screenshot was to illustrate what are related. I was not suggesting to have color-coding in the actual config window.

We can consider the advanced tab later since it would introduce more discussions and changes to the codebase, which could delay our decision.

I also second this.

Thanks for the PR 👍