Admin UI: per-tool expand/minimize ARROW, cards minimized by default (name-only), categories stay expanded

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01Q8t9GEyyLZbUQu26na1JQg
This commit is contained in:
2026-10-16 03:59:37 +00:00
parent 57ea63a817
commit ee3628e529
+20 -15
View File
@@ -26,7 +26,7 @@ function updateCards(form){
});
}
/* ---- Collapsible categories + per-card minimize. Default EXPANDED; collapse is opt-in. ---- */
/* ---- Categories (collapsible) + per-tool expand arrow (cards minimized by default) ---- */
var LSKEY='asktamMcpCatCollapsed';
function loadState(){try{return JSON.parse(localStorage.getItem(LSKEY)||'{}')||{};}catch(e){return {};}}
function saveState(m){try{localStorage.setItem(LSKEY,JSON.stringify(m));}catch(e){}}
@@ -44,10 +44,17 @@ function initCollapsibleTools(){
});
saveState(state);
}
function setAllCards(min){
form.querySelectorAll('.asktam-mcp-tool-card').forEach(function(card){
card.classList.toggle('is-min',min);
var b=card.querySelector('.asktam-mcp-card-min');
if(b){b.textContent=min?'▸':'▾';b.setAttribute('aria-label',min?'Expand tool':'Minimize tool');}
});
}
// Global expand / collapse controls
// Global controls: category expand/collapse + expand/minimize every tool card
var bulk=form.querySelector('.asktam-mcp-bulk-actions');
if(bulk && !bulk.querySelector('.asktam-mcp-expand-all')){
if(bulk && !bulk.querySelector('.asktam-mcp-collapse-tools')){
var wrap=document.createElement('span');
wrap.className='asktam-mcp-collapse-tools';
var exp=document.createElement('button');exp.type='button';exp.className='button asktam-mcp-expand-all';exp.textContent='Expand all';
@@ -55,8 +62,9 @@ function initCollapsibleTools(){
wrap.appendChild(exp);wrap.appendChild(col);
var save=bulk.querySelector('.asktam-mcp-bulk-save');
if(save)bulk.insertBefore(wrap,save);else bulk.appendChild(wrap);
exp.addEventListener('click',function(){setAll(false);});
col.addEventListener('click',function(){setAll(true);});
// Expand all = open every category AND open every tool card; Collapse all = reverse
exp.addEventListener('click',function(){setAll(false);setAllCards(false);});
col.addEventListener('click',function(){setAll(false);setAllCards(true);});
}
cats.forEach(function(cat){
@@ -69,7 +77,7 @@ function initCollapsibleTools(){
caret.textContent='▾';
header.insertBefore(caret,header.firstChild);
}
// Default EXPANDED; only collapse if the user previously collapsed this category.
// Categories default EXPANDED so the full tool list is visible.
var collapsed=(id in state)?!!state[id]:false;
cat.classList.toggle('is-collapsed',collapsed);
if(header && !header.dataset.collBound){
@@ -83,18 +91,20 @@ function initCollapsibleTools(){
}
});
// Per-card minimize (hides description + slug for that one tool)
// Per-tool arrow — each tool MINIMIZED by default (shows just the name). Arrow expands it.
form.querySelectorAll('.asktam-mcp-tool-card').forEach(function(card){
if(card.querySelector('.asktam-mcp-card-min'))return;
card.classList.add('is-min');
var b=document.createElement('button');
b.type='button';
b.className='asktam-mcp-card-min';
b.setAttribute('aria-label','Minimize tool');
b.textContent='–';
b.setAttribute('aria-label','Expand tool');
b.textContent='▸'; // right-pointing arrow = minimized
b.addEventListener('click',function(e){
e.preventDefault();e.stopPropagation(); // don't toggle the tool's checkbox
var min=card.classList.toggle('is-min');
b.textContent=min?'+':'–';
b.textContent=min?'▸':'▾'; // ▸ minimized / ▾ expanded
b.setAttribute('aria-label',min?'Expand tool':'Minimize tool');
});
card.appendChild(b);
});
@@ -129,31 +139,26 @@ function initConnectionConfigs(){
var configsDiv=document.getElementById('asktam-http-configs');
if(configsDiv)configsDiv.style.display='';
// claude.ai custom connector format
var claudeAiJson=JSON.stringify({
mcpServers:{wordpress:{url:endpoint,headers:{Authorization:bearer}}}
},null,2);
setBlock('asktam-claude-ai-code','asktam-claude-ai-copy',claudeAiJson);
// Claude Desktop claude_desktop_config.json
var desktopJson=JSON.stringify({
mcpServers:{wordpress:{url:endpoint,headers:{Authorization:bearer}}}
},null,2);
setBlock('asktam-desktop-code','asktam-desktop-copy',desktopJson);
// Cursor .cursor/mcp.json
var cursorJson=JSON.stringify({
mcpServers:{wordpress:{url:endpoint,headers:{Authorization:bearer}}}
},null,2);
setBlock('asktam-cursor-code','asktam-cursor-copy',cursorJson);
// Windsurf
var windsurfJson=JSON.stringify({
mcpServers:{wordpress:{serverUrl:endpoint,headers:{Authorization:bearer}}}
},null,2);
setBlock('asktam-windsurf-code','asktam-windsurf-copy',windsurfJson);
// npx mcp-remote
var remoteJson=JSON.stringify({
mcpServers:{wordpress:{command:'npx',args:['-y','mcp-remote',endpoint,'--header','Authorization: '+bearer]}}
},null,2);