feat(import): indicate if default transformation file is being used (#…

…427)
adobe · Sep 17, 2024 · 13500e6 · 13500e6
1 parent 250ce78
commit 13500e6
Show file tree

Hide file tree

Showing 5 changed files with 38 additions and 7 deletions.
diff --git a/css/import/import.css b/css/import/import.css
@@ -45,6 +45,18 @@
   border: 1px solid var(--spectrum-global-color-gray-100);
 }
 
+.import #import-action-row {
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+}
+
+.import #transformation-file-default {
+  text-align: right;
+  font-style: italic;
+  font-size: 12px;
+}
+
 .import sp-theme[color="light"] {
   width: 100%;
   background-color: var(--spectrum-global-color-gray-50);
@@ -192,4 +204,4 @@
 
 .import #import-result sp-icon-alert {
   color: rgb(215 25 19);
-}
+}
diff --git a/import-bulk.html b/import-bulk.html
@@ -79,9 +79,12 @@ <h2>Import - Bulk</h2>
                                 </sp-accordion-item>
                             </sp-accordion>
 
-                            <sp-button-group>
-                                <sp-button id="import-doimport-button">Import</sp-button>
-                            </sp-button-group>
+                            <div id="import-action-row">
+                                <sp-button-group>
+                                    <sp-button id="import-doimport-button">Import</sp-button>
+                                </sp-button-group>
+                                <p id="transformation-file-default" class="hidden">NOTE: The default transformation file is being used.</p>
+                            </div>
                         </form>
                         <span id="folder-name"></span>
                         <div class="page-preview hidden">

diff --git a/import.html b/import.html
@@ -82,9 +82,12 @@ <h2>Import - Workbench</h2>
                                 </sp-accordion-item>
                             </sp-accordion>
 
-                            <sp-button-group>
-                                <sp-button id="import-doimport-button">Import</sp-button>
-                            </sp-button-group>
+                            <div id="import-action-row">
+                                <sp-button-group>
+                                    <sp-button id="import-doimport-button">Import</sp-button>
+                                </sp-button-group>
+                                <p id="transformation-file-default" class="hidden">NOTE: The default transformation file is being used.</p>
+                            </div>
                         </form>
                         <span id="folder-name"></span>
                         <div class="page-preview hidden">

diff --git a/js/import/import.ui.js b/js/import/import.ui.js
@@ -24,6 +24,7 @@ const PREVIEW_CONTAINER = document.querySelector(`${PARENT_SELECTOR} .page-previ
 
 const IMPORTFILEURL_FIELD = document.getElementById('import-file-url');
 const IMPORT_BUTTON = document.getElementById('import-doimport-button');
+const DEFAULT_TRANSFORMER_USED = document.getElementById('transformation-file-default');
 
 // const SAVEASWORD_BUTTON = document.getElementById('saveAsWord');
 const FOLDERNAME_SPAN = document.getElementById('folder-name');
@@ -396,6 +397,14 @@ const smartScroll = async (window) => {
   }
 };
 
+const setDefaultTransformerNotice = (importer) => {
+  if (importer.usingDefaultTransformer) {
+    DEFAULT_TRANSFORMER_USED.classList.remove('hidden');
+  } else {
+    DEFAULT_TRANSFORMER_USED.classList.add('hidden');
+  }
+};
+
 const attachListeners = () => {
   attachOptionFieldsListeners(config.fields, PARENT_SELECTOR);
 
@@ -433,6 +442,7 @@ const attachListeners = () => {
 
   IMPORT_BUTTON.addEventListener('click', (async () => {
     initImportStatus();
+    setDefaultTransformerNotice(config.importer);
 
     if (IS_BULK) {
       clearResultPanel();
@@ -611,6 +621,7 @@ const attachListeners = () => {
   IMPORTFILEURL_FIELD.addEventListener('change', async (event) => {
     if (config.importer) {
       await config.importer.setImportFileURL(event.target.value);
+      setDefaultTransformerNotice(config.importer);
     }
   });
 

diff --git a/js/shared/pollimporter.js b/js/shared/pollimporter.js
@@ -52,6 +52,7 @@ export default class PollImporter {
     this.projectTransform = null;
     this.projectTransformFileURL = '';
     this.running = false;
+    this.usingDefaultTransformer = true;
 
     this.#init();
   }
@@ -71,6 +72,7 @@ export default class PollImporter {
       const res = await fetch(projectTransformFileURL);
       body = await res.text();
 
+      this.usingDefaultTransformer = !res.ok;
       if (res.ok && body !== this.lastProjectTransformFileBody) {
         this.lastProjectTransformFileBody = body;
         await loadModule(projectTransformFileURL);