[Feature Request] Display plugins by categories / Filter for Plugins

There is a GSOC project about it, so I think there is good change of this being implemented(I am also interested in it :grin:).

I like this, but I don't think we should have something like toggle button, rather we may have just one small element. It would be cleaner, I think.

Yeah! Sounds good.

I like the idea, but not sure about it, maybe we can have top 25-35 plugins. I had this idea of having a certain download count to get into this, but I think the list will keep growing.

If we are not going to show all plugins, I think we can decide a certain period for this, like showing all the plugins from last '1 month'.

Sure! I am on it.

1 Like

Although I agree with this, but I think we should first implement only one filter at a time. And after that if we get requests from user then we can extend it. What do you think?


I have created 2 UI mock-ups with different sort button.

The line dividing the categories sections doesn't look great in mock-up, but will be improved while implementing this.

Let me know your thoughts on this.

Fair enough. Actually, now that we have the various sort options I don't think it's as necessary to do more than one filter at a time.

I think it's looking pretty great overall! I'm leaning toward the drop down menu because I struggle with identifying what the icons represent and I don't like having to cycle through multiple options to get to what I want. It's true though that the icons are more consistent with existing UI. I'd be fine with either one. Lets see what others think.

1 Like

Hey guys, It would be great if anyone can give feedback on this (links can be found below):
We are deciding on how the sort button should look with the filtering option.

I thought I should make it more simple to review and provide feedback on UI mock-ups for sort menu, so I am attaching 2 videos for it. View them in Full Screen for better clarity

  1. Sort button as icon (similar to note list sorting button):

  2. Sorting as a drop-down menu:

Feel free to give any suggestions.

I find the sorting with the icon good, because it matches the sorting in the notes in joplin.
Only a tool tip would be good, what the icon represents.

Sure! I will add it.

@shbach
I think we are now clear on what and how filtering should be done. To summarize it:

  • We are implementing filtering for plugins with 'filter icon button combined with menu items' + 'sorting icon(like we have in note list)'
  • For now we will be supporting only one filter at a time which can be sorted with, for example name, release date.
  • We will be removing the "Manage your plugins" label before the current 'cog' icon

How it will look from user's perspective:

A UI mock-up for this can be found here :point_down:(expand this to view the mock-up):

  1. User first opens plugins sections in Settings, installed plugins are shown by default.
  2. If search bar is used then it will search all the plugins including remote ones.
  3. If user select some category then it will show all the plugins in that category including remote ones.
  4. Selected category name will be shown in 'Search Bar' either in text or like we do it when adding tags
  5. Only After selecting the category, we will allow the sorting as it's done in VS Code. Sorting icons will include a tool-tip.
  6. If user selects another category when a category is already is applied, then the latest one will replace it.
  7. And then if user wants to see the installed plugins, user can select the "Installed" category and sort it or just remove any existing category, and it will be the same as Step 1.

If we are on agreement on the above points, I will start implementing this.

2 Likes

Sounds good to me. I look forward to seeing it implemented.

1 Like

Hey @JackGruber, wanted to tell you that we now have a good idea of how this should be implemented, and I have started working on this.

@Daeraxa As we discussed earlier, I know that you wanted to see some parts implemented differently, but I hope you will like this way also.

The summary for this can be found in post below :point_down:

Thanks all for your suggestions!

1 Like

Thanks for creating the spec. As you mentioned on Discord, filtering and sorting should be two different pull requests, each with their own separate spec. Filtering first.

Rather than an icon for filtering, a real dropdown list would be better because it would show the category name.

By the way, you should really look at existing wireframing tools to create mock UIs, because it seems you're implementing the feature directly and create videos. That's needlessly time consuming and prevents you from tweaking the wireframe over time. A few images are better than a video.

Thanks, Laurent, for taking a look.

Sure! I will implement it as dropdown list then.

This is actually done in Figma. I shared the videos because the links may take some time to load. Here are the links:

  1. Sort button as an icon
  2. Sorting with drop down menu
1 Like

Oh ok, I missed that, those are very realistic! In general a low fidelity wireframe like this is sufficient when we just want to discuss the functionalities. It also makes it easier to quickly change things, then later you can create a high fidelity one like you've done (sometimes you can even skip this part for simple changes).

2 Likes

I will remember this from now on. It will simplify the process, as creating these UI mock-ups did take some time.

I thought I should share a preview of what has been implemented so far. I have implemented the drop-down list as a separate component rather than 'Settings option' as I don't think we need to store the filter value in a database or file.

Furthermore, I was thinking of adding a button to clear the applied filter and on clicking it we will display 'Installed' plugins. This will be placed right after the drop-down list.
Now I have to just implement enabled/disabled filter and of course the tests. I know that line separator doesn't look great, I have just added it for demo purpose and will improve it.

Let me know what do you think.

5 Likes

Nice.
What is the default filter when you go on to the page? Installed plugins?
Wouldn't it be better to show all plugins when you go onto the page and set no filter or all as default?
I find it bad when I search for plugins and have to switch from installed to something else.

Thanks JackGruber,

The "Installed" is not the default filter. We decided to show installed plugins by default, same as we do now, without any filter. And to search in "Installed" you will need to apply that filter. So there is no default filter.

If you used search bar when no filter is selected, then it will search through all the plugins.

1 Like

Hey guys,
Do you think when searching in "Installed" category, you should be able to enable/disable plugins? Because from current behaviour after searching for plugins, we cannot enable/disable them.

I think no matter the filter, any extensions that show up and are installed should have the option to enable/disable/uninstall from that view.

2 Likes

Yes, I think this would be important!

Experimenting with plugins, I noticed that there are conflicts between several plugins. It is very bothersome to manually turn on/off each plugin to detect which plugin setting causes the conflict.

I would like to have a setting to turn on or off all plugins. Furthermore, a setting where I could collect all plugins I am using every day in order to switch between turn off all and turn on just my preferred plugins.

1 Like