public/js/views/modals/delete-account-view.js

   1 'use strict';
   2
   3 var Marionette = require('backbone.marionette');
   4 var log = require('../../utils/log');
   5 var context = require('gitter-web-client-context');
   6 var appEvents = require('../../utils/appevents');
   7 var ModalView = require('./modal');
   8 var apiClient = require('../../components/api-client');
   9 var DelayLock = require('../../models/delay-lock-model');
  10 var template = require('./tmpl/delete-account-view.hbs');
  11
  12 var View = Marionette.ItemView.extend({
  13   tagName: 'p',
  14   attributes: { style: '' },
  15   ui: {
  16     ghostUserCheckbox: '.js-delete-account-ghost-user-checkbox'
  17   },
  18   events: {
  19     'input @ui.ghostUserCheckbox': 'onGhostCheckboxChanged'
  20   },
  21   modelEvents: {
  22     change: 'render'
  23   },
  24   initialize: function() {
  25     this.model.set('ghostUsername', `ghost~${context.getUserId()}`);
  26   },
  27   template: template,
  28   onGhostCheckboxChanged: function() {
  29     this.model.set('ghost', this.ui.ghostUserCheckbox.is(':checked'));
  30   }
  31 });
  32
  33 var Modal = ModalView.extend({
  34   initialize: function(options) {
  35     options = options || {};
  36     options.title = 'Careful Now...';
  37     var username = context.user().get('username');
  38     options.menuItems = [
  39       {
  40         disabled: true,
  41         action: 'delete',
  42         text: `Delete ${username}`,
  43         className: 'modal--default__footer__btn--negative'
  44       }
  45     ];
  46
  47     this.lockModel = new DelayLock();
  48
  49     this.listenTo(this.lockModel, 'change:locked', function() {
  50       this.setButtonState('delete', true);
  51     });
  52
  53     ModalView.prototype.initialize.call(this, options);
  54     this.view = new View({
  55       model: this.lockModel
  56     });
  57
  58     this.listenTo(this, 'menuItemClicked', this.menuItemClicked);
  59   },
  60   menuItemClicked: function(button) {
  61     switch (button) {
  62       case 'delete':
  63         // Notify others, that they shouldn't redirect while we are trying to logout
  64         appEvents.trigger('account.delete-start');
  65
  66         // Disable the button so they can't click it again
  67         this.setButtonState('delete', false);
  68
  69         this.lockModel.set('deletionRequestLoading', true);
  70         this.lockModel.set('deletionRequestSucceeded', false);
  71         this.lockModel.set('deletionRequestError', undefined);
  72
  73         apiClient.user
  74           .delete('/', {
  75             ghost: this.lockModel.get('ghost') || false
  76           })
  77           .then(() => {
  78             this.lockModel.set('deletionRequestSucceeded', true);
  79             // Redirect back to the homepage
  80             window.location.href = '/';
  81           })
  82           .catch(err => {
  83             log.error('Error while deleting account', { exception: err });
  84
  85             if (err.statusText === 'timeout') {
  86               this.lockModel.set(
  87                 'deletionRequestError',
  88                 `The request timed out but your account is probably still in the process of being deleted on our end (especially if you joined a lot of rooms). Please wait a couple hours before trying again : ${err} (status: ${err.status})`
  89               );
  90             } else {
  91               this.lockModel.set(
  92                 'deletionRequestError',
  93                 `Error while deleting account: ${err} (status: ${err.status})`
  94               );
  95             }
  96
  97             // We only trigger a stop on error as they could decide to not delete
  98             // their account after they see an error and continue using the app
  99             //
 100             // Otherwise, the delete flow redirect should continue
 101             appEvents.trigger('account.delete-stop');
 102           })
 103           .then(() => {
 104             this.lockModel.set('deletionRequestLoading', false);
 105           });
 106         break;
 107
 108       case 'cancel':
 109         this.dialog.hide();
 110         break;
 111     }
 112   }
 113 });
 114
 115 module.exports = Modal;