fix(ui): cleanup workspace edit buttons

This commit is contained in:
Rushabh Mehta 2024-07-29 18:56:13 +05:30
parent 5a2c2a3250
commit e19dce1fe0
2 changed files with 50 additions and 40 deletions

View file

@ -59,6 +59,7 @@ frappe.views.Workspace = class Workspace {
`).appendTo(this.wrapper.find(".layout-side-section"));
this.sidebar = list_sidebar.find(".desk-sidebar");
this.body = this.wrapper.find(".layout-main-section");
this.prepare_new_and_edit();
}
async setup_pages(reload) {
@ -90,6 +91,46 @@ frappe.views.Workspace = class Workspace {
}
}
prepare_new_and_edit() {
this.$page = $(`
<div class="editor-js-container"></div>
<div class="workspace-footer">
<button data-label="New" class="btn btn-default ellipsis btn-new-workspace">
<svg class="es-icon es-line icon-xs" style="" aria-hidden="true">
<use class="" href="#es-line-add"></use>
</svg>
<span class="hidden-xs" data-label="Edit">New</span>
</button>
<button class="btn btn-default btn-sm mr-2 btn-edit-workspace" data-label="Edit">
<svg class="es-icon es-line icon-xs" style="" aria-hidden="true">
<use class="" href="#es-line-edit"></use>
</svg>
<span class="hidden-xs" data-label="Edit">
<span><span class="alt-underline">E</span>dit</span>
</span>
</button>
</div>
`).appendTo(this.body);
this.body.find(".btn-new-workspace").on("click", () => {
this.initialize_new_page(true);
});
this.body.find(".btn-edit-workspace").on("click", async () => {
if (!this.editor || !this.editor.readOnly) return;
this.is_read_only = false;
this.toggle_hidden_workspaces(true);
await this.editor.readOnly.toggle();
this.editor.isReady.then(() => {
this.body.addClass("edit-mode");
this.initialize_editorjs_undo();
this.setup_customization_buttons(this._page);
this.show_sidebar_actions();
this.make_blocks_sortable();
});
});
}
get_pages() {
return frappe.xcall("frappe.desk.desktop.get_workspace_sidebar_items");
}
@ -379,25 +420,9 @@ frappe.views.Workspace = class Workspace {
async show_page(page) {
if (!this.body.find("#editorjs")[0]) {
this.$page = $(`
$(`
<div id="editorjs" class="desk-page page-main-content"></div>
<div class="workspace-footer">
<button data-label="New" class="btn btn-default ellipsis btn-new-workspace">
<svg class="es-icon es-line icon-xs" style="" aria-hidden="true">
<use class="" href="#es-line-add"></use>
</svg>
<span class="hidden-xs" data-label="Edit">New</span>
</button>
<button class="btn btn-default btn-sm mr-2 btn-edit-workspace" data-label="Edit">
<svg class="es-icon es-line icon-xs" style="" aria-hidden="true">
<use class="" href="#es-line-edit"></use>
</svg>
<span class="hidden-xs" data-label="Edit">
<span><span class="alt-underline">E</span>dit</span>
</span>
</button>
</div>
`).appendTo(this.body);
`).appendTo(this.body.find(".editor-js-container"));
}
if (this.all_pages.length) {
@ -406,6 +431,7 @@ frappe.views.Workspace = class Workspace {
let pages =
page.public && this.public_pages.length ? this.public_pages : this.private_pages;
let current_page = pages.filter((p) => p.title == page.name)[0];
this._page = current_page;
this.content = current_page && JSON.parse(current_page.content);
this.content && this.add_custom_cards_in_content();
@ -472,33 +498,13 @@ frappe.views.Workspace = class Workspace {
this.clear_page_actions();
if (current_page.is_editable) {
this.body
.find(".btn-edit-workspace")
.removeClass("hide")
.on("click", async () => {
if (!this.editor || !this.editor.readOnly) return;
this.is_read_only = false;
this.toggle_hidden_workspaces(true);
await this.editor.readOnly.toggle();
this.editor.isReady.then(() => {
this.body.addClass("edit-mode");
this.initialize_editorjs_undo();
this.setup_customization_buttons(current_page);
this.show_sidebar_actions();
this.make_blocks_sortable();
});
});
this.body.find(".btn-edit-workspace").removeClass("hide");
} else {
this.body.find(".btn-edit-workspace").addClass("hide");
}
// need to add option for icons in inner buttons as well
if (this.has_create_access) {
this.body
.find(".btn-new-workspace")
.removeClass("hide")
.on("click", () => {
this.initialize_new_page(true);
});
this.body.find(".btn-new-workspace").removeClass("hide");
} else {
this.body.find(".btn-new-workspace").addClass("hide");
}

View file

@ -994,6 +994,10 @@ body {
.links-widget-box {
background-color: var(--bg-color) !important;
}
.workspace-footer {
display: none;
}
}
}