Fixes slow when import html on upgrade (#9689)

* Short-circuit the import option; only show it when you click a button

* Add aira-label

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>

* perf(import): lazy evaluate import options panel, shortcircuit when no options, and flatten let widgets

- Only parse $:/Import JSON when user expands the import options panel
- Skip all import option logic if no $:/tags/ImportOptions tiddlers exist
- Merge nested let widgets into single multi-variable let for better performance and readability
- Add lingo for import options panel and no-match message

This greatly improves import speed for large wikis, especially when no import options are present.

* fix(import): use correct transclusion for aria-label on import options panel buttons\n\nBind aria-label using {{$:/language/Import/Listing/ImportOptions/Caption}} instead of macro literal, matching TiddlyWiki convention and ensuring accessibility tools read the correct label.

---------

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>
This commit is contained in:
lin onetwo 2026-02-23 18:58:24 +08:00 committed by GitHub
parent 49faefcca5
commit b673651103
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 36 additions and 17 deletions

View file

@ -15,6 +15,8 @@ Listing/Preview/TextRaw: Text (Raw)
Listing/Preview/Fields: Fields
Listing/Preview/Diff: Diff
Listing/Preview/DiffFields: Diff (Fields)
Listing/ImportOptions/Caption: Import options
Listing/ImportOptions/NoMatch: No import options apply to these files.
Listing/Rename/Tooltip: Rename tiddler before importing
Listing/Rename/Prompt: Rename to:
Listing/Rename/ConfirmRename: Rename tiddler

View file

@ -49,23 +49,40 @@ title: $:/core/ui/ImportListing
\end
\whitespace trim
<$let importJson={{{ [{$:/Import}] }}}
importTitles={{{ [<importJson>jsonindexes[tiddlers]] }}}
importTypes={{{ [(importTitles)] :map[<importJson>jsonget[tiddlers],<currentTiddler>,[type]] }}}
anyMatch={{{ [all[shadows+tiddlers]tag[$:/tags/ImportOptions]get[condition]] :map[(importTypes)subfilter<currentTiddler>] +[!is[blank]limit[1]] }}}>
<%if [<anyMatch>!is[blank]] %>
<div class="tc-import-option">
<$list filter="[all[shadows+tiddlers]tag[$:/tags/ImportOptions]]" variable="importOption">
<$let condition={{{ [<importOption>get[condition]] }}}
hasMatch={{{ [(importTypes)subfilter<condition>limit[1]] }}}>
<%if [<hasMatch>!is[blank]] %>
<$transclude tiddler=<<importOption>>/>
<%endif%>
</$let>
</$list>
</div>
<%endif%>
</$let>
<%if [all[shadows+tiddlers]tag[$:/tags/ImportOptions]limit[1]] %>
<$reveal type="nomatch" state="$:/state/import/options" text="yes" tag="div">
<$button class="tc-btn-invisible tc-btn-dropdown" set="$:/state/import/options" setTo="yes" aria-label={{$:/language/Import/Listing/ImportOptions/Caption}} aria-expanded="false">
<span class="tc-small-gap-right">{{$:/core/images/right-arrow}}</span><<lingo Listing/ImportOptions/Caption>>
</$button>
</$reveal>
<$reveal type="match" state="$:/state/import/options" text="yes" tag="div">
<$button class="tc-btn-invisible tc-btn-dropdown" set="$:/state/import/options" setTo="no" aria-label={{$:/language/Import/Listing/ImportOptions/Caption}} aria-expanded="true">
<span class="tc-small-gap-right">{{$:/core/images/down-arrow}}</span><<lingo Listing/ImportOptions/Caption>>
</$button>
<$let importJson={{{ [{$:/Import}] }}}
importTitles={{{ [<importJson>jsonindexes[tiddlers]] }}}
importTypes={{{ [(importTitles)] :map[<importJson>jsonget[tiddlers],<currentTiddler>,[type]] }}}
anyMatch={{{ [all[shadows+tiddlers]tag[$:/tags/ImportOptions]get[condition]] :map[(importTypes)subfilter<currentTiddler>] +[!is[blank]limit[1]] }}}>
<%if [<anyMatch>!is[blank]] %>
<div class="tc-import-option">
<$list filter="[all[shadows+tiddlers]tag[$:/tags/ImportOptions]]" variable="importOption">
<$let condition={{{ [<importOption>get[condition]] }}}
hasMatch={{{ [(importTypes)subfilter<condition>limit[1]] }}}>
<%if [<hasMatch>!is[blank]] %>
<$transclude tiddler=<<importOption>>/>
<%endif%>
</$let>
</$list>
</div>
<%else%>
<div class="tc-import-option">
<<lingo Listing/ImportOptions/NoMatch>>
</div>
<%endif%>
</$let>
</$reveal>
<%endif%>
<div class="tc-table-wrapper">
<table class="tc-import-table">
<tbody>