Command palette plugin v1.0 , powerful context search bar, search under filter, etc

[linonetwo]

Demo: 命令菜单 — 搜索条目文本，以及执行太微中的命令。美观大方的多合一搜索框和快捷指令中心。
Github: GitHub - tiddly-gittly/tw-command-palette: Command palette Chinese translated
CPL: TW-CPL — 太微插件聚合中心

This plugin references the design of Souk21/TW-commandpalette, thanks to him for making the first version! This plugin upgrades and is written with TypeScript and algolia/autocomplete, make it much more powerful and friendly to developers to extend its functionality.

Use ctrl+P to open it, and search your titles and texts.

Or Use ctrl+tab to switch between recently used tiddlers

Hold ctrl, and press tab again to go down, like in the browser or VSCode.

use ctrl+shift+P to open commands list (or by adding prefix $)

You can search tiddlers with tags like $:/tags/Actions $:/tags/Messages and execute them. Add your tiddlers with these tags to show them in the list. Some example commands:

caption: <<lingo ShowControlPanel $:/plugins/linonetwo/commandpalette/language/>>
tags: $:/tags/Actions
title: $:/plugins/linonetwo/commandpalette/Show Control Panel

<$action-navigate $to="$:/ControlPanel"/>

tags: $:/tags/Messages
caption: {{$:/language/Buttons/Edit/Caption}}
description: {{$:/language/Buttons/Edit/Hint}}
title: $:/plugins/linonetwo/commandpalette/Edit Tiddler

tm-edit-tiddler

