diff --git a/src/components/MainHeader.jsx b/src/components/MainHeader.jsx
index 0cb40b1..0d5a0f0 100644
--- a/src/components/MainHeader.jsx
+++ b/src/components/MainHeader.jsx
@@ -95,30 +95,33 @@ export function MainHeader(props) {
 							</svg>
 							<Trans>Open</Trans>
 						</button>
-						<Button
-							onClick={props.loginBtnHandler}
-							data-event-category="ui"
-							data-event-action="loginButtonClick"
-							class="hide-on-login btn btn--dark hint--rounded  hint--bottom-left"
-						>
-							<Trans>Login/Signup</Trans>
-						</Button>
-						<Button
-							onClick={props.profileBtnHandler}
-							data-event-category="ui"
-							data-event-action="headerAvatarClick"
-							aria-label={i18n._(t`See profile or Logout`)}
-							class="hide-on-logout btn--dark hint--rounded  hint--bottom-left"
-						>
-							<img
-								id="headerAvatarImg"
-								width="20"
-								src={
-									props.user ? props.user.photoURL || DEFAULT_PROFILE_IMG : ''
-								}
-								class="main-header__avatar-img"
-							/>
-						</Button>
+						{!props.user ? (
+							<Button
+								onClick={props.loginBtnHandler}
+								data-event-category="ui"
+								data-event-action="loginButtonClick"
+								class="btn btn--dark hint--rounded  hint--bottom-left"
+							>
+								<Trans>Login/Signup</Trans>
+							</Button>
+						) : (
+							<Button
+								onClick={props.profileBtnHandler}
+								data-event-category="ui"
+								data-event-action="headerAvatarClick"
+								aria-label={i18n._(t`See profile or Logout`)}
+								class="btn--dark hint--rounded  hint--bottom-left"
+							>
+								<img
+									id="headerAvatarImg"
+									width="20"
+									src={
+										props.user ? props.user.photoURL || DEFAULT_PROFILE_IMG : ''
+									}
+									class="main-header__avatar-img"
+								/>
+							</Button>
+						)}
 					</div>
 				</div>
 			)}
diff --git a/src/components/app.jsx b/src/components/app.jsx
index 9198c70..e0e918c 100644
--- a/src/components/app.jsx
+++ b/src/components/app.jsx
@@ -303,11 +303,14 @@ export default class App extends Component {
 	}
 
 	updateProfileUi() {
-		if (this.state.user) {
-			document.body.classList.add('is-logged-in');
-		} else {
-			document.body.classList.remove('is-logged-in');
-		}
+		this.setState(prevState => {
+			if (prevState.user) {
+				document.body.classList.add('is-logged-in');
+			} else {
+				document.body.classList.remove('is-logged-in');
+			}
+			return null;
+		});
 	}
 
 	refreshEditor() {
@@ -464,23 +467,27 @@ export default class App extends Component {
 
 	populateItemsInSavedPane(items) {
 		// TODO: sort desc. by updation date
-		this.setState({
-			savedItems: { ...this.state.savedItems }
-		});
+		// this.setState({
+		// 	savedItems: { ...this.state.savedItems }
+		// });
 
 		this.toggleSavedItemsPane();
 		// HACK: Set overflow after sometime so that the items can animate without getting cropped.
 		// setTimeout(() => $('#js-saved-items-wrap').style.overflowY = 'auto', 1000);
 	}
 	toggleSavedItemsPane(shouldOpen) {
-		this.setState({
-			isSavedItemPaneOpen:
-				shouldOpen === undefined ? !this.state.isSavedItemPaneOpen : shouldOpen
-		});
+		this.setState(prevState => {
+			const isSavedItemPaneOpen =
+				shouldOpen === undefined ? !prevState.isSavedItemPaneOpen : shouldOpen;
 
-		document.body.classList[this.state.isSavedItemPaneOpen ? 'add' : 'remove'](
-			'overlay-visible'
-		);
+			document.body.classList[isSavedItemPaneOpen ? 'add' : 'remove'](
+				'overlay-visible'
+			);
+
+			return {
+				isSavedItemPaneOpen
+			};
+		});
 	}
 
 	/**
@@ -490,17 +497,17 @@ export default class App extends Component {
 	 * @return {promise}                    Promise.
 	 */
 	async fetchItems(shouldSaveGlobally, shouldFetchLocally) {
-		// HACK: This empty assignment is being used when importing locally saved items
-		// to cloud, `fetchItems` runs once on account login which clears the
-		// savedItems object and hence, while merging no saved item matches with itself.
-		this.state.savedItems = {};
 		var items = [];
+		const savedItems = {};
 
 		items = await itemService.getAllItems(shouldFetchLocally);
 		trackEvent('fn', 'fetchItems', items.length);
 		if (shouldSaveGlobally) {
 			items.forEach(item => {
-				this.state.savedItems[item.id] = item;
+				savedItems[item.id] = item;
+			});
+			this.setState({
+				savedItems
 			});
 		}
 		return items;
@@ -1178,7 +1185,7 @@ export default class App extends Component {
 		}
 	}
 
-	mergeImportedItems(items) {
+	mergeImportedItems(items, isMergingToCloud = false) {
 		var existingItemIds = [];
 		var toMergeItems = {};
 		const d = deferred();
@@ -1187,10 +1194,10 @@ export default class App extends Component {
 			// We can access `savedItems` here because this gets set when user
 			// opens the saved creations panel. And import option is available
 			// inside the saved items panel.
-			// HACK: Also when this fn is called for importing locally saved items
-			// to cloud, `fetchItems` runs once on account login which clears the
-			// savedItems object and hence, no match happens for `existingItemIds`.
-			if (savedItems[item.id]) {
+
+			// When we are merging to cloud, savedItems contains the local items. And if we start matching,
+			// all items will match with themselves and nothing would import :P
+			if (!isMergingToCloud && savedItems[item.id]) {
 				// Item already exists
 				existingItemIds.push(item.id);
 			} else {
@@ -1231,7 +1238,7 @@ export default class App extends Component {
 	 * Called from inside ask-to-import-modal
 	 */
 	importCreationsAndSettingsIntoApp() {
-		this.mergeImportedItems(this.oldSavedItems).then(() => {
+		this.mergeImportedItems(this.oldSavedItems, true).then(() => {
 			trackEvent('fn', 'oldItemsImported');
 			this.dontAskToImportAnymore();
 		});
diff --git a/src/itemService.js b/src/itemService.js
index ba25aad..f506ed0 100644
--- a/src/itemService.js
+++ b/src/itemService.js
@@ -39,7 +39,7 @@ export const itemService = {
 		var d = deferred();
 		let itemIds = await this.getUserItemIds(shouldFetchLocally);
 		itemIds = Object.getOwnPropertyNames(itemIds || {});
-		log('itemids', itemIds);
+		// log('itemids', itemIds);
 
 		if (!itemIds.length) {
 			d.resolve([]);