From 40b80f493c48f0e00cf6428c0381dd057d15b006 Mon Sep 17 00:00:00 2001
From: cnouguier <ch.nouguier@gmail.com>
Date: Fri, 31 Jan 2025 18:01:04 +0100
Subject: [PATCH] feat: Allow to hide the separator in KCardSection (close
 #1075)

---
 .../components/collection/KCardSection.vue    | 26 +++----------------
 .../collection/KDescriptionCardSection.vue    | 15 +++++++----
 core/client/utils/utils.items.js              |  4 +++
 3 files changed, 17 insertions(+), 28 deletions(-)

diff --git a/core/client/components/collection/KCardSection.vue b/core/client/components/collection/KCardSection.vue
index 481b74a80..c0677a710 100644
--- a/core/client/components/collection/KCardSection.vue
+++ b/core/client/components/collection/KCardSection.vue
@@ -1,6 +1,6 @@
 <template>
   <div>
-    <q-separator />
+    <q-separator v-if="!hideSeparator" />
     <!--
       Header section
      -->
@@ -26,30 +26,10 @@
 <script setup>
 import _ from 'lodash'
 import { computed } from 'vue'
+import { CardSectionProps } from '../../utils/utils.items.js'
 
 // Props
-const props = defineProps({
-  title: {
-    type: String,
-    default: ''
-  },
-  actions: {
-    type: Array,
-    default: () => null
-  },
-  actionsFilter: {
-    type: [String, Array],
-    default: () => null
-  },
-  hideHeader: {
-    type: Boolean,
-    default: false
-  },
-  dense: {
-    type: Boolean,
-    default: false
-  }
-})
+const props = defineProps(_.omit(CardSectionProps, ['item']))
 
 // Computed
 const filteredActions = computed(() => {
diff --git a/core/client/components/collection/KDescriptionCardSection.vue b/core/client/components/collection/KDescriptionCardSection.vue
index cf51d3124..c77e2e5b7 100644
--- a/core/client/components/collection/KDescriptionCardSection.vue
+++ b/core/client/components/collection/KDescriptionCardSection.vue
@@ -1,14 +1,15 @@
 <template>
   <KCardSection
-    :title="$t('KDescriptionCardSection.TITLE')"
+    :title="computedTitle"
     :actions="actions"
     :actionsFilter="actionsFilter"
-    :hideHeader="hideHeader"
+    :hide-separator="hideSeparator"
+    :hide-header="hideHeader"
     :dense="dense"
   >
     <KTextArea
-      v-if="description"
-      :text="description"
+      v-if="computedDescription"
+      :text="computedDescription"
       :minHeight="48"
       :dense="dense"
     />
@@ -28,6 +29,7 @@
 import _ from 'lodash'
 import { computed } from 'vue'
 import { CardSectionProps } from '../../utils/utils.items.js'
+import { i18n } from '../../i18n.js'
 import KCardSection from './KCardSection.vue'
 import KTextArea from '../KTextArea.vue'
 
@@ -41,7 +43,10 @@ const props = defineProps({
 })
 
 // Computed
-const description = computed(() => {
+const computedTitle = computed(() => {
+  return _.isEmpty(props.title) ? i18n.t('KDescriptionCardSection.TITLE') : props.title
+})
+const computedDescription = computed(() => {
   return _.get(props.item, props.descriptionPath)
 })
 </script>
diff --git a/core/client/utils/utils.items.js b/core/client/utils/utils.items.js
index e38543d23..4d59e536b 100644
--- a/core/client/utils/utils.items.js
+++ b/core/client/utils/utils.items.js
@@ -15,6 +15,10 @@ export const CardSectionProps = {
     type: [String, Array],
     default: () => null
   },
+  hideSeparator: {
+    type: Boolean,
+    default: false
+  },
   hideHeader: {
     type: Boolean,
     default: false