fix disabled and tooltip

TrueLayer · Nov 12, 2024 · 5f6a089 · 5f6a089
1 parent 38c42a0
commit 5f6a089
Show file tree

Hide file tree

Showing 3 changed files with 27 additions and 28 deletions.
diff --git a/Block/Adminhtml/System/Config/Field/Base64FileUpload.php b/Block/Adminhtml/System/Config/Field/Base64FileUpload.php
@@ -28,9 +28,8 @@ protected function _getElementHtml(AbstractElement $element)
         $htmlTextInputId = $element->getHtmlId();
         $mode = $element->getData('field_config')['depends']['fields']['mode']['value'] ?? Mode::SANDBOX;
         $fieldType = $element->getData('field_config')['type'] ?? 'text';
-        $tooltip = $element->getTooltip();
-        $element->setTooltip();
         $displayValue = $element->getValue();
+        $disabled = $element->getDisabled();
         if ($displayValue && $fieldType == 'obscure') {
             $displayValue = '******';
         }
@@ -40,7 +39,7 @@ protected function _getElementHtml(AbstractElement $element)
             'mode' => $mode,
             'fieldType' => $fieldType,
             'displayValue' => $displayValue,
-            'tooltip' => $tooltip,
+            'disabled' => $disabled,
         ]);
         return $this->_toHtml();
     }

diff --git a/view/adminhtml/templates/system/config/button/base64-file-upload.phtml b/view/adminhtml/templates/system/config/button/base64-file-upload.phtml
@@ -14,29 +14,30 @@ $htmlClass = 'truelayer_upload-file-as-string_'.$mode;
 $scope = 'truelayer_private-key-upload_'.$mode;
 $fieldType = $block->getData('fieldType');
 $displayValue = $block->getData('displayValue');
-$tooltip = $block->getData('tooltip');
+$disabled = $block->getData('disabled');
+$disabledHtml = $disabled ? 'disabled="disabled"' : "";
 
 $htmlTextInputId = $block->getData('htmlTextInputId');
 $htmlFileInputId = $htmlTextInputId.'_file';
 ?>
 
-<div class="<?= $htmlClass ?>" data-bind="scope: '<?= $scope ?>'">
+<span class="<?= $htmlClass ?>" data-bind="scope: '<?= $scope ?>'" style="display:inline-block;width:100%;">
     <input
         id="<?= $htmlTextInputId ?>"
         name="groups[general][fields][<?= $mode ?>_private_key][value]"
         type="<?= $fieldType === 'obscure' ? 'password' : 'text' ?>"
-        value="<?= $displayValue ?>"/>
+        value="<?= $displayValue ?>"
+        <?= $disabledHtml ?>
+    />
 
-        <?php if ($tooltip) { ?>
-            <div class="tooltip"><span class="help"><span></span></span>
-            <div class="tooltip-content"><?= $tooltip ?></div></div>
-        <?php } ?>
     <button
+        id="button-<?= $htmlTextInputId ?>"
         type="button"
         data-bind="click: clickUpload"
+        <?= $disabledHtml ?>
     >Upload file</button>
     <input type="file" id="<?= $htmlFileInputId ?>" data-bind="event:{change:handleFile}" hidden />
-</div>
+</span>
 
 <script type="text/x-magento-init">
     {

diff --git a/view/adminhtml/web/js/handle-upload.js b/view/adminhtml/web/js/handle-upload.js
@@ -5,32 +5,31 @@
 
 define([
     'uiComponent',
-    'jquery'
-], function (Component, $) {
+], function (Component) {
     'use strict';
 
     return Component.extend({
         clickUpload() {
             document.getElementById(this.htmlFileInputId).click();
         },
         handleFile(object, event) {
-                const textInput = document.getElementById(this.htmlTextInputId);
-                // Get a reference to the file
-                const file = event?.target?.files[0];
+            const textInput = document.getElementById(this.htmlTextInputId);
+            // Get a reference to the file
+            const file = event?.target?.files[0];
 
-                if (!file) {
-                    return;
-                }
-                // Encode the file using the FileReader API
-                const reader = new FileReader();
-                reader.onloadend = () => {
-                    // Use a regex to remove data url part
-                    const base64String = reader.result
-                        .replace(/^data:.+,/, "");
+            if (!file) {
+                return;
+            }
+            // Encode the file using the FileReader API
+            const reader = new FileReader();
+            reader.onloadend = () => {
+                // Use a regex to remove data url part
+                const base64String = reader.result
+                    .replace(/^data:.+,/, "");
 
-                    textInput.value = base64String;
-                };
-                reader.readAsDataURL(file);
+                textInput.value = base64String;
+            };
+            reader.readAsDataURL(file);
         }
     });
 });