move users tokens to features folder

awx/ui/client/features/users/index.js

@@ -0,0 +1,8 @@
+import atFeaturesUsersTokens from '~features/users/tokens';
+
+const MODULE_NAME = 'at.features.users';
+
+angular
+    .module(MODULE_NAME, [atFeaturesUsersTokens]);
+
+export default MODULE_NAME;

awx/ui/client/features/users/tokens/_index.less

@@ -0,0 +1,9 @@
+/** @define TokenModal */
+.TokenModal {
+    display: flex;
+}
+
+.TokenModal-label {
+    font-weight: bold;
+    width: 130px;
+}

awx/ui/client/features/users/tokens/index.js

@@ -0,0 +1,9 @@
+import TokensStrings from './tokens.strings';
+
+const MODULE_NAME = 'at.features.users.tokens';
+
+angular
+    .module(MODULE_NAME, [])
+    .service('TokensStrings', TokensStrings);
+
+export default MODULE_NAME;

awx/ui/client/features/users/tokens/tokens.strings.js

@@ -0,0 +1,43 @@
+function TokensStrings (BaseString) {
+    BaseString.call(this, 'tokens');
+
+    const { t } = this;
+    const ns = this.tokens;
+
+    ns.state = {
+        LIST_BREADCRUMB_LABEL: t.s('TOKENS'),
+        ADD_BREADCRUMB_LABEL: t.s('CREATE TOKEN'),
+        USER_LIST_BREADCRUMB_LABEL: t.s('TOKENS')
+    };
+
+    ns.tab = {
+        DETAILS: t.s('Details')
+    };
+
+    ns.add = {
+        PANEL_TITLE: t.s('CREATE TOKEN'),
+        APP_PLACEHOLDER: t.s('SELECT AN APPLICATION'),
+        SCOPE_HELP_TEXT: t.s('Specify a scope for the token\'s access'),
+        TOKEN_MODAL_HEADER: t.s('TOKEN INFORMATION'),
+        TOKEN_LABEL: t.s('TOKEN'),
+        REFRESH_TOKEN_LABEL: t.s('REFRESH TOKEN'),
+        TOKEN_EXPIRES_LABEL: t.s('EXPIRES'),
+        ERROR_HEADER: t.s('COULD NOT CREATE TOKEN'),
+        ERROR_BODY_LABEL: t.s('Returned status:'),
+        LAST_USED_LABEL: t.s('by'),
+        DELETE_ACTION_LABEL: t.s('DELETE'),
+        SCOPE_PLACEHOLDER: t.s('Select a scope'),
+        SCOPE_READ_LABEL: t.s('Read'),
+        SCOPE_WRITE_LABEL: t.s('Write')
+    };
+
+    ns.list = {
+        ROW_ITEM_LABEL_DESCRIPTION: t.s('DESCRIPTION'),
+        ROW_ITEM_LABEL_EXPIRED: t.s('EXPIRATION'),
+        ROW_ITEM_LABEL_USED: t.s('LAST USED')
+    };
+}
+
+TokensStrings.$inject = ['BaseStringService'];
+
+export default TokensStrings;

awx/ui/client/features/users/tokens/users-tokens-add-application.route.js

@@ -0,0 +1,69 @@
+export default {
+    name: 'users.edit.tokens.add.application',
+    url: '/application?selected',
+    searchPrefix: 'application',
+    params: {
+        application_search: {
+            value: {
+                page_size: 5,
+                order_by: 'name'
+            },
+            dynamic: true,
+            squash: ''
+        }
+    },
+    data: {
+        basePath: 'applications',
+        formChildState: true
+    },
+    ncyBreadcrumb: {
+        skip: true
+    },
+    views: {
+        'application@users.edit.tokens.add': {
+            templateProvider: (ListDefinition, generateList) => {
+                const html = generateList.build({
+                    mode: 'lookup',
+                    list: ListDefinition,
+                    input_type: 'radio'
+                });
+
+                return `<lookup-modal>${html}</lookup-modal>`;
+            }
+        }
+    },
+    resolve: {
+        ListDefinition: [() => ({
+            name: 'applications',
+            iterator: 'application',
+            hover: true,
+            index: false,
+            fields: {
+                name: {
+                    key: true,
+                    label: 'Name',
+                    columnClass: 'col-lg-4 col-md-6 col-sm-8 col-xs-8',
+                    awToolTip: '{{application.description | sanitize}}',
+                    dataPlacement: 'top'
+                },
+            },
+            actions: {
+            },
+            fieldActions: {
+            }
+        })],
+        Dataset: ['QuerySet', 'GetBasePath', '$stateParams', 'ListDefinition',
+            (qs, GetBasePath, $stateParams, list) => qs.search(
+                GetBasePath('applications'),
+                $stateParams[`${list.iterator}_search`]
+            )
+        ]
+    },
+    onExit ($state) {
+        if ($state.transition) {
+            $('#form-modal').modal('hide');
+            $('.modal-backdrop').remove();
+            $('body').removeClass('modal-open');
+        }
+    }
+};

