Refactor how creation are saved and loaded back.

Things were a lil convoluted. There were 2 methods of loading:
from `code` key and from item-* key. Now we load from code always.
This is assuming that `code` key always has last saved item. This meant
that last item should be saved in `code` key reliably.
So every save writes `code` key as well now.

This also changes behavior for user that you cannot reload without saving. Otherwise
changes are gone.

src/components/app.jsx

@@ -179,11 +179,18 @@ export default class App extends Component {
 	componentWillMount() {
 		var lastCode;
 		window.onunload = () => {
-			this.saveCode('code');
 			if (this.detachedWindow) {
 				this.detachedWindow.close();
 			}
 		};
+		window.onbeforeunload = event => {
+			if (this.state.unsavedEditCount) {
+				console.log(9999999999);
+				event.preventDefault();
+				// Chrome requires returnValue to be set.
+				event.returnValue = '';
+			}
+		};
 
 		db.local.get(
 			{
@@ -203,24 +210,8 @@ export default class App extends Component {
 			if (result.preserveLastCode && lastCode) {
 				this.setState({ unsavedEditCount: 0 });
 
-				// For web app environment we don't fetch item from localStorage,
+				log('Load last unsaved item', lastCode);
-				// because the item isn't stored in the localStorage.
+				this.setCurrentItem(lastCode).then(() => this.refreshEditor());
-				if (lastCode.id && window.IS_EXTENSION) {
-					// In case of already saved item (with id), we fetch it from
-					// its real key instead of using `code` for better reliability.
-					// because `code` sets only on shady unloadbefore.
-					db.local.get(lastCode.id, itemResult => {
-						if (itemResult[lastCode.id]) {
-							log('Load item ', lastCode.id);
-							this.setCurrentItem(itemResult[lastCode.id]).then(() =>
-								this.refreshEditor()
-							);
-						}
-					});
-				} else {
-					log('Load last unsaved item', lastCode);
-					this.setCurrentItem(lastCode).then(() => this.refreshEditor());
-				}
 			} else {
 				this.createNewItem();
 			}
@@ -306,12 +297,15 @@ export default class App extends Component {
 		this.updateExternalLibCount();
 		this.contentWrap.refreshEditor();
 	}
+	askForUnsavedChanges() {
+		return confirm(
+			'You have unsaved changes in your current work. Do you want to discard unsaved changes and continue?'
+		);
+	}
 	// Creates a new item with passed item's contents
 	forkItem(sourceItem) {
 		if (this.state.unsavedEditCount) {
-			var shouldDiscard = confirm(
+			var shouldDiscard = this.askForUnsavedChanges();
-				'You have unsaved changes in your current work. Do you want to discard unsaved changes and continue?'
-			);
 			if (!shouldDiscard) {
 				return;
 			}
@@ -782,6 +776,11 @@ export default class App extends Component {
 		log('saving key', key || currentItem.id, currentItem);
 
 		function onSaveComplete() {
+			// No feedback on saving `code` key. Its just to silently preserve
+			// last written code.
+			if (key === 'code') {
+				return;
+			}
 			if (window.user && !navigator.onLine) {
 				alertsService.add(
 					'Item saved locally. Will save to account when you are online.'

src/itemService.js

@@ -90,26 +90,24 @@ export const itemService = {
 	async setItem(id, item) {
 		const d = deferred();
 		var remotePromise;
-		// TODO: check why we need to save locally always?
-		const obj = {
-			[id]: item
-		};
-		db.local.set(obj, () => {
-			// Is extension OR is app but logged out OR is logged in but offline
-			// If logged in but offline, resolve immediately so
-			// that you see the feedback msg immediately and not wait for
-			// later sync.
-			if (window.IS_EXTENSION || !window.user || !navigator.onLine) {
-				d.resolve();
-			}
-		});
 
-		// If `id` is `code`, this is a call on unloadbefore to save the last open thing.
+		// Always persist in `code` key for `preserveLastOpenItem` setting.
-		// Do not presist that on remote.
+		// This key is used to retrieve content of last open item.
-		if (id === 'code') {
+		db.local.set({ code: item }, () => {});
-			// No deferred required here as this gets called on unloadbefore
+
-			return false;
+		// NOT LOGGED IN
+		// If `id` is `code`, this is a call on unloadbefore to save the last open thing,
+		// which needs to be persisted locally only.
+		if (!window.user || id === 'code') {
+			const obj = {
+				[id]: item
+			};
+			db.local.set(obj, () => {
+				d.resolve();
+			});
+			return d.promise;
 		}
+
 		if (window.user) {
 			var remoteDb = await window.db.getDb();
 			log(`Starting to save item ${id}`);
@@ -125,9 +123,13 @@ export const itemService = {
 					d.resolve();
 				})
 				.catch(d.reject);
-		}
 
-		return window.user && navigator.onLine ? remotePromise : d.promise;
+			// logged in but offline, we resolve immediately so
+			// that you see the feedback msg immediately and not wait for
+			// later sync.
+			if (!navigator.onLine) return Promise.resolve();
+			return remotePromise;
+		}
 	},
 
 	/**