From a99721bb2204bf2dcfccd34c48406ab2e5f42dc8 Mon Sep 17 00:00:00 2001
From: SimonGschnell <simongschnell@gmail.com>
Date: Fri, 9 May 2025 09:34:12 +0200
Subject: [PATCH 1/9] feature(Dashboard Mobile): the modal to add new widgets
 distributes the space to display widgetes more evenly

---
 public/js/components/Dashboard/Widget/Picker.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/public/js/components/Dashboard/Widget/Picker.js b/public/js/components/Dashboard/Widget/Picker.js
index 7ffd0671c..378c4ca9d 100644
--- a/public/js/components/Dashboard/Widget/Picker.js
+++ b/public/js/components/Dashboard/Widget/Picker.js
@@ -36,11 +36,11 @@ export default {
 		<bs-modal ref="modal" class="fade" :dialog-class="{'modal-fullscreen-sm-down': 1, 'modal-xl': widgets && widgets.length > 0}" @hiddenBsModal="close">
 			<template v-slot:title>Create new widget</template>
 			<template v-slot:default>
-				<div v-if="widgets" class="row">
+				<div v-if="widgets" class="row g-2">
 					<div v-if="!widgets.length">
 						No Widgets available
 					</div>
-					<div v-for="widget in widgets" :key="widget.widget_id" class="col-sm-6 col-md-4 col-lg-3 col-xl-2">
+					<div v-for="widget in widgets" :key="widget.widget_id" class="col-6 col-sm-6 col-md-4 col-lg-3 col-xl-2">
 						<widget-icon @select="pick" :widget="widget" ></widget-icon>
 					</div>
 				</div>

From a94b52dbc68b136d21f1c5ea0eb18a3622399148 Mon Sep 17 00:00:00 2001
From: SimonGschnell <simongschnell@gmail.com>
Date: Mon, 12 May 2025 11:44:27 +0200
Subject: [PATCH 2/9] refactor(Dashboard touch events): fixes the touch event
 behaviors for the widgets and the dashboard

---
 public/css/components/dashboard.css       |  1 +
 public/js/components/Dashboard/Item.js    |  6 +++++-
 public/js/components/Dashboard/Section.js |  5 +++--
 public/js/components/Drop/Grid.js         | 19 +++++++++++--------
 public/js/components/Drop/Grid/Item.js    | 15 ++++++++-------
 5 files changed, 28 insertions(+), 18 deletions(-)

diff --git a/public/css/components/dashboard.css b/public/css/components/dashboard.css
index 55cd9a8ed..f48a25418 100644
--- a/public/css/components/dashboard.css
+++ b/public/css/components/dashboard.css
@@ -15,6 +15,7 @@
 	height: 100%;
 	width: 100%;
 	background-color:white;
+	position:relative;
 }
 
 .empty-tile-hover:hover {
diff --git a/public/js/components/Dashboard/Item.js b/public/js/components/Dashboard/Item.js
index b7a334b92..beaca64f0 100644
--- a/public/js/components/Dashboard/Item.js
+++ b/public/js/components/Dashboard/Item.js
@@ -41,6 +41,8 @@ export default {
 		"item_data",
 		"place",
 		"setup",
+		"dragstate",
+		"resizeOverlay"
 	],
 	computed: {
 		maxHeight(){
@@ -153,7 +155,8 @@ export default {
 			<i class="fa-solid fa-spinner fa-pulse fa-3x"></i>
 		</div>
 	</div>
-	<div v-else-if="!hidden || editMode" :id="widgetID" class="dashboard-item card overflow-hidden h-100 position-relative" :class="arguments && arguments.className ? arguments.className : ''">
+	<div v-else-if="!hidden || editMode" :id="widgetID" class="dashboard-item card overflow-hidden h-100 position-relative" :class="{'draggedItem':dragstate, 'dashboard-item-overlay':resizeOverlay, [arguments?.className]:arguments && arguments.className}">
+	<div v-show="!dragstate" class="h-100 card border-0">
 		<div v-if="widget" class="card-header d-flex ps-0 pe-2 align-items-center">
 			<Transition>
 				<span v-if="editMode && !isPinned" drag-action="move" class="col-auto mx-2 px-2 cursor-move"><i class="fa-solid fa-grip-vertical"></i></span>
@@ -221,5 +224,6 @@ export default {
 				</template>
 			</div>
 		</height-transition>
+		</div>
 	</div>`,
 };
diff --git a/public/js/components/Dashboard/Section.js b/public/js/components/Dashboard/Section.js
index 17c2ac004..fb5caa965 100644
--- a/public/js/components/Dashboard/Section.js
+++ b/public/js/components/Dashboard/Section.js
@@ -209,7 +209,7 @@ export default {
 		});
 	},
 	template: `
-	<h4 v-if="editModeIsActive" class=" mb-0">
+	<h4 v-if="editModeIsActive" class=" mb-2">
 		<i @click="showSectionInformation(name)" class="fa-solid fa-circle-info section-info" ></i>
 		{{sectionNameTranslation()}}:
 	</h4>
@@ -217,10 +217,11 @@ export default {
 		<drop-grid v-model:cols="gridWidth" :items="items" :itemsSetup="computedWidgetsSetup" :active="editModeIsActive" :resize-limit="checkResizeLimit" :margin-for-extra-row=".01" @draggedItem="draggedItem=$event" @rearrange-items="updatePositions" @gridHeight="gridHeight=$event" >
 			<template #default="item">
 				<div v-if="item.placeholder" class="empty-tile-hover" @click="$emit('widgetAdd', name, { widget: 1, config: {}, place: {[gridWidth]: {x:item.x,y:item.y,w:1,h:1}}, custom: 1 })"></div>
-				<div v-else-if="item.blank || (item.widgetid && item.widgetid == draggedItem?.data.widgetid)" :class="{'dashboard-item-overlay':item.resizeOverlay}" class="dashboard-item card overflow-hidden h-100 position-relative draggedItem" ></div>
 				<dashboard-item 
 					v-else
 					:id="item.widget"
+					:dragstate="item.blank || (item.widgetid && item.widgetid == draggedItem?.data.widgetid)"
+					:resizeOverlay="item.resizeOverlay"
 					:widgetID="item.id"
 					:width="item.w"
 					:height="item.h"
diff --git a/public/js/components/Drop/Grid.js b/public/js/components/Drop/Grid.js
index 44ca0a603..54907703b 100644
--- a/public/js/components/Drop/Grid.js
+++ b/public/js/components/Drop/Grid.js
@@ -405,6 +405,7 @@ export default {
 			}
 		},
 		startMove(evt, item) {
+			
 			if (!this.active)
 				return;
 			
@@ -413,14 +414,15 @@ export default {
 			this.grid.h += 1;
 			this.draggedItem = item;
 			this.$emit('draggedItem',item);
-			this.draggedNode = evt.target;
+			
+			this.draggedNode = evt.target.closest(".drop-grid-item");
 			//clones the widget for the drag Image
-			let clone = evt.target.cloneNode(true);
+			let clone = evt.target.closest(".drop-grid-item")?.cloneNode(true);
+			
 			clone.style.zIndex = 5;
 			clone.classList.add("widgetClone");
 			this.$refs.container.appendChild(clone);
 			this.clonedWidget = clone;
-			
 			this.draggedOffset = [item.x - this.x, item.y - this.y];
 			this._dragStart(evt, item);
 		},
@@ -498,9 +500,10 @@ export default {
 			Array.from(document.getElementsByClassName("denied-dragging-animation"))?.forEach(ele => {
 				ele.classList.remove("denied-dragging-animation");
 			})
+			
 			let widgetClones = document.getElementsByClassName("widgetClone");
-			for(let widget of widgetClones){
-				this.$refs.container.removeChild(widget);
+			for (let i=0; i <widgetClones.length; i++){ 
+				this.$refs.container.removeChild(widgetClones[i]);
 			}
 			
 			if (!this.active || this.x < 0 || this.y < 0 || this.x >= this.cols)
@@ -614,7 +617,7 @@ export default {
 		<TransitionGroup tag="div">
 			<grid-item
 				ref="gridItems"
-				v-for="(item,index) in ((mode != 1 || mode != 2) && active ? placedItems_withPlaceholders : placedItems)"
+				v-for="(item,index) in ((mode != 1 && mode != 2) && active ? placedItems_withPlaceholders : placedItems)"
 				:key="item.data.id"
 				:item="item"
 				@start-move="startMove"
@@ -623,8 +626,8 @@ export default {
 				@start-resize="startResize"
 				@dragging="dragging"
 				@end-drag="dragCancel"
-				@drop-drag="dragEnd"
-				@touchEvent="updateCursorOnMouseMove"
+				@touch-end="dragEnd();mouseUp();"
+				@touch-start="updateCursorOnMouseMove($event); mouseDown();"
 				class="position-absolute"
 				:active="active"
 				:style="{
diff --git a/public/js/components/Drop/Grid/Item.js b/public/js/components/Drop/Grid/Item.js
index b8acf3044..a597c4f00 100644
--- a/public/js/components/Drop/Grid/Item.js
+++ b/public/js/components/Drop/Grid/Item.js
@@ -17,7 +17,8 @@ export default {
 		"endDrag",
 		"dropDrag",
 		"item",
-		"touchEvent"
+		"touchStart",
+		"touchEnd",
 	],
 	data() {
 		return {
@@ -54,16 +55,16 @@ export default {
 		},
 		touchDragEnd(evt) {
 			if (!this.dragging)
-				//return evt.preventDefault();
-                                return;
+				return;
 			this.dragging = false;
-			this.$emit('dropDrag', evt);
+			this.$emit('touchEnd', evt);
 		},
 		touchStart(event){
-			this.$emit('touchEvent', event); 
+			this.$emit('touchStart', event); 
 			this.registerDragAction(event); 
 			this.tryDragStart(event, this.item);
-		}
+		},
+		
 	},
 	template: `
 	<div class="drop-grid-item"
@@ -73,7 +74,7 @@ export default {
 		@touchend="touchDragEnd"
 		@dragstart="tryDragStart($event, item)"
 		@drag="$emit('dragging',$event)"
-		@touchmove="$emit('dragging',$event)"
+		@touchmove.prevent="$emit('dragging',$event)"
 		@dragend="$emit('endDrag', $event)"
 		:draggable="active && !item.placeholder && dragAction != ''">
 		<slot v-bind="item"></slot>

From ed2a4679264d2c89f40af5608a15e34aa4b23a2d Mon Sep 17 00:00:00 2001
From: SimonGschnell <simongschnell@gmail.com>
Date: Mon, 12 May 2025 13:51:20 +0200
Subject: [PATCH 3/9] refactor(Dashboard additional row): changes the UI and
 behavior to add an additional row to the grid

---
 public/css/components/dashboard.css       | 16 +++++++++
 public/js/components/Dashboard/Item.js    |  3 +-
 public/js/components/Dashboard/Section.js |  4 ++-
 public/js/components/Drop/Grid.js         | 41 ++++++++++++-----------
 4 files changed, 42 insertions(+), 22 deletions(-)

diff --git a/public/css/components/dashboard.css b/public/css/components/dashboard.css
index f48a25418..8770c1e78 100644
--- a/public/css/components/dashboard.css
+++ b/public/css/components/dashboard.css
@@ -18,6 +18,22 @@
 	position:relative;
 }
 
+.dashboard-section > .newGridRow{
+	position:absolute;
+	width:20px;
+	height:20px;
+	padding:0;
+	bottom:0;
+	left:50%;
+	transform:translate(-50%, 50%);
+	background-color:white;
+}
+
+.newGridRow:hover {
+	color:white;
+	background-color:#6c757d;
+}
+
 .empty-tile-hover:hover {
 		background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="-500 -500 1448 1512"><path fill="rgb(211, 211, 211)" d="M64 32C28.7 32 0 60.7 0 96V416c0 35.3 28.7 64 64 64H384c35.3 0 64-28.7 64-64V96c0-35.3-28.7-64-64-64H64zM200 344V280H136c-13.3 0-24-10.7-24-24s10.7-24 24-24h64V168c0-13.3 10.7-24 24-24s24 10.7 24 24v64h64c13.3 0 24 10.7 24 24s-10.7 24-24 24H248v64c0 13.3-10.7 24-24 24s-24-10.7-24-24z"/></svg>');
 }
diff --git a/public/js/components/Dashboard/Item.js b/public/js/components/Dashboard/Item.js
index beaca64f0..68a92e701 100644
--- a/public/js/components/Dashboard/Item.js
+++ b/public/js/components/Dashboard/Item.js
@@ -42,7 +42,8 @@ export default {
 		"place",
 		"setup",
 		"dragstate",
-		"resizeOverlay"
+		"resizeOverlay",
+		"additionalRow"
 	],
 	computed: {
 		maxHeight(){
diff --git a/public/js/components/Dashboard/Section.js b/public/js/components/Dashboard/Section.js
index fb5caa965..07e636cf5 100644
--- a/public/js/components/Dashboard/Section.js
+++ b/public/js/components/Dashboard/Section.js
@@ -41,6 +41,7 @@ export default {
 			gridWidth: 1,
 			gridHeight: null,
 			draggedItem:null,
+			additionalRow:false,
 		}
 	},
 	provide() {
@@ -214,7 +215,8 @@ export default {
 		{{sectionNameTranslation()}}:
 	</h4>
 	<div class="dashboard-section position-relative pb-3 border-bottom" ref="container" :style="getSectionStyle">
-		<drop-grid v-model:cols="gridWidth" :items="items" :itemsSetup="computedWidgetsSetup" :active="editModeIsActive" :resize-limit="checkResizeLimit" :margin-for-extra-row=".01" @draggedItem="draggedItem=$event" @rearrange-items="updatePositions" @gridHeight="gridHeight=$event" >
+		<button v-if="!additionalRow && editModeIsActive" @click="additionalRow=true" class="btn btn-outline-secondary rounded-circle newGridRow d-flex justify-content-center align-items-center">+</button>
+		<drop-grid v-model:cols="gridWidth" v-model:additionalRow="additionalRow" :items="items" :itemsSetup="computedWidgetsSetup" :active="editModeIsActive" :resize-limit="checkResizeLimit" :margin-for-extra-row=".01" @draggedItem="draggedItem=$event" @rearrange-items="updatePositions" @gridHeight="gridHeight=$event" >
 			<template #default="item">
 				<div v-if="item.placeholder" class="empty-tile-hover" @click="$emit('widgetAdd', name, { widget: 1, config: {}, place: {[gridWidth]: {x:item.x,y:item.y,w:1,h:1}}, custom: 1 })"></div>
 				<dashboard-item 
diff --git a/public/js/components/Drop/Grid.js b/public/js/components/Drop/Grid.js
index 54907703b..9be07ca15 100644
--- a/public/js/components/Drop/Grid.js
+++ b/public/js/components/Drop/Grid.js
@@ -26,6 +26,10 @@ export default {
 			type: Number,
 			default: 0
 		},
+		additionalRow:{
+			type: Boolean,
+			default: false,
+		}
 	},
 	emits: [
 		"rearrangeItems",
@@ -48,7 +52,6 @@ export default {
 			draggedOffset: [0,0],
 			draggedItem: null,
 			draggedNode: null,
-			additionalRow: null,
 			reorderedItems:[],
 			clonedWidget:null,
 		}
@@ -60,6 +63,14 @@ export default {
 		},
 	},
 	computed: {
+		additionalRowComputed: {
+			get() {
+				return this.additionalRow;
+			},
+			set(value) {
+				this.$emit('update:additionalRow', value);
+			}
+		},
 		items_hashmap() {
 			let items = {};
 			this.items.forEach(item => {
@@ -120,6 +131,11 @@ export default {
 			if ((this.mode == MODE_MOVE || this.mode == MODE_RESIZE) && this.dragGrid){
 				return this.dragGrid.h;
 			}
+			if (this.mode == MODE_IDLE) {
+				if (this.additionalRowComputed) {
+					return this.grid ? (this.grid.h+1) : 1;
+				}
+			}
 			return this.grid ? this.grid.h : 1;
 		},
 		gridStyle() {
@@ -350,13 +366,8 @@ export default {
 			if (this.mode == MODE_IDLE) {
 				this.x = -1;
 				this.y = -1;
-				if (this.additionalRow !== null) {
-					let gridHeight = this.grid.getMaxY() + 1;
-					if(this.grid.h>gridHeight){
-						this.grid.h = gridHeight;
-					}
-					this.additionalRow = null;
-				}
+				this.additionalRowComputed = false;
+				
 			}
 		},
 		updateCursor(evt) {
@@ -380,18 +391,6 @@ export default {
 			if (this.x == gridX && this.y == gridY)
 				return false;
 			
-			if (this.mode == MODE_IDLE) {
-				if (this.additionalRow === null && this.y == this.rows-1 && gridY == this.rows) {
-					this.additionalRow = this.grid.h;
-					this.grid.h += 1;
-				} else if (this.additionalRow !== null && gridY != this.rows - 1) {
-					let gridHeight = this.grid.getMaxY() + 1;
-					if(this.grid.h > gridHeight){
-						this.grid.h = gridHeight;
-					}
-					this.additionalRow = null;
-				}
-			}
 			this.x = gridX;
 			this.y = gridY;
 
@@ -482,6 +481,7 @@ export default {
 			}
 		},
 		dragCancel() {
+			this.additionalRowComputed = false;
 			this.toggleDraggedItemOverlay(false);
 			this.mode = MODE_IDLE;
 			this.positionUpdates = null;
@@ -531,6 +531,7 @@ export default {
 			return updated;
 		},
 		emptyTileClicked() {
+			this.additionalRowComputed = false;
 			this.$emit('newItem', this.x, this.y);
 		},
 		updateCursorOnMouseMove(evt){

From dab628a72d5d2f94b18ab4c607fe53fa33b74d18 Mon Sep 17 00:00:00 2001
From: SimonGschnell <simongschnell@gmail.com>
Date: Tue, 13 May 2025 11:48:01 +0200
Subject: [PATCH 4/9] refactor(Dashboard UX): improves user experience for
 dashboard

---
 public/css/components/dashboard.css                 | 13 +++++++++++++
 public/js/apps/Dashboard/Fhc.js                     |  1 +
 public/js/components/Dashboard/Dashboard.js         |  8 +++++++-
 public/js/components/Dashboard/Section.js           | 11 +++++------
 public/js/components/Dashboard/Widget/Picker.js     |  2 +-
 public/js/components/Dashboard/Widget/WidgetIcon.js |  2 +-
 6 files changed, 28 insertions(+), 9 deletions(-)

diff --git a/public/css/components/dashboard.css b/public/css/components/dashboard.css
index 8770c1e78..eeb24d007 100644
--- a/public/css/components/dashboard.css
+++ b/public/css/components/dashboard.css
@@ -1,6 +1,19 @@
 @import './calendar.css';
 @import './dashboard/news.css';
 
+@media (max-width: 576px){
+	.widget-icon {
+		max-height: 250px;
+		object-fit: cover;
+	}
+	.widget-icon-container{
+		max-width: 250px;
+		margin-left: auto;
+		margin-right: auto;
+	}
+}
+
+
 .empty-tile-hover {
 	height: 100%;
 	width: 100%;
diff --git a/public/js/apps/Dashboard/Fhc.js b/public/js/apps/Dashboard/Fhc.js
index fc25fbdfe..ada267900 100644
--- a/public/js/apps/Dashboard/Fhc.js
+++ b/public/js/apps/Dashboard/Fhc.js
@@ -299,6 +299,7 @@ app.use(primevue.config.default, {
 		tooltip: 8000
 	}
 })
+app.directive('tooltip', primevue.tooltip);
 app.use(PluginsPhrasen);
 app.directive('contrast', contrast);
 app.mount('#fhccontent');
\ No newline at end of file
diff --git a/public/js/components/Dashboard/Dashboard.js b/public/js/components/Dashboard/Dashboard.js
index a463ff20b..825bad3f7 100644
--- a/public/js/components/Dashboard/Dashboard.js
+++ b/public/js/components/Dashboard/Dashboard.js
@@ -177,7 +177,13 @@ export default {
 				});
 				remove.forEach(wid => this.widgetRemove(name, wid));
 			}
-			this.sections = this.sections.sort((section1, section2) => section2.widgets.length - section1.widgets.length);
+			this.sections = this.sections.sort((section1, section2) => {
+				if(section1.name == 'custom')
+					return 1;
+				if (section2.name == 'custom')
+					return -1;
+				return section2.widgets.length - section1.widgets.length;
+			});
 		}).catch(err => console.error('ERROR:', err));
 	},
 	async beforeMount() {
diff --git a/public/js/components/Dashboard/Section.js b/public/js/components/Dashboard/Section.js
index 07e636cf5..05c3f940f 100644
--- a/public/js/components/Dashboard/Section.js
+++ b/public/js/components/Dashboard/Section.js
@@ -1,5 +1,4 @@
 import BsConfirm from "../Bootstrap/Confirm.js";
-import SectionModal from "../Bootstrap/Alert.js";
 import DropGrid from '../Drop/Grid.js'
 import DashboardItem from "./Item.js";
 import CachedWidgetLoader from "../../composables/Dashboard/CachedWidgetLoader.js";
@@ -109,13 +108,13 @@ export default {
 		},
 		showSectionInformation(){
 			if (this.name == "general"){
-				SectionModal.popup(this.$p.t('dashboard', 'dashboardGeneralSectionDescription')); 
+				return this.$p.t('dashboard', 'dashboardGeneralSectionDescription'); 
 			}
 			else if(this.name == "custom"){
-				SectionModal.popup(this.$p.t('dashboard', 'dashboardCustomSectionDescription'));
+				return this.$p.t('dashboard', 'dashboardCustomSectionDescription');
 			}
 			else{
-				SectionModal.popup(this.$p.t('dashboard', 'dashboardSectionDescription', [this.name]));
+				return this.$p.t('dashboard', 'dashboardSectionDescription', [this.name]);
 			}
 		},
 		handleConfigOpened() {
@@ -211,14 +210,14 @@ export default {
 	},
 	template: `
 	<h4 v-if="editModeIsActive" class=" mb-2">
-		<i @click="showSectionInformation(name)" class="fa-solid fa-circle-info section-info" ></i>
+		<i v-tooltip="{ value: showSectionInformation(name), hideDelay: 300 }" class="fa-solid fa-circle-info section-info" ></i>
 		{{sectionNameTranslation()}}:
 	</h4>
 	<div class="dashboard-section position-relative pb-3 border-bottom" ref="container" :style="getSectionStyle">
 		<button v-if="!additionalRow && editModeIsActive" @click="additionalRow=true" class="btn btn-outline-secondary rounded-circle newGridRow d-flex justify-content-center align-items-center">+</button>
 		<drop-grid v-model:cols="gridWidth" v-model:additionalRow="additionalRow" :items="items" :itemsSetup="computedWidgetsSetup" :active="editModeIsActive" :resize-limit="checkResizeLimit" :margin-for-extra-row=".01" @draggedItem="draggedItem=$event" @rearrange-items="updatePositions" @gridHeight="gridHeight=$event" >
 			<template #default="item">
-				<div v-if="item.placeholder" class="empty-tile-hover" @click="$emit('widgetAdd', name, { widget: 1, config: {}, place: {[gridWidth]: {x:item.x,y:item.y,w:1,h:1}}, custom: 1 })"></div>
+				<div v-if="item.placeholder" class="empty-tile-hover" @pointerdown="$emit('widgetAdd', name, { widget: 1, config: {}, place: {[gridWidth]: {x:item.x,y:item.y,w:1,h:1}}, custom: 1 })"></div>
 				<dashboard-item 
 					v-else
 					:id="item.widget"
diff --git a/public/js/components/Dashboard/Widget/Picker.js b/public/js/components/Dashboard/Widget/Picker.js
index 378c4ca9d..46b7c50e7 100644
--- a/public/js/components/Dashboard/Widget/Picker.js
+++ b/public/js/components/Dashboard/Widget/Picker.js
@@ -40,7 +40,7 @@ export default {
 					<div v-if="!widgets.length">
 						No Widgets available
 					</div>
-					<div v-for="widget in widgets" :key="widget.widget_id" class="col-6 col-sm-6 col-md-4 col-lg-3 col-xl-2">
+					<div v-for="widget in widgets" :key="widget.widget_id" class="widget-icon-container col-sm-6 col-md-4 col-lg-3 col-xl-2">
 						<widget-icon @select="pick" :widget="widget" ></widget-icon>
 					</div>
 				</div>
diff --git a/public/js/components/Dashboard/Widget/WidgetIcon.js b/public/js/components/Dashboard/Widget/WidgetIcon.js
index a7d816cb2..76a32af8c 100644
--- a/public/js/components/Dashboard/Widget/WidgetIcon.js
+++ b/public/js/components/Dashboard/Widget/WidgetIcon.js
@@ -20,7 +20,7 @@ export default {
 	emits:["select"],
 	template: /*html */`
 	<div class="card h-100" @click="$emit('select',widget.widget_id);">
-		<img class="card-img-top" :src="path(widget.setup.icon)" :alt="'pictogram for ' + (widget.setup.name || widget.widget_kurzbz)">
+		<img class="card-img-top widget-icon" :src="path(widget.setup.icon)" :alt="'pictogram for ' + (widget.setup.name || widget.widget_kurzbz)">
 		<div class="card-body">
 			<h5 class="card-title">{{ widget.setup.name || widget.widget_kurzbz }}</h5>
 			<p class="card-text">{{ widget.beschreibung }}</p>

From ebcb33b31692f4d9590b2568ca30c5103c248f24 Mon Sep 17 00:00:00 2001
From: SimonGschnell <simongschnell@gmail.com>
Date: Thu, 15 May 2025 12:00:41 +0200
Subject: [PATCH 5/9] update(Dashboard DataStructure Migration): adds migration
 file to change all old datastructures from the dashboard.tbl_dashboard_preset

---
 system/dbupdate_3.4.php                       |  2 ++
 .../61730_Dashboard_Anpassungen.php           | 34 +++++++++++++++++++
 2 files changed, 36 insertions(+)
 create mode 100644 system/dbupdate_3.4/61730_Dashboard_Anpassungen.php

diff --git a/system/dbupdate_3.4.php b/system/dbupdate_3.4.php
index 0e2b4e7c6..8ff7fab2b 100644
--- a/system/dbupdate_3.4.php
+++ b/system/dbupdate_3.4.php
@@ -74,6 +74,8 @@ require_once('dbupdate_3.4/55968_index_anrechnung.php');
 require_once('dbupdate_3.4/25999_locale_update.php');
 require_once('dbupdate_3.4/55289_pep_fine_tuning.php');
 require_once('dbupdate_3.4/55614_perm_verwaltetoe.php');
+require_once('dbupdate_3.4/61730_Dashboard_Anpassungen.php');
+
 
 // *** Pruefung und hinzufuegen der neuen Attribute und Tabellen
 echo '<H2>Pruefe Tabellen und Attribute!</H2>';
diff --git a/system/dbupdate_3.4/61730_Dashboard_Anpassungen.php b/system/dbupdate_3.4/61730_Dashboard_Anpassungen.php
new file mode 100644
index 000000000..a35c6188f
--- /dev/null
+++ b/system/dbupdate_3.4/61730_Dashboard_Anpassungen.php
@@ -0,0 +1,34 @@
+<?php
+
+$result = @$db->db_query("SELECT preset_id FROM dashboard.tbl_dashboard_preset WHERE preset ? 'widgets'");
+$result_num_rows = $db->db_num_rows($result);
+$errorList = array();
+for($i = 0; $i < $result_num_rows; $i++)
+{
+	$row = $db->db_fetch_object($result, $i);
+
+	$qry = "
+	UPDATE dashboard.tbl_dashboard_preset
+	SET preset = 
+	COALESCE(
+	(SELECT jsonb_object_agg(keys,values) FROM (
+		SELECT key AS keys,jsonb_build_object('widgets',to_jsonb(value)) AS values
+		FROM jsonb_each(preset->'widgets')
+	) AS subquery 
+	),preset)
+	WHERE preset_id = ".$row->preset_id;
+
+	$db->db_query($qry);
+	if (!$db->db_query($qry))
+        array_push($errorList,'<br><strong>dashboard.tbl_dashboard_preset: ' . $db->db_last_error() . '</strong><br>') ;
+    
+}
+
+if(empty($errorList)){
+	echo '<br>successfully updated dashboard.tbl_dashboard_preset';
+}
+else{
+	foreach($errorList as $error){
+		echo $error;
+	}
+}

From a40f304d8d4518bd3b91b17ed3ed86c40872940c Mon Sep 17 00:00:00 2001
From: SimonGschnell <simongschnell@gmail.com>
Date: Thu, 15 May 2025 12:05:12 +0200
Subject: [PATCH 6/9] update(Dashboard DataStructure Migration): also changes
 datastructure for the dashboard.tbl_dashboard_benuter_override

---
 .../61730_Dashboard_Anpassungen.php           | 25 ++++++++++++++++++-
 1 file changed, 24 insertions(+), 1 deletion(-)

diff --git a/system/dbupdate_3.4/61730_Dashboard_Anpassungen.php b/system/dbupdate_3.4/61730_Dashboard_Anpassungen.php
index a35c6188f..e59df948a 100644
--- a/system/dbupdate_3.4/61730_Dashboard_Anpassungen.php
+++ b/system/dbupdate_3.4/61730_Dashboard_Anpassungen.php
@@ -24,8 +24,31 @@ for($i = 0; $i < $result_num_rows; $i++)
     
 }
 
+$result = @$db->db_query("SELECT override_id FROM dashboard.tbl_dashboard_benutzer_override WHERE override ? 'widgets'");
+$result_num_rows = $db->db_num_rows($result);
+for($i = 0; $i < $result_num_rows; $i++)
+{
+	$row = $db->db_fetch_object($result, $i);
+
+	$qry = "
+	UPDATE dashboard.tbl_dashboard_benutzer_override
+	SET override = 
+	COALESCE(
+	(SELECT jsonb_object_agg(keys,values) FROM (
+		SELECT key AS keys,jsonb_build_object('widgets',to_jsonb(value)) AS values
+		FROM jsonb_each(override->'widgets')
+	) AS subquery 
+	),override)
+	WHERE override_id = ".$row->override_id;
+
+	$db->db_query($qry);
+	if (!$db->db_query($qry))
+        array_push($errorList,'<br><strong>dashboard.tbl_dashboard_benutzer_override: ' . $db->db_last_error() . '</strong><br>') ;
+    
+}
+
 if(empty($errorList)){
-	echo '<br>successfully updated dashboard.tbl_dashboard_preset';
+	echo '<br>successfully updated dashboard.tbl_dashboard_preset and dashboard.tbl_dashboard_benutzer_override';
 }
 else{
 	foreach($errorList as $error){

From 875a7884760ae8a69cbde9f8bc83fcc8da2d2ce0 Mon Sep 17 00:00:00 2001
From: SimonGschnell <simongschnell@gmail.com>
Date: Fri, 16 May 2025 09:54:05 +0200
Subject: [PATCH 7/9] update(Dashboard rows and columns): additional row is not
 removed when going out with the mouse

---
 public/js/components/Drop/Grid.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/public/js/components/Drop/Grid.js b/public/js/components/Drop/Grid.js
index 9be07ca15..fe39a07d2 100644
--- a/public/js/components/Drop/Grid.js
+++ b/public/js/components/Drop/Grid.js
@@ -363,12 +363,12 @@ export default {
 			});
 		},
 		mouseLeave() {
-			if (this.mode == MODE_IDLE) {
+			/* if (this.mode == MODE_IDLE) {
 				this.x = -1;
 				this.y = -1;
 				this.additionalRowComputed = false;
 				
-			}
+			} */
 		},
 		updateCursor(evt) {
 			if (!this.active) {

From df108482eb89652e09a65894d4ad164dbf462634 Mon Sep 17 00:00:00 2001
From: SimonGschnell <simongschnell@gmail.com>
Date: Mon, 19 May 2025 09:09:48 +0200
Subject: [PATCH 8/9] update(Dashboard additionalRow): opens tooltip when
 hovering over the button to add a now line to the dashboard grid

---
 public/js/components/Dashboard/Section.js |  4 ++--
 system/phrasesupdate.php                  | 20 ++++++++++++++++++++
 2 files changed, 22 insertions(+), 2 deletions(-)

diff --git a/public/js/components/Dashboard/Section.js b/public/js/components/Dashboard/Section.js
index 05c3f940f..43031b8c1 100644
--- a/public/js/components/Dashboard/Section.js
+++ b/public/js/components/Dashboard/Section.js
@@ -210,11 +210,11 @@ export default {
 	},
 	template: `
 	<h4 v-if="editModeIsActive" class=" mb-2">
-		<i v-tooltip="{ value: showSectionInformation(name), hideDelay: 300 }" class="fa-solid fa-circle-info section-info" ></i>
+		<i v-tooltip="showSectionInformation(name)" class="fa-solid fa-circle-info section-info" ></i>
 		{{sectionNameTranslation()}}:
 	</h4>
 	<div class="dashboard-section position-relative pb-3 border-bottom" ref="container" :style="getSectionStyle">
-		<button v-if="!additionalRow && editModeIsActive" @click="additionalRow=true" class="btn btn-outline-secondary rounded-circle newGridRow d-flex justify-content-center align-items-center">+</button>
+		<button v-tooltip="$p.t('dashboard','addLine')" v-if="!additionalRow && editModeIsActive" @click="additionalRow=true" class="btn btn-outline-secondary rounded-circle newGridRow d-flex justify-content-center align-items-center">+</button>
 		<drop-grid v-model:cols="gridWidth" v-model:additionalRow="additionalRow" :items="items" :itemsSetup="computedWidgetsSetup" :active="editModeIsActive" :resize-limit="checkResizeLimit" :margin-for-extra-row=".01" @draggedItem="draggedItem=$event" @rearrange-items="updatePositions" @gridHeight="gridHeight=$event" >
 			<template #default="item">
 				<div v-if="item.placeholder" class="empty-tile-hover" @pointerdown="$emit('widgetAdd', name, { widget: 1, config: {}, place: {[gridWidth]: {x:item.x,y:item.y,w:1,h:1}}, custom: 1 })"></div>
diff --git a/system/phrasesupdate.php b/system/phrasesupdate.php
index f51e8a200..32bbb4364 100644
--- a/system/phrasesupdate.php
+++ b/system/phrasesupdate.php
@@ -40581,6 +40581,26 @@ array(
 			)
 		)
 	),
+	array(
+		'app' => 'core',
+		'category' => 'dashboard',
+		'phrase' => 'addLine',
+		'insertvon' => 'system',
+		'phrases' => array(
+			array(
+				'sprache' => 'German',
+				'text' => 'Weitere Zeile hinzufügen',
+				'description' => '',
+				'insertvon' => 'system'
+			),
+			array(
+				'sprache' => 'English',
+				'text' => 'Add another line',
+				'description' => '',
+				'insertvon' => 'system'
+			)
+		)
+	),
 	array(
 		'app' => 'core',
 		'category' => 'dashboard',

From 4a10faeb252abf7e013119891ceb479e2b121552 Mon Sep 17 00:00:00 2001
From: SimonGschnell <simongschnell@gmail.com>
Date: Mon, 19 May 2025 10:28:15 +0200
Subject: [PATCH 9/9] update(Dashboard custom Section & additionalRow): the
 additional row is not removed when moving widgets and the custom section gets
 also created when created user_overrides

---
 application/libraries/dashboard/DashboardLib.php | 2 +-
 public/js/components/Drop/Grid.js                | 8 ++++++--
 2 files changed, 7 insertions(+), 3 deletions(-)

diff --git a/application/libraries/dashboard/DashboardLib.php b/application/libraries/dashboard/DashboardLib.php
index 7aab6b949..f6d7d6599 100644
--- a/application/libraries/dashboard/DashboardLib.php
+++ b/application/libraries/dashboard/DashboardLib.php
@@ -107,7 +107,7 @@ class DashboardLib
 		$emptyoverride = new stdClass();
 		$emptyoverride->dashboard_id = $dashboard->dashboard_id;
 		$emptyoverride->uid = $uid;
-		$emptyoverride->override = '{"' . self::USEROVERRIDE_SECTION . '": {"widgets":{}}}}';
+		$emptyoverride->override = '{"' . self::USEROVERRIDE_SECTION . '": {"widgets":{}}, "custom": { "widgets" : {}}}';
 		
 		return $emptyoverride;
 	}
diff --git a/public/js/components/Drop/Grid.js b/public/js/components/Drop/Grid.js
index fe39a07d2..55b9b1bbd 100644
--- a/public/js/components/Drop/Grid.js
+++ b/public/js/components/Drop/Grid.js
@@ -128,7 +128,11 @@ export default {
 			return [...this.placedItems, ...this.items_placeholders];
 		},
 		rows() {
-			if ((this.mode == MODE_MOVE || this.mode == MODE_RESIZE) && this.dragGrid){
+			if (this.additionalRowComputed) {
+					return this.grid ? (this.grid.h+1) : 1;
+			}
+			return this.grid ? this.grid.h : 1;
+			/* if ((this.mode == MODE_MOVE || this.mode == MODE_RESIZE) && this.dragGrid){
 				return this.dragGrid.h;
 			}
 			if (this.mode == MODE_IDLE) {
@@ -136,7 +140,7 @@ export default {
 					return this.grid ? (this.grid.h+1) : 1;
 				}
 			}
-			return this.grid ? this.grid.h : 1;
+			return this.grid ? this.grid.h : 1; */
 		},
 		gridStyle() {
 			const addH = this.active ? this.marginForExtraRow : 0;