From ea9c5a12b8d4e58c0e27f4d76a2043decb8f4ce9 Mon Sep 17 00:00:00 2001 From: Martin Edenhofer Date: Sun, 21 Aug 2016 01:34:05 +0200 Subject: [PATCH] Improved token create dialog. --- .../controllers/_profile/token_access.coffee | 76 ++++++++++++++----- .../app/views/profile/token_access.jst.eco | 40 +--------- .../views/profile/token_access_create.jst.eco | 30 ++++++++ test/browser/preferences_test.rb | 35 ++++++--- 4 files changed, 114 insertions(+), 67 deletions(-) create mode 100644 app/assets/javascripts/app/views/profile/token_access_create.jst.eco diff --git a/app/assets/javascripts/app/controllers/_profile/token_access.coffee b/app/assets/javascripts/app/controllers/_profile/token_access.coffee index b80ae775a..c92178ab8 100644 --- a/app/assets/javascripts/app/controllers/_profile/token_access.coffee +++ b/app/assets/javascripts/app/controllers/_profile/token_access.coffee @@ -2,7 +2,7 @@ class Index extends App.ControllerContent requiredPermission: 'user_preferences.access_token' events: 'click .js-delete': 'delete' - 'submit form.js-create': 'create' + 'click .js-create': 'create' constructor: -> super @@ -36,10 +36,56 @@ class Index extends App.ControllerContent render: => @html App.view('profile/token_access')( tokens: @tokens - permissions: @permissions ) create: (e) => + e.preventDefault() + new Create( + container: @el.closest('.content') + permissions: @permissions + load: @load + ) + + delete: (e) => + e.preventDefault() + + callback = => + id = $(e.target).closest('a').data('token-id') + @ajax( + id: 'user_access_token_delete' + type: 'DELETE' + url: "#{@apiPath}/user_access_token/#{id}" + processData: true + success: => + @load(true) + error: @error + ) + + new App.ControllerConfirm( + message: 'Sure?' + callback: callback + container: @el.closest('.content') + ) + + error: (xhr, status, error) => + data = JSON.parse(xhr.responseText) + @notify( + type: 'error' + msg: App.i18n.translateContent(data.message || data.error) + ) + +class Create extends App.ControllerModal + head: 'Add a Personal Access Token' + buttonSubmit: 'Create' + buttonCancel: true + shown: true + + content: -> + App.view('profile/token_access_create')( + permissions: @permissions + ) + + onSubmit: (e) => e.preventDefault() params = @formParam(e.target) @@ -63,41 +109,33 @@ class Index extends App.ControllerContent show: (data) => @load() + @newToken = data + @close() + + onClosed: => + return if !@newToken ui = @ new App.ControllerModal( head: 'Your New Personal Access Token' buttonSubmit: 'OK, I\'ve copied my token' content: -> App.view('profile/token_access_created')( - name: data.name + name: ui.newToken.name ) post: -> - @el.find('.js-select').on('click', ui.selectAll) + @$('.js-select').on('click', ui.selectAll) onCancel: -> @close() onSubmit: -> @close() - ) - - delete: (e) => - e.preventDefault() - return if !confirm(App.i18n.translateInline('Sure?')) - id = $(e.target).closest('a').data('token-id') - @ajax( - id: 'user_access_token_delete' - type: 'DELETE' - url: "#{@apiPath}/user_access_token/#{id}" - processData: true - success: => - @load(true) - error: @error + container: @container ) error: (xhr, status, error) => data = JSON.parse(xhr.responseText) @notify( type: 'error' - msg: App.i18n.translateContent(data.message) + msg: App.i18n.translateContent(data.message || data.error) ) App.Config.set('Token Access', { prio: 3200, name: 'Token Access', parent: '#profile', target: '#profile/token_access', controller: Index, permission: ['user_preferences.access_token'] }, 'NavBarProfile') diff --git a/app/assets/javascripts/app/views/profile/token_access.jst.eco b/app/assets/javascripts/app/views/profile/token_access.jst.eco index 0312f36fb..4c8cf5d01 100644 --- a/app/assets/javascripts/app/views/profile/token_access.jst.eco +++ b/app/assets/javascripts/app/views/profile/token_access.jst.eco @@ -1,48 +1,11 @@ -

<%- @T('You can generate a personal access token for each application you use that needs access to the Zammad API.') %>

<%- @T('Add a Personal Access Token') %>

-

<%- @T('Pick a name for the application, and we\'ll give you a unique token.') %>

-
-
-
- -
-
-
- -
- -
- <% for permission in @permissions: %> - <% if !permission.name.match(/\./): %> - - <% else: %> -
- -
- <% end %> - <% end %> -
- -
- - -
+<%- @T('Create') %>
@@ -83,4 +46,3 @@ <% end %> - diff --git a/app/assets/javascripts/app/views/profile/token_access_create.jst.eco b/app/assets/javascripts/app/views/profile/token_access_create.jst.eco new file mode 100644 index 000000000..2cb22c8e3 --- /dev/null +++ b/app/assets/javascripts/app/views/profile/token_access_create.jst.eco @@ -0,0 +1,30 @@ +
+
+ +
+
+
+ +
+
+ <% for permission in @permissions: %> + <% if !permission.name.match(/\./): %> + + <% else: %> +
+ +
+ <% end %> + <% end %> +
+
diff --git a/test/browser/preferences_test.rb b/test/browser/preferences_test.rb index 8bfd45292..9d67948bb 100644 --- a/test/browser/preferences_test.rb +++ b/test/browser/preferences_test.rb @@ -2,6 +2,7 @@ require 'browser_test_helper' class PreferencesTest < TestCase + def test_permission_agent @browser = browser_instance login( @@ -406,12 +407,18 @@ class PreferencesTest < TestCase click(css: 'a[href="#profile"]') click(css: 'a[href="#profile/token_access"]') + click(css: '#content .js-create') + watch_for( + css: '.modal .modal-title', + value: 'Add a Personal Access Token' + ) + set( - css: '#content .js-create .js-input', + css: '#content .modal .js-input', value: 'Some App#1', ) - click(css: '#content input[value="ticket.agent"] ~ .label-text') - click(css: '#content .js-create .js-submit') + click(css: '#content .modal input[value="ticket.agent"] ~ .label-text') + click(css: '#content .modal .js-submit') watch_for( css: '.modal .modal-title', value: 'Your New Personal Access Token' @@ -422,12 +429,18 @@ class PreferencesTest < TestCase value: 'Some App#1' ) + click(css: '#content .js-create') + watch_for( + css: '.modal .modal-title', + value: 'Add a Personal Access Token' + ) set( - css: '#content .js-create .js-input', + css: '#content .modal .js-input', value: 'Some App#2', ) - click(css: '#content input[value="ticket.agent"] ~ .label-text') - click(css: '#content .js-create .js-submit') + click(css: '#content .modal input[value="ticket.agent"] ~ .label-text') + click(css: '#content .modal .js-submit') + watch_for( css: '.modal .modal-title', value: 'Your New Personal Access Token' @@ -439,9 +452,13 @@ class PreferencesTest < TestCase ) click(css: '#content .js-tokenList a') - sleep 1 - alert = @browser.switch_to.alert - alert.accept() + watch_for( + css: '#content .modal .modal-header', + value: 'confirm', + ) + click( + css: '#content .modal .js-submit', + ) watch_for_disappear( css: '#content .js-tokenList', value: 'Some App#2'