awx/ui/client/features/users/tokens/users-tokens-add.controller.js

@@ -0,0 +1,111 @@
+function AddTokensController (
+    models, $state, strings, Rest, Alert, Wait, GetBasePath,
+    $filter, ProcessErrors
+) {
+    const vm = this || {};
+    const { application } = models;
+
+    vm.mode = 'add';
+    vm.strings = strings;
+    vm.panelTitle = strings.get('add.PANEL_TITLE');
+
+    vm.form = {};
+
+    vm.form.application = {
+        type: 'field',
+        label: 'Application',
+        id: 'application'
+    };
+    vm.form.description = {
+        type: 'String',
+        label: 'Description',
+        id: 'description'
+    };
+
+    vm.form.application._resource = 'application';
+    vm.form.application._route = 'users.edit.tokens.add.application';
+    vm.form.application._model = application;
+    vm.form.application._placeholder = strings.get('add.APP_PLACEHOLDER');
+    vm.form.application.required = true;
+
+    vm.form.description.required = false;
+
+    vm.form.scope = {
+        choices: [
+            '',
+            'read',
+            'write'
+        ],
+        help_text: strings.get('add.SCOPE_HELP_TEXT'),
+        id: 'scope',
+        label: 'Scope',
+        required: true,
+        _component: 'at-input-select',
+        _data: [
+            strings.get('add.SCOPE_PLACEHOLDER'),
+            strings.get('add.SCOPE_READ_LABEL'),
+            strings.get('add.SCOPE_WRITE_LABEL')
+        ],
+        _exp: 'choice for (index, choice) in state._data',
+        _format: 'array'
+    };
+
+    vm.form.save = payload => {
+        Rest.setUrl(`${GetBasePath('users')}${$state.params.user_id}/authorized_tokens`);
+        return Rest.post(payload)
+            .then(({ data }) => {
+                Alert(strings.get('add.TOKEN_MODAL_HEADER'), `
+                  <div class="TokenModal">
+                      <div class="TokenModal-label">
+                          ${strings.get('add.TOKEN_LABEL')}
+                      </div>
+                      <div class="TokenModal-value">
+                          ${data.token}
+                      </div>
+                  </div>
+                  <div class="TokenModal">
+                      <div class="TokenModal-label">
+                          ${strings.get('add.REFRESH_TOKEN_LABEL')}
+                      </div>
+                      <div class="TokenModal-value">
+                          ${data.refresh_token}
+                      </div>
+                  </div>
+                  <div class="TokenModal">
+                      <div class="TokenModal-label">
+                          ${strings.get('add.TOKEN_EXPIRES_LABEL')}
+                      </div>
+                      <div class="TokenModal-value">
+                          ${$filter('longDate')(data.expires)}
+                      </div>
+                  </div>
+                `, null, null, null, null, null, true);
+                Wait('stop');
+            })
+            .catch(({ data, status }) => {
+                ProcessErrors(null, data, status, null, {
+                    hdr: strings.get('add.ERROR_HEADER'),
+                    msg: `${strings.get('add.ERROR_BODY_LABEL')} ${status}`
+                });
+                Wait('stop');
+            });
+    };
+
+    vm.form.onSaveSuccess = () => {
+        $state.go('^', { user_id: $state.params.user_id }, { reload: true });
+    };
+}
+
+AddTokensController.$inject = [
+    'resolvedModels',
+    '$state',
+    'TokensStrings',
+    'Rest',
+    'Alert',
+    'Wait',
+    'GetBasePath',
+    '$filter',
+    'ProcessErrors'
+];
+
+export default AddTokensController;

awx/ui/client/features/users/tokens/users-tokens-add.partial.html

