Account migration

Saga initiates account migration, which is fully encapsulated in
Firebase client. Client creates a second SDK instance which is used to
log into the old (GitHub) account using the credential. This instance is
used to retrieve old projects and then save them to the current account.
Then the credential is detached from the old account and attached to the
new one.

Author: outoftime

locales/en/translation.json

@@ -78,19 +78,24 @@
   "account-migration": {
     "header": {
       "proposed": "Combine these accounts?",
-      "undo-grace-period": "Preparing to combine accounts…"
+      "undo-grace-period": "Preparing to combine accounts…",
+      "in-progress": "Combining accounts…",
+      "complete": "All done!"
     },
     "proposal": [
       "Your GitHub login is linked to a different Popcode account. Do you want to combine the account you’re using now with that other account?",
       "All of the saved projects from the GitHub-linked account will be transferred into the account you’re using now."
     ],
     "preparing": "Popcode is preparing to combine your accounts. If you do not wish to do this, click the button below:",
+    "in-progress": "Popcode is transferring the projects from the other account into your current one.",
+    "complete": "Popcode has finished combining your accounts.",
     "your-account": "Your account",
     "account-to-merge": "Account to merge",
     "buttons": {
       "migrate": "Combine these accounts",
       "cancel": "Keep them separate",
-      "stop": "Stop"
+      "stop": "Stop",
+      "dismiss": "Done"
     }
   },
   "utility": {

src/actions/user.js

@@ -27,6 +27,14 @@ export const startAccountMigration = createAction('START_ACCOUNT_MIGRATION');
 export const dismissAccountMigration =
   createAction('DISMISS_ACCOUNT_MIGRATION');
 
+export const accountMigrationUndoPeriodExpired =
+  createAction('ACCOUNT_MIGRATION_UNDO_PERIOD_EXPIRED');
+
+export const accountMigrationComplete = createAction(
+  'ACCOUNT_MIGRATION_COMPLETE',
+  (projects, credential) => ({projects, credential}),
+);
+
 export const logOut = createAction('LOG_OUT');
 
 export const userAuthenticated = createAction(

src/clients/firebase.js

@@ -40,12 +40,12 @@ async function loadDatabaseSdk() {
   );
 }
 
-function buildFirebase() {
+function buildFirebase(appName = undefined) {
   const app = firebase.initializeApp({
     apiKey: config.firebaseApiKey,
     authDomain: `${config.firebaseApp}.firebaseapp.com`,
     databaseURL: `https://${config.firebaseApp}.firebaseio.com`,
-  });
+  }, appName);
 
   return {
     auth: firebase.auth(app),
@@ -149,6 +149,51 @@ export async function linkGithub() {
   return userCredential.credential;
 }
 
+export async function migrateAccount(inboundAccountCredential) {
+  const inboundAccountFirebase = buildFirebase('migration');
+  const {auth: inboundAccountAuth} = inboundAccountFirebase;
+  try {
+    await inboundAccountAuth.signInWithCredential(inboundAccountCredential);
+
+    const migratedProjects = await migrateProjects(inboundAccountFirebase);
+    await migrateCredential(inboundAccountCredential, inboundAccountFirebase);
+
+    return migratedProjects;
+  } finally {
+    inboundAccountAuth.app.delete();
+  }
+}
+
+async function migrateCredential(credential, {auth: inboundAccountAuth}) {
+  await inboundAccountAuth.currentUser.unlink(credential.providerId);
+  await auth.currentUser.linkWithCredential(credential);
+  await saveUserCredential({user: auth.currentUser, credential});
+}
+
+async function migrateProjects({
+  auth: inboundAccountAuth,
+  loadDatabase: loadinboundAccountDatabase,
+}) {
+  const currentAccountDatabase = await loadDatabase();
+  const inboundAccountDatabase = await loadinboundAccountDatabase();
+
+  const allProjectsValue = await inboundAccountDatabase.
+    ref(`workspaces/${inboundAccountAuth.currentUser.uid}/projects`).
+    once('value');
+
+  if (!isNull(allProjectsValue)) {
+    const allProjects = allProjectsValue.val();
+
+    await currentAccountDatabase.
+      ref(`workspaces/${auth.currentUser.uid}/projects`).
+      update(allProjects);
+
+    return values(allProjects);
+  }
+
+  return [];
+}
+
 async function signInWithGithub() {
   return auth.signInWithPopup(githubAuthProvider);
 }

src/components/AccountMigration.jsx

@@ -9,6 +9,8 @@ import {
 } from '../records';
 import {AccountMigrationState} from '../enums';
 
+import AccountMigrationComplete from './AccountMigrationComplete';
+import AccountMigrationInProgress from './AccountMigrationInProgress';
 import AccountMigrationUndoGracePeriod
   from './AccountMigrationUndoGracePeriod';
 import Modal from './Modal';
@@ -74,6 +76,10 @@ export default function AccountMigration({
               );
             case AccountMigrationState.UNDO_GRACE_PERIOD:
               return <AccountMigrationUndoGracePeriod onDismiss={onDismiss} />;
+            case AccountMigrationState.IN_PROGRESS:
+              return <AccountMigrationInProgress />;
+            case AccountMigrationState.COMPLETE:
+              return <AccountMigrationComplete onDismiss={onDismiss} />;
           }
           return null;
         })()}

