Added setting to toggle compact mode

api/config/default.php

@@ -704,4 +704,5 @@ return [
 	'homepageUptimeKumaRefresh' => '60000',
 	'homepageUptimeKumaHeader' => 'Uptime Kuma',
 	'homepageUptimeKumaHeaderToggle' => true,
+	'homepageUptimeKumaCompact' => true,
 ];

api/homepage/uptime_kuma.php

@@ -34,6 +34,7 @@ trait UptimeKumaHomepageItem
 					$this->settingsOption('refresh', 'homepageUptimeKumaRefresh'),
 					$this->settingsOption('title', 'homepageUptimeKumaHeader'),
 					$this->settingsOption('toggle-title', 'homepageUptimeKumaHeaderToggle'),
+					$this->settingsOption('switch', 'homepageUptimeKumaCompact', ['label' => 'Compact view', 'help' => 'Toggles the compact view of this homepage module']),
 				],
 			]
 		];
@@ -98,7 +99,14 @@ trait UptimeKumaHomepageItem
 					// do nothing when monitor is disabled
 				}
 			}, $body);
-			$api = array_values(array_filter($body));
+			$api = [
+				'data' => array_values(array_filter($body)),
+				'options' => [
+					'title' => $this->config['homepageUptimeKumaHeader'],
+					'titleToggle' => $this->config['homepageUptimeKumaHeaderToggle'],
+					'compact' => $this->config['homepageUptimeKumaCompact'],
+				]
+			];
 		} catch (GuzzleException $e) {
 			$this->setLoggerChannel('UptimeKuma')->error($e);
 			$this->setAPIResponse('error', $e->getMessage(), 401);

js/functions.js

@@ -9111,7 +9111,7 @@ function buildUptimeKumaItem(array){
                             <div class="ml-1 w-100">
                                 <i class="`+imageText+` font-20 pull-right mt-3 mb-2"></i>
                                 `; if (typeof data.url !== 'undefined') { card += kumaLink; }
-                                card += `<h3 class="d-flex no-block align-items-center mt-2 mb-2"><img class="lazyload loginTitle">&nbsp;`+name+`</h3>
+                                card += `<h3 class="d-flex no-block align-items-center mt-2 mb-2"><img class="lazyload loginTitle">&nbsp;`+data.name+`</h3>
                                 `; if (typeof data.url !== 'undefined') { card +=`</a>`; }
                                 card += `<div class="clearfix"></div>
                             </div>