ENGCOM-4373: Fix Admin Customizable Options Dropdown sort_order issue #21371

 - Merge Pull Request #21371 from omiroshnichenko/magento2:20989
 - Merged commits:
   1. 4e348fd
   2. e270dee
   3. 795d532

Author: magento-engcom-team

app/code/Magento/Backend/view/adminhtml/web/template/dynamic-rows/grid.html

@@ -69,7 +69,7 @@
 
                         <!-- ko foreach: { data: $record().elems(), as: 'elem'}  -->
                         <td if="elem.template"
-                            visible="elem.visible"
+                            visible="elem.visible() && elem.formElement !== 'hidden'"
                             disable="elem.disabled"
                             css="$parent.setClasses(elem)"
                             template="elem.template"

app/code/Magento/Catalog/Ui/DataProvider/Product/Form/Modifier/CustomOptions.php

@@ -871,6 +871,7 @@ protected function getPositionFieldConfig($sortOrder)
                         'formElement' => Hidden::NAME,
                         'dataScope' => static::FIELD_SORT_ORDER_NAME,
                         'dataType' => Number::NAME,
+                        'visible' => false,
                         'sortOrder' => $sortOrder,
                     ],
                 ],

app/code/Magento/Ui/view/base/web/js/dynamic-rows/dynamic-rows.js

@@ -543,6 +543,7 @@ define([
                     data = this.createHeaderTemplate(cell.config);
                     cell.config.labelVisible = false;
                     _.extend(data, {
+                        defaultLabelVisible: data.visible(),
                         label: cell.config.label,
                         name: cell.name,
                         required: !!cell.config.validation,

app/code/Magento/Ui/view/base/web/js/dynamic-rows/record.js

@@ -245,7 +245,7 @@ define([
                 label = _.findWhere(this.parentComponent().labels(), {
                     name: index
                 });
-                label.visible() !== state ? label.visible(state) : false;
+                label.defaultLabelVisible && label.visible(state);
             } else {
                 elems[curElem].visible(state);
             }

app/code/Magento/Ui/view/base/web/templates/dynamic-rows/templates/default.html

@@ -41,7 +41,7 @@
                     <!-- ko foreach: { data: $record().elems(), as: 'elem'}  -->
                     <td if="elem.template"
                         css="$parent.setClasses(elem)"
-                        visible="elem.visible"
+                        visible="elem.visible() && elem.formElement !== 'hidden'"
                         disable="elem.disabled"
                         template="elem.template"/>
                     <!-- /ko -->

app/code/Magento/Ui/view/base/web/templates/dynamic-rows/templates/grid.html

@@ -58,7 +58,7 @@
 
                     <!-- ko foreach: { data: $record().elems(), as: 'elem'}  -->
                     <td if="elem.template"
-                        visible="elem.visible"
+                        visible="elem.visible() && elem.formElement !== 'hidden'"
                         disable="elem.disabled"
                         css="$parent.setClasses(elem)"
                         template="elem.template"

dev/tests/js/jasmine/tests/app/code/Magento/Ui/base/js/dynamic-rows/dynamic-rows.test.js

@@ -151,12 +151,14 @@ define([
                     }
                 }],
                 result = [{
+                    defaultLabelVisible: true,
                     label: 'Label 2',
                     name: 'Name 2',
                     required: false,
                     columnsHeaderClasses: '',
                     sortOrder: 5
                 }, {
+                    defaultLabelVisible: true,
                     label: 'Label 1',
                     name: 'Name 1',
                     required: false,