port remoteItem code to itemService and some refactor

src/index.html

@@ -73,6 +73,9 @@
 						    <path d="M13,9V3.5L18.5,9M6,2C4.89,2 4,2.89 4,4V20A2,2 0 0,0 6,22H18A2,2 0 0,0 20,20V8L14,2H6Z" />
 						</svg>Open
 					</a>
+					<a>
+						<img width="20" src="https://www.gravatar.com/avatar/6be4e636e8aacd405bed5cd15124a875" class="main-header__avatar-img"/>
+					</a>
 				</div>
 			</div>
 			<div class="content-wrap  flex  flex-grow">

src/itemService.js

@@ -8,36 +8,51 @@
 		},
 
 		async getAllItems() {
-			var db = await window.db.getDb();
+			var d = deferred();
+			var remoteDb = await window.db.getDb();
 
-			return db
+			remoteDb
 				.doc(`users/${window.user.uid}`)
 				.get()
 				.then(doc => {
 					return doc.data().items;
 				})
-				.then(async itemIds => {
+				.then(itemIdsObj => {
+					var itemIds = Object.getOwnPropertyNames(itemIdsObj || {});
 					console.log('itemids', itemIds);
+
+					if (!itemIds.length) {
+						d.resolve([]);
+					}
+
 					var items = [];
-					for (var id in itemIds) {
-						var item = await this.getItem(id);
+					for (let i = 0; i < itemIds.length; i++) {
+						const id = itemIds[i];
+						utils.log('Starting to fetch item ', id);
+						this.getItem(id).then(item => {
 							items.push(item);
+							// Check if we have all items now.
+							if (itemIds.length === items.length) {
+								d.resolve(items);
+							}
+						});
 					}
 					return items;
 				});
+			return d.promise;
 		},
 
 		async setUser() {
-			var db = await window.db.getDb();
-			return db.doc(`users/${window.user.uid}`).set({
+			const remoteDb = await window.db.getDb();
+			return remoteDb.doc(`users/${window.user.uid}`).set({
 				items: {}
 			});
 		},
 
 		async setItem(id, item) {
-			var db = await window.db.getDb();
+			var remoteDb = await window.db.getDb();
 			console.log(`Starting to save item ${id}`);
-			return db
+			return remoteDb
 				.collection('items')
 				.doc(id)
 				.set(item, {
@@ -49,9 +64,27 @@
 				.catch(error => console.log(error));
 		},
 
+		async removeItem(id) {
+			if (window.IS_EXTENSION) {
+				var d = deferred();
+				db.local.remove(id, d.resolve);
+				return d.promise;
+			}
+			const remoteDb = await window.db.getDb();
+			console.log(`Starting to save item ${id}`);
+			return remoteDb
+				.collection('items')
+				.doc(id)
+				.delete()
+				.then(arg => {
+					console.log('Document removed', arg);
+				})
+				.catch(error => console.log(error));
+		},
+
 		async setItemForUser(itemId) {
-			var db = await window.db.getDb();
-			return db
+			var remoteDb = await window.db.getDb();
+			return remoteDb
 				.collection('users')
 				.doc(window.user.uid)
 				.update({
@@ -61,6 +94,33 @@
 					console.log(`Item ${itemId} set for user`, arg);
 				})
 				.catch(error => console.log(error));
+		},
+
+		async unsetItemForUser(itemId) {
+			if (window.IS_EXTENSION) {
+				return window.db.local.get(
+					{
+						items: {}
+					},
+					function(result) {
+						delete result.items[itemId];
+						db.local.set({
+							items: result.items
+						});
+					}
+				);
+			}
+			const remoteDb = await window.db.getDb();
+			return remoteDb
+				.collection('users')
+				.doc(window.user.uid)
+				.update({
+					[`items.${itemId}`]: firebase.firestore.FieldValue.delete()
+				})
+				.then(arg => {
+					console.log(`Item ${itemId} unset for user`, arg);
+				})
+				.catch(error => console.log(error));
 		}
 	};
 })();

src/script.js

@@ -483,6 +483,7 @@ globalConsoleContainerEl, externalLibrarySearchInput, keyboardShortcutsModal
 		var items = [];
 		if (!window.IS_EXTENSION) {
 			items = await itemService.getAllItems();
+
 			if (shouldSaveGlobally) {
 				items.forEach(item => {
 					savedItems[item.id] = item;
@@ -524,6 +525,8 @@ globalConsoleContainerEl, externalLibrarySearchInput, keyboardShortcutsModal
 	}
 	function setCurrentItem(item) {
 		currentItem = item;
+		utils.log('Current Item set', item);
+
 		// Reset auto-saving flag
 		isAutoSavingEnabled = false;
 		// Reset unsaved count, in UI also.
@@ -588,26 +591,17 @@ globalConsoleContainerEl, externalLibrarySearchInput, keyboardShortcutsModal
 
 		itemTile.remove();
 		// Remove from items list
-		db.local.get(
-			{
-				items: {}
-			},
-			function(result) {
-				delete result.items[itemId];
-				db.local.set({
-					items: result.items
-				});
-			}
-		);
+		itemService.unsetItemForUser(itemId);
 
 		// Remove individual item too.
-		db.local.remove(itemId, function() {
+		itemService.removeItem(itemId).then(() => {
 			alertsService.add('Item removed.');
 			// This item is open in the editor. Lets open a new one.
 			if (currentItem.id === itemId) {
 				createNewItem();
 			}
 		});
+
 		// Remove from cached list
 		delete savedItems[itemId];
 

src/style.css

@@ -348,6 +348,9 @@ body > #demo-frame {
 .main-header__btn-wrap > a:hover {
 	border-color: rgba(146, 151, 179, 0.5);
 }
+.main-header__avatar-img {
+	border-radius: 50%;
+}
 .logo {
 	display: inline-block;
 	height: 25px;