-
diff --git a/frappe/public/js/frappe/list/list_sidebar.js b/frappe/public/js/frappe/list/list_sidebar.js index 5b92119807..28c6eaab0b 100644 --- a/frappe/public/js/frappe/list/list_sidebar.js +++ b/frappe/public/js/frappe/list/list_sidebar.js @@ -183,7 +183,8 @@ frappe.views.ListSidebar = class ListSidebar { filters: (me.list_view.filter_area ? me.list_view.get_filters_for_args() : me.default_filters) || [] }, callback: function(r) { - me.render_stat((r.message.stats || {})["_user_tags"]); + let stats = (r.message.stats || {})["_user_tags"] || []; + me.render_stat(stats); let stats_dropdown = me.sidebar.find('.list-stats-dropdown'); frappe.utils.setup_search(stats_dropdown, '.stat-link', '.stat-label'); } diff --git a/frappe/public/js/frappe/model/sync.js b/frappe/public/js/frappe/model/sync.js index 2cb7ca1a32..48f886364c 100644 --- a/frappe/public/js/frappe/model/sync.js +++ b/frappe/public/js/frappe/model/sync.js @@ -39,7 +39,7 @@ Object.assign(frappe.model, { } frappe.model.sync_docinfo(r); - + return r.docs; }, rename_after_save: (d, i) => { diff --git a/frappe/public/js/frappe/router.js b/frappe/public/js/frappe/router.js index 4fcf0dbd14..7bea7f0584 100644 --- a/frappe/public/js/frappe/router.js +++ b/frappe/public/js/frappe/router.js @@ -133,14 +133,14 @@ frappe.router = { // /app/user/user-001 = ["Form", "User", "user-001"] // /app/event/view/calendar/default = ["List", "Event", "Calendar", "Default"] - let private_wspace = route[1] && `${route[1]}-${frappe.user.name.toLowerCase()}`; + let private_workspace = route[1] && `${route[1]}-${frappe.user.name.toLowerCase()}`; if (frappe.workspaces[route[0]]) { // public workspace route = ['Workspaces', frappe.workspaces[route[0]].title]; - } else if (route[0] == 'private' && frappe.workspaces[private_wspace]) { + } else if (route[0] == 'private' && frappe.workspaces[private_workspace]) { // private workspace - route = ['Workspaces', 'private', frappe.workspaces[private_wspace].title]; + route = ['Workspaces', 'private', frappe.workspaces[private_workspace].title]; } else if (this.routes[route[0]]) { // route route = this.set_doctype_route(route); diff --git a/frappe/public/js/frappe/ui/sort_selector.js b/frappe/public/js/frappe/ui/sort_selector.js index 544467fb14..879466e8f7 100644 --- a/frappe/public/js/frappe/ui/sort_selector.js +++ b/frappe/public/js/frappe/ui/sort_selector.js @@ -113,41 +113,43 @@ frappe.ui.SortSelector = class SortSelector { if(!this.args.options) { // default options var _options = [ - {'fieldname': 'modified'} + {'fieldname': 'modified'}, + {'fieldname': 'name'}, + {'fieldname': 'creation'}, + {'fieldname': 'idx'}, ] // title field - if(meta.title_field) { - _options.push({'fieldname': meta.title_field}); + if (meta.title_field) { + _options.splice(1, 0, {'fieldname': meta.title_field}); } - // bold or mandatory + // sort field - set via DocType schema or Customize Form + if (meta_sort_field) { + _options.splice(1, 0, { 'fieldname': meta_sort_field }); + } + + // bold, mandatory and fields that are available in list view meta.fields.forEach(function(df) { - if(df.mandatory || df.bold) { + if ( + (df.mandatory || df.bold || df.in_list_view) + && frappe.model.is_value_type(df.fieldtype) + && frappe.perm.has_perm(me.doctype, df.permlevel, "read") + ) { _options.push({fieldname: df.fieldname, label: df.label}); } }); - // meta sort field - if(meta_sort_field) _options.push({ 'fieldname': meta_sort_field }); - - // more default options - _options.push( - {'fieldname': 'name'}, - {'fieldname': 'creation'}, - {'fieldname': 'idx'} - ) - - // de-duplicate - this.args.options = _options.uniqBy(function(obj) { - return obj.fieldname; + // add missing labels + _options.forEach(option => { + if (!option.label) { + option.label = me.get_label(option.fieldname); + } }); - // add missing labels - this.args.options.forEach(function(o) { - if(!o.label) { - o.label = me.get_label(o.fieldname); - } + // de-duplicate + this.args.options = _options.uniqBy(obj => { + return obj.fieldname; }); } diff --git a/frappe/public/js/frappe/ui/workspace_sidebar_loading_skeleton.html b/frappe/public/js/frappe/ui/workspace_sidebar_loading_skeleton.html new file mode 100644 index 0000000000..4f20e3c21c --- /dev/null +++ b/frappe/public/js/frappe/ui/workspace_sidebar_loading_skeleton.html @@ -0,0 +1,22 @@ ++ `); } @@ -119,8 +110,10 @@ frappe.views.Workspace = class Workspace { }); // Scroll sidebar to selected page if it is not in viewport. - !frappe.dom.is_element_in_viewport(this.sidebar.find('.selected')) + this.sidebar.find('.selected').length && !frappe.dom.is_element_in_viewport(this.sidebar.find('.selected')) && this.sidebar.find('.selected')[0].scrollIntoView(); + + this.remove_sidebar_skeleton(); } build_sidebar_section(title, root_pages) { @@ -164,7 +157,8 @@ frappe.views.Workspace = class Workspace { let child_items = pages.filter(page => page.parent_page == item.title); if (child_items.length > 0) { - let child_container = $(``); + let child_container = $item_container.find('.sidebar-child-item'); + child_container.addClass('hidden'); this.prepare_sidebar(child_items, child_container, $item_container); } @@ -179,18 +173,23 @@ frappe.views.Workspace = class Workspace { } add_drop_icon(item, sidebar_control, item_container) { + let drop_icon = 'small-down'; + if (item_container.find(`[item-name="${this.current_page.name}"]`).length) { + drop_icon = 'small-up'; + } + let $child_item_section = item_container.find('.sidebar-child-item'); - let $drop_icon = $(`${frappe.utils.icon("small-down", "sm")}`) + let $drop_icon = $(`${frappe.utils.icon(drop_icon, "sm")}`) .appendTo(sidebar_control); let pages = item.public ? this.public_pages : this.private_pages; if (pages.some(e => e.parent_page == item.title)) { $drop_icon.removeClass('hidden'); - $drop_icon.on('click', () => { - let icon = $drop_icon.find("use").attr("href")==="#icon-small-down" ? "#icon-small-up" : "#icon-small-down"; - $drop_icon.find("use").attr("href", icon); - $child_item_section.toggleClass("hidden"); - }); } + $drop_icon.on('click', () => { + let icon = $drop_icon.find("use").attr("href")==="#icon-small-down" ? "#icon-small-up" : "#icon-small-down"; + $drop_icon.find("use").attr("href", icon); + $child_item_section.toggleClass("hidden"); + }); } show() { @@ -203,21 +202,48 @@ frappe.views.Workspace = class Workspace { let page = this.get_page_to_show(); this.page.set_title(`${__(page.name)}`); + this.update_selected_sidebar(this.current_page, false); //remove selected from old page + this.update_selected_sidebar(page, true); //add selected on new page + this.show_page(page); } + update_selected_sidebar(page, add) { + let section = page.public ? 'public' : 'private'; + if (this.sidebar && this.sidebar_items[section] && this.sidebar_items[section][page.name]) { + let $sidebar = this.sidebar_items[section][page.name]; + let pages = page.public ? this.public_pages : this.private_pages; + let sidebar_page = pages.find(p => p.title == page.name); + + if (add) { + $sidebar[0].firstElementChild.classList.add("selected"); + if (sidebar_page) sidebar_page.selected = true; + + // open child sidebar section if closed + $sidebar.parent().hasClass('hidden') && + $sidebar.parent().removeClass('hidden'); + + this.current_page = { name: page.name, public: page.public }; + localStorage.current_page = page.name; + localStorage.is_current_page_public = page.public; + } else { + $sidebar[0].firstElementChild.classList.remove("selected"); + if (sidebar_page) sidebar_page.selected = false; + } + } + } + get_data(page) { - return frappe.xcall("frappe.desk.desktop.get_desktop_page", { + return frappe.call("frappe.desk.desktop.get_desktop_page", { page: page }).then(data => { - this.page_data = data; + this.page_data = data.message; // caching page data this.pages[page.name] && delete this.pages[page.name]; - this.pages[page.name] = data; + this.pages[page.name] = data.message; if (!this.page_data || Object.keys(this.page_data).length === 0) return; - if (this.page_data.charts && this.page_data.charts.items.length === 0) return; return frappe.dashboard_utils.get_dashboard_settings().then(settings => { @@ -249,49 +275,35 @@ frappe.views.Workspace = class Workspace { } async show_page(page) { - let section = this.current_page.public ? 'public' : 'private'; - if (this.sidebar_items && this.sidebar_items[section] && this.sidebar_items[section][this.current_page.name]) { - this.sidebar_items[section][this.current_page.name][0].firstElementChild.classList.remove("selected"); - this.sidebar_items[page.public ? 'public':'private'][page.name][0].firstElementChild.classList.add("selected"); - - if (this.sidebar_items[page.public ? 'public':'private'][page.name].parents('.sidebar-item-container')[0]) { - this.sidebar_items[page.public ? 'public':'private'][page.name] - .parents('.sidebar-item-container') - .find('.drop-icon use') - .attr("href", "#icon-small-up"); - } - } - - this.current_page = { name: page.name, public: page.public }; - localStorage.current_page = page.name; - localStorage.is_current_page_public = page.public; - if (!this.body.find('#editorjs')[0]) { this.$page = $(` `).appendTo(this.body); } - this.create_skeleton(); if (this.all_pages) { + this.create_page_skeleton(); + let pages = page.public ? this.public_pages : this.private_pages; - let this_page = pages.filter(p => p.title == page.name)[0]; - this.setup_actions(page); - this.content = this_page && JSON.parse(this_page.content); + let current_page = pages.filter(p => p.title == page.name)[0]; + this.content = current_page && JSON.parse(current_page.content); this.add_custom_cards_in_content(); $('.item-anchor').addClass('disable-click'); - if (this.pages && this.pages[this_page.name]) { - this.page_data = this.pages[this_page.name]; + if (this.pages && this.pages[current_page.name]) { + this.page_data = this.pages[current_page.name]; } else { - await this.get_data(this_page); + await frappe.after_ajax(() => this.get_data(current_page)); } + this.setup_actions(page); + this.prepare_editorjs(); $('.item-anchor').removeClass('disable-click'); - this.remove_skeleton(); + + this.remove_page_skeleton(); } } @@ -329,9 +341,7 @@ frappe.views.Workspace = class Workspace { return; } - this.page.clear_primary_action(); - this.page.clear_secondary_action(); - this.page.clear_inner_toolbar(); + this.clear_page_actions(); current_page.is_editable && this.page.set_secondary_action(__("Edit"), async () => { if (!this.editor || !this.editor.readOnly) return; @@ -341,7 +351,6 @@ frappe.views.Workspace = class Workspace { this.initialize_editorjs_undo(); this.setup_customization_buttons(current_page); this.show_sidebar_actions(); - this.make_sidebar_sortable(); this.make_blocks_sortable(); }); }); @@ -357,22 +366,25 @@ frappe.views.Workspace = class Workspace { this.undo.readOnly = false; } - setup_customization_buttons(page) { - let me = this; + clear_page_actions() { this.page.clear_primary_action(); this.page.clear_secondary_action(); this.page.clear_inner_toolbar(); + } + + setup_customization_buttons(page) { + this.clear_page_actions(); page.is_editable && this.page.set_primary_action( __("Save Customizations"), () => { - this.page.clear_primary_action(); - this.page.clear_secondary_action(); - this.page.clear_inner_toolbar(); - this.undo.readOnly = true; - this.save_page(); - this.editor.readOnly.toggle(); - this.is_read_only = true; + this.clear_page_actions(); + this.save_page(page).then((saved) => { + if (!saved) return; + this.undo.readOnly = true; + this.editor.readOnly.toggle(); + this.is_read_only = true; + }); }, null, __("Saving") @@ -382,11 +394,10 @@ frappe.views.Workspace = class Workspace { __("Discard"), async () => { this.discard = true; - this.page.clear_primary_action(); - this.page.clear_secondary_action(); - this.page.clear_inner_toolbar(); + this.clear_page_actions(); await this.editor.readOnly.toggle(); this.is_read_only = true; + this.sidebar_pages = this.cached_pages; this.reload(); frappe.show_alert({ message: __("Customizations Discarded"), indicator: "info" }); } @@ -395,34 +406,30 @@ frappe.views.Workspace = class Workspace { page.name && this.page.add_inner_button(__("Settings"), () => { frappe.set_route(`workspace/${page.name}`); }); - - Object.keys(this.blocks).forEach(key => { - this.page.add_inner_button(` - ${this.blocks[key].toolbox.icon} - ${__(this.blocks[key].toolbox.title)} - `, function() { - const index = me.editor.blocks.getBlocksCount() + 1; - me.editor.blocks.insert(key, {}, {}, index, true); - me.editor.caret.setToLastBlock('start', 0); - $('.ce-block:last-child')[0].scrollIntoView(); - }, __('Add Block')); - }); } show_sidebar_actions() { this.sidebar.find('.standard-sidebar-section').addClass('show-control'); + this.make_sidebar_sortable(); } - add_sidebar_actions(item, sidebar_control) { + add_sidebar_actions(item, sidebar_control, is_new) { if (!item.is_editable) { - $(`${frappe.utils.icon("lock", "sm")}`) - .appendTo(sidebar_control); sidebar_control.parent().click(() => { !this.is_read_only && frappe.show_alert({ message: __("Only Workspace Manager can sort or edit this page"), indicator: 'info' }, 5); }); + + frappe.utils.add_custom_button( + frappe.utils.icon('duplicate', 'sm'), + () => this.duplicate_page(item), + "duplicate-page", + `${__('Duplicate Workspace')}`, + null, + sidebar_control + ); } else { frappe.utils.add_custom_button( frappe.utils.icon('drag', 'xs'), @@ -432,22 +439,378 @@ frappe.views.Workspace = class Workspace { null, sidebar_control ); - frappe.utils.add_custom_button( - frappe.utils.icon('delete', 'xs'), - () => this.delete_page(item), - "delete-page", - `${__('Delete')}`, - null, - sidebar_control - ); + + !is_new && this.add_settings_button(item, sidebar_control); } } - delete_page(item) { - frappe.confirm(__("Are you sure you want to delete page {0}?", [item.title]), () => { - this.deleted_sidebar_items.push(item); - this.sidebar.find(`.standard-sidebar-section [item-name="${item.title}"][item-public="${item.public}"]`).addClass('hidden'); + get_parent_pages(page) { + this.public_parent_pages = ['', ...this.public_pages.filter(p => !p.parent_page).map(p => p.title)]; + this.private_parent_pages = ['', ...this.private_pages.filter(p => !p.parent_page).map(p => p.title)]; + + if (page) { + return page.public ? this.public_parent_pages : this.private_parent_pages; + } + } + + edit_page(item) { + var me = this; + let old_item = item; + let parent_pages = this.get_parent_pages(item); + let idx = parent_pages.findIndex(x => x == item.title); + if (idx !== -1) parent_pages.splice(idx, 1); + const d = new frappe.ui.Dialog({ + title: __('Update Details'), + fields: [ + { + label: __('Title'), + fieldtype: 'Data', + fieldname: 'title', + reqd: 1, + default: item.title + }, + { + label: __('Parent'), + fieldtype: 'Select', + fieldname: 'parent', + options: parent_pages, + default: item.parent_page + }, + { + label: __('Public'), + fieldtype: 'Check', + fieldname: 'is_public', + depends_on: `eval:${this.has_access}`, + default: item.public, + onchange: function() { + d.set_df_property('parent', 'options', + this.get_value() ? me.public_parent_pages : me.private_parent_pages); + } + }, + { + fieldtype: 'Column Break' + }, + { + label: __('Icon'), + fieldtype: 'Icon', + fieldname: 'icon', + default: item.icon + }, + ], + primary_action_label: __('Update'), + primary_action: (values) => { + let is_title_changed = values.title != old_item.title; + let is_section_changed = values.is_public != old_item.public; + if ((is_title_changed || is_section_changed) && !this.validate_page(values, old_item)) return; + d.hide(); + + frappe.call({ + method: "frappe.desk.doctype.workspace.workspace.update_page", + args: { + name: old_item.name, + title: values.title, + icon: values.icon || '', + parent: values.parent || '', + public: values.is_public || 0, + }, + callback: function(res) { + if (res.message) { + let message = `Workspace ${old_item.title} Edited Successfully`; + frappe.show_alert({ message: __(message), indicator: "green" }); + } + } + }); + + this.update_sidebar(old_item, values); + + if (this.make_page_selected) { + let pre_url = values.is_public ? '' : 'private/'; + let route = pre_url + frappe.router.slug(values.title); + frappe.set_route(route); + + this.make_page_selected = false; + } + + this.make_sidebar(); + this.show_sidebar_actions(); + } }); + d.show(); + } + + update_sidebar(old_item, new_item) { + let is_section_changed = old_item.public != (new_item.is_public || 0); + let is_title_changed = old_item.title != new_item.title; + let new_updated_item = {...old_item}; + + let pages = old_item.public ? this.public_pages : this.private_pages; + + let child_items = pages.filter(page => page.parent_page == old_item.title); + + this.make_page_selected = old_item.selected; + + new_updated_item.title = new_item.title; + new_updated_item.icon = new_item.icon; + new_updated_item.parent_page = new_item.parent || ""; + new_updated_item.public = new_item.is_public; + + if (is_title_changed || is_section_changed) { + if (new_item.is_public) { + new_updated_item.name = new_item.title; + new_updated_item.label = new_item.title; + new_updated_item.for_user = ""; + } else { + let user = frappe.session.user; + new_updated_item.name = `${new_item.title}-${user}`; + new_updated_item.label = `${new_item.title}-${user}`; + new_updated_item.for_user = user; + } + } + this.update_cached_values(old_item, new_updated_item); + + if (child_items.length) { + child_items.forEach(child => { + child.parent_page = new_item.title; + is_section_changed && this.update_child_sidebar(child, new_item); + }); + } + } + + update_child_sidebar(child, new_item) { + let old_child = {...child}; + this.make_page_selected = child.selected; + + child.public = new_item.is_public; + if (new_item.is_public) { + child.name = child.title; + child.label = child.title; + child.for_user = ""; + } else { + let user = frappe.session.user; + child.name = `${child.title}-${user}`; + child.label = `${child.title}-${user}`; + child.for_user = user; + } + + this.update_cached_values(old_child, child); + } + + update_cached_values(old_item, new_item, duplicate, new_page) { + let [from_pages, to_pages] = old_item.public ? + [this.public_pages, this.private_pages] : [this.private_pages, this.public_pages]; + + let old_item_index = from_pages.findIndex(page => page.title == old_item.title); + duplicate && old_item_index++; + + // update frappe.workspaces + if (frappe.workspaces[frappe.router.slug(old_item.name)] || new_page) { + !duplicate && delete frappe.workspaces[frappe.router.slug(old_item.name)]; + if (new_item) { + frappe.workspaces[frappe.router.slug(new_item.name)] = {'title': new_item.title}; + } + } + + // update page block data + if (this.pages && this.pages[old_item.name] || new_page) { + if (new_item) { + this.pages[new_item.name] = this.pages[old_item.name] || {}; + } + !duplicate && delete this.pages[old_item.name]; + } + + // update public and private pages + if (new_item) { + let is_section_changed = old_item.public != (new_item.is_public || new_item.public || 0); + + if (is_section_changed) { + !duplicate && from_pages.splice(old_item_index, 1); + to_pages.push(new_item); + } else if (new_page) { + from_pages.push(new_item); + } else { + from_pages.splice(old_item_index, duplicate ? 0 : 1, new_item); + } + } else { + from_pages.splice(old_item_index, 1); + } + + this.sidebar_pages.pages = [...this.public_pages, ...this.private_pages]; + this.cached_pages = this.sidebar_pages; + } + + add_settings_button(item, sidebar_control) { + this.dropdown_list = [ + { + label: 'Edit', + title: 'Edit Workspace', + icon: frappe.utils.icon('edit', 'sm'), + action: () => this.edit_page(item) + }, + { + label: 'Duplicate', + title: 'Duplicate Workspace', + icon: frappe.utils.icon('duplicate', 'sm'), + action: () => this.duplicate_page(item) + }, + { + label: 'Delete', + title: 'Delete Workspace', + icon: frappe.utils.icon('delete-active', 'sm'), + action: () => this.delete_page(item) + } + ]; + + let $button = $(` ++\ No newline at end of file diff --git a/frappe/public/js/frappe/utils/utils.js b/frappe/public/js/frappe/utils/utils.js index a3a8f96b11..725296a121 100644 --- a/frappe/public/js/frappe/utils/utils.js +++ b/frappe/public/js/frappe/utils/utils.js @@ -243,9 +243,28 @@ Object.assign(frappe.utils, { '=': '=' }; - return String(txt).replace(/[&<>"'`=/]/g, function(char) { - return escape_html_mapping[char]; - }); + return String(txt).replace( + /[&<>"'`=/]/g, + char => escape_html_mapping[char] || char + ); + }, + + unescape_html: function(txt) { + let unescape_html_mapping = { + '&': '&', + '<': '<', + '>': '>', + '"': '"', + ''': "'", + '/': '/', + '`': '`', + '=': '=' + }; + + return String(txt).replace( + /&|<|>|"|'|/|`|=/g, + char => unescape_html_mapping[char] || char + ); }, html2text: function(html) { diff --git a/frappe/public/js/frappe/views/communication.js b/frappe/public/js/frappe/views/communication.js index 1ed79a9758..1d219a7044 100755 --- a/frappe/public/js/frappe/views/communication.js +++ b/frappe/public/js/frappe/views/communication.js @@ -263,7 +263,6 @@ frappe.views.CommunicationComposer = class { const subject_field = me.dialog.fields_dict.subject; let content = content_field.get_value() || ""; - content = content.split('')[1] || content; content_field.set_value(`${reply.message}+ + + + +++ + + + + + + + + + + + ++
${content}`); subject_field.set_value(reply.subject); @@ -725,15 +724,6 @@ frappe.views.CommunicationComposer = class { message += await this.get_signature(); - const SALUTATION_END_COMMENT = ""; - if (this.real_name && !message.includes(SALUTATION_END_COMMENT)) { - message = ` -${__('Dear {0},', [this.real_name], 'Salutation in new email')},
- ${SALUTATION_END_COMMENT}
- ${message} - `; - } - if (this.is_a_reply) { message += this.get_earlier_reply(); } diff --git a/frappe/public/js/frappe/views/reports/report_view.js b/frappe/public/js/frappe/views/reports/report_view.js index 6d8e281793..f5d9f3e110 100644 --- a/frappe/public/js/frappe/views/reports/report_view.js +++ b/frappe/public/js/frappe/views/reports/report_view.js @@ -340,7 +340,7 @@ frappe.views.ReportView = class ReportView extends frappe.views.ListView { options: columns_in_picker }, { - label: __('Insert Column Before {0}', [datatabe_col.docfield.label.bold()]), + label: __('Insert Column Before {0}', [__(datatabe_col.docfield.label).bold()]), fieldname: 'insert_before', fieldtype: 'Check' } @@ -789,7 +789,10 @@ frappe.views.ReportView = class ReportView extends frappe.views.ListView { } else { this.fields.splice(col_index, 0, field); } - frappe.show_alert(__('Also adding the dependent currency field {0}', [field[0].bold()])); + const field_label = frappe.meta.get_label(doctype, field[0]); + frappe.show_alert( + __('Also adding the dependent currency field {0}', [__(field_label).bold()]) + ); } } @@ -799,7 +802,10 @@ frappe.views.ReportView = class ReportView extends frappe.views.ListView { const field = [col, doctype]; this.fields.push(field); this.refresh(); - frappe.show_alert(__('Also adding the status dependency field {0}', [field[0].bold()])); + const field_label = frappe.meta.get_label(doctype, field[0]); + frappe.show_alert( + __('Also adding the status dependency field {0}', [__(field_label).bold()]) + ); } } diff --git a/frappe/public/js/frappe/views/workspace/blocks/block.js b/frappe/public/js/frappe/views/workspace/blocks/block.js index aed3c2f727..f4d4eca6cc 100644 --- a/frappe/public/js/frappe/views/workspace/blocks/block.js +++ b/frappe/public/js/frappe/views/workspace/blocks/block.js @@ -7,7 +7,7 @@ export default class Block { make(block, block_name, widget_type = block) { let block_data = this.config.page_data[block+'s'].items.find(obj => { - return obj.label == block_name; + return frappe.utils.unescape_html(obj.label) == frappe.utils.unescape_html(block_name); }); if (!block_data) return false; this.wrapper.innerHTML = ''; @@ -28,12 +28,64 @@ export default class Block { return true; } - rendered() { - var e = this.wrapper.closest('.ce-block'); - e.classList.add("col-" + this.get_col()); + rendered(wrapper) { + if (wrapper) this.wrapper = wrapper; + !this.readOnly && this.resizer(); + let block = this.wrapper.closest('.ce-block'); + this.set_col_class(block, this.get_col()); + } + + resizer() { + this.wrapper.className = this.wrapper.className + ' resizable'; + var resizer = document.createElement('div'); + resizer.className = 'resizer'; + this.wrapper.parentElement.appendChild(resizer); + resizer.addEventListener('mousedown', init_drag, false); + let me = this; + var startX, startWidth; + + function init_drag(e) { + startX = e.clientX; + startWidth = this.parentElement.offsetWidth; + document.documentElement.addEventListener('mousemove', do_drag, false); + document.documentElement.addEventListener('mouseup', stop_drag, false); + } + + function do_drag(e) { + $(this).css("cursor", "col-resize"); + $('.widget').css("pointer-events", "none"); + $(me.wrapper.parentElement).find('.resizer').css("border-right", "3px solid var(--gray-400)"); + un_focus(); + if ((startWidth + e.clientX - startX) - startWidth > 60) { + startX = e.clientX; + me.increase_width(); + } else if ((startWidth + e.clientX - startX) - startWidth < -60) { + startX = e.clientX; + me.decrease_width(); + } + } + + // disable text selection on mousedown (on drag) + function un_focus() { + if (document.selection) { + document.selection.empty(); + } else { + window.getSelection().removeAllRanges(); + } + } + + function stop_drag() { + $(this).css("cursor", "default"); + $('.widget').css("pointer-events", "auto"); + $(me.wrapper.parentElement).find('.resizer').css("border-right", "0px solid transparent"); + + document.documentElement.removeEventListener('mousemove', do_drag, false); + document.documentElement.removeEventListener('mouseup', stop_drag, false); + } } new(block, widget_type = block) { + let me = this; const dialog_class = get_dialog_constructor(widget_type); let block_name = block+'_name'; this.dialog = new dialog_class({ @@ -53,13 +105,18 @@ export default class Block { }); this.block_widget.customize(this.options); this.wrapper.setAttribute(block_name, this.block_widget.label); + $(this.wrapper).find('.widget').addClass(`${widget_type} edit-mode`); this.new_block_widget = this.block_widget.get_config(); - this.add_tune_button(); + this.add_settings_button(); }, }); if (!this.readOnly && this.data && !this.data[block_name]) { this.dialog.make(); + + this.dialog.dialog.get_close_btn().click(() => { + me.wrapper.closest('.ce-block').remove(); + }); } } @@ -74,42 +131,203 @@ export default class Block { this.new_block_widget = block_obj.get_config(); } - add_tune_button() { - let $widget_control = $(this.wrapper).find('.widget-control'); - frappe.utils.add_custom_button( - frappe.utils.icon('dot-horizontal', 'xs'), - (event) => { - let evn = event; - !$('.ce-settings.ce-settings--opened').length && - setTimeout(() => { - this.api.toolbar.toggleBlockSettings(); - var position = $(evn.target).offset(); - $('.ce-settings.ce-settings--opened').offset({ - top: position.top + 25, - left: position.left - 77 - }); - }, 50); + add_new_block_button() { + let $new_button = $(` +${frappe.utils.icon('add-round', 'lg')}+ `); + + $new_button.appendTo(this.wrapper); + + $new_button.click(event => { + event.stopPropagation(); + let index = this.api.blocks.getCurrentBlockIndex() + 1; + this.api.blocks.insert('paragraph', {}, {}, index); + this.api.caret.setToBlock(index); + }); + } + + add_settings_button() { + let me = this; + this.dropdown_list = [ + { + label: 'Delete', + title: 'Delete Block', + icon: frappe.utils.icon('delete-active', 'sm'), + action: () => this.api.blocks.delete() }, - "tune-btn", - `${__('Tune')}`, - null, - $widget_control, - true - ); + { + label: 'Expand', + title: 'Expand Block', + icon: frappe.utils.icon('expand-alt', 'sm'), + action: () => this.increase_width() + }, + { + label: 'Shrink', + title: 'Shrink Block', + icon: frappe.utils.icon('shrink', 'sm'), + action: () => this.decrease_width() + }, + { + label: 'Move Up', + title: 'Move Up', + icon: frappe.utils.icon('up-arrow', 'sm'), + action: () => this.move_block('up') + }, + { + label: 'Move Down', + title: 'Move Down', + icon: frappe.utils.icon('down-arrow', 'sm'), + action: () => this.move_block('down') + } + ]; + + let $widget_control = $(this.wrapper).find('.widget-control'); + + let $button = $(` ++ + ++ `); + + + let dropdown_item = function(label, title, icon, action) { + let html = $(` ++ ${icon} + ${label} ++ `); + + html.click(event => { + event.stopPropagation(); + action && action(); + }); + + return html; + }; + + $button.click(event => { + event.stopPropagation(); + $button.find('.dropdown-list').toggleClass('hidden'); + }); + + $(document).click(() => { + $button.find('.dropdown-list').addClass('hidden'); + }); + + $widget_control.prepend($button); + + this.dropdown_list.forEach((item) => { + if ((item.label == 'Expand' || item.label == 'Shrink') && + me.options && !me.options.allow_resize) { + return; + } + $button.find('.dropdown-list').append(dropdown_item(item.label, item.title, item.icon, item.action)); + }); } get_col() { let col = this.col || 12; - let class_name = "col-12"; + let class_name = "col-xs-12"; let wrapper = this.wrapper.closest('.ce-block'); const col_class = new RegExp(/\bcol-.+?\b/, "g"); if (wrapper && wrapper.className.match(col_class)) { wrapper.classList.forEach(function (cn) { - cn.match(col_class) && (class_name = cn); + if (cn.match(col_class)) { + class_name = cn; + } }); let parts = class_name.split("-"); - col = parseInt(parts[1]); + col = parseInt(parts[2]); } return col; } + + decrease_width() { + this.update_width('decrease'); + } + + increase_width() { + this.update_width('increase'); + } + + update_width(action) { + let min_width = this.options && this.options.min_width || 3; + const current_block_index = this.api.blocks.getCurrentBlockIndex(); + if (current_block_index < 0) { + return; + } + + let current_block = this.api.blocks.getBlockByIndex(current_block_index); + if (!current_block) { + return; + } + + const current_block_element = current_block.holder; + + let className = 'col-xs-12'; + const colClass = new RegExp(/\bcol-.+?\b/, 'g'); + if (current_block_element.className.match(colClass)) { + current_block_element.classList.forEach( cn => { + if (cn.match(colClass)) { + className = cn; + } + }); + let parts = className.split('-'); + let width = parseInt(parts[2]); + + let condition = true; + + if (action == 'increase') { + condition = width <= 11; + width = width + 1; + } else if (action == 'decrease') { + condition = width > min_width; + width = width - 1; + } + + if (condition) { + this.set_col_class(current_block_element, width); + } + } + } + + set_col_class(node, width) { + let classes = $.grep(node.classList, function (item) { + return item.indexOf("col-") !== 0; + }); + + node.classList = ''; + + classes.forEach(cl => { + node.classList.add(cl); + }); + + let col = 'col-xs-12'; + if (width <= 12 && width >= 7) { + col = 'col-xs-' + width; + } else if (width == 6 || width == 5) { + node.classList.add('col-xs-12'); + col = 'col-sm-' + width; + } else if (width == 4) { + node.classList.add('col-xs-12'); + node.classList.add('col-sm-6'); + col = 'col-md-' + width; + } else if (width == 3) { + node.classList.add('col-xs-12'); + node.classList.add('col-sm-6'); + node.classList.add('col-md-4'); + col = 'col-lg-' + width; + } + node.classList.add(col); + } + + move_block(direction) { + let current_index = this.api.blocks.getCurrentBlockIndex(); + let new_index = current_index + (direction == 'down' ? 1 : -1); + this.api.blocks.move(new_index, current_index); + } } \ No newline at end of file diff --git a/frappe/public/js/frappe/views/workspace/blocks/card.js b/frappe/public/js/frappe/views/workspace/blocks/card.js index 9b4a2ed14f..9ce6ce8b4d 100644 --- a/frappe/public/js/frappe/views/workspace/blocks/card.js +++ b/frappe/public/js/frappe/views/workspace/blocks/card.js @@ -3,7 +3,7 @@ export default class Card extends Block { static get toolbox() { return { title: 'Card', - icon: '' + icon: frappe.utils.icon('card', 'sm') }; } @@ -22,6 +22,7 @@ export default class Card extends Block { allow_delete: this.allow_customization, allow_hiding: false, allow_edit: true, + allow_resize: true }; } @@ -35,7 +36,9 @@ export default class Card extends Block { } if (!this.readOnly) { - this.add_tune_button(); + $(this.wrapper).find('.widget').addClass('links edit-mode'); + this.add_settings_button(); + this.add_new_block_button(); } return this.wrapper; @@ -49,9 +52,9 @@ export default class Card extends Block { return true; } - save(blockContent) { + save() { return { - card_name: blockContent.getAttribute('card_name'), + card_name: this.wrapper.getAttribute('card_name'), col: this.get_col(), new: this.new_block_widget }; diff --git a/frappe/public/js/frappe/views/workspace/blocks/chart.js b/frappe/public/js/frappe/views/workspace/blocks/chart.js index 02e6a66e6f..ccef1fa15f 100644 --- a/frappe/public/js/frappe/views/workspace/blocks/chart.js +++ b/frappe/public/js/frappe/views/workspace/blocks/chart.js @@ -3,7 +3,7 @@ export default class Chart extends Block { static get toolbox() { return { title: 'Chart', - icon: '' + icon: frappe.utils.icon('chart', 'sm') }; } @@ -21,7 +21,9 @@ export default class Chart extends Block { allow_delete: this.allow_customization, allow_hiding: false, allow_edit: true, - max_widget_count: 2, + allow_resize: true, + min_width: 6, + max_widget_count: 2 }; } @@ -35,7 +37,9 @@ export default class Chart extends Block { } if (!this.readOnly) { - this.add_tune_button(); + $(this.wrapper).find('.widget').addClass('chart edit-mode'); + this.add_settings_button(); + this.add_new_block_button(); } return this.wrapper; @@ -49,9 +53,9 @@ export default class Chart extends Block { return true; } - save(blockContent) { + save() { return { - chart_name: blockContent.getAttribute('chart_name'), + chart_name: this.wrapper.getAttribute('chart_name'), col: this.get_col(), new: this.new_block_widget }; diff --git a/frappe/public/js/frappe/views/workspace/blocks/header.js b/frappe/public/js/frappe/views/workspace/blocks/header.js index d88bc42af9..29ffb0a828 100644 --- a/frappe/public/js/frappe/views/workspace/blocks/header.js +++ b/frappe/public/js/frappe/views/workspace/blocks/header.js @@ -4,16 +4,8 @@ export default class Header extends Block { constructor({ data, config, api, readOnly }) { super({ config, api, readOnly }); - this._CSS = { - block: this.api.styles.block, - settingsButton: this.api.styles.settingsButton, - settingsButtonActive: this.api.styles.settingsButtonActive, - wrapper: 'ce-header', - }; - this._settings = this.config; this._data = this.normalizeData(data); - this.settingsButtons = []; this._element = this.getTag(); this.data = data; @@ -27,8 +19,7 @@ export default class Header extends Block { data = {}; } - newData.text = (data.text && __(data.text.replace(/(\n|\t)/gm, ""))) || ''; - newData.level = parseInt(data.level) || this.defaultLevel.number; + newData.text = data.text || ''; newData.col = parseInt(data.col) || 12; return newData; @@ -36,7 +27,6 @@ export default class Header extends Block { render() { this.wrapper = document.createElement('div'); - this.wrapper.contentEditable = this.readOnly ? 'false' : 'true'; if (!this.readOnly) { let $widget_head = $(``); let $widget_control = $(``); @@ -45,27 +35,10 @@ export default class Header extends Block { $widget_control.appendTo($widget_head); $widget_head.appendTo(this.wrapper); - this.wrapper.classList.add('widget', 'header'); + this.wrapper.classList.add('widget', 'header', 'edit-mode'); - frappe.utils.add_custom_button( - frappe.utils.icon('dot-horizontal', 'xs'), - (event) => { - let evn = event; - !$('.ce-settings.ce-settings--opened').length && - setTimeout(() => { - this.api.toolbar.toggleBlockSettings(); - var position = $(evn.target).offset(); - $('.ce-settings.ce-settings--opened').offset({ - top: position.top + 25, - left: position.left - 77 - }); - }, 50); - }, - "tune-btn", - `${__('Tune')}`, - null, - $widget_control - ); + this.add_settings_button(); + this.add_new_block_button(); frappe.utils.add_custom_button( frappe.utils.icon('drag', 'xs'), @@ -76,67 +49,14 @@ export default class Header extends Block { $widget_control ); - frappe.utils.add_custom_button( - frappe.utils.icon('delete', 'xs'), - () => this.api.blocks.delete(), - "delete-header", - `${__('Delete')}`, - null, - $widget_control - ); - return this.wrapper; } return this._element; } - renderSettings() { - const holder = document.createElement('DIV'); - - if (this.levels.length <= 1) { - return holder; - } - - this.levels.forEach(level => { - const selectTypeButton = document.createElement('SPAN'); - - selectTypeButton.classList.add(this._CSS.settingsButton); - - if (this.currentLevel.number === level.number) { - selectTypeButton.classList.add(this._CSS.settingsButtonActive); - } - - selectTypeButton.innerHTML = level.svg; - - selectTypeButton.dataset.level = level.number; - - selectTypeButton.addEventListener('click', () => { - this.setLevel(level.number); - }); - - holder.appendChild(selectTypeButton); - - this.settingsButtons.push(selectTypeButton); - }); - - return holder; - } - - setLevel(level) { - this.data = { - level: level, - text: this.data.text, - }; - - this.settingsButtons.forEach(button => { - button.classList.toggle(this._CSS.settingsButtonActive, parseInt(button.dataset.level) === level); - }); - } - merge(data) { const newData = { - text: this.data.text + data.text, - level: this.data.level, + text: this.data.text + data.text }; this.data = newData; @@ -146,31 +66,28 @@ export default class Header extends Block { return blockData.text.trim() !== ''; } - save(toolsContent) { + save() { this.wrapper = this._element; return { - text: toolsContent.innerText, - level: this.currentLevel.number, + text: this.wrapper.innerHTML.replace(/ /gi, ''), col: this.get_col() }; } rendered() { - var e = this._element.closest('.ce-block'); - e.classList.add("col-" + this.get_col()); - } - - static get conversionConfig() { - return { - export: 'text', // use 'text' property for other blocks - import: 'text', // fill 'text' property from other block's export string - }; + super.rendered(this._element); } static get sanitize() { return { level: false, - text: {}, + text: { + br: true, + b: true, + i: true, + a: true, + span: true + }, }; } @@ -180,7 +97,6 @@ export default class Header extends Block { get data() { this._data.text = this._element.innerHTML; - this._data.level = this.currentLevel.number; return this._data; } @@ -188,15 +104,11 @@ export default class Header extends Block { set data(data) { this._data = this.normalizeData(data); - if (data.level !== undefined && this._element.parentNode) { - const newHeader = this.getTag(); - newHeader.innerHTML = this._element.innerHTML; - this._element.parentNode.replaceChild(newHeader, this._element); - this._element = newHeader; - } - if (data.text !== undefined) { - this._element.innerHTML = this._data.text || ''; + let text = this._data.text || ''; + const contains_html_tag = /<[a-z][\s\S]*>/i.test(text); + this._element.innerHTML = contains_html_tag ? + text : `${text}`; } if (!this.readOnly && this.wrapper) { @@ -205,11 +117,12 @@ export default class Header extends Block { } getTag() { - const tag = document.createElement(this.currentLevel.tag); + const tag = document.createElement('DIV'); - tag.innerHTML = this._data.text || ''; + let text = this._data.text || ' '; + tag.innerHTML = `${text}`; - tag.classList.add(this._CSS.wrapper); + tag.classList.add('ce-header'); if (!this.readOnly) { tag.contentEditable = true; @@ -220,120 +133,10 @@ export default class Header extends Block { return tag; } - get currentLevel() { - let level = this.levels.find(levelItem => levelItem.number === this._data.level); - - if (!level) { - level = this.defaultLevel; - } - - return level; - } - - get defaultLevel() { - if (this._settings.defaultLevel) { - const userSpecified = this.levels.find(levelItem => { - return levelItem.number === this._settings.defaultLevel; - }); - - if (userSpecified) { - return userSpecified; - } else { - // console.warn('(ง\'̀-\'́)ง Heading Tool: the default level specified was not found in available levels'); - } - } - - return this.levels[1]; - } - - get levels() { - const availableLevels = [ - { - number: 1, - tag: 'H1', - svg: '', - }, - { - number: 2, - tag: 'H2', - svg: '', - }, - { - number: 3, - tag: 'H3', - svg: '', - }, - { - number: 4, - tag: 'H4', - svg: '', - }, - { - number: 5, - tag: 'H5', - svg: '', - }, - { - number: 6, - tag: 'H6', - svg: '', - }, - ]; - - return this._settings.levels ? availableLevels.filter( - l => this._settings.levels.includes(l.number) - ) : availableLevels; - } - - onPaste(event) { - const content = event.detail.data; - - let level = this.defaultLevel.number; - - switch (content.tagName) { - case 'H1': - level = 1; - break; - case 'H2': - level = 2; - break; - case 'H3': - level = 3; - break; - case 'H4': - level = 4; - break; - case 'H5': - level = 5; - break; - case 'H6': - level = 6; - break; - } - - if (this._settings.levels) { - // Fallback to nearest level when specified not available - level = this._settings.levels.reduce((prevLevel, currLevel) => { - return Math.abs(currLevel - level) < Math.abs(prevLevel - level) ? currLevel : prevLevel; - }); - } - - this.data = { - level, - text: content.innerHTML, - }; - } - - static get pasteConfig() { - return { - tags: ['H1', 'H2', 'H3', 'H4', 'H5', 'H6'], - }; - } - static get toolbox() { return { - icon: '', title: 'Heading', + icon: frappe.utils.icon('header', 'sm') }; } } \ No newline at end of file diff --git a/frappe/public/js/frappe/views/workspace/blocks/header_size.js b/frappe/public/js/frappe/views/workspace/blocks/header_size.js new file mode 100644 index 0000000000..3694b8799b --- /dev/null +++ b/frappe/public/js/frappe/views/workspace/blocks/header_size.js @@ -0,0 +1,117 @@ +export default class HeaderSize { + + static get isInline() { + return true; + } + + get state() { + return this._state; + } + + set state(state) { + this._state = state; + } + + get title() { + return 'Header Size'; + } + + constructor({api}) { + this.api = api; + this.button = null; + this._state = true; + this.selectedText = null; + this.range = null; + this.headerLevels = []; + } + + render() { + this.button = document.createElement('button'); + this.button.type = 'button'; + this.button.innerHTML = `${frappe.utils.icon('header', 'sm')}${frappe.utils.icon('small-down', 'xs')}`; + this.button.classList = 'header-inline-tool'; + + return this.button; + } + + checkState(selection) { + let termWrapper = this.api.selection.findParentTag('SPAN'); + + for (const h of ['h1', 'h2', 'h3', 'h4', 'h5', 'h6']) { + if (termWrapper && termWrapper.classList.contains(h)) { + let num = h.match(/\d+/)[0]; + $('.header-inline-tool svg:first-child').replaceWith(frappe.utils.icon(`header-${num}`, 'md')); + } + } + + const text = selection.anchorNode; + if (!text) return; + } + + change_size(range, size) { + if (!range) return; + + let span = document.createElement('SPAN'); + + span.classList.add(`h${size}`); + span.innerText = range.toString(); + + this.remove_parent_tag(range, range.commonAncestorContainer, span); + + range.extractContents(); + range.insertNode(span); + this.api.inlineToolbar.close(); + } + + remove_parent_tag(range, parent_node, span) { + let diff = range.startContainer.data; + let selected_text = span.innerText; + let parent_tag = parent_node.parentElement; + + if (diff !== selected_text) { + parent_tag = parent_node; + } + + if (parent_tag.innerText == selected_text) { + if (!parent_tag.classList.contains('ce-header') && !parent_tag.classList.contains('ce-paragraph')) { + this.remove_parent_tag(range, parent_node.parentElement, span); + parent_tag.remove(); + } + } + } + + surround(range) { + this.selectedText = range.cloneContents(); + this.actions.hidden = !this.actions.hidden; + this.range = !this.actions.hidden ? range : null; + this.state = !this.actions.hidden; + } + + renderActions() { + this.actions = document.createElement('div'); + this.actions.classList = 'header-level-select'; + + this.headerLevels = new Array(6).fill().map((_, idx) => { + const $header_level = document.createElement('div'); + $header_level.classList.add(`h${idx+1}`, 'header-level'); + $header_level.innerText = `Header ${idx+1}`; + return $header_level; + }); + + for (const [i, headerLevel] of this.headerLevels.entries()) { + this.actions.appendChild(headerLevel); + this.api.listeners.on(headerLevel, 'click', () => { + this.change_size(this.range, i+1); + }); + } + + this.actions.hidden = true; + return this.actions; + } + + destroy() { + for (const headerLevel of this.headerLevels) { + this.api.listeners.off(headerLevel, 'click'); + } + } +} \ No newline at end of file diff --git a/frappe/public/js/frappe/views/workspace/blocks/index.js b/frappe/public/js/frappe/views/workspace/blocks/index.js index 00a9b8c83a..5fac17bd02 100644 --- a/frappe/public/js/frappe/views/workspace/blocks/index.js +++ b/frappe/public/js/frappe/views/workspace/blocks/index.js @@ -8,11 +8,11 @@ import Spacer from "./spacer"; import Onboarding from "./onboarding"; // import tunes -import SpacingTune from "./spacing_tune"; +import HeaderSize from "./header_size"; -frappe.provide("frappe.wspace_block"); +frappe.provide("frappe.workspace_block"); -frappe.wspace_block.blocks = { +frappe.workspace_block.blocks = { header: Header, paragraph: Paragraph, card: Card, @@ -22,6 +22,6 @@ frappe.wspace_block.blocks = { onboarding: Onboarding, }; -frappe.wspace_block.tunes = { - spacing_tune: SpacingTune +frappe.workspace_block.tunes = { + header_size: HeaderSize, }; \ No newline at end of file diff --git a/frappe/public/js/frappe/views/workspace/blocks/onboarding.js b/frappe/public/js/frappe/views/workspace/blocks/onboarding.js index 7176b7726d..c0ba529853 100644 --- a/frappe/public/js/frappe/views/workspace/blocks/onboarding.js +++ b/frappe/public/js/frappe/views/workspace/blocks/onboarding.js @@ -4,7 +4,7 @@ export default class Onboarding extends Block { static get toolbox() { return { title: 'Onboarding', - icon: '' + icon: frappe.utils.icon('onboarding', 'sm') }; } @@ -21,19 +21,21 @@ export default class Onboarding extends Block { allow_create: this.allow_customization, allow_delete: this.allow_customization, allow_hiding: false, - allow_edit: true + allow_edit: true, + allow_resize: false }; } rendered() { - var e = this.wrapper.closest('.ce-block'); + let block = this.wrapper.closest('.ce-block'); if (this.readOnly && !$(this.wrapper).find('.onboarding-widget-box').is(':visible')) { - $(e).hide(); + $(block).hide(); } - e.classList.add("col-" + this.get_col()); + this.set_col_class(block, this.get_col()); } new(block, widget_type = block) { + let me = this; const dialog_class = get_dialog_constructor(widget_type); let block_name = block+'_name'; this.dialog = new dialog_class({ @@ -54,13 +56,18 @@ export default class Onboarding extends Block { }); this.block_widget.customize(this.options); this.wrapper.setAttribute(block_name, this.block_widget.label || this.block_widget.onboarding_name); + $(this.wrapper).find('.widget').addClass(`${widget_type} edit-mode`); this.new_block_widget = this.block_widget.get_config(); - this.add_tune_button(); + this.add_settings_button(); }, }); if (!this.readOnly && this.data && !this.data[block_name]) { this.dialog.make(); + + this.dialog.dialog.get_close_btn().click(() => { + me.wrapper.closest('.ce-block').remove(); + }); } } @@ -105,7 +112,9 @@ export default class Onboarding extends Block { } if (!this.readOnly) { - this.add_tune_button(); + $(this.wrapper).find('.widget').addClass('onboarding edit-mode'); + this.add_settings_button(); + this.add_new_block_button(); } $(this.wrapper).css("padding-bottom", "20px"); return this.wrapper; @@ -119,9 +128,9 @@ export default class Onboarding extends Block { return true; } - save(blockContent) { + save() { return { - onboarding_name: blockContent.getAttribute('onboarding_name'), + onboarding_name: this.wrapper.getAttribute('onboarding_name'), col: this.get_col(), new: this.new_block_widget }; diff --git a/frappe/public/js/frappe/views/workspace/blocks/paragraph.js b/frappe/public/js/frappe/views/workspace/blocks/paragraph.js index 9e5dfb68ff..70f97c44c1 100644 --- a/frappe/public/js/frappe/views/workspace/blocks/paragraph.js +++ b/frappe/public/js/frappe/views/workspace/blocks/paragraph.js @@ -27,6 +27,8 @@ export default class Paragraph extends Block { } onKeyUp(e) { + if (!this.wrapper) return; + this.show_hide_block_list(true); if (e.code !== 'Backspace' && e.code !== 'Delete') { return; } @@ -34,55 +36,86 @@ export default class Paragraph extends Block { const {textContent} = this._element; if (textContent === '') { + this.show_hide_block_list(); this._element.innerHTML = ''; } } + show_hide_block_list(hide) { + let $wrapper = $(this.wrapper).hasClass('ce-paragraph') ? $(this.wrapper.parentElement) : $(this.wrapper); + let $block_list_container = $wrapper.find('.block-list-container.dropdown-list'); + $block_list_container.removeClass('hidden'); + hide && $block_list_container.addClass('hidden'); + } + drawView() { let div = document.createElement('DIV'); div.classList.add(this._CSS.wrapper, this._CSS.block, 'widget'); div.contentEditable = false; - div.dataset.placeholder = this.api.i18n.t(this._placeholder); if (!this.readOnly) { div.contentEditable = true; + div.addEventListener('focus', () => { + const {textContent} = this._element; + if (textContent !== '') return; + this.show_hide_block_list(); + }); + div.addEventListener('blur', () => { + setTimeout(() => this.show_hide_block_list(true), 10); + }); + div.dataset.placeholder = this.api.i18n.t(this._placeholder); div.addEventListener('keyup', this.onKeyUp); } return div; } + open_block_list() { + let dropdown_title = 'Templates'; + let $block_list_container = $(` +++ `); + + let all_blocks = frappe.workspace_block.blocks; + Object.keys(all_blocks).forEach(key => { + let $block_list_item = $(` +${dropdown_title.toUpperCase()}++ ${all_blocks[key].toolbox.icon} + ${__(all_blocks[key].toolbox.title)} ++ `); + + $block_list_item.click(event => { + event.stopPropagation(); + const index = this.api.blocks.getCurrentBlockIndex(); + this.api.blocks.delete(); + this.api.blocks.insert(key, {}, {}, index); + this.api.caret.setToBlock(index); + }); + + $block_list_container.append($block_list_item); + }); + + $block_list_container.addClass('hidden'); + $block_list_container.appendTo(this.wrapper); + } + render() { this.wrapper = document.createElement('div'); - this.wrapper.contentEditable = this.readOnly ? 'false' : 'true'; if (!this.readOnly) { - let $para_control = $(``); + let $para_control = $(``); this.wrapper.appendChild(this._element); this._element.classList.remove('widget'); $para_control.appendTo(this.wrapper); - this.wrapper.classList.add('widget'); + this.wrapper.classList.add('widget', 'paragraph', 'edit-mode'); - frappe.utils.add_custom_button( - frappe.utils.icon('dot-horizontal', 'xs'), - (event) => { - let evn = event; - !$('.ce-settings.ce-settings--opened').length && - setTimeout(() => { - this.api.toolbar.toggleBlockSettings(); - var position = $(evn.target).offset(); - $('.ce-settings.ce-settings--opened').offset({ - top: position.top + 25, - left: position.left - 77 - }); - }, 50); - }, - "tune-btn", - `${__('Tune')}`, - null, - $para_control - ); + this.open_block_list(); + this.add_new_block_button(); + this.add_settings_button(); frappe.utils.add_custom_button( frappe.utils.icon('drag', 'xs'), @@ -93,15 +126,6 @@ export default class Paragraph extends Block { $para_control ); - frappe.utils.add_custom_button( - frappe.utils.icon('delete', 'xs'), - () => this.api.blocks.delete(), - "delete-paragraph", - `${__('Delete')}`, - null, - $para_control - ); - return this.wrapper; } return this._element; @@ -132,8 +156,7 @@ export default class Paragraph extends Block { } rendered() { - var e = this._element.closest('.ce-block'); - e.classList.add("col-" + this.get_col()); + super.rendered(this._element); } onPaste(event) { @@ -144,20 +167,14 @@ export default class Paragraph extends Block { this.data = data; } - static get conversionConfig() { - return { - export: 'text', // to convert Paragraph to other block, use 'text' property of saved data - import: 'text' // to covert other block's exported string to Paragraph, fill 'text' property of tool data - }; - } - static get sanitize() { return { text: { br: true, b: true, i: true, - a: true + a: true, + span: true } }; } @@ -188,8 +205,8 @@ export default class Paragraph extends Block { static get toolbox() { return { - icon: '', - title: 'Text' + title: 'Text', + icon: frappe.utils.icon('text', 'sm') }; } } \ No newline at end of file diff --git a/frappe/public/js/frappe/views/workspace/blocks/shortcut.js b/frappe/public/js/frappe/views/workspace/blocks/shortcut.js index 96b8f47484..2be5da0d4b 100644 --- a/frappe/public/js/frappe/views/workspace/blocks/shortcut.js +++ b/frappe/public/js/frappe/views/workspace/blocks/shortcut.js @@ -3,7 +3,7 @@ export default class Shortcut extends Block { static get toolbox() { return { title: 'Shortcut', - icon: '' + icon: frappe.utils.icon('shortcut', 'sm') }; } @@ -13,17 +13,39 @@ export default class Shortcut extends Block { constructor({ data, api, config, readOnly, block }) { super({ data, api, config, readOnly, block }); - this.col = this.data.col ? this.data.col : "4"; + this.col = this.data.col ? this.data.col : "3"; this.allow_customization = !this.readOnly; this.options = { allow_sorting: this.allow_customization, allow_create: this.allow_customization, allow_delete: this.allow_customization, allow_hiding: false, - allow_edit: true + allow_edit: true, + allow_resize: true }; } + rendered() { + super.rendered(); + + this.remove_last_divider(); + $(window).resize(() => { + this.remove_last_divider(); + }); + } + + remove_last_divider() { + let block = this.wrapper.closest('.ce-block'); + let container_offset_right = $('.layout-main-section')[0].offsetWidth; + let block_offset_right = block.offsetLeft + block.offsetWidth; + + if (container_offset_right - block_offset_right <= 110) { + $(block).find('.divider').addClass('hidden'); + } else { + $(block).find('.divider').removeClass('hidden'); + } + } + render() { this.wrapper = document.createElement('div'); this.new('shortcut'); @@ -34,7 +56,14 @@ export default class Shortcut extends Block { } if (!this.readOnly) { - this.add_tune_button(); + $(this.wrapper).find('.widget').addClass('shortcut edit-mode'); + this.add_settings_button(); + this.add_new_block_button(); + } else { + let $shortcut_icon = frappe.utils.icon('arrow-up-right', 'xs', '', 'stroke: grey', 'ml-2'); + $(this.wrapper).find('.widget .widget-title').append($shortcut_icon); + + $(this.wrapper).append($(``)); } return this.wrapper; } @@ -47,9 +76,9 @@ export default class Shortcut extends Block { return true; } - save(blockContent) { + save() { return { - shortcut_name: blockContent.getAttribute('shortcut_name'), + shortcut_name: this.wrapper.getAttribute('shortcut_name'), col: this.get_col(), new: this.new_block_widget }; diff --git a/frappe/public/js/frappe/views/workspace/blocks/spacer.js b/frappe/public/js/frappe/views/workspace/blocks/spacer.js index 3309cad4a4..bb75cea873 100644 --- a/frappe/public/js/frappe/views/workspace/blocks/spacer.js +++ b/frappe/public/js/frappe/views/workspace/blocks/spacer.js @@ -3,7 +3,7 @@ export default class Spacer extends Block { static get toolbox() { return { title: 'Spacer', - icon: '' + icon: frappe.utils.icon('spacer', 'sm') }; } @@ -18,40 +18,24 @@ export default class Spacer extends Block { render() { this.wrapper = document.createElement('div'); + this.wrapper.classList.add('widget', 'spacer'); if (!this.readOnly) { let $spacer = $(`- +`); $spacer.appendTo(this.wrapper); - this.wrapper.classList.add('widget', 'new-widget'); - this.wrapper.style.minHeight = 50 + 'px'; + this.wrapper.classList.add('edit-mode'); + this.wrapper.style.minHeight = 40 + 'px'; let $widget_control = $spacer.find('.widget-control'); - frappe.utils.add_custom_button( - frappe.utils.icon('dot-horizontal', 'xs'), - (event) => { - let evn = event; - !$('.ce-settings.ce-settings--opened').length && - setTimeout(() => { - this.api.toolbar.toggleBlockSettings(); - var position = $(evn.target).offset(); - $('.ce-settings.ce-settings--opened').offset({ - top: position.top + 25, - left: position.left - 77 - }); - }, 50); - }, - "tune-btn", - `${__('Tune')}`, - null, - $widget_control - ); + this.add_settings_button(); + this.add_new_block_button(); frappe.utils.add_custom_button( frappe.utils.icon('drag', 'xs'), @@ -61,15 +45,6 @@ export default class Spacer extends Block { null, $widget_control ); - - frappe.utils.add_custom_button( - frappe.utils.icon('delete', 'xs'), - () => this.api.blocks.delete(), - "delete-spacer", - `${__('Delete')}`, - null, - $widget_control - ); } return this.wrapper; } diff --git a/frappe/public/js/frappe/views/workspace/blocks/spacing_tune.js b/frappe/public/js/frappe/views/workspace/blocks/spacing_tune.js deleted file mode 100644 index 365f7f590e..0000000000 --- a/frappe/public/js/frappe/views/workspace/blocks/spacing_tune.js +++ /dev/null @@ -1,123 +0,0 @@ -export default class SpacingTune { - static get isTune() { - return true; - } - - constructor({api, settings}) { - this.api = api; - this.settings = settings; - this.CSS = { - button: 'ce-settings__button', - wrapper: 'ce-tune-layout', - sidebar: 'cdx-settings-sidebar', - animation: 'wobble', - }; - this.data = { colWidth: 12 }; - this.wrapper = undefined; - this.sidebar = undefined; - } - - render() { - let me = this; - let layoutWrapper = document.createElement('div'); - layoutWrapper.classList.add(this.CSS.wrapper); - let decreaseWidthButton = document.createElement('div'); - decreaseWidthButton.classList.add(this.CSS.button, 'ce-shrink-button'); - let increaseWidthButton = document.createElement('div'); - increaseWidthButton.classList.add(this.CSS.button, 'ce-expand-button'); - - layoutWrapper.appendChild(decreaseWidthButton); - layoutWrapper.appendChild(increaseWidthButton); - - decreaseWidthButton.innerHTML = ``; - this.api.tooltip.onHover(decreaseWidthButton, 'Shrink', { - placement: 'top', - hidingDelay: 500, - }); - this.api.listeners.on( - decreaseWidthButton, - 'click', - () => me.decreaseWidth(), - false - ); - - increaseWidthButton.innerHTML = ``; - this.api.tooltip.onHover(increaseWidthButton, 'Expand', { - placement: 'top', - hidingDelay: 500, - }); - this.api.listeners.on( - increaseWidthButton, - 'click', - () => me.increaseWidth(), - false - ); - - this.wrapper = layoutWrapper; - return layoutWrapper; - } - - decreaseWidth() { - const currentBlockIndex = this.api.blocks.getCurrentBlockIndex(); - - if (currentBlockIndex < 0) { - return; - } - - let currentBlock = this.api.blocks.getBlockByIndex(currentBlockIndex); - if (!currentBlock) { - return; - } - - let currentBlockElement = currentBlock.holder; - - let className = 'col-12'; - let colClass = new RegExp(/\bcol-.+?\b/, 'g'); - if (currentBlockElement.className.match(colClass)) { - currentBlockElement.classList.forEach( cn => { - if (cn.match(colClass)) { - className = cn; - } - }); - let parts = className.split('-'); - let width = parseInt(parts[1]); - if (width >= 4) { - currentBlockElement.classList.remove('col-'+width); - width = width - 1; - currentBlockElement.classList.add('col-'+width); - } - } - } - - increaseWidth() { - const currentBlockIndex = this.api.blocks.getCurrentBlockIndex(); - - if (currentBlockIndex < 0) { - return; - } - - const currentBlock = this.api.blocks.getBlockByIndex(currentBlockIndex); - if (!currentBlock) { - return; - } - - const currentBlockElement = currentBlock.holder; - - let className = 'col-12'; - const colClass = new RegExp(/\bcol-.+?\b/, 'g'); - if (currentBlockElement.className.match(colClass)) { - currentBlockElement.classList.forEach( cn => { - if (cn.match(colClass)) { - className = cn; - } - }); - let parts = className.split('-'); - let width = parseInt(parts[1]); - if (width <= 11) { - currentBlockElement.classList.remove('col-'+width); - width = width + 1; - currentBlockElement.classList.add('col-'+width); - } - } - } -} \ No newline at end of file diff --git a/frappe/public/js/frappe/views/workspace/workspace.js b/frappe/public/js/frappe/views/workspace/workspace.js index e6248f66cf..e28225904d 100644 --- a/frappe/public/js/frappe/views/workspace/workspace.js +++ b/frappe/public/js/frappe/views/workspace/workspace.js @@ -20,13 +20,11 @@ frappe.views.Workspace = class Workspace { constructor(wrapper) { this.wrapper = $(wrapper); this.page = wrapper.page; - this.blocks = frappe.wspace_block.blocks; + this.blocks = frappe.workspace_block.blocks; this.is_read_only = true; - this.new_page = null; this.pages = {}; this.sorted_public_items = []; this.sorted_private_items = []; - this.deleted_sidebar_items = []; this.current_page = {}; this.sidebar_items = { 'public': {}, @@ -52,7 +50,10 @@ frappe.views.Workspace = class Workspace { } async setup_pages(reload) { + !this.discard && this.create_page_skeleton(); + !this.discard && this.create_sidebar_skeleton(); this.sidebar_pages = !this.discard ? await this.get_pages() : this.sidebar_pages; + this.cached_pages = $.extend(true, {}, this.sidebar_pages); this.all_pages = this.sidebar_pages.pages; this.has_access = this.sidebar_pages.has_access; @@ -68,24 +69,13 @@ frappe.views.Workspace = class Workspace { for (let page of this.all_pages) { frappe.workspaces[frappe.router.slug(page.name)] = {title: page.title}; } - if (this.new_page && this.new_page.name) { - if (!frappe.workspaces[frappe.router.slug(this.new_page.label)]) { - this.new_page = { name: this.all_pages[0].title, public: this.all_pages[0].public }; - } - if (this.new_page.public) { - frappe.set_route(`${frappe.router.slug(this.new_page.name)}`); - } else { - frappe.set_route(`private/${frappe.router.slug(this.new_page.name)}`); - } - this.new_page = null; - } this.make_sidebar(); reload && this.show(); } } get_pages() { - return frappe.xcall("frappe.desk.desktop.get_wspace_sidebar_items"); + return frappe.xcall("frappe.desk.desktop.get_workspace_sidebar_items"); } sidebar_item_container(item) { @@ -101,6 +91,7 @@ frappe.views.Workspace = class Workspace {Spacer+ ${frappe.utils.icon('dot-horizontal', 'xs')} ++ + `); + + let dropdown_item = function(label, title, icon, action) { + let html = $(` ++ ${icon} + ${label} ++ `); + + html.click(event => { + event.stopPropagation(); + action && action(); + }); + + return html; + }; + + $button.filter('.dropdown-btn').click(event => { + event.stopPropagation(); + if ($button.filter('.dropdown-list.hidden').length) { + $('.dropdown-list:not(.hidden)').addClass('hidden'); + } + $button.filter('.dropdown-list').toggleClass('hidden'); + }); + + $(document).click(event => { + event.stopPropagation(); + $('.dropdown-list:not(.hidden)').addClass('hidden'); + }); + + sidebar_control.append($button); + + this.dropdown_list.forEach((i) => { + $button.filter('.dropdown-list').append(dropdown_item(i.label, i.title, i.icon, i.action)); + }); + } + + delete_page(page) { + frappe.confirm(__("Are you sure you want to delete page {0}?", [page.title]), () => { + frappe.call({ + method: "frappe.desk.doctype.workspace.workspace.delete_page", + args: { page: page }, + callback: function(res) { + if (res.message) { + let page = res.message; + let message = `Workspace ${page.title} Deleted Successfully`; + frappe.show_alert({ message: __(message), indicator: "green" }); + } + } + }); + + this.page.clear_primary_action(); + this.update_cached_values(page); + + if (this.current_page.name == page.title && this.current_page.public == page.public) { + frappe.set_route('/'); + } + + this.make_sidebar(); + this.show_sidebar_actions(); + }); + } + + duplicate_page(page) { + var me = this; + let parent_pages = this.get_parent_pages(page); + const d = new frappe.ui.Dialog({ + title: __('Create Duplicate'), + fields: [ + { + label: __('Title'), + fieldtype: 'Data', + fieldname: 'title', + reqd: 1 + }, + { + label: __('Parent'), + fieldtype: 'Select', + fieldname: 'parent', + options: parent_pages, + default: page.parent_page + }, + { + label: __('Public'), + fieldtype: 'Check', + fieldname: 'is_public', + depends_on: `eval:${this.has_access}`, + default: page.public, + onchange: function() { + d.set_df_property('parent', 'options', + this.get_value() ? me.public_parent_pages : me.private_parent_pages); + } + }, + { + fieldtype: 'Column Break' + }, + { + label: __('Icon'), + fieldtype: 'Icon', + fieldname: 'icon', + default: page.icon + }, + ], + primary_action_label: __('Duplicate'), + primary_action: (values) => { + if (!this.validate_page(values)) return; + d.hide(); + frappe.call({ + method: "frappe.desk.doctype.workspace.workspace.duplicate_page", + args: { + page_name: page.name, + new_page: values + }, + callback: function(res) { + if (res.message) { + let new_page = res.message; + let message = `Duplicate of ${page.title} named as ${new_page.title} is created successfully`; + frappe.show_alert({ message: __(message), indicator: "green" }); + } + } + }); + + let new_page = {...page}; + + new_page.title = values.title; + new_page.public = values.is_public || 0; + new_page.name = values.title + (new_page.public ? '' : '-' + frappe.session.user); + new_page.label = new_page.name; + new_page.icon = values.icon; + new_page.parent_page = values.parent || ''; + new_page.for_user = new_page.public ? '' : frappe.session.user; + new_page.is_editable = !new_page.public; + new_page.selected = true; + + this.update_cached_values(page, new_page, true); + + let pre_url = values.is_public ? '' : 'private/'; + let route = pre_url + frappe.router.slug(values.title); + frappe.set_route(route); + + me.make_sidebar(); + me.show_sidebar_actions(); + } + }); + d.show(); } make_sidebar_sortable() { @@ -463,35 +826,75 @@ frappe.views.Workspace = class Workspace { onEnd: function (evt) { let is_public = $(evt.item).attr('item-public') == '1'; me.prepare_sorted_sidebar(is_public); + me.update_sorted_sidebar(); } }); }); } prepare_sorted_sidebar(is_public) { + let pages = is_public ? this.public_pages : this.private_pages; if (is_public) { - this.sorted_public_items = this.sort_sidebar(this.sidebar.find('.standard-sidebar-section').last()); + this.sorted_public_items = this.sort_sidebar(this.sidebar.find('.standard-sidebar-section').last(), pages); } else { - this.sorted_private_items = this.sort_sidebar(this.sidebar.find('.standard-sidebar-section').first()); + this.sorted_private_items = this.sort_sidebar(this.sidebar.find('.standard-sidebar-section').first(), pages); } + + this.sidebar_pages.pages = [...this.public_pages, ...this.private_pages]; + this.cached_pages = this.sidebar_pages; } - sort_sidebar($sidebar_section) { + sort_sidebar($sidebar_section, pages) { let sorted_items = []; - for (let page of $sidebar_section.find('.sidebar-item-container')) { + Array.from($sidebar_section.find('.sidebar-item-container')).forEach((page, i) => { let parent_page = ""; + if (page.closest('.nested-container').classList.contains('sidebar-child-item')) { parent_page = page.parentElement.parentElement.attributes["item-name"].value; } + sorted_items.push({ title: page.attributes['item-name'].value, parent_page: parent_page, public: page.attributes['item-public'].value }); - } + + let $drop_icon = $(page).find('.sidebar-item-control .drop-icon').first(); + if ($(page).find('.sidebar-child-item > *').length != 0) { + $drop_icon.removeClass('hidden'); + } else { + $drop_icon.addClass('hidden'); + } + + let from_index = pages.findIndex(p => p.title == page.attributes['item-name'].value); + let element = pages[from_index]; + element.parent_page = parent_page; + if (from_index != i) { + pages.splice(from_index, 1); + pages.splice(i, 0, element); + } + }); return sorted_items; } + update_sorted_sidebar() { + if (this.sorted_public_items || this.sorted_private_items) { + frappe.call({ + method: "frappe.desk.doctype.workspace.workspace.sort_pages", + args: { + sb_public_items: this.sorted_public_items, + sb_private_items: this.sorted_private_items, + }, + callback: function(res) { + if (res.message) { + let message = `Sidebar Updated Successfully`; + frappe.show_alert({ message: __(message), indicator: "green" }); + } + } + }); + } + } + make_blocks_sortable() { let me = this; this.page_sortable = Sortable.create(this.page.main.find(".codex-editor__redactor").get(0), { @@ -508,11 +911,10 @@ frappe.views.Workspace = class Workspace { } initialize_new_page() { - this.public_parent_pages = ['', ...this.public_pages.filter(page => !page.parent_page).map(page => page.title)]; - this.private_parent_pages = ['', ...this.private_pages.filter(page => !page.parent_page).map(page => page.title)]; var me = this; + this.get_parent_pages(); const d = new frappe.ui.Dialog({ - title: __('Set Title'), + title: __('New Workspace'), fields: [ { label: __('Title'), @@ -551,81 +953,115 @@ frappe.views.Workspace = class Workspace { d.hide(); this.initialize_editorjs_undo(); this.setup_customization_buttons({is_editable: true}); - this.title = values.title; - this.icon = values.icon; - this.parent = values.parent; - this.public = values.is_public; + + let name = values.title + (values.is_public ? '' : '-' + frappe.session.user); + let blocks = [{ + type: "header", + data: { text: values.title } + }]; + + let new_page = { + content: JSON.stringify(blocks), + name: name, + label: name, + title: values.title, + public: values.is_public || 0, + for_user: values.is_public ? '' : frappe.session.user, + icon: values.icon, + parent_page: values.parent || '', + is_editable: true, + selected: true + }; + this.editor.render({ - blocks: [ - { - type: "header", - data: { - text: this.title, - level: 4 - } - } - ] + blocks: blocks }).then(async () => { if (this.editor.configuration.readOnly) { this.is_read_only = false; await this.editor.readOnly.toggle(); } - this.add_page_to_sidebar(values); + + frappe.call({ + method: "frappe.desk.doctype.workspace.workspace.new_page", + args: { + new_page: new_page + }, + callback: function(res) { + if (res.message) { + let message = `Workspace ${new_page.title} Created Successfully`; + frappe.show_alert({ message: __(message), indicator: "green" }); + } + } + }); + + this.update_cached_values(new_page, new_page, true, true); + + let pre_url = new_page.public ? '' : 'private/'; + let route = pre_url + frappe.router.slug(new_page.title); + frappe.set_route(route); + + this.make_sidebar(); this.show_sidebar_actions(); - this.make_sidebar_sortable(); - this.make_blocks_sortable(); - this.prepare_sorted_sidebar(values.is_public); }); } }); d.show(); } - validate_page(values) { + validate_page(new_page, old_page) { let message = ""; - let pages = values.is_public ? this.public_pages : this.private_pages; + let [from_pages, to_pages] = new_page.is_public ? + [this.private_pages, this.public_pages] : [this.public_pages, this.private_pages]; - if (pages && pages.filter(p => p.title == values.title)[0]) { - message = "Page with title '{0}' already exist."; - } else if (frappe.router.doctype_route_exist(frappe.router.slug(values.title))) { + let section = this.sidebar_categories[new_page.is_public]; + + if (to_pages && to_pages.filter(p => p.title == new_page.title)[0]) { + message = `Page with title ${new_page.title} already exist.`; + } + + if (frappe.router.doctype_route_exist(frappe.router.slug(new_page.title))) { message = "Doctype with same route already exist. Please choose different title."; } + let child_pages = old_page && from_pages.filter(p => p.parent_page == old_page.title); + if (child_pages) { + child_pages.every(child_page => { + if (to_pages && to_pages.find(p => p.title == child_page.title)) { + message = `One of the child page with name ${child_page.title} already exist in ${section} Section. Please update the name of the child page first before moving`; + cur_dialog.hide(); + return false; + } + return true; + }); + } + if (message) { - frappe.throw(__(message, [__(values.title)])); + frappe.throw(__(message)); return false; } return true; } - add_page_to_sidebar({title, icon, parent, is_public}) { + add_page_to_sidebar(page) { let $sidebar = $('.standard-sidebar-section'); - let item = { - title: title, - icon: icon, - parent_page: parent, - public: is_public - }; - let $sidebar_item = this.sidebar_item_container(item); - $sidebar_item.addClass('is-draggable'); + let item = {...page}; + + item.selected = true; + item.is_editable = true; + + let $sidebar_item = this.sidebar_item_container(item); + + this.add_sidebar_actions(item, $sidebar_item.find('.sidebar-item-control'), true); - frappe.utils.add_custom_button( - frappe.utils.icon('drag', 'xs'), - null, - "drag-handle", - `${__('Drag')}`, - null, - $sidebar_item.find('.sidebar-item-control') - ); $sidebar_item.find('.sidebar-item-control .drag-handle').css('margin-right', '8px'); - let $sidebar_section = is_public ? $sidebar[1] : $sidebar[0]; + let sidebar_section = item.is_public ? $sidebar[1] : $sidebar[0]; - if (!parent) { - !is_public && $sidebar.first().removeClass('hidden'); - $sidebar_item.appendTo($sidebar_section); + if (!item.parent) { + !item.is_public && $sidebar.first().removeClass('hidden'); + $sidebar_item.appendTo(sidebar_section); } else { - let $item_container = $($sidebar_section).find(`[item-name="${parent}"]`); + let $item_container = $(sidebar_section).find(`[item-name="${item.parent}"]`); let $child_section = $item_container.find('.sidebar-child-item'); let $drop_icon = $item_container.find('.drop-icon'); if (!$child_section[0]) { @@ -635,22 +1071,31 @@ frappe.views.Workspace = class Workspace { } $sidebar_item.appendTo($child_section); $child_section.removeClass('hidden'); + $item_container.find('.drop-icon.hidden').removeClass('hidden'); $item_container.find('.drop-icon use').attr("href", "#icon-small-up"); } + + let section = item.is_public ? 'public' : 'private'; + if (this.sidebar_items && this.sidebar_items[section] && !this.sidebar_items[section][item.title]) { + this.sidebar_items[section][item.title] = $sidebar_item; + } } initialize_editorjs(blocks) { this.tools = { header: { class: this.blocks['header'], - inlineToolbar: true, + inlineToolbar: ['HeaderSize', 'bold', 'italic', 'link'], config: { - defaultLevel: 4 + default_size: 4 } }, paragraph: { class: this.blocks['paragraph'], - inlineToolbar: true + inlineToolbar: ['HeaderSize', 'bold', 'italic', 'link'], + config: { + placeholder: 'Choose a block or continue typing' + } }, chart: { class: this.blocks['chart'], @@ -677,7 +1122,7 @@ frappe.views.Workspace = class Workspace { } }, spacer: this.blocks['spacer'], - spacingTune: frappe.wspace_block.tunes['spacing_tune'], + HeaderSize: frappe.workspace_block.tunes['header_size'], }; this.editor = new EditorJS({ data: { @@ -685,27 +1130,18 @@ frappe.views.Workspace = class Workspace { }, tools: this.tools, autofocus: false, - tunes: ['spacingTune'], readOnly: true, logLevel: 'ERROR' }); } - save_page() { - frappe.dom.freeze(); - this.create_skeleton(); - let save = true; - if (!this.title && this.current_page) { - let pages = this.current_page.public ? this.public_pages : this.private_pages; - this.title = this.current_page.name; - this.public = pages.filter(p => p.title == this.title)[0].public; - save = false; - } else { - this.current_page = { name: this.title, public: this.public }; - } + save_page(page) { let me = this; - this.editor.save().then((outputData) => { + this.current_page = { name: page.title, public: page.public }; + + return this.editor.save().then((outputData) => { let new_widgets = {}; + outputData.blocks.forEach(item => { if (item.data.new) { if (!new_widgets[item.type]) { @@ -718,34 +1154,36 @@ frappe.views.Workspace = class Workspace { let blocks = outputData.blocks.filter( item => item.type != 'card' || - (item.data.card_name !== 'Custom Documents' && - item.data.card_name !== 'Custom Reports') + (item.data.card_name !== 'Custom Documents' && + item.data.card_name !== 'Custom Reports') ); + if (page.content == JSON.stringify(blocks)) { + this.setup_customization_buttons(page); + frappe.show_alert({ message: __("No changes made on the page"), indicator: "warning" }); + return false; + } + + this.create_page_skeleton(); + page.content = JSON.stringify(blocks); frappe.call({ method: "frappe.desk.doctype.workspace.workspace.save_page", args: { - title: me.title, - icon: me.icon || '', - parent: me.parent || '', - public: me.public || 0, - sb_public_items: me.sorted_public_items, - sb_private_items: me.sorted_private_items, - deleted_pages: me.deleted_sidebar_items, + title: page.title, + public: page.public || 0, new_widgets: new_widgets, - blocks: JSON.stringify(blocks), - save: save + blocks: JSON.stringify(blocks) }, callback: function(res) { - frappe.dom.unfreeze(); if (res.message) { - me.new_page = res.message; - me.pages[res.message.label] && delete me.pages[res.message.label]; + me.discard = true; + me.update_cached_values(page, page); me.reload(); frappe.show_alert({ message: __("Page Saved Successfully"), indicator: "green" }); } } }); + return true; }).catch((error) => { error; // console.log('Saving failed: ', error); @@ -753,26 +1191,34 @@ frappe.views.Workspace = class Workspace { } reload() { - this.title = ''; - this.icon = ''; - this.parent = ''; - this.public = false; this.sorted_public_items = []; this.sorted_private_items = []; - this.deleted_sidebar_items = []; - this.create_skeleton(); this.setup_pages(true); this.discard = false; this.undo.readOnly = true; } - create_skeleton() { - this.$page.prepend(frappe.render_template('workspace_loading_skeleton')); - this.$page.find('.codex-editor').addClass('hidden'); + create_page_skeleton() { + if ($('.layout-main-section').find('.workspace-skeleton').length) return; + + $('.layout-main-section').prepend(frappe.render_template('workspace_loading_skeleton')); + $('.layout-main-section').find('.codex-editor').addClass('hidden'); } - remove_skeleton() { - this.$page.find('.codex-editor').removeClass('hidden'); - this.$page.find('.workspace-skeleton').remove(); + remove_page_skeleton() { + $('.layout-main-section').find('.codex-editor').removeClass('hidden'); + $('.layout-main-section').find('.workspace-skeleton').remove(); + } + + create_sidebar_skeleton() { + if ($('.list-sidebar').find('.workspace-sidebar-skeleton').length) return; + + $('.list-sidebar').prepend(frappe.render_template('workspace_sidebar_loading_skeleton')); + $('.desk-sidebar').addClass('hidden'); + } + + remove_sidebar_skeleton() { + $('.desk-sidebar').removeClass('hidden'); + $('.list-sidebar').find('.workspace-sidebar-skeleton').remove(); } }; diff --git a/frappe/public/js/frappe/widgets/base_widget.js b/frappe/public/js/frappe/widgets/base_widget.js index e6ae64d9dc..aabb3526b0 100644 --- a/frappe/public/js/frappe/widgets/base_widget.js +++ b/frappe/public/js/frappe/widgets/base_widget.js @@ -34,16 +34,6 @@ export default class Widget { this.action_area ); - options.allow_delete && - frappe.utils.add_custom_button( - frappe.utils.icon('delete', 'xs'), - () => this.delete(), - "", - `${__('Delete')}`, - null, - this.action_area - ); - if (options.allow_hiding) { if (this.hidden) { this.widget.removeClass("hidden"); @@ -71,27 +61,11 @@ export default class Widget { frappe.utils.add_custom_button( frappe.utils.icon("edit", "xs"), () => this.edit(), - null, + "edit-button", `${__('Edit')}`, null, this.action_area ); - - if (options.allow_resize) { - const title = this.width == 'Full'? `${__('Collapse')}` : `${__('Expand')}`; - frappe.utils.add_custom_button( - '', - () => this.toggle_width(), - "resize-button", - title, - null, - this.action_area - ); - - this.resize_button = this.action_area.find( - ".resize-button" - ); - } } make() { @@ -100,9 +74,7 @@ export default class Widget { } make_widget() { - this.widget = $(`+ this.widget = $(``); this.title_field = this.widget.find(".widget-title"); diff --git a/frappe/public/js/frappe/widgets/chart_widget.js b/frappe/public/js/frappe/widgets/chart_widget.js index ec602b8522..6c34fac45a 100644 --- a/frappe/public/js/frappe/widgets/chart_widget.js +++ b/frappe/public/js/frappe/widgets/chart_widget.js @@ -28,7 +28,7 @@ export default class ChartWidget extends Widget { } set_chart_title() { - const max_chars = this.widget.width() < 600 ? 20 : 60; + const max_chars = this.widget.width() < 600 ? 40 : 60; this.set_title(max_chars); } diff --git a/frappe/public/js/frappe/widgets/links_widget.js b/frappe/public/js/frappe/widgets/links_widget.js index cc771b96b5..3320e88bfb 100644 --- a/frappe/public/js/frappe/widgets/links_widget.js +++ b/frappe/public/js/frappe/widgets/links_widget.js @@ -80,7 +80,9 @@ export default class LinksWidget extends Widget { return $(` + } ${disabled_dependent(item)}" type="${item.type}" title="${ + item.label ? item.label : item.name + }"> ${get_link_for_item(item)} `); diff --git a/frappe/public/js/frappe/widgets/widget_dialog.js b/frappe/public/js/frappe/widgets/widget_dialog.js index 5676a834fe..01d41a0cf9 100644 --- a/frappe/public/js/frappe/widgets/widget_dialog.js +++ b/frappe/public/js/frappe/widgets/widget_dialog.js @@ -9,6 +9,7 @@ class WidgetDialog { this.setup_dialog_events(); this.dialog.show(); + window.cur_dialog = this.dialog; this.editing && this.set_default_values(); } @@ -181,19 +182,16 @@ class CardDialog extends WidgetDialog { fieldtype: "Select", in_list_view: 1, label: "Link Type", - options: ["DocType", "Page", "Report"], - onchange: (e) => { - me.link_to = e.currentTarget.value; - } + options: ["DocType", "Page", "Report"] }, { fieldname: "link_to", fieldtype: "Dynamic Link", in_list_view: 1, label: "Link To", - options: "link_type", - get_options: () => { - return me.link_to; + get_options: (df) => { + return df.doc.link_type; + } }, { @@ -506,7 +504,7 @@ class NumberCardDialog extends WidgetDialog { setup_dialog_events() { if (!this.document_type) { - if (this.default_values['doctype']) { + if (this.default_values && this.default_values['doctype']) { this.document_type = this.default_values['doctype']; this.setup_filter(this.default_values['doctype']); this.set_aggregate_function_fields(); @@ -518,7 +516,7 @@ class NumberCardDialog extends WidgetDialog { set_aggregate_function_fields() { let aggregate_function_fields = []; - if (this.document_type) { + if (this.document_type && frappe.get_meta(this.document_type)) { frappe.get_meta(this.document_type).fields.map(df => { if (frappe.model.numeric_fieldtypes.includes(df.fieldtype)) { if (df.fieldtype == 'Currency') { @@ -537,7 +535,7 @@ class NumberCardDialog extends WidgetDialog { if (data.new_or_existing == 'Existing Card') { data.name = data.card; } - data.stats_filter = JSON.stringify(this.filter_group.get_filters()); + data.stats_filter = this.filter_group && JSON.stringify(this.filter_group.get_filters()); data.document_type = this.document_type; return data; diff --git a/frappe/public/scss/common/buttons.scss b/frappe/public/scss/common/buttons.scss index de3a4cfc20..62479e7a7a 100644 --- a/frappe/public/scss/common/buttons.scss +++ b/frappe/public/scss/common/buttons.scss @@ -62,7 +62,7 @@ background-color: var(--control-bg); color: var(--text-color); &:hover, &:active { - background-color: var(--gray-300); + background-color: var(--gray-400); color: var(--text-color); } } diff --git a/frappe/public/scss/common/css_variables.scss b/frappe/public/scss/common/css_variables.scss index 5cc030516f..f4794362d3 100644 --- a/frappe/public/scss/common/css_variables.scss +++ b/frappe/public/scss/common/css_variables.scss @@ -231,6 +231,10 @@ --highlight-shadow: 1px 1px 10px var(--blue-50), 0px 0px 4px var(--blue-600); + // code block + --code-block-bg: var(--gray-900); + --code-block-text: var(--gray-400); + // Border Sizes --border-radius-sm: 4px; --border-radius: 6px; diff --git a/frappe/public/scss/common/quill.scss b/frappe/public/scss/common/quill.scss index a243acba5f..3d5ce61c15 100644 --- a/frappe/public/scss/common/quill.scss +++ b/frappe/public/scss/common/quill.scss @@ -42,6 +42,7 @@ height: 300px; border-bottom-left-radius: var(--border-radius); border-bottom-right-radius: var(--border-radius); + resize: vertical; } .ql-stroke { stroke: var(--icon-stroke); @@ -85,10 +86,22 @@ margin-bottom: 8px; } +.ql-code-block-container { + background-color: var(--code-block-bg); + color: var(--code-block-text); + padding: var(--padding-xs) var(--padding-sm) !important; + margin-bottom: var(--margin-xs) !important; + margin-top: var(--margin-xs)!important; + border-radius: var(--border-radius-sm); +} + .ql-bubble .ql-editor { min-height: 100px; max-height: 300px; border-radius: var(--border-radius-sm); + .ql-code-block-container { + @extend .ql-code-block-container; + } } .ql-mention-list-container { diff --git a/frappe/public/scss/desk/dark.scss b/frappe/public/scss/desk/dark.scss index 8cab845d35..6e5ebdb694 100644 --- a/frappe/public/scss/desk/dark.scss +++ b/frappe/public/scss/desk/dark.scss @@ -87,6 +87,8 @@ --highlight-shadow: 1px 1px 10px var(--blue-900), 0px 0px 4px var(--blue-500); + --shadow-base: 0px 4px 8px rgba(114, 176, 233, 0.06), 0px 0px 4px rgba(112, 172, 228, 0.12); + // input --input-disabled-bg: none; diff --git a/frappe/public/scss/desk/desktop.scss b/frappe/public/scss/desk/desktop.scss index 6ab01a744c..549ed6eee9 100644 --- a/frappe/public/scss/desk/desktop.scss +++ b/frappe/public/scss/desk/desktop.scss @@ -107,13 +107,20 @@ body { } } +.divider { + height: 30%; + position: absolute; + top: 18px; + right: 0; + border-right: 1px solid var(--gray-400); +} + .widget { @include flex(flex, null, null, column); min-height: 1px; - padding: 15px; + padding: 7px; border-radius: var(--border-radius-md); height: 100%; - box-shadow: var(--card-shadow); background-color: var(--card-bg); .btn { @@ -143,6 +150,7 @@ body { font-weight: 500; line-height: 1.3em; color: var(--heading-color); + cursor: default; svg { flex: none; @@ -329,9 +337,28 @@ body { } &.onboarding-widget-box { - margin-top: var(--margin-xs); margin-bottom: var(--margin-2xl); - padding: var(--padding-lg); + padding: var(--padding-lg) !important; + background-color: var(--bg-color); + + &.edit-mode:hover { + background-color: var(--fg-color); + + .onboarding-step { + &.active, + &:hover { + background-color: var(--bg-color); + + .step-index.step-pending { + background-color: var(--fg-color); + } + } + + .step-index { + background-color: var(--bg-color); + } + } + } .widget-head { display: flex; @@ -390,12 +417,6 @@ body { .step-index.step-pending { display: flex; } - - &.active { - .step-index.step-pending { - background-color: var(--fg-color); - } - } } &.complete { @@ -418,7 +439,11 @@ body { &.active, &:hover { - background-color: var(--bg-light-gray); + background-color: var(--fg-color); + + .step-index { + background-color: var(--bg-color); + } .step-skip { visibility: visible; @@ -434,7 +459,7 @@ body { height: 20px; width: 20px; color: var(--text-on-light-gray); - background-color: var(--bg-light-gray); + background-color: var(--fg-color); margin-right: var(--margin-sm); border-radius: var(--border-radius-full); @@ -447,7 +472,7 @@ body { display: none; background-color: var(--primary); .icon use { - stroke: var(--white); + stroke: var(--var(--fg-color)); } } @@ -496,7 +521,7 @@ body { } } - @media (max-width: map-get($grid-breakpoints, "sm")) { + @media (max-width: map-get($grid-breakpoints, "md")) { .widget-body { flex-direction: column; .onboarding-steps-wrapper { @@ -513,9 +538,19 @@ body { &.shortcut-widget-box { cursor: pointer; - .widget-head { - margin-top: var(--margin-xs); - margin-bottom: 5px; + &:hover { + .widget-title { + color: var(--blue-500) !important; + } + + svg.icon-xs { + stroke: var(--blue-500) !important; + } + } + + .widget-title { + cursor: pointer !important; + font-size: var(--text-base) !important; } .indicator-pill { @@ -631,8 +666,8 @@ body { width: 18px; .icon-xs { - width: 8px; - height: 7px; + width: 10px; + height: 10px; } } @@ -757,6 +792,25 @@ body { } } +.workspace-sidebar-skeleton { + transition: ease; + .sidebar-box { + height: 40px; + margin-bottom: 10px; + margin-left: 10px; + background-color: var(--skeleton-bg); + + &.child { + margin-left: 30px; + } + + &.section { + height: 25px; + margin-left: 0px; + } + } +} + [data-page-route="Workspaces"] { @media (min-width: map-get($grid-breakpoints, "lg")) { .layout-main { @@ -764,7 +818,6 @@ body { .layout-side-section, .layout-main-section-wrapper { height: 100%; overflow-y: auto; - padding-right: 25px; scrollbar-color: var(--gray-200) transparent; [data-theme="dark"] & { scrollbar-color: var(--gray-800) transparent; @@ -783,7 +836,12 @@ body { } .layout-side-section { - margin-right: 20px; + padding-right: 15px; + } + + .layout-main-section { + padding: var(--padding-md); + margin-bottom: var(--margin-sm); } .desk-sidebar { @@ -792,9 +850,15 @@ body { } } + .layout-main-section { + background-color: var(--fg-color); + padding: var(--padding-sm); + border-radius: var(--border-radius-lg); + } + .block-menu-item-icon svg{ - width: 12px; - height: 12px; + width: 18px; + height: 18px; margin-right: 5px; } @@ -803,7 +867,6 @@ body { padding: 0px; .sidebar-item-control { - > * { align-self: center; margin-left: 3px; @@ -816,7 +879,7 @@ body { display: none; } - .delete-page { + .setting-btn, .duplicate-page { display: none; } @@ -824,13 +887,13 @@ body { padding: 10px 12px 10px 2px; } - .sidebar-info { - display: none; - } - svg { margin-right: 0; } + + .dropdown-list { + top: 42px; + } } .sidebar-item-label { @@ -846,6 +909,7 @@ body { } .sidebar-item-container { + position: relative; .sidebar-item-container{ margin-left: 10px; @@ -863,19 +927,14 @@ body { display: inline-block; } - .delete-page { - display: inline-block; - margin-right: 8px; - } - - .sidebar-info { + .setting-btn, .duplicate-page { display: inline-block; margin-right: 8px; } .drop-icon { padding: 10px 8px 10px 2px; - margin-left: -4px; + margin-left: -8px; } } @@ -899,11 +958,81 @@ body { margin: 0px -7px; padding-bottom: 20px !important; - .ce-block{ + .ce-block { width: 100%; padding-left: 0; padding-right: 0; + .ce-header b { + font-weight: 600 !important; + } + + .new-block-button { + position: absolute; + top: 14px; + left: -22px; + cursor: pointer; + visibility: hidden; + opacity: 0; + transition: visibility 0s, opacity 0.5s ease-in-out; + } + + .edit-mode { + .widget-control > *, .paragraph-control > * { + width: 0px; + visibility: hidden; + opacity: 0; + transition: visibility 0s, opacity 0.5s ease-in-out; + } + + .link-item { + pointer-events: none; + } + } + + &:hover { + .widget-control > *, .new-block-button { + width: auto; + visibility: visible; + opacity: 1; + } + } + + &.ce-block--focused { + .widget { + box-shadow: var(--shadow-base) !important; + + .widget-control > * { + width: auto; + visibility: visible; + opacity: 1; + } + + &.shortcut, &.header { + background-color: var(--fg-color) !important; + } + + &.onboarding { + background-color: var(--fg-color); + + .onboarding-step { + &.active, + &:hover { + background-color: var(--bg-color); + + .step-index.step-pending { + background-color: var(--fg-color); + } + } + + .step-index { + background-color: var(--bg-color); + } + } + } + } + } + &.ce-block--selected { .ce-block__content { background-color: inherit; @@ -923,50 +1052,125 @@ body { pointer-events: none; } - .ce-header { - padding: 0 !important; - margin-bottom: 0 !important; - flex: 1; + .resizer { + width: 10px; + height: 100%; + position:absolute; + right: 0; + bottom: 0; + cursor: col-resize; + border-color: transparent; + transition: border-color 0.3s ease-in-out; + + &:hover { + border-right: 3px solid var(--gray-400) !important; + } } - .widget{ - &.header { - display: flex; - justify-content: center; - flex: 1; - padding-left: 15px !important; - padding-right: 15px !important; - min-height: 50px; - box-shadow: none; - background-color: var(--control-bg); - color: var(--text-muted); + .ce-header { + padding-left: 7px !important; + margin-bottom: 0 !important; + flex: 1; + + &:focus { + outline: none; + } + } + + .block-list-container { + left: 20px; + top: 55px !important; + width: 200px !important; + } + + .dropdown-title { + padding: 6px 10px; + font-size: smaller; + cursor: default; + } + + .ce-paragraph[data-placeholder]:empty::before { + opacity: 1; + } + + .widget { + &.edit-mode { + padding: 7px 12px; + + &:hover { + box-shadow: var(--shadow-base); + background-color: var(--fg-color); + } + + &.spacer { + align-items: inherit; + color: var(--text-muted); + border: 1px dashed var(--gray-400); + cursor: pointer; + + .widget-control > * { + width: auto; + } + + .spacer-left { + min-width: 74px; + } + } } - &:focus { - outline: none; - } - - &.new-widget { - align-items: inherit; + &.spacer { + height: 18px !important; } &.ce-paragraph { display: block; } - .paragraph-control { - display: flex; - flex-direction: row-reverse; - position: absolute; - right: 20px; - gap: 5px; - background-color: var(--card-bg); - padding-left: 5px; + &.paragraph { + cursor: text; - .drag-handle { - cursor: all-scroll; - cursor: grabbing; + .ce-paragraph { + padding: 2px; } + + .paragraph-control { + display: flex; + flex-direction: row-reverse; + position: absolute; + right: 20px; + gap: 5px; + background-color: var(--card-bg); + padding-left: 5px; + + .drag-handle { + cursor: all-scroll; + cursor: grabbing; + } + } + } + + &.header { + display: flex; + justify-content: center; + flex: 1; + padding-left: 0px !important; + min-height: 40px; + box-shadow: none; + background-color: var(--control-bg); + color: var(--text-muted); + cursor: text; + + .ce-header { + padding-left: 14px !important; + } + } + + &.shortcut { + background-color: var(--control-bg); + } + + &:focus { + outline: none; } } } @@ -978,14 +1182,21 @@ body { } .ce-toolbar { + + &.ce-toolbar--opened { + display: none; + } + svg { fill: currentColor; } .icon { stroke: none; - width: fit-content; - height: fit-content; + + &.icon--plus { + width: 14px; + } } .ce-settings { @@ -993,6 +1204,10 @@ body { .ce-settings__button, .cdx-settings-button { color: #707684; + + .icon { + width: 14px; + } } .cdx-settings-button--active { @@ -1024,6 +1239,10 @@ body { .icon { fill: currentColor; } + + svg { + stroke: none; + } } @media (min-width: 1199px) { @@ -1037,25 +1256,63 @@ body { } } - @media (max-width: 1199px) { - .ce-block.col-4 { - flex: 0 0 50%; - max-width: 50%; - } - } - - @media (max-width: 750px) { - .ce-block.col-4 { - flex: 0 0 100%; - max-width: 100%; - } - } - @media (max-width: 750px) { - .ce-block.col-6 { - flex: 0 0 100%; - max-width: 100%; - } - } - } + + .cdx-marker { + background: rgba(245,235,111,0.29); + padding: 3px 0; + } + + .header-inline-tool { + border: none; + background-color: transparent; + margin-bottom: 2px; + } + + .header-level-select { + display: flex; + flex-direction: column; + padding: 6px; + } + + .header-level-select .header-level { + border: none; + background-color: transparent; + border-radius: var(--border-radius-sm); + padding: 6px; + margin: 2px 0px; + + &:hover { + background-color: var(--fg-hover-color); + } + } + + .dropdown-btn { + position: relative; + } + + .dropdown-list { + position: absolute; + background-color: var(--fg-color); + box-shadow: var(--shadow-base) !important; + border-radius: var(--border-radius-sm); + padding: 6px; + top: 30px; + right: 0; + width: 150px; + z-index: 1; + } + + .dropdown-list .dropdown-item { + cursor: pointer; + padding: 6px 10px; + font-size: small; + border-radius: var(--border-radius-sm); + margin: 1px 0px; + } + + .dropdown-item-icon { + margin-right: 5px; + } + } diff --git a/frappe/public/scss/desk/sidebar.scss b/frappe/public/scss/desk/sidebar.scss index 7430044878..82bd1cdf13 100644 --- a/frappe/public/scss/desk/sidebar.scss +++ b/frappe/public/scss/desk/sidebar.scss @@ -107,7 +107,7 @@ body[data-route^="Module"] .main-menu { cursor: pointer; .sidebar-image { - width: 100%; + width: min(100%, 170px); height: auto; max-height: 170px; object-fit: cover; diff --git a/frappe/public/scss/website/index.scss b/frappe/public/scss/website/index.scss index 970e9cab88..dcd11a6c76 100644 --- a/frappe/public/scss/website/index.scss +++ b/frappe/public/scss/website/index.scss @@ -31,12 +31,6 @@ @import 'my_account'; -body { - @include media-breakpoint-up(sm) { - background-color: var(--bg-color); - } -} - .ql-editor.read-mode { padding: 0; line-height: 1.6; diff --git a/frappe/public/scss/website/my_account.scss b/frappe/public/scss/website/my_account.scss index bdc52588aa..22b29cc3ec 100644 --- a/frappe/public/scss/website/my_account.scss +++ b/frappe/public/scss/website/my_account.scss @@ -1,7 +1,8 @@ //styles for my account and edit-profile page @include media-breakpoint-up(sm) { body[data-path="me"], - body[data-path="list"] { + body[data-path="list"], + body[data-path="update-profile"] { background-color: var(--bg-color); } } diff --git a/frappe/public/scss/website/web_form.scss b/frappe/public/scss/website/web_form.scss index cb79f88266..8f55bf8104 100644 --- a/frappe/public/scss/website/web_form.scss +++ b/frappe/public/scss/website/web_form.scss @@ -6,7 +6,7 @@ .breadcrumb-container.container { @include media-breakpoint-up(sm) { - padding-left: var(--padding-sm); + padding-left: 0; } } diff --git a/frappe/templates/includes/navbar/navbar_items.html b/frappe/templates/includes/navbar/navbar_items.html index 34cc24fe1a..dbc086f1f4 100644 --- a/frappe/templates/includes/navbar/navbar_items.html +++ b/frappe/templates/includes/navbar/navbar_items.html @@ -70,7 +70,7 @@ {% endif %} {% if show_sidebar and sidebar_items %} --@@ -110,10 +82,8 @@ export default class Widget {---+ ++
{% for item in sidebar_items -%}- diff --git a/frappe/tests/test_db_update.py b/frappe/tests/test_db_update.py index 4ae33a2fab..d2c54ef18c 100644 --- a/frappe/tests/test_db_update.py +++ b/frappe/tests/test_db_update.py @@ -34,6 +34,58 @@ class TestDBUpdate(unittest.TestCase): self.assertEqual(fieldtype, table_column.type) self.assertIn(cstr(table_column.default) or 'NULL', [cstr(default), "'{}'".format(default)]) + def test_index_and_unique_constraints(self): + doctype = "User" + frappe.reload_doctype('User', force=True) + frappe.model.meta.trim_tables('User') + + make_property_setter(doctype, 'restrict_ip', 'unique', '1', 'Int') + frappe.db.updatedb(doctype) + restrict_ip_in_table = get_table_column("User", "restrict_ip") + self.assertTrue(restrict_ip_in_table.unique) + + make_property_setter(doctype, 'restrict_ip', 'unique', '0', 'Int') + frappe.db.updatedb(doctype) + restrict_ip_in_table = get_table_column("User", "restrict_ip") + self.assertFalse(restrict_ip_in_table.unique) + + make_property_setter(doctype, 'restrict_ip', 'search_index', '1', 'Int') + frappe.db.updatedb(doctype) + restrict_ip_in_table = get_table_column("User", "restrict_ip") + self.assertTrue(restrict_ip_in_table.index) + + make_property_setter(doctype, 'restrict_ip', 'search_index', '0', 'Int') + frappe.db.updatedb(doctype) + restrict_ip_in_table = get_table_column("User", "restrict_ip") + self.assertFalse(restrict_ip_in_table.index) + + make_property_setter(doctype, 'restrict_ip', 'search_index', '1', 'Int') + make_property_setter(doctype, 'restrict_ip', 'unique', '1', 'Int') + frappe.db.updatedb(doctype) + restrict_ip_in_table = get_table_column("User", "restrict_ip") + self.assertTrue(restrict_ip_in_table.index) + self.assertTrue(restrict_ip_in_table.unique) + + make_property_setter(doctype, 'restrict_ip', 'search_index', '1', 'Int') + make_property_setter(doctype, 'restrict_ip', 'unique', '0', 'Int') + frappe.db.updatedb(doctype) + restrict_ip_in_table = get_table_column("User", "restrict_ip") + self.assertTrue(restrict_ip_in_table.index) + self.assertFalse(restrict_ip_in_table.unique) + + make_property_setter(doctype, 'restrict_ip', 'search_index', '0', 'Int') + make_property_setter(doctype, 'restrict_ip', 'unique', '1', 'Int') + frappe.db.updatedb(doctype) + restrict_ip_in_table = get_table_column("User", "restrict_ip") + self.assertFalse(restrict_ip_in_table.index) + self.assertTrue(restrict_ip_in_table.unique) + + # explicitly make a text index + frappe.db.add_index(doctype, ["email_signature(200)"]) + frappe.db.updatedb(doctype) + email_sig_column = get_table_column("User", "email_signature") + self.assertEqual(email_sig_column.index, 1) + def get_fieldtype_from_def(field_def): fieldtuple = frappe.db.type_map.get(field_def.fieldtype, ('', 0)) fieldtype = fieldtuple[0] @@ -69,4 +121,8 @@ def get_other_fields_meta(meta): fields = dict(default_fields_map, **optional_fields_map) field_map = [frappe._dict({'fieldname': field, 'fieldtype': _type, 'length': _length}) for field, (_type, _length) in fields.items()] - return field_map \ No newline at end of file + return field_map + +def get_table_column(doctype, fieldname): + table_columns = frappe.db.get_table_columns_description('tab{}'.format(doctype)) + return find(table_columns, lambda d: d.get('name') == fieldname) diff --git a/frappe/tests/test_patches.py b/frappe/tests/test_patches.py index 7f4efc700c..64e8684f55 100644 --- a/frappe/tests/test_patches.py +++ b/frappe/tests/test_patches.py @@ -1,7 +1,43 @@ -import unittest, frappe +import unittest +import frappe from frappe.modules import patch_handler +from unittest.mock import mock_open, patch + + +EMTPY_FILE = "" +EMTPY_SECTION = """ +[pre_model_sync] + +[post_model_sync] +""" +FILLED_SECTIONS = """ +[pre_model_sync] +app.module.patch1 +app.module.patch2 + +[post_model_sync] +app.module.patch3 + +""" +OLD_STYLE_PATCH_TXT = """ +app.module.patch1 +app.module.patch2 +app.module.patch3 +""" + +EDGE_CASES = """ +[pre_model_sync] +App.module.patch1 +app.module.patch2 # rerun +execute:frappe.db.updatedb("Item") +execute:frappe.function(arg="1") + +[post_model_sync] +app.module.patch3 +""" + class TestPatches(unittest.TestCase): def test_patch_module_names(self): frappe.flags.final_patches = [] @@ -15,3 +51,69 @@ class TestPatches(unittest.TestCase): self.assertTrue(frappe.get_attr(patchmodule.split()[0] + ".execute")) frappe.flags.in_install = False + + def test_get_patch_list(self): + pre = patch_handler.get_patches_from_app("frappe", patch_handler.PatchType.pre_model_sync) + post = patch_handler.get_patches_from_app("frappe", patch_handler.PatchType.post_model_sync) + all_patches = patch_handler.get_patches_from_app("frappe") + self.assertGreater(len(pre), 0) + self.assertGreater(len(post), 0) + + self.assertEqual(len(all_patches), len(pre) + len(post)) + + def test_all_patches_are_marked_completed(self): + all_patches = patch_handler.get_patches_from_app("frappe") + finished_patches = frappe.db.count("Patch Log") + + self.assertGreaterEqual(finished_patches, len(all_patches)) + + + +class TestPatchReader(unittest.TestCase): + @patch("builtins.open", new_callable=mock_open, read_data=EMTPY_FILE) + def test_empty_file(self, _file): + all_patches = patch_handler.get_patches_from_app("frappe") + pre = patch_handler.get_patches_from_app("frappe", patch_handler.PatchType.pre_model_sync) + post = patch_handler.get_patches_from_app("frappe", patch_handler.PatchType.post_model_sync) + self.assertEqual(all_patches, []) + self.assertEqual(pre, []) + self.assertEqual(post, []) + + + @patch("builtins.open", new_callable=mock_open, read_data=EMTPY_SECTION) + def test_empty_sections(self, _file): + all_patches = patch_handler.get_patches_from_app("frappe") + pre = patch_handler.get_patches_from_app("frappe", patch_handler.PatchType.pre_model_sync) + post = patch_handler.get_patches_from_app("frappe", patch_handler.PatchType.post_model_sync) + self.assertEqual(all_patches, []) + self.assertEqual(pre, []) + self.assertEqual(post, []) + + @patch("builtins.open", new_callable=mock_open, read_data=FILLED_SECTIONS) + def test_new_style(self, _file): + all_patches = patch_handler.get_patches_from_app("frappe") + pre = patch_handler.get_patches_from_app("frappe", patch_handler.PatchType.pre_model_sync) + post = patch_handler.get_patches_from_app("frappe", patch_handler.PatchType.post_model_sync) + self.assertEqual(all_patches, ["app.module.patch1", "app.module.patch2", "app.module.patch3"]) + self.assertEqual(pre, ["app.module.patch1", "app.module.patch2"]) + self.assertEqual(post, ["app.module.patch3",]) + + @patch("builtins.open", new_callable=mock_open, read_data=OLD_STYLE_PATCH_TXT) + def test_old_style(self, _file): + all_patches = patch_handler.get_patches_from_app("frappe") + pre = patch_handler.get_patches_from_app("frappe", patch_handler.PatchType.pre_model_sync) + post = patch_handler.get_patches_from_app("frappe", patch_handler.PatchType.post_model_sync) + self.assertEqual(all_patches, ["app.module.patch1", "app.module.patch2", "app.module.patch3"]) + self.assertEqual(pre, ["app.module.patch1", "app.module.patch2", "app.module.patch3"]) + self.assertEqual(post, []) + + + @patch("builtins.open", new_callable=mock_open, read_data=EDGE_CASES) + def test_new_style_edge_cases(self, _file): + pre = patch_handler.get_patches_from_app("frappe", patch_handler.PatchType.pre_model_sync) + self.assertEqual(pre, [ + "App.module.patch1", + "app.module.patch2 # rerun", + 'execute:frappe.db.updatedb("Item")', + 'execute:frappe.function(arg="1")', + ]) diff --git a/frappe/tests/test_twofactor.py b/frappe/tests/test_twofactor.py index a1a2bf9b9c..fadc61a551 100644 --- a/frappe/tests/test_twofactor.py +++ b/frappe/tests/test_twofactor.py @@ -222,9 +222,10 @@ def disable_2fa(): def toggle_2fa_all_role(state=None): '''Enable or disable 2fa for 'all' role on the system.''' all_role = frappe.get_doc('Role','All') - if state is None: - state = False if all_role.two_factor_auth == True else False - if state not in [True, False]: return + state = state if state is not None else False + if type(state) != bool: + return + all_role.two_factor_auth = cint(state) all_role.save(ignore_permissions=True) frappe.db.commit() diff --git a/frappe/translations/de.csv b/frappe/translations/de.csv index 1dc542f55d..0a541343f3 100644 --- a/frappe/translations/de.csv +++ b/frappe/translations/de.csv @@ -91,6 +91,7 @@ Field Name,Feldname, Fieldname,Feldname, Fields,Felder, First Name,Vorname, +First Day of the Week,Erster Wochentag, Frequency,Häufigkeit, Friday,Freitag, From,Von, @@ -1393,6 +1394,7 @@ Is Spam,ist Spam, Is Standard,Ist Standard, Is Submittable,Ist übertragbar, Is Table,ist eine Tabelle, +Is Template, Ist Vorlage, Is Your Company Address,Ist Ihre Unternehmensadresse, It is risky to delete this file: {0}. Please contact your System Manager.,"Es ist riskant, diese Datei zu löschen: {0}. Bitte kontaktieren Sie Ihren System-Manager.", Item cannot be added to its own descendents,Artikel kann nicht zu seinen eigenen Abkömmlingen hinzugefügt werden, diff --git a/frappe/utils/__init__.py b/frappe/utils/__init__.py index 351c0413ce..9deec0a77c 100644 --- a/frappe/utils/__init__.py +++ b/frappe/utils/__init__.py @@ -901,10 +901,11 @@ def dictify(arg): def add_user_info(user, user_info): if user not in user_info: info = frappe.db.get_value("User", - user, ["full_name", "user_image", "name", 'email'], as_dict=True) or frappe._dict() + user, ["full_name", "user_image", "name", 'email', 'time_zone'], as_dict=True) or frappe._dict() user_info[user] = frappe._dict( fullname = info.full_name or user, image = info.user_image, name = user, - email = info.email + email = info.email, + time_zone = info.time_zone ) diff --git a/frappe/utils/boilerplate.py b/frappe/utils/boilerplate.py index 6c405ce467..634c99de13 100755 --- a/frappe/utils/boilerplate.py +++ b/frappe/utils/boilerplate.py @@ -1,6 +1,11 @@ # Copyright (c) 2021, Frappe Technologies Pvt. Ltd. and Contributors # License: MIT. See LICENSE -import frappe, os, re, git + +import git +import os +import re + +import frappe from frappe.utils import touch_file, cstr def make_boilerplate(dest, app_name, no_git=False): @@ -57,6 +62,11 @@ def make_boilerplate(dest, app_name, no_git=False): frappe.create_folder(os.path.join(dest, hooks.app_name, hooks.app_name, "public", "js")) + # add .gitkeep file so that public folder is committed to git + # this is needed because if public doesn't exist, bench build doesn't symlink the apps assets + with open(os.path.join(dest, hooks.app_name, hooks.app_name, "public", ".gitkeep"), "w") as f: + f.write('') + with open(os.path.join(dest, hooks.app_name, hooks.app_name, "__init__.py"), "w") as f: f.write(frappe.as_unicode(init_template)) diff --git a/frappe/utils/redis_wrapper.py b/frappe/utils/redis_wrapper.py index dac9ab7a6d..9ca5bbfd4f 100644 --- a/frappe/utils/redis_wrapper.py +++ b/frappe/utils/redis_wrapper.py @@ -22,7 +22,7 @@ class RedisWrapper(redis.Redis): if shared: return key if user: - if user == True: + if user is True: user = frappe.session.user key = "user:{0}:{1}".format(user, key) diff --git a/frappe/website/doctype/web_form_field/web_form_field.json b/frappe/website/doctype/web_form_field/web_form_field.json index 2770f03e80..94a8851739 100644 --- a/frappe/website/doctype/web_form_field/web_form_field.json +++ b/frappe/website/doctype/web_form_field/web_form_field.json @@ -39,7 +39,7 @@ "fieldtype": "Select", "in_list_view": 1, "label": "Fieldtype", - "options": "Attach\nAttach Image\nCheck\nCurrency\nData\nDate\nDatetime\nDuration\nFloat\nHTML\nInt\nLink\nPassword\nRating\nSelect\nSmall Text\nText\nText Editor\nTable\nSection Break\nColumn Break" + "options": "Attach\nAttach Image\nCheck\nCurrency\nData\nDate\nDatetime\nDuration\nFloat\nHTML\nInt\nLink\nPassword\nRating\nSelect\nSmall Text\nText\nText Editor\nTable\nTime\nSection Break\nColumn Break" }, { "fieldname": "label", @@ -146,7 +146,7 @@ ], "istable": 1, "links": [], - "modified": "2021-04-30 12:02:25.422345", + "modified": "2022-01-24 20:43:25.422345", "modified_by": "Administrator", "module": "Website", "name": "Web Form Field", diff --git a/frappe/website/utils.py b/frappe/website/utils.py index d4d0cead63..fa95fbfbb0 100644 --- a/frappe/website/utils.py +++ b/frappe/website/utils.py @@ -5,9 +5,9 @@ import mimetypes import os import re from functools import wraps +from typing import Dict, Optional import yaml -from six import iteritems from werkzeug.wrappers import Response import frappe @@ -453,7 +453,7 @@ def cache_html(func): return cache_html_decorator -def build_response(path, data, http_status_code, headers=None): +def build_response(path, data, http_status_code, headers: Optional[Dict] = None): # build response response = Response() response.data = set_content_type(response, data, path) @@ -463,7 +463,7 @@ def build_response(path, data, http_status_code, headers=None): add_preload_headers(response) if headers: - for key, val in iteritems(headers): + for key, val in headers.items(): response.headers[key] = val.encode("ascii", errors="xmlcharrefreplace") return response diff --git a/frappe/website/workspace/website/website.json b/frappe/website/workspace/website/website.json index bd06f0a131..a0d9a817d4 100644 --- a/frappe/website/workspace/website/website.json +++ b/frappe/website/workspace/website/website.json @@ -1,6 +1,6 @@ { "charts": [], - "content": "[{\"type\": \"onboarding\", \"data\": {\"onboarding_name\":\"Website\", \"col\": 12}}, {\"type\": \"header\", \"data\": {\"text\": \"Your Shortcuts\", \"level\": 4, \"col\": 12}}, {\"type\": \"shortcut\", \"data\": {\"shortcut_name\": \"Blog Post\", \"col\": 4}}, {\"type\": \"shortcut\", \"data\": {\"shortcut_name\": \"Blogger\", \"col\": 4}}, {\"type\": \"shortcut\", \"data\": {\"shortcut_name\": \"Web Page\", \"col\": 4}}, {\"type\": \"shortcut\", \"data\": {\"shortcut_name\": \"Web Form\", \"col\": 4}}, {\"type\": \"shortcut\", \"data\": {\"shortcut_name\": \"Website Settings\", \"col\": 4}}, {\"type\": \"spacer\", \"data\": {\"col\": 12}}, {\"type\": \"header\", \"data\": {\"text\": \"Reports & Masters\", \"level\": 4, \"col\": 12}}, {\"type\": \"card\", \"data\": {\"card_name\": \"Setup\", \"col\": 4}}, {\"type\": \"card\", \"data\": {\"card_name\": \"Blog\", \"col\": 4}}, {\"type\": \"card\", \"data\": {\"card_name\": \"Web Site\", \"col\": 4}}, {\"type\": \"card\", \"data\": {\"card_name\": \"Portal\", \"col\": 4}}, {\"type\": \"card\", \"data\": {\"card_name\": \"Knowledge Base\", \"col\": 4}}]", + "content": "[{\"type\":\"onboarding\",\"data\":{\"onboarding_name\":\"Website\",\"col\":12}},{\"type\":\"header\",\"data\":{\"text\":\"Your Shortcuts\",\"col\":12}},{\"type\":\"shortcut\",\"data\":{\"shortcut_name\":\"Blog Post\",\"col\":3}},{\"type\":\"shortcut\",\"data\":{\"shortcut_name\":\"Blogger\",\"col\":3}},{\"type\":\"shortcut\",\"data\":{\"shortcut_name\":\"Web Page\",\"col\":3}},{\"type\":\"shortcut\",\"data\":{\"shortcut_name\":\"Web Form\",\"col\":3}},{\"type\":\"shortcut\",\"data\":{\"shortcut_name\":\"Website Settings\",\"col\":3}},{\"type\":\"spacer\",\"data\":{\"col\":12}},{\"type\":\"header\",\"data\":{\"text\":\"Reports & Masters\",\"col\":12}},{\"type\":\"card\",\"data\":{\"card_name\":\"Setup\",\"col\":4}},{\"type\":\"card\",\"data\":{\"card_name\":\"Blog\",\"col\":4}},{\"type\":\"card\",\"data\":{\"card_name\":\"Web Site\",\"col\":4}},{\"type\":\"card\",\"data\":{\"card_name\":\"Portal\",\"col\":4}},{\"type\":\"card\",\"data\":{\"card_name\":\"Knowledge Base\",\"col\":4}}]", "creation": "2020-03-02 14:13:51.089373", "docstatus": 0, "doctype": "Workspace", @@ -232,7 +232,7 @@ "type": "Link" } ], - "modified": "2021-08-05 12:16:03.154033", + "modified": "2022-01-13 17:49:41.527194", "modified_by": "Administrator", "module": "Website", "name": "Website", @@ -241,7 +241,7 @@ "public": 1, "restrict_to_domain": "", "roles": [], - "sequence_id": 28, + "sequence_id": 28.0, "shortcuts": [ { "color": "Green", diff --git a/frappe/www/printview.py b/frappe/www/printview.py index 569ebe27d6..bea1300764 100644 --- a/frappe/www/printview.py +++ b/frappe/www/printview.py @@ -2,9 +2,8 @@ # License: MIT. See LICENSE import frappe, os, copy, json, re -from frappe import _ +from frappe import _, get_module_path -from frappe.modules import get_doc_path from frappe.core.doctype.access_log.access_log import make_access_log from frappe.utils import cint, sanitize_html, strip_html from frappe.utils.jinja_globals import is_rtl @@ -251,8 +250,9 @@ def get_print_format(doctype, print_format): frappe.DoesNotExistError) # server, find template - path = os.path.join(get_doc_path(frappe.db.get_value("DocType", doctype, "module"), - "Print Format", print_format.name), frappe.scrub(print_format.name) + ".html") + module = print_format.module or frappe.db.get_value("DocType", doctype, "module") + path = os.path.join(get_module_path(module, "Print Format", print_format.name), + frappe.scrub(print_format.name) + ".html") if os.path.exists(path): with open(path, "r") as pffile: diff --git a/requirements.txt b/requirements.txt index e074224410..114ab5f61d 100644 --- a/requirements.txt +++ b/requirements.txt @@ -59,7 +59,6 @@ rq~=1.8.0 rsa>=4.1 # not directly required, pinned by Snyk to avoid a vulnerability schedule~=1.1.0 semantic-version~=2.8.5 -six~=1.15.0 sqlparse~=0.4.1 stripe~=2.56.0 terminaltables~=3.1.0 diff --git a/yarn.lock b/yarn.lock index a2fb689c7d..18a8610a2a 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2774,15 +2774,10 @@ nan@^2.13.2: resolved "https://registry.yarnpkg.com/nan/-/nan-2.14.1.tgz#d7be34dfa3105b91494c3147089315eff8874b01" integrity sha512-isWHgVjnFjh2x2yuJ/tj3JbwoHu3UC2dX5G/88Cm24yB6YopVgxvBObDY7n5xW6ExmFhJpSEQqFPvq9zaXc8Jw== -nanoid@^3.1.22: - version "3.1.22" - resolved "https://registry.yarnpkg.com/nanoid/-/nanoid-3.1.22.tgz#b35f8fb7d151990a8aebd5aa5015c03cf726f844" - integrity sha512-/2ZUaJX2ANuLtTvqTlgqBQNJoQO398KyJgZloL0PZkC0dpysjncRUPsFe3DUPzz/y3h+u7C46np8RMuvF3jsSQ== - -nanoid@^3.1.23: - version "3.1.23" - resolved "https://registry.yarnpkg.com/nanoid/-/nanoid-3.1.23.tgz#f744086ce7c2bc47ee0a8472574d5c78e4183a81" - integrity sha512-FiB0kzdP0FFVGDKlRLEQ1BgDzU87dy5NnzjeW9YZNt+/c3+q82EQDUwniSAUxp/F0gFNI1ZhKU1FqYsMuqZVnw== +nanoid@^3.1.22, nanoid@^3.1.23: + version "3.2.0" + resolved "https://registry.yarnpkg.com/nanoid/-/nanoid-3.2.0.tgz#62667522da6673971cca916a6d3eff3f415ff80c" + integrity sha512-fmsZYa9lpn69Ad5eDn7FMcnnSR+8R34W9qJEijxYhTbfOWzr22n1QxCMzXLK+ODyW2973V3Fux959iQoUxzUIA== native-request@^1.0.5: version "1.0.8"