From 2ce2e1b6b0822269b6449cc1807e8219964feb97 Mon Sep 17 00:00:00 2001 From: Faris Ansari Date: Fri, 17 Aug 2018 18:39:36 +0530 Subject: [PATCH] feat(messages): split messages into buying and selling - messages will be organized by their purpose, i.e Buying and Selling - on clicking the buying item, the message room page will be opened where sellers can communicate - invalidate cache using event key --- .../public/js/hub/components/detail_view.js | 10 +- erpnext/public/js/hub/components/item_card.js | 7 +- erpnext/public/js/hub/hub_call.js | 11 +- erpnext/public/js/hub/pages/favourites.js | 8 +- erpnext/public/js/hub/pages/item.js | 12 ++ erpnext/public/js/hub/pages/messages.js | 171 ++++++++---------- 6 files changed, 116 insertions(+), 103 deletions(-) diff --git a/erpnext/public/js/hub/components/detail_view.js b/erpnext/public/js/hub/components/detail_view.js index 9ef48d4d0a..cd734058aa 100644 --- a/erpnext/public/js/hub/components/detail_view.js +++ b/erpnext/public/js/hub/components/detail_view.js @@ -33,6 +33,12 @@ function get_detail_view_html(item, allow_edit) { ${__('Saved')} `; + const contact_seller_button = item.hub_seller !== hub.settings.company_email + ? `` + : ''; + let menu_items = ''; if(allow_edit) { @@ -69,9 +75,7 @@ function get_detail_view_html(item, allow_edit) {
${favourite_button} - + ${contact_seller_button}
diff --git a/erpnext/public/js/hub/components/item_card.js b/erpnext/public/js/hub/components/item_card.js index f7f5975db6..9f5a6ef683 100644 --- a/erpnext/public/js/hub/components/item_card.js +++ b/erpnext/public/js/hub/components/item_card.js @@ -15,11 +15,16 @@ function get_item_card_html(item) { let dot_spacer = ''; subtitle = subtitle.join(dot_spacer); + // route + if (!item.route) { + item.route = `marketplace/item/${item.hub_item_code}` + } + const item_html = `
+ data-route="${item.route}">
diff --git a/erpnext/public/js/hub/hub_call.js b/erpnext/public/js/hub/hub_call.js index d2eaab31b4..042569d874 100644 --- a/erpnext/public/js/hub/hub_call.js +++ b/erpnext/public/js/hub/hub_call.js @@ -2,7 +2,7 @@ frappe.provide('hub'); frappe.provide('erpnext.hub'); erpnext.hub.cache = {}; -hub.call = function call_hub_method(method, args={}, setup_cache_invalidation = invalidate_after_5_mins) { +hub.call = function call_hub_method(method, args={}, clear_cache_on_event) { return new Promise((resolve, reject) => { // cache @@ -13,7 +13,14 @@ hub.call = function call_hub_method(method, args={}, setup_cache_invalidation = // cache invalidation const clear_cache = () => delete erpnext.hub.cache[key]; - setup_cache_invalidation(clear_cache); + + if (!clear_cache_on_event) { + invalidate_after_5_mins(clear_cache); + } else { + erpnext.hub.on(clear_cache_on_event, () => { + clear_cache(key) + }); + } frappe.call({ method: 'erpnext.hub_node.api.call_hub_method', diff --git a/erpnext/public/js/hub/pages/favourites.js b/erpnext/public/js/hub/pages/favourites.js index 566f5b0e21..ae08a6813c 100644 --- a/erpnext/public/js/hub/pages/favourites.js +++ b/erpnext/public/js/hub/pages/favourites.js @@ -26,11 +26,9 @@ erpnext.hub.Favourites = class Favourites extends SubPage { } get_favourites() { - return hub.call( - 'get_favourite_items_of_seller', - { hub_seller: hub.settings.company_email }, - clear_cache => erpnext.hub.on('action:item_favourite', clear_cache) - ); + return hub.call('get_favourite_items_of_seller', { + hub_seller: hub.settings.company_email + }, 'action:item_favourite'); } render(items) { diff --git a/erpnext/public/js/hub/pages/item.js b/erpnext/public/js/hub/pages/item.js index a94d5845b0..71a4b0f5c3 100644 --- a/erpnext/public/js/hub/pages/item.js +++ b/erpnext/public/js/hub/pages/item.js @@ -105,6 +105,18 @@ erpnext.hub.Item = class Item extends SubPage { ], primary_action: ({ message }) => { if (!message) return; + + hub.call('send_message', { + from_seller: hub.settings.company_email, + to_seller: this.item.hub_seller, + hub_item: this.item.hub_item_code, + message + }) + .then(() => { + d.hide(); + frappe.set_route('marketplace', 'messages'); + erpnext.hub.trigger('action:send_message') + }); } }); diff --git a/erpnext/public/js/hub/pages/messages.js b/erpnext/public/js/hub/pages/messages.js index 8531e0b3f9..a1f734f6ef 100644 --- a/erpnext/public/js/hub/pages/messages.js +++ b/erpnext/public/js/hub/pages/messages.js @@ -1,118 +1,105 @@ import SubPage from './subpage'; -import { make_search_bar } from '../components/search_bar'; +import { get_item_card_container_html } from '../components/items_container'; +import { get_empty_state } from '../components/empty_state'; erpnext.hub.Messages = class Messages extends SubPage { - make_wrapper() { - super.make_wrapper(); + make_wrapper() { + super.make_wrapper(); + } - const html = ` -
-
-
-
-
- ${get_message_area_html()} -
-
- `; + refresh() { + const res = Promise.all([ + this.get_buying_items(), + this.get_selling_items() + ]); - make_search_bar({ - wrapper: this.$wrapper, - on_search: keyword => { + res.then(([buying_items, selling_items]) => { + this.empty(); - }, - placeholder: __('Search for messages') - }) + if (buying_items.length) { + buying_items.map(item => { + item.route = `marketplace/buy/${item.hub_item_code}` + }) + this.render(buying_items, __('Buying')); + } - this.$wrapper.append(html); + if (selling_items.length) { + // selling_items.map(item => { + // item.route = `marketplace/sell/${item.hub_item_code}/${}` + // }); + this.render(selling_items, __('Selling')); + } - this.message_input = new frappe.ui.CommentArea({ - parent: this.$wrapper.find('.message-input'), - on_submit: (message) => { - this.message_input.reset(); + if (!buying_items.length && !selling_items.length) { + this.render_empty_state(); + } + }); + } - // append message html - const $message_list = this.$wrapper.find('.message-list'); - const message_html = get_message_html({ - sender: hub.settings.company_email, - content: message - }); - $message_list.append(message_html); - frappe.dom.scroll_to_bottom($message_list); + render(items = [], title) { + const html = get_item_card_container_html(items, title); + this.$wrapper.append(html); + } - const to_seller = frappe.get_route()[2]; - hub.call('send_message', { - from_seller: hub.settings.company_email, - to_seller, - message - }); - }, - no_wrapper: true - }); - } + render_empty_state() { + const empty_state = get_empty_state(__('You haven\'t interacted with any seller yet.')); + this.$wrapper.html(empty_state); + } - refresh() { - this.get_interactions() - .then(sellers => { - const html = sellers.map(get_list_item_html).join(''); - this.$wrapper.find('.seller-list').html(html); - }); + get_buying_items() { + return hub.call('get_buying_items_for_messages', {}, 'action:send_message'); + } - this.get_messages() - .then(messages => { - const $message_list = this.$wrapper.find('.message-list'); - const html = messages.map(get_message_html).join(''); - $message_list.html(html); - frappe.dom.scroll_to_bottom($message_list); - }); - } + get_selling_items() { + return hub.call('get_selling_items_for_messages'); + } - get_interactions() { - return hub.call('get_sellers_with_interactions', { for_seller: hub.settings.company_email }); - } + get_interactions() { + return hub.call('get_sellers_with_interactions', { for_seller: hub.settings.company_email }); + } - get_messages() { - const against_seller = frappe.get_route()[2]; - if (!against_seller) return Promise.resolve([]); + get_messages() { + const against_seller = frappe.get_route()[2]; + if (!against_seller) return Promise.resolve([]); - return hub.call('get_messages', { - for_seller: hub.settings.company_email, - against_seller: against_seller - }); - } + return hub.call('get_messages', { + for_seller: hub.settings.company_email, + against_seller: against_seller + }); + } } function get_message_area_html() { - return ` -
-
-
-
-
-
- `; + return ` +
+
+
+
+
+
+ `; } function get_list_item_html(seller) { - const active_class = frappe.get_route()[2] === seller.email ? 'active' : ''; + const active_class = frappe.get_route()[2] === seller.email ? 'active' : ''; - return ` -
-
- -
-
- ${seller.company} -
-
- `; + return ` +
+
+ +
+
+ ${seller.company} +
+
+ `; } function get_message_html(message) { - return ` -
-
${message.sender}
-

${message.content}

-
- `; + return ` +
+
${message.sender}
+

${message.content}

+
+ `; }