sidebar: restore jey buttons under Frappe v16
v16 removed the .collapse-sidebar-link anchor the Full Width / Switch Theme buttons inserted before, so they silently stopped rendering. Add a jeySidebarAnchor() helper that falls back to .body-sidebar-bottom, and re-add a Collapse/Expand button (calls frappe.app.sidebar.toggle_width) to replace the default v15 link Frappe dropped. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
parent
953bf8b2c8
commit
fe9dc89eb6
|
|
@ -254,7 +254,8 @@ input.list-header-checkbox:checked::after {
|
|||
========================================================================== */
|
||||
|
||||
.jey-fullwidth-link,
|
||||
.jey-theme-switch-link {
|
||||
.jey-theme-switch-link,
|
||||
.jey-collapse-link {
|
||||
text-decoration: none;
|
||||
font-size: var(--text-sm);
|
||||
display: flex;
|
||||
|
|
@ -264,13 +265,15 @@ input.list-header-checkbox:checked::after {
|
|||
}
|
||||
|
||||
.jey-fullwidth-link svg,
|
||||
.jey-theme-switch-link svg {
|
||||
.jey-theme-switch-link svg,
|
||||
.jey-collapse-link svg {
|
||||
margin: 0;
|
||||
flex: 0 0 auto;
|
||||
}
|
||||
|
||||
.jey-fullwidth-link span,
|
||||
.jey-theme-switch-link span {
|
||||
.jey-theme-switch-link span,
|
||||
.jey-collapse-link span {
|
||||
margin-left: 10px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
|
|
|
|||
|
|
@ -651,9 +651,20 @@
|
|||
(function () {
|
||||
"use strict";
|
||||
|
||||
// Frappe v15 had a "Collapse" link we inserted before; v16 removed it.
|
||||
// Fall back to body-sidebar-bottom as the parent in v16.
|
||||
window.jeySidebarAnchor = window.jeySidebarAnchor || function () {
|
||||
var v15 = document.querySelector(".collapse-sidebar-link");
|
||||
if (v15) return { parent: v15.parentNode, before: v15 };
|
||||
var bottom = document.querySelector(".body-sidebar .body-sidebar-bottom");
|
||||
if (bottom) return { parent: bottom, before: bottom.firstChild };
|
||||
return null;
|
||||
};
|
||||
|
||||
function addFullWidthButton() {
|
||||
var collapse = document.querySelector(".collapse-sidebar-link");
|
||||
if (!collapse || document.querySelector(".jey-fullwidth-link")) return;
|
||||
if (document.querySelector(".jey-fullwidth-link")) return;
|
||||
var anchor = window.jeySidebarAnchor();
|
||||
if (!anchor) return;
|
||||
|
||||
var link = document.createElement("a");
|
||||
link.className = "jey-fullwidth-link";
|
||||
|
|
@ -670,7 +681,7 @@
|
|||
});
|
||||
|
||||
updateIcon();
|
||||
collapse.parentNode.insertBefore(link, collapse);
|
||||
anchor.parent.insertBefore(link, anchor.before);
|
||||
}
|
||||
|
||||
$(document).ready(addFullWidthButton);
|
||||
|
|
@ -685,8 +696,9 @@
|
|||
"use strict";
|
||||
|
||||
function addThemeSwitchButton() {
|
||||
var collapse = document.querySelector(".collapse-sidebar-link");
|
||||
if (!collapse || document.querySelector(".jey-theme-switch-link")) return;
|
||||
if (document.querySelector(".jey-theme-switch-link")) return;
|
||||
var anchor = window.jeySidebarAnchor && window.jeySidebarAnchor();
|
||||
if (!anchor) return;
|
||||
|
||||
var link = document.createElement("a");
|
||||
link.className = "jey-theme-switch-link";
|
||||
|
|
@ -698,13 +710,64 @@
|
|||
new frappe.ui.ThemeSwitcher().show();
|
||||
});
|
||||
|
||||
collapse.parentNode.insertBefore(link, collapse);
|
||||
anchor.parent.insertBefore(link, anchor.before);
|
||||
}
|
||||
|
||||
$(document).ready(addThemeSwitchButton);
|
||||
$(document).on("page-change", addThemeSwitchButton);
|
||||
})();
|
||||
|
||||
/* ==========================================================================
|
||||
Collapse / Expand Sidebar button (restored; v16 removed the default)
|
||||
========================================================================== */
|
||||
|
||||
(function () {
|
||||
"use strict";
|
||||
|
||||
function isExpanded() {
|
||||
var c = document.querySelector(".body-sidebar-container");
|
||||
return !!(c && c.classList.contains("expanded"));
|
||||
}
|
||||
|
||||
function render(link) {
|
||||
var expanded = isExpanded();
|
||||
var iconName = expanded ? "chevrons-left" : "chevrons-right";
|
||||
var label = expanded ? __("Collapse Sidebar") : __("Expand Sidebar");
|
||||
link.innerHTML =
|
||||
frappe.utils.icon(iconName, "sm", "", "", "text-ink-gray-7 current-color", true) +
|
||||
"<span>" + label + "</span>";
|
||||
}
|
||||
|
||||
function addCollapseButton() {
|
||||
if (document.querySelector(".jey-collapse-link")) return;
|
||||
var anchor = window.jeySidebarAnchor && window.jeySidebarAnchor();
|
||||
if (!anchor) return;
|
||||
|
||||
var link = document.createElement("a");
|
||||
link.className = "jey-collapse-link";
|
||||
render(link);
|
||||
|
||||
link.addEventListener("click", function () {
|
||||
if (frappe.app && frappe.app.sidebar && frappe.app.sidebar.toggle_width) {
|
||||
frappe.app.sidebar.toggle_width();
|
||||
}
|
||||
// toggle_width updates class synchronously; re-render
|
||||
render(link);
|
||||
});
|
||||
|
||||
anchor.parent.insertBefore(link, anchor.before);
|
||||
|
||||
// Keep label in sync if sidebar state changes elsewhere
|
||||
$(document).off("sidebar-expand.jey-collapse").on("sidebar-expand.jey-collapse", function () {
|
||||
var el = document.querySelector(".jey-collapse-link");
|
||||
if (el) render(el);
|
||||
});
|
||||
}
|
||||
|
||||
$(document).ready(addCollapseButton);
|
||||
$(document).on("page-change", addCollapseButton);
|
||||
})();
|
||||
|
||||
/* ==========================================================================
|
||||
Hide "Website" item from sidebar user dropdown
|
||||
========================================================================== */
|
||||
|
|
|
|||
Loading…
Reference in New Issue