src/components/AccountMigrationComplete.jsx

@@ -0,0 +1,28 @@
+import classnames from 'classnames';
+import {t} from 'i18next';
+import React, {Fragment} from 'react';
+import PropTypes from 'prop-types';
+
+export default function AccountMigrationComplete({onDismiss}) {
+  return (
+    <Fragment>
+      <p>
+        {t('account-migration.complete')}
+      </p>
+      <div className="account-migration__buttons">
+        <button
+          className={classnames(
+            'account-migration__button',
+          )}
+          onClick={onDismiss}
+        >
+          {t('account-migration.buttons.dismiss')}
+        </button>
+      </div>
+    </Fragment>
+  );
+}
+
+AccountMigrationComplete.propTypes = {
+  onDismiss: PropTypes.func.isRequired,
+};

src/components/AccountMigrationInProgress.jsx

@@ -0,0 +1,10 @@
+import React from 'react';
+import {t} from 'i18next';
+
+export default function AccountMigrationInProgress() {
+  return (
+    <p>
+      {t('account-migration.in-progress')}
+    </p>
+  );
+}

src/records/AccountMigration.js

@@ -5,4 +5,5 @@ import {AccountMigrationState} from '../enums';
 export default Record({
   state: AccountMigrationState.PROPOSED,
   userAccountToMerge: null,
+  firebaseCredential: null,
 }, 'AccountMigration');

src/reducers/projects.js

@@ -106,6 +106,9 @@ export default function reduceProjects(stateIn, action) {
     case 'PROJECTS_LOADED':
       return action.payload.reduce(addProject, state);
 
+    case 'ACCOUNT_MIGRATION_COMPLETE':
+      return action.payload.projects.reduce(addProject, state);
+
     case 'UPDATE_PROJECT_SOURCE':
       return state.setIn(
         [action.payload.projectKey, 'sources', action.payload.language],

src/reducers/user.js

@@ -66,6 +66,7 @@ function user(stateIn, action) {
             action.payload.profile,
             action.payload.credential,
           ),
+          firebaseCredential: action.payload.credential,
         }),
       );
 
@@ -78,6 +79,21 @@ function user(stateIn, action) {
     case 'DISMISS_ACCOUNT_MIGRATION':
       return state.delete('currentMigration');
 
+    case 'ACCOUNT_MIGRATION_UNDO_PERIOD_EXPIRED':
+      return state.setIn(
+        ['currentMigration', 'state'],
+        AccountMigrationState.IN_PROGRESS,
+      );
+
+    case 'ACCOUNT_MIGRATION_COMPLETE':
+      return addCredential(
+        state.setIn(
+          ['currentMigration', 'state'],
+          AccountMigrationState.COMPLETE,
+        ),
+        action.payload.credential,
+      );
+
     case 'USER_LOGGED_OUT':
       return new User().set('loginState', LoginState.ANONYMOUS);
 

src/sagas/user.js

@@ -2,20 +2,35 @@ import {bugsnagClient} from '../util/bugsnag';
 import isEmpty from 'lodash-es/isEmpty';
 import isError from 'lodash-es/isError';
 import isString from 'lodash-es/isString';
-import {all, call, put, take, takeEvery} from 'redux-saga/effects';
+import {
+  all,
+  call,
+  put,
+  race,
+  select,
+  take,
+  takeEvery,
+} from 'redux-saga/effects';
+import {delay} from 'redux-saga';
 import isNil from 'lodash-es/isNil';
 import {notificationTriggered} from '../actions/ui';
 import {
+  accountMigrationComplete,
   accountMigrationNeeded,
+  accountMigrationUndoPeriodExpired,
   identityLinked,
   linkIdentityFailed,
   userAuthenticated,
   userLoggedOut,
 } from '../actions/user';
+import {
+  getCurrentAccountMigration,
+} from '../selectors';
 import loginState from '../channels/loginState';
 import {
   getSessionUid,
   linkGithub,
+  migrateAccount,
   signIn,
   signOut,
   startSessionHeartbeat,
@@ -122,6 +137,17 @@ export function* linkGithubIdentity() {
   }
 }
 
+export function* startAccountMigration() {
+  yield race({
+    shouldContinue: call(delay, 5000, true),
+    cancel: take('DISMISS_ACCOUNT_MIGRATION'),
+  });
+  yield put(accountMigrationUndoPeriodExpired());
+  const {firebaseCredential} = yield select(getCurrentAccountMigration);
+  const projects = yield call(migrateAccount, firebaseCredential);
+  yield put(accountMigrationComplete(projects, firebaseCredential));
+}
+
 export function* logOut() {
   yield call(signOut);
 }
@@ -132,5 +158,6 @@ export default function* () {
     takeEvery('LINK_GITHUB_IDENTITY', linkGithubIdentity),
     takeEvery('LOG_IN', logIn),
     takeEvery('LOG_OUT', logOut),
+    takeEvery('START_ACCOUNT_MIGRATION', startAccountMigration),
   ]);
 }