@@ -0,0 +1,18 @@
+<at-panel>
+    <at-panel-heading>
+        {{ vm.panelTitle }}
+    </at-panel-heading>
+
+    <at-panel-body>
+        <at-form state="vm.form" autocomplete="off">
+            <at-input-lookup col="4" tab="1" state="vm.form.application"></at-input-lookup>
+            <at-input-text col="4" tab="2" state="vm.form.description"></at-input-text>
+            <at-input-select col="4" tab="3" state="vm.form.scope"></at-input-select>
+
+            <at-action-group col="12" pos="right">
+                <at-form-action type="cancel" to="tokens"></at-form-action>
+                <at-form-action type="save"></at-form-action>
+            </at-action-group>
+        </at-form>
+    </at-panel-body>
+</at-panel>

awx/ui/client/features/users/tokens/users-tokens-add.route.js

@@ -0,0 +1,37 @@
+import { N_ } from '../../../src/i18n';
+import AddController from './users-tokens-add.controller';
+
+const addTemplate = require('~features/users/tokens/users-tokens-add.partial.html');
+
+function TokensDetailResolve ($q, Application) {
+    const promises = {};
+
+    promises.application = new Application('options');
+
+    return $q.all(promises);
+}
+
+TokensDetailResolve.$inject = [
+    '$q',
+    'ApplicationModel'
+];
+
+export default {
+    url: '/add-token',
+    name: 'users.edit.tokens.add',
+    params: {
+    },
+    ncyBreadcrumb: {
+        label: N_('CREATE TOKEN')
+    },
+    views: {
+        'preFormView@users.edit': {
+            templateUrl: addTemplate,
+            controller: AddController,
+            controllerAs: 'vm'
+        }
+    },
+    resolve: {
+        resolvedModels: TokensDetailResolve
+    }
+};

awx/ui/client/features/users/tokens/users-tokens-list.controller.js

@@ -0,0 +1,119 @@
+/** ***********************************************
+ * Copyright (c) 2018 Ansible, Inc.
+ *
+ * All Rights Reserved
+ ************************************************ */
+function ListTokensController (
+    $filter,
+    $scope,
+    $state,
+    Dataset,
+    strings,
+    ProcessErrors,
+    Rest,
+    GetBasePath,
+    Prompt,
+    Wait
+) {
+    const vm = this || {};
+
+    vm.strings = strings;
+    vm.activeId = $state.params.token_id;
+
+    $scope.canAdd = true;
+
+    // smart-search
+    const name = 'tokens';
+    const iterator = 'token';
+    const key = 'token_dataset';
+
+    $scope.list = { iterator, name, basePath: 'tokens' };
+    $scope.collection = { iterator };
+    $scope[key] = Dataset.data;
+    vm.tokensCount = Dataset.data.count;
+    $scope[name] = Dataset.data.results;
+    $scope.$on('updateDataset', (e, dataset) => {
+        $scope[key] = dataset;
+        $scope[name] = dataset.results;
+        vm.tokensCount = dataset.count;
+    });
+
+    vm.getLastUsed = token => {
+        const lastUsed = _.get(token, 'last_used');
+
+        if (!lastUsed) {
+            return undefined;
+        }
+
+        let html = $filter('longDate')(lastUsed);
+
+        const { username, id } = _.get(token, 'summary_fields.last_used', {});
+
+        if (username && id) {
+            html += ` ${strings.get('add.LAST_USED_LABEL')} <a href="/#/users/${id}">${$filter('sanitize')(username)}</a>`;
+        }
+
+        return html;
+    };
+
+    vm.deleteToken = (tok) => {
+        const action = () => {
+            $('#prompt-modal').modal('hide');
+            Wait('start');
+            Rest.setUrl(`${GetBasePath('tokens')}${tok.id}`);
+            Rest.destroy()
+                .then(() => {
+                    let reloadListStateParams = null;
+
+                    if ($scope.tokens.length === 1 && $state.params.token_search &&
+                    !_.isEmpty($state.params.token_search.page) &&
+                    $state.params.token_search.page !== '1') {
+                        const page = `${(parseInt(reloadListStateParams
+                            .token_search.page, 10) - 1)}`;
+                        reloadListStateParams = _.cloneDeep($state.params);
+                        reloadListStateParams.token_search.page = page;
+                    }
+
+                    if (parseInt($state.params.token_id, 10) === tok.id) {
+                        $state.go('^', reloadListStateParams, { reload: true });
+                    } else {
+                        $state.go('.', reloadListStateParams, { reload: true });
+                    }
+                })
+                .catch(({ data, status }) => {
+                    ProcessErrors($scope, data, status, null, {
+                        hdr: strings.get('error.HEADER'),
+                        msg: strings.get('error.CALL', { path: `${GetBasePath('tokens')}${tok.id}`, status })
+                    });
+                })
+                .finally(() => {
+                    Wait('stop');
+                });
+        };
+
+        const deleteModalBody = `<div class="Prompt-bodyQuery">${strings.get('deleteResource.CONFIRM', 'token')}</div>`;
+
+        Prompt({
+            hdr: strings.get('deleteResource.HEADER'),
+            resourceName: 'token',
+            body: deleteModalBody,
+            action,
+            actionText: strings.get('add.DELETE_ACTION_LABEL')
+        });
+    };
+}
+
+ListTokensController.$inject = [
+    '$filter',
+    '$scope',
+    '$state',
+    'Dataset',
+    'TokensStrings',
+    'ProcessErrors',
+    'Rest',
+    'GetBasePath',
+    'Prompt',
+    'Wait'
+];
+
+export default ListTokensController;

