fix:updating the app

Adobe-Marketing-Cloud · Oct 16, 2024 · 71671cf · 71671cf
1 parent 6489cac
commit 71671cf
Show file tree

Hide file tree

Showing 4 changed files with 38 additions and 42 deletions.
diff --git a/web-src/index.html b/web-src/index.html
@@ -7,53 +7,48 @@
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <meta http-equiv="X-UA-Compatible" content="ie=edge">
-    <link rel="stylesheet" href="https://unpkg.com/@spectrum-css/vars/dist/spectrum-global.css">
-    <link rel="stylesheet" href="https://unpkg.com/@spectrum-css/typography/index.css">
-    <link rel="stylesheet" href="index.css">
-  <title>EDSAssetTracker</title>
-  <script src="./src/utils.js" type="module"></script>
+    <link rel="stylesheet" href="assetsUsageReport.css">
+    <link rel="stylesheet" href="https://use.typekit.net/dil4fkj.css">
+  <title>Assets Usage Report</title>
   <script src="./src/index.js" type="module"></script>
 </head>
 <body>
-  <h1>Welcome to EDSAssetTracker!</h1>
-  <div class="spectrum--large spectrum-Typography spectrum-Site">
-    <div>
-      <h2>Run your application backend actions</h2>
-      <form id='actionForm'>
-        <div>
-          <label for='action-list'>Select an action.</label>
-          <span id="action-list" name="action-list"></span>
-        </div>
-        <div>
-          <label for="actionParams">headers { json } to pass to your action:</label>
-          <textarea id='actionHeaders' name='actionHeaders' placeholder='{ "key": "value" }'></textarea>
+<div class="assets-usage-report">
+  <h1 class="assets-title">Assets Usage Report</h1>
+  <div class="view-toggle">
+    <button class="card-view" id="toggleViewBtn">Card View
+    </button>
+  </div>
+  <div id="all-asset-usage-report"></div>
+  <div class="page-filter all">For all pages</div>
+  <div class="assets-container">
+
+    <div class="assets-flex-container">
+      <div class="asset-row header">
+        <div class="asset-header">Thumbnail</div>
+        <div id="sortTitle" class="asset-header">Title
+          <i class="sort-icon"></i>
         </div>
-        <div>
-          <label for="actionParams">params { json } to pass to your action:</label>
-          <textarea id='actionParams' name='actionParams' placeholder='{ "key": "value" }'></textarea>
+        <div class="asset-header">Mime Type</div>
+        <div id="sortUsage" class="asset-header">Usage
+          <i class="sort-icon"></i>
         </div>
-        <input type="submit" value="Invoke">
-      </form>
+        <div class="asset-header">Actions</div>
+        <div class="asset-header">Details</div>
+      </div>
+      <!-- Asset rows will be added here by assetsData.js -->
+    </div>
+    <div class="card-view-container" style="display: none;">
+      <!-- Cards will be added here by JavaScript -->
     </div>
-    <div>
-      <h2>results</h2>
-      <textarea id='taOutput' readonly spellcheck="false" style="min-height:260px;"></textarea>
+    <div class="insights-panel">
+      <div class="title">Assets insights</div>
+      <div id="assets-insights" class="insights-container">
+        <!-- Recommendations will be added here by JavaScript -->
+      </div>
     </div>
-    <footer>
-      <h2>Useful documentation for your app</h2>
-      <a href='https://github.com/AdobeDocs/project-firefly/blob/master/README.md#project-firefly-developer-guide' target='_blank'>
-        Adobe Developer App Builder
-      </a>
-      <a href='https://github.com/adobe/aio-sdk#adobeaio-sdk' target='_blank'>
-        Adobe I/O SDK
-      </a>
-      <a href='https://adobedocs.github.io/adobeio-runtime/' target='_blank'>
-        Adobe I/O Runtime
-      </a>
-      <a href='https://react-spectrum.adobe.com/react-spectrum/index.html' target='_blank'>
-        React Spectrum
-      </a>
-    </footer>
   </div>
+  <script type='module' src="src/assetsData.js"></script>
+</div>
 </body>
 </html>
diff --git a/web-src/src/assetDetails.js b/web-src/src/assetDetails.js
@@ -123,7 +123,7 @@ let accessToken;
         viewDetail.classList.add('assets-usage');
         viewDetail.textContent = "Assets Usage Report";
         viewDetail.addEventListener('click', () => {
-          window.location.href = `/assetsUsageReport.html?pagePath=${page}`;
+          window.location.href = `/index.html?pagePath=${page}`;
         });
         pageDiv.appendChild(viewDetail);
         pagesSection.appendChild(pageDiv);

diff --git a/web-src/src/assetsData.js b/web-src/src/assetsData.js
@@ -101,7 +101,7 @@ let accessToken;
       allAssetsDiv.classList.add('all-asset-usage-report');
       allAssetsDiv.textContent = '< Back to site assets usage report';
       allAssetsDiv.addEventListener('click', () => {
-        window.location.href = `/assetsUsageReport.html?hlxUrl=${hlxUrl}`;
+        window.location.href = `/index.html?hlxUrl=${hlxUrl}`;
       });
       const pageFilter = document.querySelector('.page-filter');
       pageFilter.classList.remove('all');

diff --git a/web-src/src/index.js b/web-src/src/index.js
@@ -205,6 +205,7 @@ async function invokeAction (action, _headers, _params) {
 }
 
 export async function getState() {
+  console.log('Getting state');
   let attempts = 0;
   while (!state.imsToken) {
     attempts++;