From bdbe96b5f275b6379625413481177d1b960ba333 Mon Sep 17 00:00:00 2001
From: Shariq Ansari <sharique.rik@gmail.com>
Date: Mon, 27 May 2024 14:46:24 +0530
Subject: [PATCH] fix: show normal actions in grouped action in mobile view

---
 frontend/src/components/CustomActions.vue | 27 ++++++++++++++++++++---
 1 file changed, 24 insertions(+), 3 deletions(-)

diff --git a/frontend/src/components/CustomActions.vue b/frontend/src/components/CustomActions.vue
index 68cfa545..9342892e 100644
--- a/frontend/src/components/CustomActions.vue
+++ b/frontend/src/components/CustomActions.vue
@@ -14,8 +14,9 @@
 </template>
 
 <script setup>
-import { computed } from 'vue'
+import { computed, h } from 'vue'
 import { Dropdown } from 'frappe-ui'
+import { isMobileView } from '@/stores/settings'
 
 const props = defineProps({
   actions: {
@@ -25,10 +26,30 @@ const props = defineProps({
 })
 
 const groupedActions = computed(() => {
-  return props.actions.filter((action) => action.group)
+  let _actions = []
+  let _normalActions = props.actions.filter((action) => !action.group)
+  if (isMobileView.value && _normalActions.length) {
+    _actions.push({
+      group: __('Actions'),
+      hideLabel: true,
+      items: _normalActions.map((action) => ({
+        label: action.label,
+        onClick: action.onClick,
+        icon: action.icon,
+      })),
+    })
+  }
+  _actions = _actions.concat(
+    props.actions.filter((action) => action.group)
+  )
+  return _actions
 })
 
 const normalActions = computed(() => {
-  return props.actions.filter((action) => !action.group)
+  let _actions = props.actions.filter((action) => !action.group)
+  if (isMobileView.value && _actions.length) {
+    return []
+  }
+  return _actions
 })
 </script>