[hub][feat] Edit your Profile, recycle profile dialog

erpnext/public/js/hub/components/profile_dialog.js

@@ -1,4 +1,4 @@
-const ProfileDialog = (title = __('Edit Profile'), action={}) => {
+const ProfileDialog = (title = __('Edit Profile'), action={}, initial_values={}) => {
     const fields = [
         {
             fieldtype: 'Link',
@@ -63,6 +63,8 @@ const ProfileDialog = (title = __('Edit Profile'), action={}) => {
         }
     });
 
+    dialog.set_values(initial_values);
+
     // Post create
     const default_company = frappe.defaults.get_default('company');
     dialog.set_value('company', default_company);

erpnext/public/js/hub/marketplace.js

@@ -230,12 +230,15 @@ erpnext.hub.Marketplace = class Marketplace {
 	}
 
 	show_register_dialog() {
-		this.profile_dialog = ProfileDialog(__('Become a Seller'), {
+		this.register_dialog = ProfileDialog(
+			__('Become a Seller'),
+			{
 				label: __('Register'),
 				on_submit: this.register_seller.bind(this)
-		});
+			}
+		);
 
-		this.profile_dialog.show();
+		this.register_dialog.show();
 	}
 
 	register_seller(form_values) {
@@ -244,7 +247,7 @@ erpnext.hub.Marketplace = class Marketplace {
 		    args: form_values,
 		    btn: $(e.currentTarget)
 		}).then(() => {
-			this.profile_dialog.hide();
+			this.register_dialog.hide();
 			frappe.set_route('marketplace', 'publish');
 
 		    // custom jquery event

erpnext/public/js/hub/pages/profile.js

@@ -1,5 +1,6 @@
 import SubPage from './subpage';
 import { get_detail_skeleton_html } from '../components/skeleton_state';
+import { ProfileDialog } from '../components/profile_dialog';
 
 erpnext.hub.Profile = class Profile extends SubPage {
 	make_wrapper() {
@@ -10,21 +11,16 @@ erpnext.hub.Profile = class Profile extends SubPage {
 	refresh() {
 		this.show_skeleton();
 		this.get_hub_seller_profile(this.keyword)
-			.then(profile => this.render(profile));
+			.then(profile => {
+				this.edit_profile_dialog.set_values(profile);
+				this.render(profile);
+			});
 	}
 
 	get_hub_seller_profile() {
 		return hub.call('get_hub_seller_profile', { hub_seller: hub.settings.company_email });
 	}
 
-	make_edit_profile_dialog() {
-		// this.edit_profile_dialog = new
-	}
-
-	edit_profile() {
-		//
-	}
-
 	show_skeleton() {
 		this.$wrapper.html(get_detail_skeleton_html());
 	}
@@ -98,6 +94,33 @@ erpnext.hub.Profile = class Profile extends SubPage {
 		this.$wrapper.html(profile_html);
 	}
 
+	make_edit_profile_dialog() {
+		this.edit_profile_dialog = ProfileDialog(
+			__('Edit Profile'),
+			{
+				label: __('Update'),
+				on_submit: this.update_profile.bind(this)
+			}
+		);
+	}
+
+	edit_profile() {
+		this.edit_profile_dialog.set_values({
+			company_email: hub.settings.company_email
+		});
+		this.edit_profile_dialog.show();
+	}
+
+	update_profile(new_values) {
+		hub.call('update_profile', {
+			hub_seller: hub.settings.company_email,
+			updated_profile: new_values
+		}).then(new_profile => {
+				this.edit_profile_dialog.hide();
+				this.render(new_profile);
+			});
+	}
+
 	get_timeline_log_item(pretty_date, message, icon) {
 		return `<div class="media timeline-item  notification-content">
 			<div class="small">

erpnext/public/js/hub/pages/subpage.js

@@ -3,6 +3,16 @@ export default class SubPage {
 		this.$parent = $(parent);
 		this.make_wrapper(options);
 
+		// generic action handler
+		this.$wrapper.on('click', '[data-action]', e => {
+			const $target = $(e.currentTarget);
+			const action = $target.data().action;
+
+			if (action && this[action]) {
+				this[action].apply(this, $target);
+			}
+		})
+
 		// handle broken images after every render
 		if (this.render) {
 			this._render = this.render.bind(this);