Forwardport release 1.1 into 1.2

CHANGELOG.md

@@ -26,6 +26,8 @@ and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.
 - Avoid querying Astarte for trigger delivery policies when Astarte does not support them ([#459](https://github.com/astarte-platform/astarte-dashboard/issues/459)).
 - Simplified floating point values for specifying `known_value` in "incoming data" triggers.
 ([#465](https://github.com/astarte-platform/astarte-dashboard/issues/465))
+- Show falsey values in the DeviceLiveEventCard by `JSON.stringify` all values and not only objects.
+- Resolved an issue where the search filter term was appended to the device ID and alias fields in the device list.
 
 ## [1.1.1] - 2023-11-15
 ### Added

src/DeviceStatusPage/DeviceLiveEventsCard.tsx

@@ -18,7 +18,7 @@
 
 import React, { useCallback, useEffect, useState } from 'react';
 import { Badge, Card } from 'react-bootstrap';
 import _ from 'lodash';
 
 import AstarteClient, {
   AstarteDeviceEvent,
@@ -70,8 +70,8 @@
 
       const connectionTriggerPayload = {
         name: `connectiontrigger-${deviceId}`,
         device_id: deviceId,
         simple_trigger: {
           type: 'device_trigger',
           on: 'device_connected',
           device_id: deviceId,
@@ -242,9 +242,7 @@
         </Badge>
         <span className="me-2">{event.interfaceName}</span>
         <span className="me-2">{event.path}</span>
-        <span className="me-2 font-monospace">
-          {_.isObject(event.value) ? JSON.stringify(event.value) : event.value}
-        </span>
+        <span className="mr-2 font-monospace">{JSON.stringify(event.value)}</span>
       </>
     );
   }

src/ui/CheckableDeviceTable.tsx

@@ -1,7 +1,7 @@
 /*
    This file is part of Astarte.
 
-   Copyright 2020 Ispirata Srl
+   Copyright 2024 SECO Mind Srl
 
    Licensed under the Apache License, Version 2.0 (the "License");
    you may not use this file except in compliance with the License.
@@ -32,15 +32,14 @@ const Highlight = ({ text, word }: HighlightProps): React.ReactElement => {
 
   return (
     <>
-      {text.split(word).reduce(
-        (prev: React.ReactElement[], current, index) => [
-          ...prev,
+      {text.split(new RegExp(`(${word})`, 'gi')).map((part, index) =>
+        part.toLowerCase() === word?.toLowerCase() ? (
           <span key={index} className="bg-warning text-dark">
-            {word}
-          </span>,
-          <span>{current}</span>,
-        ],
-        [],
+            {part}
+          </span>
+        ) : (
+          <span key={index}>{part}</span>
+        ),
       )}
     </>
   );