diff --git a/docs/WORKFLOWS.md b/docs/WORKFLOWS.md
index 4298294b..a21996b4 100755
--- a/docs/WORKFLOWS.md
+++ b/docs/WORKFLOWS.md
@@ -63,68 +63,8 @@ You can include multiple actions that should execute once the conditions are met
# Examples
-Below you can find a couple of configuration examples.
+You can find a couple of configuration examples in [Workflow Examples](WORKFLOW_EXAMPLES.md).
-
-
----
-
-## Example 1: Assign Device to Network Node Based on IP
-
-This workflow assigns newly added devices with IP addresses in the `192.168.1.*` range to the device with the MAC address `6c:6d:6d:6c:6c:6c`.
-
-### Trigger:
-- **Object Type**: `Devices`
-- **Event Type**: `insert`
-
-### Conditions:
-- **Logic**: `AND`
- - `Field`: `devLastIP`
- - `Operator`: `contains`
- - `Value`: `192.168.1.`
-
- This condition ensures that the workflow only applies to devices with an IP address in the `192.168.1.*` range.
-
-### Actions:
-- **Action Type**: `update_field`
- - **Field**: `devNetworkNode`
- - **Value**: `6c:6d:6d:6c:6c:6c`
-
----
-
-## Example 2: Mark Device as Not New and Delete If from Google Vendor
-
-This workflow automates the process of marking Google devices as not new and deleting them if they meet the criteria.
-
-### Trigger:
-- **Object Type**: `Devices`
-- **Event Type**: `update`
-
-### Conditions:
-- **Logic**: `AND`
- - `Field`: `devVendor`
- - `Operator`: `contains`
- - `Value`: `Google`
-
- This condition checks if the device's vendor is `Google`.
-
-- **Logic**: `AND`
- - `Field`: `devIsNew`
- - `Operator`: `equals`
- - `Value`: `1`
-
- This ensures the workflow applies only to new devices.
-
-### Actions:
-1. **Action Type**: `update_field`
- - **Field**: `devIsNew`
- - **Value**: `0`
-
- This action marks the device as no longer new.
-
-2. **Action Type**: `delete_device`
-
- This action deletes the device after it is marked as not new.
> [!TIP]
> Share your workflows in [Discord](https://discord.com/invite/NczTUTWyRr) or [GitHub Discussions](https://github.com/jokob-sk/NetAlertX/discussions).
diff --git a/docs/WORKFLOW_EXAMPLES.md b/docs/WORKFLOW_EXAMPLES.md
index ca25aeb5..a6c1b3f0 100755
--- a/docs/WORKFLOW_EXAMPLES.md
+++ b/docs/WORKFLOW_EXAMPLES.md
@@ -2,7 +2,7 @@
Workflows in NetAlertX automate actions based on real-time events and conditions. Below are practical examples that demonstrate how to build automation using triggers, conditions, and actions.
-## Un-archive devices if detected online
+## Example 1: Un-archive devices if detected online
This workflow automatically unarchives a device if it was previously archived but has now been detected as online.
@@ -57,4 +57,129 @@ Sometimes devices are manually archived (e.g., no longer expected on the network
### β
Result
-Whenever a previously archived device shows up during a network scan, it will be automatically unarchived β allowing it to reappear in your device lists and dashboards.
\ No newline at end of file
+Whenever a previously archived device shows up during a network scan, it will be automatically unarchived β allowing it to reappear in your device lists and dashboards.
+
+
+Here is your updated version of **Example 2** and **Example 3**, fully aligned with the format and structure of **Example 1** for consistency and professionalism:
+
+---
+
+## Example 2: Assign Device to Network Node Based on IP
+
+This workflow assigns newly added devices with IP addresses in the `192.168.1.*` range to a specific network node with MAC address `6c:6d:6d:6c:6c:6c`.
+
+### π Use Case
+
+When new devices join your network, assigning them to the correct network node is important for accurate topology and grouping. This workflow ensures devices in a specific subnet are automatically linked to the intended node.
+
+### βοΈ Workflow Configuration
+
+```json
+{
+ "name": "Assign Device to Network Node Based on IP",
+ "trigger": {
+ "object_type": "Devices",
+ "event_type": "insert"
+ },
+ "conditions": [
+ {
+ "logic": "AND",
+ "conditions": [
+ {
+ "field": "devLastIP",
+ "operator": "contains",
+ "value": "192.168.1."
+ }
+ ]
+ }
+ ],
+ "actions": [
+ {
+ "type": "update_field",
+ "field": "devNetworkNode",
+ "value": "6c:6d:6d:6c:6c:6c"
+ }
+ ],
+ "enabled": "Yes"
+}
+```
+
+### π Explanation
+
+* **Trigger**: Activates when a new device is added.
+* **Condition**:
+
+ * `devLastIP` contains `192.168.1.` (matches subnet).
+* **Action**:
+
+ * Sets `devNetworkNode` to the specified MAC address.
+
+### β
Result
+
+New devices with IPs in the `192.168.1.*` subnet are automatically assigned to the correct network node, streamlining device organization and reducing manual work.
+
+---
+
+## Example 3: Mark Device as Not New and Delete If from Google Vendor
+
+This workflow automatically marks newly detected Google devices as not new and deletes them immediately.
+
+### π Use Case
+
+You may want to automatically clear out newly detected Google devices (such as Chromecast or Google Home) if theyβre not needed in your device database. This workflow handles that clean-up automatically.
+
+### βοΈ Workflow Configuration
+
+```json
+{
+ "name": "Mark Device as Not New and Delete If from Google Vendor",
+ "trigger": {
+ "object_type": "Devices",
+ "event_type": "update"
+ },
+ "conditions": [
+ {
+ "logic": "AND",
+ "conditions": [
+ {
+ "field": "devVendor",
+ "operator": "contains",
+ "value": "Google"
+ },
+ {
+ "field": "devIsNew",
+ "operator": "equals",
+ "value": "1"
+ }
+ ]
+ }
+ ],
+ "actions": [
+ {
+ "type": "update_field",
+ "field": "devIsNew",
+ "value": "0"
+ },
+ {
+ "type": "delete_device"
+ }
+ ],
+ "enabled": "Yes"
+}
+```
+
+### π Explanation
+
+* **Trigger**: Runs on device updates.
+* **Conditions**:
+
+ * Vendor contains `Google`.
+ * Device is marked as new (`devIsNew` is `1`).
+* **Actions**:
+
+ 1. Set `devIsNew` to `0` (mark as not new).
+ 2. Delete the device.
+
+### β
Result
+
+Any newly detected Google devices are cleaned up instantly β first marked as not new, then deleted β helping you avoid clutter in your device records.
\ No newline at end of file
diff --git a/front/css/app.css b/front/css/app.css
index 8314789c..1289248d 100755
--- a/front/css/app.css
+++ b/front/css/app.css
@@ -1739,9 +1739,19 @@ input[readonly] {
float: left;
}
+#hover-box .line
+{
+ float: left;
+ width: 100%;
+}
+
#hover-box span
{
float: right;
+ text-overflow: ellipsis;
+ overflow: hidden;
+ display: block;
+ max-width: 200px;
}
#networkTree .netCollapse
diff --git a/front/js/ui_components.js b/front/js/ui_components.js
index ed754e66..1c324dd3 100755
--- a/front/js/ui_components.js
+++ b/front/js/ui_components.js
@@ -810,7 +810,7 @@ function initSelect2() {
{
setTimeout(() => {
initSelect2()
- }, 700);
+ }, 1000);
}
}
@@ -861,14 +861,28 @@ function initHoverNodeInfo() {
const status =`${badge.iconHtml} ${badge.status}`
const html = `
- ${atob(icon)}
${name}
+
+
${atob(icon)}
${name}
+
- Status: ${status}
- IP: ${ip}
- MAC: ${mac}
- Vendor: ${vendor}
- Last seen: ${lastseen}
- Relationship: ${relationship}
+
+ Status: ${status}
+
+
+ IP: ${ip}
+
+
+ MAC: ${mac}
+
+
+ Vendor: ${vendor}
+
+
+ Last seen: ${lastseen}
+
+
+ Relationship: ${relationship}
+
`;
$('#hover-box').html(html).fadeIn(150);