use ctrl+P to open, and prefix with [ to use filters

Tiddlers with tag $:/tags/Filter will show here. Including those from the tw core:

title: $:/core/Filters/Drafts
tags: $:/tags/Filter
filter: [has[draft.of]sort[title]]
description: {{$:/language/Filters/Drafts}}

Search is a two-step process, first search for a preset filter or a customized filter, enter to confirm the selection; then continue to search in the filter results, enter to open the tiddler.

In the second step, only user tiddlers are searched by default, and system tiddlers can be included by adding a prefix to the system entry search.

use ctrl+P to open, and prefix with # to search tags

Simillar to filter feature above. Search tiddlers tagged with a certain tag.

prefix with ? to see usage

So you don’t need to read this post!

Translation

If you find some translation mission on your wiki (while it works on my demo site), drag the $:/core/macros/lingo from this site to your wiki: $:/core/macros/lingo , it is from feat: t macro and docs by linonetwo · Pull Request #7821 · Jermolene/TiddlyWiki5 · GitHub which is not yet merged into the core, but widely used in i18n plugins.

For Layout Developers

If you are writing a new layout, please add this to the layout, no empty line around {{$:/core/ui/CommandPaletteTemplate}}, so it is transcluded as inline mode, not block mode! And with <$navigator, it can be used as layout switcher, see How to navigate to a tiddler in default layout from a custom layout (when out of default layout widget tree) · Jermolene/TiddlyWiki5 · Discussion #8123 · GitHub .

<$navigator story="$:/StoryList" history="$:/HistoryList" openLinkFromInsideRiver={{$:/config/Navigation/openLinkFromInsideRiver}} openLinkFromOutsideRiver={{$:/config/Navigation/openLinkFromOutsideRiver}} relinkOnRename={{$:/config/RelinkOnRename}}>
  {{$:/core/ui/CommandPaletteTemplate}}

cc @BurningTreeC

[vilc]

This looks very promising, it’s great to see this plugin modernized. Especially the modularity of actions looks very practical.

Question: is there anything similar to the “search steps config” in $:/plugins/souk21/commandpalette/CommandPaletteSearchSteps? I mean the ability to define multiple arbitrary search steps with filter expressions.
In you plugin I see only the config for which fields to search in the first “title” step and in the second “text” search.

I have found a bug. Typing \ as the first character in the palette throws a RSOE:

Internal JavaScript Error

Well, this is embarrassing. It is recommended that you restart TiddlyWiki by refreshing your browser

Uncaught SyntaxError: Invalid regular expression: /\/: \ at end of pattern

[Mohammad]

Great plugin!
A minor comment: the width of inputbox is high especially when you work on large screens.

[linonetwo]

Although it still gets wider if you are using a larger screen, you can config the percentage on its config. The default is 80%.

Try searching $command , you will see you can search for the plugin’s config with it!

[linonetwo]

Do you mean “search under a filter”, search on result of a filter? You can add tiddler with tag $:/tags/Filter, this is very standard, as it is also used in the core. I think the old command palette plugin didn’t reuse many good standard from tw-core:

title: $:/core/Filters/Orphans
tags: $:/tags/Filter
filter: [all[orphans]sort[title]]
description: {{$:/language/Filters/Orphans}}

Don’t need to include [search[]] step in the filter, because command palette will append it.

[vilc]

I missed that, this is great. It’s not quite what I meant though. With what you show, I need to explicitly tyle [, then choose which of the ready filters I want to use, then type the query.

By modifying the search steps of original CP, I could have a couple of frequently used filters included in the basic search, in a chosen order, e.g.:

1. Title matches
2. Missing tiddlers with title match
3. “Synonym” matches: search in caption and a couple other fields where I store alternative names for a thing
4. “All” matches: search in all fields
5. System tiddler title matches, system tiddlers are excluded in previous matches
6. System tiddler all field matches

I have to admit, such a complex setup comes with a sometimes visible performance issues, especially when typing very quickly or deleting quickly with backspace long press.
But I could probably just as well live with your setup, merge some steps, and relegate others to the filters as you have shown.
The highlighting of non-title matches makes it a bit better too.

[linonetwo]

I can add a “search history” on the bottom when there is no query in the input. So frequently used filters can be chosen by Ctrl+P then ↑ (circle in the list to go to the bottom).

One advantage of this new CP is that it will run a filter on the background (nodejs) if possible, so the search will be smoother. Currently, it only supports the TidGi desktop, but I will add an HTTP-based background search on the client-server setup.

[vilc]

@linonetwo

I can add a “search history” on the bottom when there is no query in the input. So frequently used filters can be chosen by Ctrl+P then ↑ (circle in the list to go to the bottom).

I guess this could be helpful.

In general I think your setup is much better for most users wanting a good UI for the default search, with some added extras and easy configurability.
It’s just that I got used to some weird possibilities of original CP (which I have modified quite a bit, taking from some unmerged PRs and other modifications floating around), so it’s not that easy to immediately switch.

[Peter]

This is an awesome plugin. I appreciate reusing the Souk21/TW-commandpalette keyboard shortcuts (mine “just worked” when installing this plugin and uninstalling TW-commandpalette).

A few notes that would prevent me from using this day-to-day in my Wiki:

• Text appears to “outweigh” tiddler titles, even if I type the titles explicitly. It seems like - if I type the text of a tiddler title explicitly - that should win over instances where the title text appears in the tiddler body
• The appearance state and current text of the command palette seems to be saved into the Wiki. If I open the command palette, save the wiki, and open the HTML file in a new window, I see the command palette open. Its appearance state should probably all be in temporary tiddlers
• I can’t see the config text or the command palette “help” text in my color palette
• My Souk21/TW-commandpalette seems to suggest system tiddlers (perhaps I’ve modified the filter). I wish this would do the same (maybe I can configure it?)
• I got an RSOE by opening the Command Palette and resizing it down to mobile widths and back up again

I think this type of plugin will attract more users to TW. Thanks for making it!

[Souk21]

Congrats on the release!
I’ll take this opportunity to archive the Souk21/TW-commandpalette repo. With the new fork out and my limited time to maintain it (sorry for the slow responses to PRs and issues), it seems like the right time to do this!

[linonetwo]

@Peter

if I type the text of a tiddler title explicitly - that should win over instances where the title text appears in the tiddler body

There need to be a search score system to order them properly, sadly tw’s search[] operator can’t handle this, so the only solution may be add a config that put the entire title search result on the top, but can’t smart mix them. I may add a smart search sub plugin for it.

@Peter

Its appearance state should probably all be in temporary tiddlers

That’s true, I’m using nodejs wiki so state tiddler is not a problem. Update in next release.

@Peter

can’t see the config text

See the Translation part of post above Command palette plugin v1.0 , powerful context search bar, search under filter, etc

@Peter

suggest system tiddlers

Try add $ prefix to search system tiddlers, at least some of them.

[linonetwo]

@Souk21

I’ll take this opportunity to archive the Souk21/TW-commandpalette repo

Your code accompany my wiki for nearly 3 years, thanks for your good work!

I also discover the power of actionString when revisit it. I haven’t notice it before, but I think it will be a powerful tool for LLM era.
So I acturally learn many thing from it. I’m going to play with command palette + AI actionString for a while. Use http request message action widget for LLM AI, anyone tried this before?

[Peter]

Thanks for updating the plugin! The state tiddlers work great.

I’m still having trouble with translations after installing the lingo macro into my Wiki (a 5.3.3 single-file wiki). I can check the demo page for what each option does, which is just fine.

I’ll switch to this to give you more feedback on the plugin. I really like more of these modern PKM features finding their way into TiddlyWiki - thank you for making them. A few more things I noticed:

1. The plugin lets you hide the search bar entirely, but then you can’t open the command palette on Mobile. Maybe including a “Tool” button to do this would be handy?
2. It takes three presses of the escape key to close the search popup when I have a query in it. It should (ideally) dismiss after one press
3. I wish I could set the width to be a px level. I use a large display, and the command palette is uncomfortably wide and not centered

Thanks again for this plugin (and thanks @Souk21 for the awesome original CommandPalette, too - I have used it daily for some time).

[Peter]

The plugin lets you hide the search bar entirely, but then you can’t open the command palette on Mobile. Maybe including a “Tool” button to do this would be handy?

This is already installed with the plugin, my mistake

[linonetwo]

@Peter

still having trouble with translations after installing the lingo macro into my Wiki

I believe it will be merged in 5.3.4. Hope it is not a big deal if it doesn’t work in these months.

@Peter

Mobile

There is a bug that make items not clickable, need to fix this before everything else.

And there is a page control button you can enable, after mobile issue is fixed, it will be useful.

@Peter

width to be a px level

I will take the time to add it! Also the escape key. After I play with the ability to invoke AI with command palette.

[oeyoews]

I looked at the documentation of autocomplete.js again, and it seems to be very customizable.

[linonetwo]

Yes, it is easy to use, so the most of the work is about calling tiddlywiki’s actionString, message, and search for things like layouts.

[Ittayd]

Looks great! Not being able to select by clicking the mouse is a big disadvantage for me.

[linonetwo]

It is now clickable, with some workaround, until Why it close when click by mouse or touch, without triggering onSelect or nevigate? · algolia/autocomplete · Discussion #1255 · GitHub is answered by someone.

There are also some new configs in control panel.

[etardiff]

As a long-time user of @Souk21’s original command palette, I really want to like your updated version— and I do like the improved configuration possibilities, and it feels significantly faster in my large wiki! But it does not seem designed for easy searching with custom filters, and that’s really holding me back from adopting it, because that’s one of my most common uses. To demonstrate:

If I type a custom filter, I expect to see it at the very top of the filter list. (Ideally, I could disable the built-in filter list entirely, or cut it down to ones I’ll actually use.) As you can see, the filter I typed isn’t even on screen at the moment, which means I need to navigate to it before I can use it—and this is especially problematic when I can’t click on it in the list. I should be able to type a filter, hit enter, and immediately see its results, rather than having to scroll through a bunch of filters I don’t want.

And when I do apply a filter, there’s no easy way to get back to the “default” view. If I want to search with a different filter (or none at all), I have to escape and reopen the command palette. My intuition is that hitting “backspace” in the empty search field should take me back to the non-filtered view.

I also wish it was easier to modify the widget CSS, since the current style doesn’t mesh very well with my wikis. (Ideally, it would make use of the core <<colour>> macros and the current palette values.) But I can edit a CSS tiddler myself, so this is a dream, not at all a priority.

I hope you can address these issues! I’d like to upgrade to your new and improved version, especially if @Souk21 no longer intends to update the original.