From 2c42238f7f5ef50e03abc58a25dc0436580662d7 Mon Sep 17 00:00:00 2001
From: Kushagra Gour <chinchang457@gmail.com>
Date: Sat, 2 Jun 2018 11:11:00 +0530
Subject: [PATCH] call setPreviewContent only when required instead of
 componentUpdate callback

---
 webmaker/src/components/ContentWrap.jsx |  6 +++---
 webmaker/src/components/app.jsx         | 17 +++++++++--------
 2 files changed, 12 insertions(+), 11 deletions(-)

diff --git a/webmaker/src/components/ContentWrap.jsx b/webmaker/src/components/ContentWrap.jsx
index 3e449db..dea8b3d 100644
--- a/webmaker/src/components/ContentWrap.jsx
+++ b/webmaker/src/components/ContentWrap.jsx
@@ -2,7 +2,7 @@ import { h, Component } from 'preact';
 import UserCodeMirror from './UserCodeMirror.jsx';
 import { computeHtml, computeCss, computeJs } from '../computes';
 import { HtmlModes, CssModes, JsModes } from '../codeModes';
-
+import { log } from '../utils';
 const BASE_PATH = chrome.extension || window.DEBUG ? '/' : '/app';
 
 export default class ContentWrap extends Component {
@@ -256,7 +256,7 @@ export default class ContentWrap extends Component {
 			css: this.cmCodes.css,
 			js: this.cmCodes.js
 		};
-		// utils.log('🔎 setPreviewContent', isForced);
+		log('🔎 setPreviewContent', isForced);
 		const targetFrame = this.detachedWindow
 			? this.detachedWindow.document.querySelector('iframe')
 			: this.frame;
@@ -295,7 +295,7 @@ export default class ContentWrap extends Component {
 		this.cm.html.setValue(this.cmCodes.html || '');
 		this.cm.css.setValue(this.cmCodes.css || '');
 		this.cm.js.setValue(this.cmCodes.js || '');
-		this.setPreviewContent(true);
+		// this.setPreviewContent(true);
 		// console.log('componentdidupdate', this.props.currentItem);
 	}
 	componentDidMount() {
diff --git a/webmaker/src/components/app.jsx b/webmaker/src/components/app.jsx
index c4d71bb..d838916 100644
--- a/webmaker/src/components/app.jsx
+++ b/webmaker/src/components/app.jsx
@@ -194,7 +194,7 @@ export default class App extends Component {
 			layoutMode: this.state.currentLayoutMode
 		});
 		this.refreshEditor();
-		// alertsService.add('New item created');
+		alertsService.add('New item created');
 	}
 	setCurrentItem(item) {
 		this.state.currentItem = item;
@@ -329,7 +329,7 @@ export default class App extends Component {
 				event.keyCode === 53
 			) {
 				event.preventDefault();
-				// scope.setPreviewContent(true, true);
+				this.contentWrap.setPreviewContent(true, true);
 				trackEvent('ui', 'previewKeyboardShortcut');
 			} else if ((event.ctrlKey || event.metaKey) && event.keyCode === 79) {
 				// Ctrl/⌘ + O
@@ -381,7 +381,7 @@ export default class App extends Component {
 			var blob = new Blob([fileContent], { type: 'text/html;charset=UTF-8' });
 			utils.downloadFile(fileName, blob);
 
-			// trackEvent('fn', 'saveFileComplete');
+			trackEvent('fn', 'saveFileComplete');
 		});
 	}
 
@@ -400,7 +400,8 @@ export default class App extends Component {
 		this.setState({
 			currentItem: { ...this.state.currentItem }
 		});
-		// alertsService.add('Libraries updated.');
+		this.contentWrap.setPreviewContent(true);
+		alertsService.add('Libraries updated.');
 	}
 	updateExternalLibCount() {
 		// Calculate no. of external libs
@@ -435,12 +436,12 @@ export default class App extends Component {
 		document.body.classList.add('layout-' + mode);
 
 		// resetSplitting();
-		// scope.setPreviewContent(true);
+		this.contentWrap.setPreviewContent(true);
 	}
 
 	layoutBtnClickHandler(layoutId) {
 		// saveSetting('layoutMode', mode);
-		// trackEvent('ui', 'toggleLayoutClick', mode);
+		trackEvent('ui', 'toggleLayoutClick', mode);
 		this.toggleLayout(layoutId);
 	}
 	saveSetting(setting, value) {
@@ -565,7 +566,7 @@ export default class App extends Component {
 			// We always save locally so that it gets fetched
 			// faster on future loads.
 			db.sync.set(obj, function() {
-				// alertsService.add('Setting saved');
+				alertsService.add('Setting saved');
 			});
 			if (window.user) {
 				window.db.getDb().then(remoteDb => {
@@ -581,7 +582,7 @@ export default class App extends Component {
 						.catch(error => utils.log(error));
 				});
 			}
-			// trackEvent('ui', 'updatePref-' + settingName, prefs[settingName]);
+			trackEvent('ui', 'updatePref-' + settingName, prefs[settingName]);
 		}
 
 		const prefs = this.state.prefs;