awx/ui/client/features/users/tokens/users-tokens-list.partial.html

@@ -0,0 +1,47 @@
+<div class="at-List-toolbar">
+    <smart-search
+        class="at-List-search"
+        django-model="tokens"
+        base-path="tokens"
+        iterator="token"
+        list="list"
+        dataset="token_dataset"
+        collection="collection"
+        search-tags="searchTags">
+    </smart-search>
+    <div class="at-List-toolbarAction">
+        <button
+            type="button"
+            ui-sref=".add"
+            class="at-Button--add"
+            aria-haspopup="true"
+            aria-expanded="false">
+        </button>
+    </div>
+</div>
+
+<at-list results="tokens">
+    <at-row ng-repeat="token in tokens">
+        <div class="at-Row-items">
+            <at-row-item
+                header-value="{{ token.summary_fields.application.name }}">
+            </at-row-item>
+            <at-row-item
+                label-value="{{:: vm.strings.get('list.ROW_ITEM_LABEL_DESCRIPTION') }}"
+                value="{{ token.description }}">
+            </at-row-item>
+            <at-row-item
+                label-value="{{:: vm.strings.get('list.ROW_ITEM_LABEL_EXPIRED') }}"
+                value="{{ token.expriation | longDate }}">
+            </at-row-item>
+            <at-row-item
+                label-value="{{:: vm.strings.get('list.ROW_ITEM_LABEL_USED') }}"
+                value="{{ vm.getLastUsed(token) }}">
+            </at-row-item>
+        </div>
+        <div class="at-Row-actions">
+            <at-row-action icon="fa-trash" ng-click="vm.deleteToken(token)">
+            </at-row-action>
+        </div>
+    </at-row>
+</at-list>

awx/ui/client/features/users/tokens/users-tokens-list.route.js

@@ -0,0 +1,46 @@
+import { N_ } from '../../../src/i18n';
+
+import ListController from './users-tokens-list.controller';
+
+const listTemplate = require('~features/users/tokens/users-tokens-list.partial.html');
+
+export default {
+    url: '/tokens',
+    name: 'users.edit.tokens',
+    ncyBreadcrumb: {
+        label: N_('TOKENS')
+    },
+    views: {
+        related: {
+            templateUrl: listTemplate,
+            controller: ListController,
+            controllerAs: 'vm'
+        }
+    },
+    searchPrefix: 'token',
+    params: {
+        token_search: {
+            value: {
+                page_size: 5,
+                order_by: 'application'
+            }
+        }
+    },
+    resolve: {
+        Dataset: [
+            '$stateParams',
+            'Wait',
+            'GetBasePath',
+            'QuerySet',
+            ($stateParams, Wait, GetBasePath, qs) => {
+                const searchParam = $stateParams.token_search;
+                const searchPath = `${GetBasePath('users')}${$stateParams.user_id}/tokens`;
+                Wait('start');
+                return qs.search(searchPath, searchParam)
+                    .finally(() => {
+                        Wait('stop');
+                    });
+            }
+        ],
+    }
+};