[hub] UI and empty state in 'your products' to guide on publishing
diff --git a/erpnext/public/js/hub/components/ItemCardsContainer.vue b/erpnext/public/js/hub/components/ItemCardsContainer.vue
index 748c272..0a20bcd 100644
--- a/erpnext/public/js/hub/components/ItemCardsContainer.vue
+++ b/erpnext/public/js/hub/components/ItemCardsContainer.vue
@@ -3,8 +3,9 @@
<empty-state
v-if="items.length === 0"
:message="empty_state_message"
+ :action="empty_state_action"
:bordered="true"
- :height="80"
+ :height="empty_state_height"
/>
<item-card
v-for="item in items"
@@ -36,6 +37,7 @@
editable: Boolean,
empty_state_message: String,
+ empty_state_action: Object,
empty_state_height: Number,
empty_state_bordered: Boolean
},
diff --git a/erpnext/public/js/hub/pages/PublishedProducts.vue b/erpnext/public/js/hub/pages/PublishedProducts.vue
index 561dab2..1da5ffb 100644
--- a/erpnext/public/js/hub/pages/PublishedProducts.vue
+++ b/erpnext/public/js/hub/pages/PublishedProducts.vue
@@ -3,7 +3,23 @@
class="marketplace-page"
:data-page-name="page_name"
>
- <h5>{{ page_title }}</h5>
+ <section-header>
+ <div>
+ <h5>{{ page_title }}</h5>
+ <p v-if="items.length"
+ class="text-muted margin-bottom">
+ {{ published_items_message }}
+ </p>
+ </div>
+
+ <button v-if="items.length"
+ class="btn btn-default btn-xs publish-items"
+ v-route="'marketplace/publish'"
+ >
+ <span>{{ publish_button_text }}</span>
+ </button>
+
+ </section-header>
<item-cards-container
:container_name="page_title"
@@ -11,6 +27,7 @@
:item_id_fieldname="item_id_fieldname"
:on_click="go_to_item_details_page"
:empty_state_message="empty_state_message"
+ :empty_state_action="publish_page_action"
>
</item-cards-container>
</div>
@@ -25,8 +42,17 @@
items: [],
item_id_fieldname: 'name',
+ publish_page_action: {
+ label: __('Publish Your First Items'),
+ on_click: () => {
+ frappe.set_route(`marketplace/home`);
+ }
+ },
+
// Constants
- page_title: __('Published Products'),
+ page_title: __('Published Items'),
+ publish_button_text: __('Publish More Items'),
+ published_items_message: __('You can publish upto 200 items.'),
// TODO: Add empty state action
empty_state_message: __(`You haven't published any products yet. Publish.`)
};