From e938ced24a5cd181b280cb749040f318de863b38 Mon Sep 17 00:00:00 2001
From: Phil Renaud <phil.renaud@hashicorp.com>
Date: Mon, 20 Jun 2022 12:48:38 -0400
Subject: [PATCH] Secure Variables: show file metadata on list pages (#13423)

* Add modified times and namespaces to layout

* Undo typing change

* Post-hoc accounting for new variable path routing
---
 ui/app/components/variable-paths.hbs             | 16 +++++++++++++++-
 ui/mirage/factories/variable.js                  |  4 ++++
 ui/tests/acceptance/secure-variables-test.js     |  2 +-
 .../components/variable-paths-test.js            |  6 +++---
 4 files changed, 23 insertions(+), 5 deletions(-)

diff --git a/ui/app/components/variable-paths.hbs b/ui/app/components/variable-paths.hbs
index bdda12c3c..574558ce8 100644
--- a/ui/app/components/variable-paths.hbs
+++ b/ui/app/components/variable-paths.hbs
@@ -3,11 +3,17 @@
     <th>
       Path
     </th>
+    <th>
+      Namespace
+    </th>
+    <th>
+      Last Modified
+    </th>
   </t.head>
   <tbody>
     {{#each this.folders as |folder|}}
       <tr data-test-folder-row {{on "click" (fn this.handleFolderClick folder.data.absolutePath)}}>
-        <td>
+        <td colspan="3">
           <span>
             <FlightIcon @name="folder" />
             <LinkTo @route="variables.path" @model={{folder.data.absolutePath}}>
@@ -29,6 +35,14 @@
             {{file.name}}
           </LinkTo>
         </td>
+        <td>
+          {{file.variable.namespace}}
+        </td>
+        <td>
+          <span class="tooltip" aria-label="{{format-ts file.variable.modifyTime}}">
+            {{moment-from-now file.variable.modifyTime}}
+          </span>
+        </td>
       </tr>
     {{/each}}
 
diff --git a/ui/mirage/factories/variable.js b/ui/mirage/factories/variable.js
index 8a98ea18f..0ab00299c 100644
--- a/ui/mirage/factories/variable.js
+++ b/ui/mirage/factories/variable.js
@@ -7,6 +7,10 @@ export default Factory.extend({
     return this.id;
   },
   namespace: 'default',
+  createdIndex: 100,
+  modifiedIndex: 100,
+  createTime: () => faker.date.past(15),
+  modifyTime: () => faker.date.recent(1),
   items() {
     return (
       this.Items || {
diff --git a/ui/tests/acceptance/secure-variables-test.js b/ui/tests/acceptance/secure-variables-test.js
index d444fb08d..64c89da83 100644
--- a/ui/tests/acceptance/secure-variables-test.js
+++ b/ui/tests/acceptance/secure-variables-test.js
@@ -83,7 +83,7 @@ module('Acceptance | secure variables', function (hooks) {
     await click(fooLink);
     assert.equal(
       currentURL(),
-      '/variables/a/b/c/foo0',
+      '/variables/var/a/b/c/foo0',
       'correctly traverses to a deeply nested variable file'
     );
     const deleteButton = find('[data-test-delete-button] button');
diff --git a/ui/tests/integration/components/variable-paths-test.js b/ui/tests/integration/components/variable-paths-test.js
index 4cc06a82d..aaf2a5d65 100644
--- a/ui/tests/integration/components/variable-paths-test.js
+++ b/ui/tests/integration/components/variable-paths-test.js
@@ -77,21 +77,21 @@ module('Integration | Component | variable-paths', function (hooks) {
       .dom('tbody tr:first-child td:first-child a')
       .hasAttribute(
         'href',
-        '/ui/variables/foo/bar/baz',
+        '/ui/variables/var/foo/bar/baz',
         'Correctly links the first file'
       );
     assert
       .dom('tbody tr:nth-child(2) td:first-child a')
       .hasAttribute(
         'href',
-        '/ui/variables/foo/bar/bay',
+        '/ui/variables/var/foo/bar/bay',
         'Correctly links the second file'
       );
     assert
       .dom('tbody tr:nth-child(3) td:first-child a')
       .hasAttribute(
         'href',
-        '/ui/variables/foo/bar/bax',
+        '/ui/variables/var/foo/bar/bax',
         'Correctly links the third file'
       );
     assert