From dd10068640f297c65742d4c6feab23c8f0e4b6bf Mon Sep 17 00:00:00 2001
From: Yurii <yurikuzn@users.noreply.github.com>
Date: Mon, 15 Jun 2026 13:45:38 +0300
Subject: [PATCH] Icon only actions

---
 client/src/components/controls.ts         | 10 ++++++----
 client/src/helpers/action-item-setup.js   |  2 +-
 client/src/views/modal.ts                 | 14 ++++++++------
 client/src/views/record/detail/buttons.ts | 11 +++++++++--
 4 files changed, 24 insertions(+), 13 deletions(-)

diff --git a/client/src/components/controls.ts b/client/src/components/controls.ts
index fb408f94d2..ed76bd33e9 100644
--- a/client/src/components/controls.ts
+++ b/client/src/components/controls.ts
@@ -236,13 +236,13 @@ function prepareItemContent(
             props.innerHTML = options.iconHtml + props.innerHTML;
         }
     } else {
-        const label = options.label ?? options.name;
+        const label = options.label;
 
         let text = options.text ??
             (
                 options.labelTranslation ?
                     language.translatePath(options.labelTranslation) :
-                    language.translate(label ?? '?', 'labels', options.scope)
+                    language.translate(label ?? '', 'labels', options.scope)
             );
 
         let icon = null;
@@ -258,8 +258,10 @@ function prepareItemContent(
 
         if (isDropdownItem) {
             text = h('span', {props: {className: 'item-text'}}, text);
-        } else if (icon) {
-            text = h('span', text);
+        } else {
+            if (icon && text) {
+                text = h('span', text);
+            }
         }
 
         content = icon ?
diff --git a/client/src/helpers/action-item-setup.js b/client/src/helpers/action-item-setup.js
index db63a97179..83f1174f33 100644
--- a/client/src/helpers/action-item-setup.js
+++ b/client/src/helpers/action-item-setup.js
@@ -129,7 +129,7 @@ class ActionItemSetupHelper {
         actionDefsList.forEach(item => {
             const name = item.name;
 
-            if (!item.label && !item.labelTranslation) {
+            if (!item.label && !item.labelTranslation && !item.iconClass) {
                 item.text = this.language.translate(name, 'actions', scope);
             }
 
diff --git a/client/src/views/modal.ts b/client/src/views/modal.ts
index 2f1489aa1b..64e7822372 100644
--- a/client/src/views/modal.ts
+++ b/client/src/views/modal.ts
@@ -496,8 +496,6 @@ class ModalView<S extends ViewSchema = ViewSchema> extends View<S> {
                     o.text = this.getLanguage().translatePath(o.labelTranslation);
                 } else if ('label' in o) {
                     o.text = this.translate(o.label, 'labels', this.scope);
-                } else {
-                    o.text = this.translate(o.name, 'modalActions', this.scope);
                 }
             }
 
@@ -508,8 +506,14 @@ class ModalView<S extends ViewSchema = ViewSchema> extends View<S> {
             if (o.iconHtml && !o.html) {
                 o.html = o.iconHtml + '<span>' + this.getHelper().escapeString(o.text as string) + '</span>';
             } else if (o.iconClass && !o.html) {
-                o.html = `<span class="${o.iconClass}"></span>` +
-                    '<span>' + this.getHelper().escapeString(o.text as string) + '</span>';
+                if (o.text) {
+                    o.html = `<span class="${o.iconClass}"></span>` +
+                        '<span>' + this.getHelper().escapeString(o.text as string) + '</span>';
+                } else {
+                    o.html = `<span class="${o.iconClass}"></span>`;
+
+                    o.className = 'btn-icon';
+                }
             }
 
             o.onClick = o.onClick ?? ((_d, event) => {
@@ -550,8 +554,6 @@ class ModalView<S extends ViewSchema = ViewSchema> extends View<S> {
                     o.text = this.getLanguage().translatePath(o.labelTranslation);
                 } else if ('label' in o) {
                     o.text = this.translate(o.label, 'labels', this.scope)
-                } else {
-                    o.text = this.translate(o.name, 'modalActions', this.scope);
                 }
             }
 
diff --git a/client/src/views/record/detail/buttons.ts b/client/src/views/record/detail/buttons.ts
index cb774004b4..f4b261cf65 100644
--- a/client/src/views/record/detail/buttons.ts
+++ b/client/src/views/record/detail/buttons.ts
@@ -51,6 +51,14 @@ export default class DetailRecordButtonsView extends View<{
         const buttons: any[] = [];
 
         data.buttonList.forEach(it => {
+            let className = this.options.actionClassName;
+
+            if (it.iconClass && !(it.label || it.labelTranslation || it.text || it.html)) {
+                className += ' btn-icon';
+            } else {
+                className += ' btn-xs-wide';
+            }
+
             buttons.push(
                 new ButtonComponent({
                     name: it.name,
@@ -62,7 +70,7 @@ export default class DetailRecordButtonsView extends View<{
                     title: it.title,
                     titleTranslation: it.titleTranslation,
                     text: it.text,
-                    className: data.buttonClassName,
+                    className: className,
                     hidden: it.hidden,
                     disabled: it.disabled || data.allDisabled,
                     iconClass: it.iconClass,
@@ -150,7 +158,6 @@ export default class DetailRecordButtonsView extends View<{
             buttonList: data.buttonList.filter(it => !it.hidden),
             dropdownItemList: dropdownItemList,
             entityType: this.options.entityType,
-            buttonClassName: 'btn-xs-wide ' + this.options.actionClassName,
             actionClassName: this.options.actionClassName,
             dropdownEmpty: dropdownEmpty,
             allDisabled: data.allDisabled,