ui: Create a helper to show the last 8 characters of token Accessor ID (

#7327)

* Create substr helper
* Create a test for the new substr helper
* Display the last 8 characters of token Accessor ID in the Token lists page

ui-v2/app/helpers/substr.js

@@ -0,0 +1,5 @@
+import { helper } from '@ember/component/helper';
+
+export default helper(function substr([str = '', start = 0, length], hash) {
+  return str.substr(start, length);
+});

ui-v2/app/templates/dc/acls/tokens/index.hbs

@@ -45,7 +45,7 @@
           </BlockSlot>
           <BlockSlot @name="row">
               <td data-test-token="{{item.AccessorID}}" class={{if (eq item.AccessorID token.AccessorID) 'me' }}>
-                  <a href={{href-to 'dc.acls.tokens.edit' item.AccessorID}}>{{truncate item.AccessorID 8 false}}</a>
+                  <a href={{href-to 'dc.acls.tokens.edit' item.AccessorID}}>{{substr item.AccessorID -8}}</a>
               </td>
               <td>
                 {{if item.Local 'local' 'global' }}

ui-v2/tests/integration/helpers/substr-test.js

@@ -0,0 +1,17 @@
+import { module, test } from 'qunit';
+import { setupRenderingTest } from 'ember-qunit';
+import { render } from '@ember/test-helpers';
+import hbs from 'htmlbars-inline-precompile';
+
+module('helper:substr', function(hooks) {
+  setupRenderingTest(hooks);
+
+  // Replace this with your real tests.
+  test('it returns last 2 characters of string', async function(assert) {
+    this.set('inputValue', 'd9a54409-648b-4327-974f-62a45c8c65f1');
+
+    await render(hbs`{{substr inputValue -4}}`);
+
+    assert.dom('*').hasText('65f1');
+  });
+});