@almadar/std 6.5.2 → 7.2.0

package/dist/behaviors/registry/organisms/std-helpdesk.orb

@@ -1,7 +1,7 @@
 {
   "name": "std-helpdesk",
   "version": "1.0.0",
-  "description": "Helpdesk organism. Composes molecules via compose: - stdList(Ticket): CRUD list of support tickets - stdMessaging(Response): messaging thread for ticket responses - stdDisplay(SupportMetrics): read-only metrics dashboard",
+  "description": "std-helpdesk as a Function",
   "orbitals": [
     {
       "name": "TicketOrbital",
@@ -61,23 +61,91 @@
       "traits": [
         {
           "name": "TicketBrowse",
-          "linkedEntity": "Ticket",
           "category": "interaction",
+          "linkedEntity": "Ticket",
+          "emits": [
+            {
+              "event": "ASSIGN",
+              "scope": "external",
+              "payload": [
+                {
+                  "name": "id",
+                  "type": "string"
+                }
+              ]
+            },
+            {
+              "event": "TicketLoaded",
+              "description": "Fired when Ticket finishes loading",
+              "scope": "internal",
+              "payload": [
+                {
+                  "name": "id",
+                  "type": "string",
+                  "required": true
+                },
+                {
+                  "name": "subject",
+                  "type": "string"
+                },
+                {
+                  "name": "description",
+                  "type": "string"
+                },
+                {
+                  "name": "priority",
+                  "type": "string"
+                },
+                {
+                  "name": "status",
+                  "type": "string"
+                },
+                {
+                  "name": "assignee",
+                  "type": "string"
+                },
+                {
+                  "name": "pendingId",
+                  "type": "string"
+                }
+              ]
+            },
+            {
+              "event": "TicketLoadFailed",
+              "description": "Fired when Ticket fails to load",
+              "scope": "internal",
+              "payload": [
+                {
+                  "name": "message",
+                  "type": "string"
+                }
+              ]
+            }
+          ],
           "listens": [
             {
               "event": "TICKET_CREATED",
               "triggers": "INIT",
-              "scope": "external"
+              "source": {
+                "kind": "trait",
+                "trait": "TicketCreate"
+              }
             },
             {
               "event": "TICKET_UPDATED",
               "triggers": "INIT",
-              "scope": "external"
+              "source": {
+                "kind": "trait",
+                "trait": "TicketEdit"
+              }
             },
             {
               "event": "TICKET_DELETED",
               "triggers": "INIT",
-              "scope": "external"
+              "source": {
+                "kind": "trait",
+                "trait": "TicketDelete"
+              }
             }
           ],
           "stateMachine": {
@@ -93,12 +161,26 @@
                 "name": "Initialize"
               },
               {
-                "key": "CREATE",
-                "name": "CREATE"
+                "key": "ASSIGN",
+                "name": "Assign"
+              },
+              {
+                "key": "TicketLoaded",
+                "name": "Ticket loaded"
+              },
+              {
+                "key": "TicketLoadFailed",
+                "name": "Ticket load failed",
+                "payload": [
+                  {
+                    "name": "message",
+                    "type": "string"
+                  }
+                ]
               },
               {
                 "key": "VIEW",
-                "name": "VIEW",
+                "name": "View",
                 "payload": [
                   {
                     "name": "id",
@@ -113,7 +195,7 @@
               },
               {
                 "key": "EDIT",
-                "name": "EDIT",
+                "name": "Edit",
                 "payload": [
                   {
                     "name": "id",
@@ -128,7 +210,7 @@
               },
               {
                 "key": "DELETE",
-                "name": "DELETE",
+                "name": "Delete",
                 "payload": [
                   {
                     "name": "id",
@@ -161,8 +243,8 @@
                       "navItems": [
                         {
                           "label": "Tickets",
-                          "href": "/tickets",
-                          "icon": "inbox"
+                          "icon": "inbox",
+                          "href": "/tickets"
                         },
                         {
                           "label": "Responses",
@@ -170,110 +252,85 @@
                           "icon": "message-circle"
                         },
                         {
-                          "label": "Metrics",
                           "href": "/metrics",
-                          "icon": "layout-list"
+                          "icon": "layout-list",
+                          "label": "Metrics"
                         }
                       ],
                       "children": [
                         {
-                          "type": "stack",
-                          "direction": "vertical",
-                          "gap": "lg",
                           "className": "max-w-5xl mx-auto w-full",
+                          "direction": "vertical",
                           "children": [
                             {
-                              "type": "stack",
-                              "direction": "horizontal",
-                              "gap": "md",
-                              "justify": "space-between",
-                              "align": "center",
                               "children": [
                                 {
-                                  "type": "stack",
                                   "direction": "horizontal",
-                                  "gap": "sm",
                                   "align": "center",
                                   "children": [
                                     {
+                                      "size": "lg",
                                       "type": "icon",
-                                      "name": "inbox",
-                                      "size": "lg"
+                                      "name": "inbox"
                                     },
                                     {
-                                      "type": "typography",
                                       "content": "Tickets",
-                                      "variant": "h2"
+                                      "variant": "h2",
+                                      "type": "typography"
                                     }
-                                  ]
+                                  ],
+                                  "gap": "sm",
+                                  "type": "stack"
                                 },
                                 {
                                   "type": "stack",
                                   "direction": "horizontal",
-                                  "gap": "sm",
                                   "children": [
                                     {
-                                      "type": "button",
                                       "label": "New Ticket",
-                                      "event": "CREATE",
                                       "variant": "primary",
-                                      "icon": "plus"
+                                      "event": "CREATE",
+                                      "icon": "plus",
+                                      "type": "button"
                                     }
-                                  ]
+                                  ],
+                                  "gap": "sm"
                                 }
-                              ]
+                              ],
+                              "gap": "md",
+                              "align": "center",
+                              "justify": "space-between",
+                              "type": "stack",
+                              "direction": "horizontal"
                             },
                             {
                               "type": "divider"
                             },
                             {
-                              "type": "simple-grid",
-                              "columns": 1,
                               "children": [
                                 {
-                                  "type": "stat-display",
+                                  "icon": "inbox",
                                   "label": "Open Tickets",
+                                  "type": "stat-display",
                                   "value": [
                                     "array/len",
                                     "@entity"
-                                  ],
-                                  "icon": "inbox"
+                                  ]
                                 }
-                              ]
+                              ],
+                              "columns": 1.0,
+                              "type": "simple-grid"
                             },
                             {
                               "type": "divider"
                             },
                             {
-                              "type": "data-list",
-                              "entity": "Ticket",
-                              "emptyIcon": "inbox",
                               "emptyTitle": "No tickets filed",
-                              "emptyDescription": "Your support queue is clear.",
-                              "itemActions": [
-                                {
-                                  "label": "View",
-                                  "event": "VIEW",
-                                  "variant": "ghost",
-                                  "size": "sm"
-                                },
-                                {
-                                  "label": "Edit",
-                                  "event": "EDIT",
-                                  "variant": "ghost",
-                                  "size": "sm"
-                                },
-                                {
-                                  "label": "Delete",
-                                  "event": "DELETE",
-                                  "variant": "danger",
-                                  "size": "sm"
-                                }
-                              ],
+                              "entity": "Ticket",
                               "columns": [
                                 {
-                                  "name": "subject",
                                   "variant": "h3",
+                                  "name": "subject",
                                   "icon": "inbox"
                                 },
                                 {
@@ -281,22 +338,47 @@
                                   "variant": "badge"
                                 },
                                 {
-                                  "name": "status",
-                                  "variant": "badge"
+                                  "variant": "badge",
+                                  "name": "status"
                                 },
                                 {
                                   "name": "assignee",
                                   "variant": "body"
                                 },
                                 {
-                                  "name": "description",
-                                  "variant": "caption"
+                                  "variant": "caption",
+                                  "name": "description"
                                 }
                               ],
+                              "gap": "sm",
+                              "emptyIcon": "inbox",
+                              "type": "data-list",
                               "variant": "card",
-                              "gap": "sm"
+                              "emptyDescription": "Your support queue is clear.",
+                              "itemActions": [
+                                {
+                                  "size": "sm",
+                                  "label": "View",
+                                  "variant": "ghost",
+                                  "event": "VIEW"
+                                },
+                                {
+                                  "size": "sm",
+                                  "label": "Edit",
+                                  "event": "EDIT",
+                                  "variant": "ghost"
+                                },
+                                {
+                                  "label": "Delete",
+                                  "event": "DELETE",
+                                  "size": "sm",
+                                  "variant": "danger"
+                                }
+                              ]
                             }
-                          ]
+                          ],
+                          "gap": "lg",
+                          "type": "stack"
                         }
                       ]
                     }
@@ -305,33 +387,69 @@
               }
             ]
           },
+          "scope": "collection"
+        },
+        {
+          "name": "TicketCreate",
+          "category": "interaction",
+          "linkedEntity": "Ticket",
           "emits": [
             {
-              "event": "ASSIGN",
-              "description": "Assign ticket and open response thread",
+              "event": "TICKET_CREATED",
+              "scope": "external",
+              "payload": [
+                {
+                  "name": "id",
+                  "type": "string"
+                }
+              ]
+            },
+            {
+              "event": "TicketLoaded",
+              "description": "Fired when Ticket finishes loading",
+              "scope": "internal",
               "payload": [
                 {
                   "name": "id",
                   "type": "string",
                   "required": true
+                },
+                {
+                  "name": "subject",
+                  "type": "string"
+                },
+                {
+                  "name": "description",
+                  "type": "string"
+                },
+                {
+                  "name": "priority",
+                  "type": "string"
+                },
+                {
+                  "name": "status",
+                  "type": "string"
+                },
+                {
+                  "name": "assignee",
+                  "type": "string"
+                },
+                {
+                  "name": "pendingId",
+                  "type": "string"
                 }
-              ],
-              "scope": "external"
-            }
-          ]
-        },
-        {
-          "name": "TicketCreate",
-          "linkedEntity": "Ticket",
-          "category": "interaction",
-          "emits": [
-            {
-              "event": "SAVE",
-              "scope": "internal"
+              ]
             },
             {
-              "event": "TICKET_CREATED",
-              "scope": "external"
+              "event": "TicketLoadFailed",
+              "description": "Fired when Ticket fails to load",
+              "scope": "internal",
+              "payload": [
+                {
+                  "name": "message",
+                  "type": "string"
+                }
+              ]
             }
           ],
           "stateMachine": {
@@ -351,7 +469,7 @@
               },
               {
                 "key": "CREATE",
-                "name": "Open"
+                "name": "Create"
               },
               {
                 "key": "CLOSE",
@@ -367,6 +485,24 @@
                     "required": true
                   }
                 ]
+              },
+              {
+                "key": "TICKET_CREATED",
+                "name": "Ticket Created"
+              },
+              {
+                "key": "TicketLoaded",
+                "name": "Ticket loaded"
+              },
+              {
+                "key": "TicketLoadFailed",
+                "name": "Ticket load failed",
+                "payload": [
+                  {
+                    "name": "message",
+                    "type": "string"
+                  }
+                ]
               }
             ],
             "transitions": [
@@ -388,40 +524,41 @@
                 "effects": [
                   [
                     "fetch",
-                    "Ticket"
+                    "Ticket",
+                    {
+                      "emit": {
+                        "failure": "TicketLoadFailed",
+                        "success": "TicketLoaded"
+                      }
+                    }
                   ],
                   [
                     "render-ui",
                     "modal",
                     {
-                      "type": "stack",
-                      "direction": "vertical",
-                      "gap": "md",
                       "children": [
                         {
-                          "type": "stack",
                           "direction": "horizontal",
                           "gap": "sm",
                           "children": [
                             {
+                              "size": "md",
                               "type": "icon",
-                              "name": "plus-circle",
-                              "size": "md"
+                              "name": "plus-circle"
                             },
                             {
-                              "type": "typography",
                               "content": "Create Ticket",
+                              "type": "typography",
                               "variant": "h3"
                             }
-                          ]
+                          ],
+                          "type": "stack"
                         },
                         {
                           "type": "divider"
                         },
                         {
-                          "type": "form-section",
                           "entity": "Ticket",
-                          "mode": "create",
                           "submitEvent": "SAVE",
                           "cancelEvent": "CLOSE",
                           "fields": [
@@ -430,9 +567,14 @@
                             "priority",
                             "status",
                             "assignee"
-                          ]
+                          ],
+                          "type": "form-section",
+                          "mode": "create"
                         }
-                      ]
+                      ],
+                      "gap": "md",
+                      "type": "stack",
+                      "direction": "vertical"
                     }
                   ]
                 ]
@@ -447,6 +589,13 @@
                     "modal",
                     null
                   ],
+                  [
+                    "render-ui",
+                    "main",
+                    {
+                      "type": "box"
+                    }
+                  ],
                   [
                     "notify",
                     "Cancelled",
@@ -470,6 +619,13 @@
                     "modal",
                     null
                   ],
+                  [
+                    "render-ui",
+                    "main",
+                    {
+                      "type": "box"
+                    }
+                  ],
                   [
                     "emit",
                     "TICKET_CREATED"
@@ -477,20 +633,70 @@
                 ]
               }
             ]
-          }
+          },
+          "scope": "collection"
         },
         {
           "name": "TicketEdit",
-          "linkedEntity": "Ticket",
           "category": "interaction",
+          "linkedEntity": "Ticket",
           "emits": [
             {
-              "event": "SAVE",
-              "scope": "internal"
+              "event": "TICKET_UPDATED",
+              "scope": "external",
+              "payload": [
+                {
+                  "name": "id",
+                  "type": "string"
+                }
+              ]
             },
             {
-              "event": "TICKET_UPDATED",
-              "scope": "external"
+              "event": "TicketLoaded",
+              "description": "Fired when Ticket finishes loading",
+              "scope": "internal",
+              "payload": [
+                {
+                  "name": "id",
+                  "type": "string",
+                  "required": true
+                },
+                {
+                  "name": "subject",
+                  "type": "string"
+                },
+                {
+                  "name": "description",
+                  "type": "string"
+                },
+                {
+                  "name": "priority",
+                  "type": "string"
+                },
+                {
+                  "name": "status",
+                  "type": "string"
+                },
+                {
+                  "name": "assignee",
+                  "type": "string"
+                },
+                {
+                  "name": "pendingId",
+                  "type": "string"
+                }
+              ]
+            },
+            {
+              "event": "TicketLoadFailed",
+              "description": "Fired when Ticket fails to load",
+              "scope": "internal",
+              "payload": [
+                {
+                  "name": "message",
+                  "type": "string"
+                }
+              ]
             }
           ],
           "stateMachine": {
@@ -510,7 +716,7 @@
               },
               {
                 "key": "EDIT",
-                "name": "Open",
+                "name": "Edit",
                 "payload": [
                   {
                     "name": "id",
@@ -533,6 +739,24 @@
                     "required": true
                   }
                 ]
+              },
+              {
+                "key": "TICKET_UPDATED",
+                "name": "Ticket Updated"
+              },
+              {
+                "key": "TicketLoaded",
+                "name": "Ticket loaded"
+              },
+              {
+                "key": "TicketLoadFailed",
+                "name": "Ticket load failed",
+                "payload": [
+                  {
+                    "name": "message",
+                    "type": "string"
+                  }
+                ]
               }
             ],
             "transitions": [
@@ -556,7 +780,11 @@
                     "fetch",
                     "Ticket",
                     {
-                      "id": "@payload.id"
+                      "id": "@payload.id",
+                      "emit": {
+                        "success": "TicketLoaded",
+                        "failure": "TicketLoadFailed"
+                      }
                     }
                   ],
                   [
@@ -565,11 +793,10 @@
                     {
                       "type": "stack",
                       "direction": "vertical",
-                      "gap": "md",
                       "children": [
                         {
-                          "type": "stack",
                           "direction": "horizontal",
+                          "type": "stack",
                           "gap": "sm",
                           "children": [
                             {
@@ -578,9 +805,9 @@
                               "size": "md"
                             },
                             {
-                              "type": "typography",
+                              "variant": "h3",
                               "content": "Edit Ticket",
-                              "variant": "h3"
+                              "type": "typography"
                             }
                           ]
                         },
@@ -588,11 +815,7 @@
                           "type": "divider"
                         },
                         {
-                          "type": "form-section",
-                          "entity": "Ticket",
-                          "mode": "edit",
-                          "submitEvent": "SAVE",
-                          "cancelEvent": "CLOSE",
+                          "entityId": "@entity.id",
                           "fields": [
                             "subject",
                             "description",
@@ -600,9 +823,14 @@
                             "status",
                             "assignee"
                           ],
-                          "entityId": "@entity.id"
+                          "type": "form-section",
+                          "mode": "edit",
+                          "submitEvent": "SAVE",
+                          "cancelEvent": "CLOSE",
+                          "entity": "Ticket"
                         }
-                      ]
+                      ],
+                      "gap": "md"
                     }
                   ]
                 ]
@@ -617,6 +845,13 @@
                     "modal",
                     null
                   ],
+                  [
+                    "render-ui",
+                    "main",
+                    {
+                      "type": "box"
+                    }
+                  ],
                   [
                     "notify",
                     "Cancelled",
@@ -640,6 +875,13 @@
                     "modal",
                     null
                   ],
+                  [
+                    "render-ui",
+                    "main",
+                    {
+                      "type": "box"
+                    }
+                  ],
                   [
                     "emit",
                     "TICKET_UPDATED"
@@ -647,16 +889,60 @@
                 ]
               }
             ]
-          }
+          },
+          "scope": "collection"
         },
         {
           "name": "TicketView",
-          "linkedEntity": "Ticket",
           "category": "interaction",
+          "linkedEntity": "Ticket",
           "emits": [
             {
-              "event": "SAVE",
-              "scope": "internal"
+              "event": "TicketLoaded",
+              "description": "Fired when Ticket finishes loading",
+              "scope": "internal",
+              "payload": [
+                {
+                  "name": "id",
+                  "type": "string",
+                  "required": true
+                },
+                {
+                  "name": "subject",
+                  "type": "string"
+                },
+                {
+                  "name": "description",
+                  "type": "string"
+                },
+                {
+                  "name": "priority",
+                  "type": "string"
+                },
+                {
+                  "name": "status",
+                  "type": "string"
+                },
+                {
+                  "name": "assignee",
+                  "type": "string"
+                },
+                {
+                  "name": "pendingId",
+                  "type": "string"
+                }
+              ]
+            },
+            {
+              "event": "TicketLoadFailed",
+              "description": "Fired when Ticket fails to load",
+              "scope": "internal",
+              "payload": [
+                {
+                  "name": "message",
+                  "type": "string"
+                }
+              ]
             }
           ],
           "stateMachine": {
@@ -676,7 +962,7 @@
               },
               {
                 "key": "VIEW",
-                "name": "Open",
+                "name": "View",
                 "payload": [
                   {
                     "name": "id",
@@ -699,6 +985,20 @@
                     "required": true
                   }
                 ]
+              },
+              {
+                "key": "TicketLoaded",
+                "name": "Ticket loaded"
+              },
+              {
+                "key": "TicketLoadFailed",
+                "name": "Ticket load failed",
+                "payload": [
+                  {
+                    "name": "message",
+                    "type": "string"
+                  }
+                ]
               }
             ],
             "transitions": [
@@ -722,6 +1022,10 @@
                     "fetch",
                     "Ticket",
                     {
+                      "emit": {
+                        "success": "TicketLoaded",
+                        "failure": "TicketLoadFailed"
+                      },
                       "id": "@payload.id"
                     }
                   ],
@@ -729,15 +1033,12 @@
                     "render-ui",
                     "modal",
                     {
-                      "type": "stack",
-                      "direction": "vertical",
                       "gap": "md",
                       "children": [
                         {
-                          "type": "stack",
-                          "direction": "horizontal",
-                          "gap": "sm",
                           "align": "center",
+                          "gap": "sm",
+                          "type": "stack",
                           "children": [
                             {
                               "type": "icon",
@@ -749,20 +1050,21 @@
                               "variant": "h3",
                               "content": "@entity.subject"
                             }
-                          ]
+                          ],
+                          "direction": "horizontal"
                         },
                         {
                           "type": "divider"
                         },
                         {
+                          "gap": "md",
                           "type": "stack",
                           "direction": "horizontal",
-                          "gap": "md",
                           "children": [
                             {
-                              "type": "typography",
                               "variant": "caption",
-                              "content": "Subject"
+                              "content": "Subject",
+                              "type": "typography"
                             },
                             {
                               "type": "typography",
@@ -772,9 +1074,6 @@
                           ]
                         },
                         {
-                          "type": "stack",
-                          "direction": "horizontal",
-                          "gap": "md",
                           "children": [
                             {
                               "type": "typography",
@@ -782,16 +1081,16 @@
                               "content": "Description"
                             },
                             {
-                              "type": "typography",
                               "variant": "body",
+                              "type": "typography",
                               "content": "@entity.description"
                             }
-                          ]
-                        },
-                        {
+                          ],
                           "type": "stack",
                           "direction": "horizontal",
-                          "gap": "md",
+                          "gap": "md"
+                        },
+                        {
                           "children": [
                             {
                               "type": "typography",
@@ -799,21 +1098,24 @@
                               "content": "Priority"
                             },
                             {
+                              "content": "@entity.priority",
                               "type": "typography",
-                              "variant": "body",
-                              "content": "@entity.priority"
+                              "variant": "body"
                             }
-                          ]
+                          ],
+                          "gap": "md",
+                          "type": "stack",
+                          "direction": "horizontal"
                         },
                         {
-                          "type": "stack",
                           "direction": "horizontal",
                           "gap": "md",
+                          "type": "stack",
                           "children": [
                             {
-                              "type": "typography",
                               "variant": "caption",
-                              "content": "Status"
+                              "content": "Status",
+                              "type": "typography"
                             },
                             {
                               "type": "typography",
@@ -823,19 +1125,19 @@
                           ]
                         },
                         {
+                          "gap": "md",
                           "type": "stack",
                           "direction": "horizontal",
-                          "gap": "md",
                           "children": [
                             {
-                              "type": "typography",
                               "variant": "caption",
+                              "type": "typography",
                               "content": "Assignee"
                             },
                             {
-                              "type": "typography",
                               "variant": "body",
-                              "content": "@entity.assignee"
+                              "content": "@entity.assignee",
+                              "type": "typography"
                             }
                           ]
                         },
@@ -844,26 +1146,28 @@
                         },
                         {
                           "type": "stack",
-                          "direction": "horizontal",
-                          "gap": "sm",
-                          "justify": "end",
                           "children": [
                             {
+                              "icon": "edit",
+                              "variant": "primary",
                               "type": "button",
                               "label": "Edit",
-                              "event": "EDIT",
-                              "variant": "primary",
-                              "icon": "edit"
+                              "event": "EDIT"
                             },
                             {
+                              "variant": "ghost",
                               "type": "button",
                               "label": "Close",
-                              "event": "CLOSE",
-                              "variant": "ghost"
+                              "event": "CLOSE"
                             }
-                          ]
+                          ],
+                          "justify": "end",
+                          "gap": "sm",
+                          "direction": "horizontal"
                         }
-                      ]
+                      ],
+                      "direction": "vertical",
+                      "type": "stack"
                     }
                   ]
                 ]
@@ -878,6 +1182,13 @@
                     "modal",
                     null
                   ],
+                  [
+                    "render-ui",
+                    "main",
+                    {
+                      "type": "box"
+                    }
+                  ],
                   [
                     "notify",
                     "Cancelled",
@@ -894,24 +1205,81 @@
                     "render-ui",
                     "modal",
                     null
+                  ],
+                  [
+                    "render-ui",
+                    "main",
+                    {
+                      "type": "box"
+                    }
                   ]
                 ]
               }
             ]
-          }
+          },
+          "scope": "collection"
         },
         {
           "name": "TicketDelete",
-          "linkedEntity": "Ticket",
           "category": "interaction",
+          "linkedEntity": "Ticket",
           "emits": [
             {
-              "event": "CONFIRM_DELETE",
-              "scope": "internal"
+              "event": "TICKET_DELETED",
+              "scope": "external",
+              "payload": [
+                {
+                  "name": "id",
+                  "type": "string"
+                }
+              ]
             },
             {
-              "event": "TICKET_DELETED",
-              "scope": "external"
+              "event": "TicketLoaded",
+              "description": "Fired when Ticket finishes loading",
+              "scope": "internal",
+              "payload": [
+                {
+                  "name": "id",
+                  "type": "string",
+                  "required": true
+                },
+                {
+                  "name": "subject",
+                  "type": "string"
+                },
+                {
+                  "name": "description",
+                  "type": "string"
+                },
+                {
+                  "name": "priority",
+                  "type": "string"
+                },
+                {
+                  "name": "status",
+                  "type": "string"
+                },
+                {
+                  "name": "assignee",
+                  "type": "string"
+                },
+                {
+                  "name": "pendingId",
+                  "type": "string"
+                }
+              ]
+            },
+            {
+              "event": "TicketLoadFailed",
+              "description": "Fired when Ticket fails to load",
+              "scope": "internal",
+              "payload": [
+                {
+                  "name": "message",
+                  "type": "string"
+                }
+              ]
             }
           ],
           "stateMachine": {
@@ -931,7 +1299,7 @@
               },
               {
                 "key": "DELETE",
-                "name": "Request Confirmation",
+                "name": "Delete",
                 "payload": [
                   {
                     "name": "id",
@@ -942,7 +1310,7 @@
               },
               {
                 "key": "CONFIRM_DELETE",
-                "name": "Confirm"
+                "name": "Confirm Delete"
               },
               {
                 "key": "CANCEL",
@@ -951,6 +1319,24 @@
               {
                 "key": "CLOSE",
                 "name": "Close"
+              },
+              {
+                "key": "TICKET_DELETED",
+                "name": "Ticket Deleted"
+              },
+              {
+                "key": "TicketLoaded",
+                "name": "Ticket loaded"
+              },
+              {
+                "key": "TicketLoadFailed",
+                "name": "Ticket load failed",
+                "payload": [
+                  {
+                    "name": "message",
+                    "type": "string"
+                  }
+                ]
               }
             ],
             "transitions": [
@@ -979,6 +1365,10 @@
                     "fetch",
                     "Ticket",
                     {
+                      "emit": {
+                        "success": "TicketLoaded",
+                        "failure": "TicketLoadFailed"
+                      },
                       "id": "@payload.id"
                     }
                   ],
@@ -986,58 +1376,58 @@
                     "render-ui",
                     "modal",
                     {
-                      "type": "stack",
-                      "direction": "vertical",
-                      "gap": "md",
                       "children": [
                         {
-                          "type": "stack",
-                          "direction": "horizontal",
-                          "gap": "sm",
                           "align": "center",
+                          "gap": "sm",
+                          "direction": "horizontal",
                           "children": [
                             {
-                              "type": "icon",
                               "name": "alert-triangle",
+                              "type": "icon",
                               "size": "md"
                             },
                             {
-                              "type": "typography",
                               "content": "Delete Ticket",
-                              "variant": "h3"
+                              "variant": "h3",
+                              "type": "typography"
                             }
-                          ]
+                          ],
+                          "type": "stack"
                         },
                         {
                           "type": "divider"
                         },
                         {
-                          "type": "alert",
                           "variant": "danger",
-                          "message": "This action cannot be undone."
+                          "message": "This action cannot be undone.",
+                          "type": "alert"
                         },
                         {
-                          "type": "stack",
-                          "direction": "horizontal",
-                          "gap": "sm",
-                          "justify": "end",
                           "children": [
                             {
                               "type": "button",
-                              "label": "Cancel",
+                              "variant": "ghost",
                               "event": "CANCEL",
-                              "variant": "ghost"
+                              "label": "Cancel"
                             },
                             {
+                              "icon": "check",
                               "type": "button",
                               "label": "Delete",
                               "event": "CONFIRM_DELETE",
-                              "variant": "danger",
-                              "icon": "check"
+                              "variant": "danger"
                             }
-                          ]
+                          ],
+                          "justify": "end",
+                          "direction": "horizontal",
+                          "gap": "sm",
+                          "type": "stack"
                         }
-                      ]
+                      ],
+                      "gap": "md",
+                      "type": "stack",
+                      "direction": "vertical"
                     }
                   ]
                 ]
@@ -1058,6 +1448,13 @@
                     "modal",
                     null
                   ],
+                  [
+                    "render-ui",
+                    "main",
+                    {
+                      "type": "box"
+                    }
+                  ],
                   [
                     "ref",
                     "Ticket"
@@ -1078,6 +1475,13 @@
                     "modal",
                     null
                   ],
+                  [
+                    "render-ui",
+                    "main",
+                    {
+                      "type": "box"
+                    }
+                  ],
                   [
                     "ref",
                     "Ticket"
@@ -1094,6 +1498,13 @@
                     "modal",
                     null
                   ],
+                  [
+                    "render-ui",
+                    "main",
+                    {
+                      "type": "box"
+                    }
+                  ],
                   [
                     "ref",
                     "Ticket"
@@ -1101,14 +1512,14 @@
                 ]
               }
             ]
-          }
+          },
+          "scope": "collection"
         }
       ],
       "pages": [
         {
           "name": "TicketsPage",
           "path": "/tickets",
-          "isInitial": true,
           "traits": [
             {
               "ref": "TicketBrowse"
@@ -1142,41 +1553,93 @@
           },
           {
             "name": "ticketId",
-            "type": "string",
-            "default": ""
+            "type": "string"
           },
           {
             "name": "body",
-            "type": "string",
-            "default": ""
+            "type": "string"
           },
           {
             "name": "author",
-            "type": "string",
-            "default": ""
+            "type": "string"
           },
           {
             "name": "createdAt",
-            "type": "date",
-            "default": ""
+            "type": "datetime"
           }
         ]
       },
       "traits": [
         {
           "name": "ResponseBrowse",
-          "linkedEntity": "Response",
           "category": "interaction",
+          "linkedEntity": "Response",
+          "emits": [
+            {
+              "event": "RESOLVE",
+              "scope": "external",
+              "payload": [
+                {
+                  "name": "id",
+                  "type": "string"
+                }
+              ]
+            },
+            {
+              "event": "ResponseLoaded",
+              "description": "Fired when Response finishes loading",
+              "scope": "internal",
+              "payload": [
+                {
+                  "name": "id",
+                  "type": "string",
+                  "required": true
+                },
+                {
+                  "name": "ticketId",
+                  "type": "string"
+                },
+                {
+                  "name": "body",
+                  "type": "string"
+                },
+                {
+                  "name": "author",
+                  "type": "string"
+                },
+                {
+                  "name": "createdAt",
+                  "type": "datetime"
+                }
+              ]
+            },
+            {
+              "event": "ResponseLoadFailed",
+              "description": "Fired when Response fails to load",
+              "scope": "internal",
+              "payload": [
+                {
+                  "name": "message",
+                  "type": "string"
+                }
+              ]
+            }
+          ],
           "listens": [
             {
               "event": "SEND",
               "triggers": "INIT",
-              "scope": "internal"
+              "source": {
+                "kind": "trait",
+                "trait": "ResponseCompose"
+              }
             },
             {
               "event": "ASSIGN",
               "triggers": "INIT",
-              "scope": "external"
+              "source": {
+                "kind": "any"
+              }
             }
           ],
           "stateMachine": {
@@ -1192,21 +1655,20 @@
                 "name": "Initialize"
               },
               {
-                "key": "COMPOSE",
-                "name": "COMPOSE"
+                "key": "RESOLVE",
+                "name": "Resolve"
               },
               {
-                "key": "VIEW",
-                "name": "VIEW",
-                "payload": [
-                  {
-                    "name": "id",
-                    "type": "string",
-                    "required": true
-                  },
+                "key": "ResponseLoaded",
+                "name": "Response loaded"
+              },
+              {
+                "key": "ResponseLoadFailed",
+                "name": "Response load failed",
+                "payload": [
                   {
-                    "name": "row",
-                    "type": "object"
+                    "name": "message",
+                    "type": "string"
                   }
                 ]
               }
@@ -1225,110 +1687,110 @@
                     "render-ui",
                     "main",
                     {
-                      "type": "dashboard-layout",
-                      "appName": "Helpdesk",
                       "navItems": [
                         {
-                          "label": "Tickets",
                           "href": "/tickets",
+                          "label": "Tickets",
                           "icon": "inbox"
                         },
                         {
-                          "label": "Responses",
+                          "icon": "message-circle",
                           "href": "/responses",
-                          "icon": "message-circle"
+                          "label": "Responses"
                         },
                         {
-                          "label": "Metrics",
+                          "icon": "layout-list",
                           "href": "/metrics",
-                          "icon": "layout-list"
+                          "label": "Metrics"
                         }
                       ],
+                      "type": "dashboard-layout",
+                      "appName": "Helpdesk",
                       "children": [
                         {
-                          "type": "stack",
-                          "direction": "vertical",
-                          "gap": "lg",
-                          "className": "max-w-5xl mx-auto w-full",
                           "children": [
                             {
-                              "type": "stack",
+                              "justify": "space-between",
                               "direction": "horizontal",
                               "gap": "md",
-                              "justify": "space-between",
                               "align": "center",
                               "children": [
                                 {
                                   "type": "stack",
                                   "direction": "horizontal",
-                                  "gap": "sm",
-                                  "align": "center",
                                   "children": [
                                     {
                                       "type": "icon",
-                                      "name": "message-circle",
-                                      "size": "lg"
+                                      "size": "lg",
+                                      "name": "message-circle"
                                     },
                                     {
                                       "type": "typography",
                                       "content": "Responses",
                                       "variant": "h2"
                                     }
-                                  ]
+                                  ],
+                                  "align": "center",
+                                  "gap": "sm"
                                 },
                                 {
-                                  "type": "stack",
                                   "direction": "horizontal",
-                                  "gap": "sm",
                                   "children": [
                                     {
-                                      "type": "button",
-                                      "label": "Compose",
-                                      "event": "COMPOSE",
                                       "variant": "primary",
-                                      "icon": "edit"
+                                      "icon": "edit",
+                                      "event": "COMPOSE",
+                                      "type": "button",
+                                      "label": "Compose"
                                     }
-                                  ]
+                                  ],
+                                  "type": "stack",
+                                  "gap": "sm"
                                 }
-                              ]
+                              ],
+                              "type": "stack"
                             },
                             {
                               "type": "divider"
                             },
                             {
+                              "emptyIcon": "inbox",
                               "type": "data-list",
+                              "variant": "card",
                               "entity": "Response",
-                              "emptyIcon": "inbox",
-                              "emptyTitle": "No messages yet",
-                              "emptyDescription": "Start a new conversation.",
-                              "itemActions": [
-                                {
-                                  "label": "View",
-                                  "event": "VIEW",
-                                  "variant": "ghost",
-                                  "size": "sm"
-                                }
-                              ],
                               "columns": [
                                 {
                                   "name": "author",
-                                  "variant": "h4",
-                                  "icon": "message-circle"
+                                  "icon": "message-circle",
+                                  "variant": "h4"
                                 },
                                 {
-                                  "name": "body",
-                                  "variant": "body"
+                                  "variant": "body",
+                                  "name": "body"
                                 },
                                 {
                                   "name": "createdAt",
-                                  "variant": "caption",
-                                  "format": "date"
+                                  "format": "date",
+                                  "variant": "caption"
                                 }
                               ],
-                              "variant": "card",
-                              "gap": "sm"
+                              "emptyDescription": "Start a new conversation.",
+                              "itemActions": [
+                                {
+                                  "event": "VIEW",
+                                  "variant": "ghost",
+                                  "label": "View",
+                                  "size": "sm"
+                                }
+                              ],
+                              "gap": "sm",
+                              "emptyTitle": "No messages yet"
                             }
-                          ]
+                          ],
+                          "direction": "vertical",
+                          "gap": "lg",
+                          "type": "stack",
+                          "className": "max-w-5xl mx-auto w-full"
                         }
                       ]
                     }
@@ -1337,29 +1799,54 @@
               }
             ]
           },
+          "scope": "collection"
+        },
+        {
+          "name": "ResponseCompose",
+          "category": "interaction",
+          "linkedEntity": "Response",
           "emits": [
             {
-              "event": "RESOLVE",
-              "description": "Resolve ticket and update metrics",
+              "event": "SEND"
+            },
+            {
+              "event": "ResponseLoaded",
+              "description": "Fired when Response finishes loading",
+              "scope": "internal",
               "payload": [
                 {
                   "name": "id",
                   "type": "string",
                   "required": true
+                },
+                {
+                  "name": "ticketId",
+                  "type": "string"
+                },
+                {
+                  "name": "body",
+                  "type": "string"
+                },
+                {
+                  "name": "author",
+                  "type": "string"
+                },
+                {
+                  "name": "createdAt",
+                  "type": "datetime"
                 }
-              ],
-              "scope": "external"
-            }
-          ]
-        },
-        {
-          "name": "ResponseCompose",
-          "linkedEntity": "Response",
-          "category": "interaction",
-          "emits": [
+              ]
+            },
             {
-              "event": "SEND",
-              "scope": "internal"
+              "event": "ResponseLoadFailed",
+              "description": "Fired when Response fails to load",
+              "scope": "internal",
+              "payload": [
+                {
+                  "name": "message",
+                  "type": "string"
+                }
+              ]
             }
           ],
           "stateMachine": {
@@ -1379,7 +1866,7 @@
               },
               {
                 "key": "COMPOSE",
-                "name": "Open"
+                "name": "Compose"
               },
               {
                 "key": "CLOSE",
@@ -1387,12 +1874,25 @@
               },
               {
                 "key": "SEND",
-                "name": "Save",
+                "name": "Send",
                 "payload": [
                   {
                     "name": "data",
-                    "type": "object",
-                    "required": true
+                    "type": "string"
+                  }
+                ]
+              },
+              {
+                "key": "ResponseLoaded",
+                "name": "Response loaded"
+              },
+              {
+                "key": "ResponseLoadFailed",
+                "name": "Response load failed",
+                "payload": [
+                  {
+                    "name": "message",
+                    "type": "string"
                   }
                 ]
               }
@@ -1418,14 +1918,12 @@
                     "render-ui",
                     "modal",
                     {
-                      "type": "stack",
                       "direction": "vertical",
                       "gap": "md",
+                      "type": "stack",
                       "children": [
                         {
                           "type": "stack",
-                          "direction": "horizontal",
-                          "gap": "sm",
                           "children": [
                             {
                               "type": "icon",
@@ -1433,26 +1931,28 @@
                               "size": "md"
                             },
                             {
+                              "variant": "h3",
                               "type": "typography",
-                              "content": "New Response",
-                              "variant": "h3"
+                              "content": "New Response"
                             }
-                          ]
+                          ],
+                          "direction": "horizontal",
+                          "gap": "sm"
                         },
                         {
                           "type": "divider"
                         },
                         {
-                          "type": "form-section",
-                          "entity": "Response",
-                          "mode": "create",
-                          "submitEvent": "SEND",
                           "cancelEvent": "CLOSE",
+                          "mode": "create",
+                          "entity": "Response",
                           "fields": [
                             "ticketId",
                             "body",
                             "author"
-                          ]
+                          ],
+                          "type": "form-section",
+                          "submitEvent": "SEND"
                         }
                       ]
                     }
@@ -1469,6 +1969,13 @@
                     "modal",
                     null
                   ],
+                  [
+                    "render-ui",
+                    "main",
+                    {
+                      "type": "box"
+                    }
+                  ],
                   [
                     "notify",
                     "Cancelled",
@@ -1491,20 +1998,63 @@
                     "render-ui",
                     "modal",
                     null
+                  ],
+                  [
+                    "render-ui",
+                    "main",
+                    {
+                      "type": "box"
+                    }
                   ]
                 ]
               }
             ]
-          }
+          },
+          "scope": "collection"
         },
         {
           "name": "ResponseView",
-          "linkedEntity": "Response",
           "category": "interaction",
+          "linkedEntity": "Response",
           "emits": [
             {
-              "event": "SAVE",
-              "scope": "internal"
+              "event": "ResponseLoaded",
+              "description": "Fired when Response finishes loading",
+              "scope": "internal",
+              "payload": [
+                {
+                  "name": "id",
+                  "type": "string",
+                  "required": true
+                },
+                {
+                  "name": "ticketId",
+                  "type": "string"
+                },
+                {
+                  "name": "body",
+                  "type": "string"
+                },
+                {
+                  "name": "author",
+                  "type": "string"
+                },
+                {
+                  "name": "createdAt",
+                  "type": "datetime"
+                }
+              ]
+            },
+            {
+              "event": "ResponseLoadFailed",
+              "description": "Fired when Response fails to load",
+              "scope": "internal",
+              "payload": [
+                {
+                  "name": "message",
+                  "type": "string"
+                }
+              ]
             }
           ],
           "stateMachine": {
@@ -1524,12 +2074,11 @@
               },
               {
                 "key": "VIEW",
-                "name": "Open",
+                "name": "View",
                 "payload": [
                   {
                     "name": "id",
-                    "type": "string",
-                    "required": true
+                    "type": "string"
                   }
                 ]
               },
@@ -1539,12 +2088,19 @@
               },
               {
                 "key": "SAVE",
-                "name": "Save",
+                "name": "Save"
+              },
+              {
+                "key": "ResponseLoaded",
+                "name": "Response loaded"
+              },
+              {
+                "key": "ResponseLoadFailed",
+                "name": "Response load failed",
                 "payload": [
                   {
-                    "name": "data",
-                    "type": "object",
-                    "required": true
+                    "name": "message",
+                    "type": "string"
                   }
                 ]
               }
@@ -1570,6 +2126,10 @@
                     "fetch",
                     "Response",
                     {
+                      "emit": {
+                        "failure": "ResponseLoadFailed",
+                        "success": "ResponseLoaded"
+                      },
                       "id": "@payload.id"
                     }
                   ],
@@ -1577,35 +2137,35 @@
                     "render-ui",
                     "modal",
                     {
-                      "type": "stack",
-                      "direction": "vertical",
                       "gap": "md",
+                      "direction": "vertical",
+                      "type": "stack",
                       "children": [
                         {
-                          "type": "stack",
-                          "direction": "horizontal",
-                          "gap": "sm",
                           "align": "center",
+                          "type": "stack",
                           "children": [
                             {
-                              "type": "icon",
                               "name": "eye",
-                              "size": "md"
+                              "size": "md",
+                              "type": "icon"
                             },
                             {
+                              "content": "@entity.ticketId",
                               "type": "typography",
-                              "variant": "h3",
-                              "content": "@entity.ticketId"
+                              "variant": "h3"
                             }
-                          ]
+                          ],
+                          "gap": "sm",
+                          "direction": "horizontal"
                         },
                         {
                           "type": "divider"
                         },
                         {
-                          "type": "stack",
                           "direction": "horizontal",
                           "gap": "md",
+                          "type": "stack",
                           "children": [
                             {
                               "type": "typography",
@@ -1613,21 +2173,21 @@
                               "content": "Ticket ID"
                             },
                             {
-                              "type": "typography",
                               "variant": "body",
-                              "content": "@entity.ticketId"
+                              "content": "@entity.ticketId",
+                              "type": "typography"
                             }
                           ]
                         },
                         {
-                          "type": "stack",
                           "direction": "horizontal",
+                          "type": "stack",
                           "gap": "md",
                           "children": [
                             {
                               "type": "typography",
-                              "variant": "caption",
-                              "content": "Body"
+                              "content": "Body",
+                              "variant": "caption"
                             },
                             {
                               "type": "typography",
@@ -1637,8 +2197,8 @@
                           ]
                         },
                         {
-                          "type": "stack",
                           "direction": "horizontal",
+                          "type": "stack",
                           "gap": "md",
                           "children": [
                             {
@@ -1654,21 +2214,21 @@
                           ]
                         },
                         {
-                          "type": "stack",
                           "direction": "horizontal",
-                          "gap": "md",
+                          "type": "stack",
                           "children": [
                             {
                               "type": "typography",
-                              "variant": "caption",
-                              "content": "Created At"
+                              "content": "Created At",
+                              "variant": "caption"
                             },
                             {
-                              "type": "typography",
+                              "content": "@entity.createdAt",
                               "variant": "body",
-                              "content": "@entity.createdAt"
+                              "type": "typography"
                             }
-                          ]
+                          ],
+                          "gap": "md"
                         },
                         {
                           "type": "divider"
@@ -1702,6 +2262,13 @@
                     "modal",
                     null
                   ],
+                  [
+                    "render-ui",
+                    "main",
+                    {
+                      "type": "box"
+                    }
+                  ],
                   [
                     "notify",
                     "Cancelled",
@@ -1718,16 +2285,24 @@
                     "render-ui",
                     "modal",
                     null
+                  ],
+                  [
+                    "render-ui",
+                    "main",
+                    {
+                      "type": "box"
+                    }
                   ]
                 ]
               }
             ]
-          }
+          },
+          "scope": "collection"
         }
       ],
       "pages": [
         {
-          "name": "ResponsesPage",
+          "name": "Responses",
           "path": "/responses",
           "traits": [
             {
@@ -1756,36 +2331,85 @@
           },
           {
             "name": "openTickets",
-            "type": "number",
-            "default": 0
+            "type": "number"
           },
           {
             "name": "resolvedTickets",
-            "type": "number",
-            "default": 0
+            "type": "number"
           },
           {
             "name": "avgResponseTime",
-            "type": "string",
-            "default": "0h"
+            "type": "string"
           },
           {
             "name": "satisfactionScore",
-            "type": "number",
-            "default": 0
+            "type": "number"
           },
           {
             "name": "activeAgents",
-            "type": "number",
-            "default": 0
+            "type": "number"
           }
         ]
       },
       "traits": [
         {
           "name": "SupportMetricsDisplay",
-          "linkedEntity": "SupportMetrics",
           "category": "interaction",
+          "linkedEntity": "SupportMetrics",
+          "emits": [
+            {
+              "event": "SupportMetricsLoaded",
+              "description": "Fired when SupportMetrics finishes loading",
+              "scope": "internal",
+              "payload": [
+                {
+                  "name": "id",
+                  "type": "string",
+                  "required": true
+                },
+                {
+                  "name": "openTickets",
+                  "type": "number"
+                },
+                {
+                  "name": "resolvedTickets",
+                  "type": "number"
+                },
+                {
+                  "name": "avgResponseTime",
+                  "type": "string"
+                },
+                {
+                  "name": "satisfactionScore",
+                  "type": "number"
+                },
+                {
+                  "name": "activeAgents",
+                  "type": "number"
+                }
+              ]
+            },
+            {
+              "event": "SupportMetricsLoadFailed",
+              "description": "Fired when SupportMetrics fails to load",
+              "scope": "internal",
+              "payload": [
+                {
+                  "name": "message",
+                  "type": "string"
+                }
+              ]
+            }
+          ],
+          "listens": [
+            {
+              "event": "RESOLVE",
+              "triggers": "INIT",
+              "source": {
+                "kind": "any"
+              }
+            }
+          ],
           "stateMachine": {
             "states": [
               {
@@ -1815,6 +2439,20 @@
               {
                 "key": "REFRESHED",
                 "name": "Refreshed"
+              },
+              {
+                "key": "SupportMetricsLoaded",
+                "name": "SupportMetrics loaded"
+              },
+              {
+                "key": "SupportMetricsLoadFailed",
+                "name": "SupportMetrics load failed",
+                "payload": [
+                  {
+                    "name": "message",
+                    "type": "string"
+                  }
+                ]
               }
             ],
             "transitions": [
@@ -1825,34 +2463,38 @@
                 "effects": [
                   [
                     "fetch",
-                    "SupportMetrics"
+                    "SupportMetrics",
+                    {
+                      "emit": {
+                        "success": "SupportMetricsLoaded",
+                        "failure": "SupportMetricsLoadFailed"
+                      }
+                    }
                   ],
                   [
                     "render-ui",
                     "main",
                     {
-                      "type": "dashboard-layout",
-                      "appName": "Helpdesk",
                       "navItems": [
                         {
                           "label": "Tickets",
-                          "href": "/tickets",
-                          "icon": "inbox"
+                          "icon": "inbox",
+                          "href": "/tickets"
                         },
                         {
                           "label": "Responses",
-                          "href": "/responses",
-                          "icon": "message-circle"
+                          "icon": "message-circle",
+                          "href": "/responses"
                         },
                         {
-                          "label": "Metrics",
                           "href": "/metrics",
-                          "icon": "layout-list"
+                          "icon": "layout-list",
+                          "label": "Metrics"
                         }
                       ],
+                      "appName": "Helpdesk",
                       "children": [
                         {
-                          "type": "scaled-diagram",
                           "children": [
                             {
                               "type": "stack",
@@ -1860,7 +2502,6 @@
                               "gap": "lg",
                               "children": [
                                 {
-                                  "type": "breadcrumb",
                                   "items": [
                                     {
                                       "label": "Home",
@@ -1869,39 +2510,40 @@
                                     {
                                       "label": "Support Metrics"
                                     }
-                                  ]
+                                  ],
+                                  "type": "breadcrumb"
                                 },
                                 {
                                   "type": "stack",
-                                  "direction": "horizontal",
                                   "gap": "md",
                                   "justify": "space-between",
                                   "children": [
                                     {
-                                      "type": "stack",
-                                      "direction": "horizontal",
-                                      "gap": "md",
                                       "children": [
                                         {
-                                          "type": "icon",
                                           "name": "activity",
+                                          "type": "icon",
                                           "size": "lg"
                                         },
                                         {
-                                          "type": "typography",
                                           "content": "Support Metrics",
+                                          "type": "typography",
                                           "variant": "h2"
                                         }
-                                      ]
+                                      ],
+                                      "gap": "md",
+                                      "direction": "horizontal",
+                                      "type": "stack"
                                     },
                                     {
-                                      "type": "button",
-                                      "label": "Refresh",
                                       "event": "REFRESH",
                                       "variant": "secondary",
-                                      "icon": "refresh-cw"
+                                      "type": "button",
+                                      "icon": "refresh-cw",
+                                      "label": "Refresh"
                                     }
-                                  ]
+                                  ],
+                                  "direction": "horizontal"
                                 },
                                 {
                                   "type": "divider"
@@ -1912,7 +2554,6 @@
                                   "children": [
                                     {
                                       "type": "simple-grid",
-                                      "columns": 3,
                                       "children": [
                                         {
                                           "type": "stat-display",
@@ -1927,7 +2568,6 @@
                                           ]
                                         },
                                         {
-                                          "type": "stat-display",
                                           "label": "ResolvedTickets",
                                           "value": [
                                             "object/get",
@@ -1936,23 +2576,22 @@
                                               "@entity"
                                             ],
                                             "resolvedTickets"
-                                          ]
+                                          ],
+                                          "type": "stat-display"
                                         },
                                         {
                                           "type": "card",
                                           "children": [
                                             {
                                               "type": "stack",
-                                              "direction": "vertical",
                                               "gap": "sm",
                                               "children": [
                                                 {
                                                   "type": "typography",
-                                                  "variant": "caption",
-                                                  "content": "AvgResponseTime"
+                                                  "content": "AvgResponseTime",
+                                                  "variant": "caption"
                                                 },
                                                 {
-                                                  "type": "typography",
                                                   "variant": "h3",
                                                   "content": [
                                                     "object/get",
@@ -1961,15 +2600,15 @@
                                                       "@entity"
                                                     ],
                                                     "avgResponseTime"
-                                                  ]
+                                                  ],
+                                                  "type": "typography"
                                                 }
-                                              ]
+                                              ],
+                                              "direction": "vertical"
                                             }
                                           ]
                                         },
                                         {
-                                          "type": "stat-display",
-                                          "label": "SatisfactionScore",
                                           "value": [
                                             "object/get",
                                             [
@@ -1977,7 +2616,9 @@
                                               "@entity"
                                             ],
                                             "satisfactionScore"
-                                          ]
+                                          ],
+                                          "label": "SatisfactionScore",
+                                          "type": "stat-display"
                                         },
                                         {
                                           "type": "stat-display",
@@ -1991,7 +2632,8 @@
                                             "activeAgents"
                                           ]
                                         }
-                                      ]
+                                      ],
+                                      "columns": 3.0
                                     }
                                   ]
                                 },
@@ -2000,69 +2642,69 @@
                                 },
                                 {
                                   "type": "grid",
-                                  "columns": 2,
                                   "gap": "md",
+                                  "columns": 2.0,
                                   "children": [
                                     {
-                                      "type": "card",
                                       "children": [
                                         {
-                                          "type": "typography",
+                                          "content": "Chart View",
                                           "variant": "caption",
-                                          "content": "Chart View"
+                                          "type": "typography"
                                         }
-                                      ]
+                                      ],
+                                      "type": "card"
                                     },
                                     {
                                       "type": "card",
                                       "children": [
                                         {
-                                          "type": "typography",
+                                          "content": "Graph View",
                                           "variant": "caption",
-                                          "content": "Graph View"
+                                          "type": "typography"
                                         }
                                       ]
                                     }
                                   ]
                                 },
                                 {
-                                  "type": "line-chart",
+                                  "title": "Trend",
                                   "data": [
                                     {
-                                      "date": "Jan",
-                                      "value": 12
+                                      "value": 12.0,
+                                      "date": "Jan"
                                     },
                                     {
                                       "date": "Feb",
-                                      "value": 19
+                                      "value": 19.0
                                     },
                                     {
                                       "date": "Mar",
-                                      "value": 15
+                                      "value": 15.0
                                     },
                                     {
                                       "date": "Apr",
-                                      "value": 25
+                                      "value": 25.0
                                     },
                                     {
                                       "date": "May",
-                                      "value": 22
+                                      "value": 22.0
                                     },
                                     {
-                                      "date": "Jun",
-                                      "value": 30
+                                      "value": 30.0,
+                                      "date": "Jun"
                                     }
                                   ],
+                                  "type": "line-chart",
                                   "xKey": "date",
-                                  "yKey": "value",
-                                  "title": "Trend"
+                                  "yKey": "value"
                                 },
                                 {
                                   "type": "chart-legend",
                                   "items": [
                                     {
-                                      "label": "Current",
-                                      "color": "primary"
+                                      "color": "primary",
+                                      "label": "Current"
                                     },
                                     {
                                       "label": "Previous",
@@ -2071,45 +2713,47 @@
                                   ]
                                 },
                                 {
+                                  "height": 200.0,
+                                  "edges": [
+                                    {
+                                      "to": "b",
+                                      "from": "a"
+                                    },
+                                    {
+                                      "from": "b",
+                                      "to": "c"
+                                    }
+                                  ],
+                                  "width": 400.0,
                                   "type": "graph-view",
                                   "nodes": [
                                     {
                                       "id": "a",
+                                      "y": 100.0,
                                       "label": "Start",
-                                      "x": 50,
-                                      "y": 100
+                                      "x": 50.0
                                     },
                                     {
-                                      "id": "b",
                                       "label": "Process",
-                                      "x": 200,
-                                      "y": 50
+                                      "x": 200.0,
+                                      "id": "b",
+                                      "y": 50.0
                                     },
                                     {
+                                      "x": 350.0,
+                                      "y": 100.0,
                                       "id": "c",
-                                      "label": "End",
-                                      "x": 350,
-                                      "y": 100
-                                    }
-                                  ],
-                                  "edges": [
-                                    {
-                                      "from": "a",
-                                      "to": "b"
-                                    },
-                                    {
-                                      "from": "b",
-                                      "to": "c"
+                                      "label": "End"
                                     }
-                                  ],
-                                  "width": 400,
-                                  "height": 200
+                                  ]
                                 }
                               ]
                             }
-                          ]
+                          ],
+                          "type": "scaled-diagram"
                         }
-                      ]
+                      ],
+                      "type": "dashboard-layout"
                     }
                   ]
                 ]
@@ -2121,7 +2765,13 @@
                 "effects": [
                   [
                     "fetch",
-                    "SupportMetrics"
+                    "SupportMetrics",
+                    {
+                      "emit": {
+                        "success": "SupportMetricsLoaded",
+                        "failure": "SupportMetricsLoadFailed"
+                      }
+                    }
                   ],
                   [
                     "render-ui",
@@ -2129,38 +2779,20 @@
                     {
                       "type": "dashboard-layout",
                       "appName": "Helpdesk",
-                      "navItems": [
-                        {
-                          "label": "Tickets",
-                          "href": "/tickets",
-                          "icon": "inbox"
-                        },
-                        {
-                          "label": "Responses",
-                          "href": "/responses",
-                          "icon": "message-circle"
-                        },
-                        {
-                          "label": "Metrics",
-                          "href": "/metrics",
-                          "icon": "layout-list"
-                        }
-                      ],
                       "children": [
                         {
-                          "type": "scaled-diagram",
                           "children": [
                             {
-                              "type": "stack",
                               "direction": "vertical",
                               "gap": "lg",
+                              "type": "stack",
                               "children": [
                                 {
                                   "type": "breadcrumb",
                                   "items": [
                                     {
-                                      "label": "Home",
-                                      "href": "/"
+                                      "href": "/",
+                                      "label": "Home"
                                     },
                                     {
                                       "label": "Support Metrics"
@@ -2168,51 +2800,48 @@
                                   ]
                                 },
                                 {
-                                  "type": "stack",
-                                  "direction": "horizontal",
-                                  "gap": "md",
-                                  "justify": "space-between",
                                   "children": [
                                     {
-                                      "type": "stack",
                                       "direction": "horizontal",
-                                      "gap": "md",
+                                      "type": "stack",
                                       "children": [
                                         {
-                                          "type": "icon",
                                           "name": "activity",
+                                          "type": "icon",
                                           "size": "lg"
                                         },
                                         {
                                           "type": "typography",
-                                          "content": "Support Metrics",
-                                          "variant": "h2"
+                                          "variant": "h2",
+                                          "content": "Support Metrics"
                                         }
-                                      ]
+                                      ],
+                                      "gap": "md"
                                     },
                                     {
-                                      "type": "button",
-                                      "label": "Refresh",
                                       "event": "REFRESH",
                                       "variant": "secondary",
-                                      "icon": "refresh-cw"
+                                      "type": "button",
+                                      "icon": "refresh-cw",
+                                      "label": "Refresh"
                                     }
-                                  ]
+                                  ],
+                                  "type": "stack",
+                                  "gap": "md",
+                                  "justify": "space-between",
+                                  "direction": "horizontal"
                                 },
                                 {
                                   "type": "divider"
                                 },
                                 {
                                   "type": "box",
-                                  "padding": "md",
                                   "children": [
                                     {
                                       "type": "simple-grid",
-                                      "columns": 3,
+                                      "columns": 3.0,
                                       "children": [
                                         {
-                                          "type": "stat-display",
-                                          "label": "OpenTickets",
                                           "value": [
                                             "object/get",
                                             [
@@ -2220,10 +2849,11 @@
                                               "@entity"
                                             ],
                                             "openTickets"
-                                          ]
+                                          ],
+                                          "type": "stat-display",
+                                          "label": "OpenTickets"
                                         },
                                         {
-                                          "type": "stat-display",
                                           "label": "ResolvedTickets",
                                           "value": [
                                             "object/get",
@@ -2232,7 +2862,8 @@
                                               "@entity"
                                             ],
                                             "resolvedTickets"
-                                          ]
+                                          ],
+                                          "type": "stat-display"
                                         },
                                         {
                                           "type": "card",
@@ -2248,7 +2879,6 @@
                                                   "content": "AvgResponseTime"
                                                 },
                                                 {
-                                                  "type": "typography",
                                                   "variant": "h3",
                                                   "content": [
                                                     "object/get",
@@ -2257,15 +2887,14 @@
                                                       "@entity"
                                                     ],
                                                     "avgResponseTime"
-                                                  ]
+                                                  ],
+                                                  "type": "typography"
                                                 }
                                               ]
                                             }
                                           ]
                                         },
                                         {
-                                          "type": "stat-display",
-                                          "label": "SatisfactionScore",
                                           "value": [
                                             "object/get",
                                             [
@@ -2273,7 +2902,9 @@
                                               "@entity"
                                             ],
                                             "satisfactionScore"
-                                          ]
+                                          ],
+                                          "type": "stat-display",
+                                          "label": "SatisfactionScore"
                                         },
                                         {
                                           "type": "stat-display",
@@ -2289,14 +2920,15 @@
                                         }
                                       ]
                                     }
-                                  ]
+                                  ],
+                                  "padding": "md"
                                 },
                                 {
                                   "type": "divider"
                                 },
                                 {
                                   "type": "grid",
-                                  "columns": 2,
+                                  "columns": 2.0,
                                   "gap": "md",
                                   "children": [
                                     {
@@ -2313,9 +2945,9 @@
                                       "type": "card",
                                       "children": [
                                         {
-                                          "type": "typography",
+                                          "content": "Graph View",
                                           "variant": "caption",
-                                          "content": "Graph View"
+                                          "type": "typography"
                                         }
                                       ]
                                     }
@@ -2326,27 +2958,27 @@
                                   "data": [
                                     {
                                       "date": "Jan",
-                                      "value": 12
+                                      "value": 12.0
                                     },
                                     {
-                                      "date": "Feb",
-                                      "value": 19
+                                      "value": 19.0,
+                                      "date": "Feb"
                                     },
                                     {
-                                      "date": "Mar",
-                                      "value": 15
+                                      "value": 15.0,
+                                      "date": "Mar"
                                     },
                                     {
-                                      "date": "Apr",
-                                      "value": 25
+                                      "value": 25.0,
+                                      "date": "Apr"
                                     },
                                     {
                                       "date": "May",
-                                      "value": 22
+                                      "value": 22.0
                                     },
                                     {
                                       "date": "Jun",
-                                      "value": 30
+                                      "value": 30.0
                                     }
                                   ],
                                   "xKey": "date",
@@ -2354,7 +2986,6 @@
                                   "title": "Trend"
                                 },
                                 {
-                                  "type": "chart-legend",
                                   "items": [
                                     {
                                       "label": "Current",
@@ -2364,46 +2995,65 @@
                                       "label": "Previous",
                                       "color": "muted"
                                     }
-                                  ]
+                                  ],
+                                  "type": "chart-legend"
                                 },
                                 {
-                                  "type": "graph-view",
                                   "nodes": [
                                     {
                                       "id": "a",
                                       "label": "Start",
-                                      "x": 50,
-                                      "y": 100
+                                      "y": 100.0,
+                                      "x": 50.0
                                     },
                                     {
+                                      "x": 200.0,
                                       "id": "b",
                                       "label": "Process",
-                                      "x": 200,
-                                      "y": 50
+                                      "y": 50.0
                                     },
                                     {
-                                      "id": "c",
                                       "label": "End",
-                                      "x": 350,
-                                      "y": 100
+                                      "x": 350.0,
+                                      "y": 100.0,
+                                      "id": "c"
                                     }
                                   ],
+                                  "width": 400.0,
+                                  "height": 200.0,
                                   "edges": [
                                     {
-                                      "from": "a",
-                                      "to": "b"
+                                      "to": "b",
+                                      "from": "a"
                                     },
                                     {
                                       "from": "b",
                                       "to": "c"
                                     }
                                   ],
-                                  "width": 400,
-                                  "height": 200
+                                  "type": "graph-view"
                                 }
                               ]
                             }
-                          ]
+                          ],
+                          "type": "scaled-diagram"
+                        }
+                      ],
+                      "navItems": [
+                        {
+                          "label": "Tickets",
+                          "icon": "inbox",
+                          "href": "/tickets"
+                        },
+                        {
+                          "icon": "message-circle",
+                          "label": "Responses",
+                          "href": "/responses"
+                        },
+                        {
+                          "icon": "layout-list",
+                          "label": "Metrics",
+                          "href": "/metrics"
                         }
                       ]
                     }
@@ -2417,81 +3067,66 @@
                 "effects": [
                   [
                     "fetch",
-                    "SupportMetrics"
+                    "SupportMetrics",
+                    {
+                      "emit": {
+                        "failure": "SupportMetricsLoadFailed",
+                        "success": "SupportMetricsLoaded"
+                      }
+                    }
                   ],
                   [
                     "render-ui",
                     "main",
                     {
-                      "type": "dashboard-layout",
-                      "appName": "Helpdesk",
-                      "navItems": [
-                        {
-                          "label": "Tickets",
-                          "href": "/tickets",
-                          "icon": "inbox"
-                        },
-                        {
-                          "label": "Responses",
-                          "href": "/responses",
-                          "icon": "message-circle"
-                        },
-                        {
-                          "label": "Metrics",
-                          "href": "/metrics",
-                          "icon": "layout-list"
-                        }
-                      ],
                       "children": [
                         {
-                          "type": "scaled-diagram",
                           "children": [
                             {
                               "type": "stack",
-                              "direction": "vertical",
                               "gap": "lg",
                               "children": [
                                 {
-                                  "type": "breadcrumb",
                                   "items": [
                                     {
-                                      "label": "Home",
-                                      "href": "/"
+                                      "href": "/",
+                                      "label": "Home"
                                     },
                                     {
                                       "label": "Support Metrics"
                                     }
-                                  ]
+                                  ],
+                                  "type": "breadcrumb"
                                 },
                                 {
                                   "type": "stack",
-                                  "direction": "horizontal",
                                   "gap": "md",
                                   "justify": "space-between",
+                                  "direction": "horizontal",
                                   "children": [
                                     {
-                                      "type": "stack",
-                                      "direction": "horizontal",
-                                      "gap": "md",
                                       "children": [
                                         {
-                                          "type": "icon",
+                                          "size": "lg",
                                           "name": "activity",
-                                          "size": "lg"
+                                          "type": "icon"
                                         },
                                         {
                                           "type": "typography",
-                                          "content": "Support Metrics",
-                                          "variant": "h2"
+                                          "variant": "h2",
+                                          "content": "Support Metrics"
                                         }
-                                      ]
+                                      ],
+                                      "type": "stack",
+                                      "gap": "md",
+                                      "direction": "horizontal"
                                     },
                                     {
+                                      "event": "REFRESH",
                                       "type": "button",
+                                      "icon": "refresh-cw",
                                       "label": "Refresh",
-                                      "event": "REFRESH",
-                                      "variant": "secondary",
-                                      "icon": "refresh-cw"
+                                      "variant": "secondary"
                                     }
                                   ]
                                 },
@@ -2503,12 +3138,8 @@
                                   "padding": "md",
                                   "children": [
                                     {
-                                      "type": "simple-grid",
-                                      "columns": 3,
                                       "children": [
                                         {
-                                          "type": "stat-display",
-                                          "label": "OpenTickets",
                                           "value": [
                                             "object/get",
                                             [
@@ -2516,7 +3147,9 @@
                                               "@entity"
                                             ],
                                             "openTickets"
-                                          ]
+                                          ],
+                                          "type": "stat-display",
+                                          "label": "OpenTickets"
                                         },
                                         {
                                           "type": "stat-display",
@@ -2535,13 +3168,11 @@
                                           "children": [
                                             {
                                               "type": "stack",
-                                              "direction": "vertical",
-                                              "gap": "sm",
                                               "children": [
                                                 {
-                                                  "type": "typography",
                                                   "variant": "caption",
-                                                  "content": "AvgResponseTime"
+                                                  "content": "AvgResponseTime",
+                                                  "type": "typography"
                                                 },
                                                 {
                                                   "type": "typography",
@@ -2555,13 +3186,13 @@
                                                     "avgResponseTime"
                                                   ]
                                                 }
-                                              ]
+                                              ],
+                                              "direction": "vertical",
+                                              "gap": "sm"
                                             }
                                           ]
                                         },
                                         {
-                                          "type": "stat-display",
-                                          "label": "SatisfactionScore",
                                           "value": [
                                             "object/get",
                                             [
@@ -2569,11 +3200,12 @@
                                               "@entity"
                                             ],
                                             "satisfactionScore"
-                                          ]
+                                          ],
+                                          "type": "stat-display",
+                                          "label": "SatisfactionScore"
                                         },
                                         {
                                           "type": "stat-display",
-                                          "label": "ActiveAgents",
                                           "value": [
                                             "object/get",
                                             [
@@ -2581,9 +3213,12 @@
                                               "@entity"
                                             ],
                                             "activeAgents"
-                                          ]
+                                          ],
+                                          "label": "ActiveAgents"
                                         }
-                                      ]
+                                      ],
+                                      "type": "simple-grid",
+                                      "columns": 3.0
                                     }
                                   ]
                                 },
@@ -2591,99 +3226,78 @@
                                   "type": "divider"
                                 },
                                 {
-                                  "type": "grid",
-                                  "columns": 2,
                                   "gap": "md",
+                                  "type": "grid",
                                   "children": [
                                     {
-                                      "type": "card",
                                       "children": [
                                         {
+                                          "content": "Chart View",
                                           "type": "typography",
-                                          "variant": "caption",
-                                          "content": "Chart View"
+                                          "variant": "caption"
                                         }
-                                      ]
+                                      ],
+                                      "type": "card"
                                     },
                                     {
                                       "type": "card",
                                       "children": [
                                         {
+                                          "content": "Graph View",
                                           "type": "typography",
-                                          "variant": "caption",
-                                          "content": "Graph View"
+                                          "variant": "caption"
                                         }
                                       ]
                                     }
-                                  ]
+                                  ],
+                                  "columns": 2.0
                                 },
                                 {
+                                  "yKey": "value",
+                                  "xKey": "date",
+                                  "title": "Trend",
                                   "type": "line-chart",
                                   "data": [
                                     {
                                       "date": "Jan",
-                                      "value": 12
+                                      "value": 12.0
                                     },
                                     {
                                       "date": "Feb",
-                                      "value": 19
+                                      "value": 19.0
                                     },
                                     {
-                                      "date": "Mar",
-                                      "value": 15
+                                      "value": 15.0,
+                                      "date": "Mar"
                                     },
                                     {
-                                      "date": "Apr",
-                                      "value": 25
+                                      "value": 25.0,
+                                      "date": "Apr"
                                     },
                                     {
-                                      "date": "May",
-                                      "value": 22
+                                      "value": 22.0,
+                                      "date": "May"
                                     },
                                     {
                                       "date": "Jun",
-                                      "value": 30
+                                      "value": 30.0
                                     }
-                                  ],
-                                  "xKey": "date",
-                                  "yKey": "value",
-                                  "title": "Trend"
+                                  ]
                                 },
                                 {
                                   "type": "chart-legend",
                                   "items": [
                                     {
-                                      "label": "Current",
-                                      "color": "primary"
-                                    },
-                                    {
-                                      "label": "Previous",
-                                      "color": "muted"
-                                    }
-                                  ]
-                                },
-                                {
-                                  "type": "graph-view",
-                                  "nodes": [
-                                    {
-                                      "id": "a",
-                                      "label": "Start",
-                                      "x": 50,
-                                      "y": 100
-                                    },
-                                    {
-                                      "id": "b",
-                                      "label": "Process",
-                                      "x": 200,
-                                      "y": 50
+                                      "color": "primary",
+                                      "label": "Current"
                                     },
                                     {
-                                      "id": "c",
-                                      "label": "End",
-                                      "x": 350,
-                                      "y": 100
+                                      "label": "Previous",
+                                      "color": "muted"
                                     }
-                                  ],
+                                  ]
+                                },
+                                {
                                   "edges": [
                                     {
                                       "from": "a",
@@ -2694,14 +3308,56 @@
                                       "to": "c"
                                     }
                                   ],
-                                  "width": 400,
-                                  "height": 200
+                                  "nodes": [
+                                    {
+                                      "y": 100.0,
+                                      "x": 50.0,
+                                      "label": "Start",
+                                      "id": "a"
+                                    },
+                                    {
+                                      "x": 200.0,
+                                      "y": 50.0,
+                                      "label": "Process",
+                                      "id": "b"
+                                    },
+                                    {
+                                      "id": "c",
+                                      "x": 350.0,
+                                      "y": 100.0,
+                                      "label": "End"
+                                    }
+                                  ],
+                                  "type": "graph-view",
+                                  "width": 400.0,
+                                  "height": 200.0
                                 }
-                              ]
+                              ],
+                              "direction": "vertical"
                             }
-                          ]
+                          ],
+                          "type": "scaled-diagram"
                         }
-                      ]
+                      ],
+                      "navItems": [
+                        {
+                          "href": "/tickets",
+                          "icon": "inbox",
+                          "label": "Tickets"
+                        },
+                        {
+                          "label": "Responses",
+                          "href": "/responses",
+                          "icon": "message-circle"
+                        },
+                        {
+                          "icon": "layout-list",
+                          "label": "Metrics",
+                          "href": "/metrics"
+                        }
+                      ],
+                      "appName": "Helpdesk",
+                      "type": "dashboard-layout"
                     }
                   ]
                 ]
@@ -2713,31 +3369,18 @@
                 "effects": [
                   [
                     "fetch",
-                    "SupportMetrics"
+                    "SupportMetrics",
+                    {
+                      "emit": {
+                        "success": "SupportMetricsLoaded",
+                        "failure": "SupportMetricsLoadFailed"
+                      }
+                    }
                   ],
                   [
                     "render-ui",
                     "main",
                     {
-                      "type": "dashboard-layout",
-                      "appName": "Helpdesk",
-                      "navItems": [
-                        {
-                          "label": "Tickets",
-                          "href": "/tickets",
-                          "icon": "inbox"
-                        },
-                        {
-                          "label": "Responses",
-                          "href": "/responses",
-                          "icon": "message-circle"
-                        },
-                        {
-                          "label": "Metrics",
-                          "href": "/metrics",
-                          "icon": "layout-list"
-                        }
-                      ],
                       "children": [
                         {
                           "type": "scaled-diagram",
@@ -2760,47 +3403,45 @@
                                   ]
                                 },
                                 {
-                                  "type": "stack",
                                   "direction": "horizontal",
-                                  "gap": "md",
-                                  "justify": "space-between",
                                   "children": [
                                     {
-                                      "type": "stack",
                                       "direction": "horizontal",
-                                      "gap": "md",
+                                      "type": "stack",
                                       "children": [
                                         {
-                                          "type": "icon",
                                           "name": "activity",
-                                          "size": "lg"
+                                          "size": "lg",
+                                          "type": "icon"
                                         },
                                         {
                                           "type": "typography",
                                           "content": "Support Metrics",
                                           "variant": "h2"
                                         }
-                                      ]
+                                      ],
+                                      "gap": "md"
                                     },
                                     {
+                                      "variant": "secondary",
+                                      "icon": "refresh-cw",
                                       "type": "button",
-                                      "label": "Refresh",
                                       "event": "REFRESH",
-                                      "variant": "secondary",
-                                      "icon": "refresh-cw"
+                                      "label": "Refresh"
                                     }
-                                  ]
+                                  ],
+                                  "gap": "md",
+                                  "type": "stack",
+                                  "justify": "space-between"
                                 },
                                 {
                                   "type": "divider"
                                 },
                                 {
-                                  "type": "box",
-                                  "padding": "md",
                                   "children": [
                                     {
+                                      "columns": 3.0,
                                       "type": "simple-grid",
-                                      "columns": 3,
                                       "children": [
                                         {
                                           "type": "stat-display",
@@ -2815,8 +3456,8 @@
                                           ]
                                         },
                                         {
-                                          "type": "stat-display",
                                           "label": "ResolvedTickets",
+                                          "type": "stat-display",
                                           "value": [
                                             "object/get",
                                             [
@@ -2830,9 +3471,7 @@
                                           "type": "card",
                                           "children": [
                                             {
-                                              "type": "stack",
                                               "direction": "vertical",
-                                              "gap": "sm",
                                               "children": [
                                                 {
                                                   "type": "typography",
@@ -2840,8 +3479,8 @@
                                                   "content": "AvgResponseTime"
                                                 },
                                                 {
-                                                  "type": "typography",
                                                   "variant": "h3",
+                                                  "type": "typography",
                                                   "content": [
                                                     "object/get",
                                                     [
@@ -2851,13 +3490,14 @@
                                                     "avgResponseTime"
                                                   ]
                                                 }
-                                              ]
+                                              ],
+                                              "type": "stack",
+                                              "gap": "sm"
                                             }
                                           ]
                                         },
                                         {
                                           "type": "stat-display",
-                                          "label": "SatisfactionScore",
                                           "value": [
                                             "object/get",
                                             [
@@ -2865,7 +3505,8 @@
                                               "@entity"
                                             ],
                                             "satisfactionScore"
-                                          ]
+                                          ],
+                                          "label": "SatisfactionScore"
                                         },
                                         {
                                           "type": "stat-display",
@@ -2881,69 +3522,71 @@
                                         }
                                       ]
                                     }
-                                  ]
+                                  ],
+                                  "padding": "md",
+                                  "type": "box"
                                 },
                                 {
                                   "type": "divider"
                                 },
                                 {
-                                  "type": "grid",
-                                  "columns": 2,
+                                  "columns": 2.0,
                                   "gap": "md",
                                   "children": [
                                     {
-                                      "type": "card",
                                       "children": [
                                         {
+                                          "content": "Chart View",
                                           "type": "typography",
-                                          "variant": "caption",
-                                          "content": "Chart View"
+                                          "variant": "caption"
                                         }
-                                      ]
+                                      ],
+                                      "type": "card"
                                     },
                                     {
                                       "type": "card",
                                       "children": [
                                         {
                                           "type": "typography",
-                                          "variant": "caption",
-                                          "content": "Graph View"
+                                          "content": "Graph View",
+                                          "variant": "caption"
                                         }
                                       ]
                                     }
-                                  ]
+                                  ],
+                                  "type": "grid"
                                 },
                                 {
+                                  "xKey": "date",
+                                  "title": "Trend",
                                   "type": "line-chart",
                                   "data": [
                                     {
                                       "date": "Jan",
-                                      "value": 12
+                                      "value": 12.0
                                     },
                                     {
-                                      "date": "Feb",
-                                      "value": 19
+                                      "value": 19.0,
+                                      "date": "Feb"
                                     },
                                     {
                                       "date": "Mar",
-                                      "value": 15
+                                      "value": 15.0
                                     },
                                     {
-                                      "date": "Apr",
-                                      "value": 25
+                                      "value": 25.0,
+                                      "date": "Apr"
                                     },
                                     {
-                                      "date": "May",
-                                      "value": 22
+                                      "value": 22.0,
+                                      "date": "May"
                                     },
                                     {
                                       "date": "Jun",
-                                      "value": 30
+                                      "value": 30.0
                                     }
                                   ],
-                                  "xKey": "date",
-                                  "yKey": "value",
-                                  "title": "Trend"
+                                  "yKey": "value"
                                 },
                                 {
                                   "type": "chart-legend",
@@ -2953,33 +3596,35 @@
                                       "color": "primary"
                                     },
                                     {
-                                      "label": "Previous",
-                                      "color": "muted"
+                                      "color": "muted",
+                                      "label": "Previous"
                                     }
                                   ]
                                 },
                                 {
-                                  "type": "graph-view",
                                   "nodes": [
                                     {
-                                      "id": "a",
                                       "label": "Start",
-                                      "x": 50,
-                                      "y": 100
+                                      "y": 100.0,
+                                      "id": "a",
+                                      "x": 50.0
                                     },
                                     {
                                       "id": "b",
-                                      "label": "Process",
-                                      "x": 200,
-                                      "y": 50
+                                      "y": 50.0,
+                                      "x": 200.0,
+                                      "label": "Process"
                                     },
                                     {
-                                      "id": "c",
+                                      "y": 100.0,
                                       "label": "End",
-                                      "x": 350,
-                                      "y": 100
+                                      "x": 350.0,
+                                      "id": "c"
                                     }
                                   ],
+                                  "width": 400.0,
+                                  "height": 200.0,
+                                  "type": "graph-view",
                                   "edges": [
                                     {
                                       "from": "a",
@@ -2989,15 +3634,32 @@
                                       "from": "b",
                                       "to": "c"
                                     }
-                                  ],
-                                  "width": 400,
-                                  "height": 200
+                                  ]
                                 }
                               ]
                             }
                           ]
                         }
-                      ]
+                      ],
+                      "navItems": [
+                        {
+                          "href": "/tickets",
+                          "icon": "inbox",
+                          "label": "Tickets"
+                        },
+                        {
+                          "icon": "message-circle",
+                          "label": "Responses",
+                          "href": "/responses"
+                        },
+                        {
+                          "href": "/metrics",
+                          "label": "Metrics",
+                          "icon": "layout-list"
+                        }
+                      ],
+                      "type": "dashboard-layout",
+                      "appName": "Helpdesk"
                     }
                   ]
                 ]
@@ -3009,42 +3671,27 @@
                 "effects": [
                   [
                     "fetch",
-                    "SupportMetrics"
+                    "SupportMetrics",
+                    {
+                      "emit": {
+                        "failure": "SupportMetricsLoadFailed",
+                        "success": "SupportMetricsLoaded"
+                      }
+                    }
                   ],
                   [
                     "render-ui",
                     "main",
                     {
-                      "type": "dashboard-layout",
-                      "appName": "Helpdesk",
-                      "navItems": [
-                        {
-                          "label": "Tickets",
-                          "href": "/tickets",
-                          "icon": "inbox"
-                        },
-                        {
-                          "label": "Responses",
-                          "href": "/responses",
-                          "icon": "message-circle"
-                        },
-                        {
-                          "label": "Metrics",
-                          "href": "/metrics",
-                          "icon": "layout-list"
-                        }
-                      ],
                       "children": [
                         {
                           "type": "scaled-diagram",
                           "children": [
                             {
-                              "type": "stack",
-                              "direction": "vertical",
                               "gap": "lg",
+                              "type": "stack",
                               "children": [
                                 {
-                                  "type": "breadcrumb",
                                   "items": [
                                     {
                                       "label": "Home",
@@ -3053,39 +3700,40 @@
                                     {
                                       "label": "Support Metrics"
                                     }
-                                  ]
+                                  ],
+                                  "type": "breadcrumb"
                                 },
                                 {
-                                  "type": "stack",
-                                  "direction": "horizontal",
-                                  "gap": "md",
-                                  "justify": "space-between",
                                   "children": [
                                     {
                                       "type": "stack",
-                                      "direction": "horizontal",
-                                      "gap": "md",
                                       "children": [
                                         {
+                                          "size": "lg",
                                           "type": "icon",
-                                          "name": "activity",
-                                          "size": "lg"
+                                          "name": "activity"
                                         },
                                         {
                                           "type": "typography",
                                           "content": "Support Metrics",
                                           "variant": "h2"
                                         }
-                                      ]
+                                      ],
+                                      "direction": "horizontal",
+                                      "gap": "md"
                                     },
                                     {
-                                      "type": "button",
-                                      "label": "Refresh",
-                                      "event": "REFRESH",
                                       "variant": "secondary",
-                                      "icon": "refresh-cw"
+                                      "event": "REFRESH",
+                                      "icon": "refresh-cw",
+                                      "type": "button",
+                                      "label": "Refresh"
                                     }
-                                  ]
+                                  ],
+                                  "type": "stack",
+                                  "direction": "horizontal",
+                                  "gap": "md",
+                                  "justify": "space-between"
                                 },
                                 {
                                   "type": "divider"
@@ -3095,8 +3743,8 @@
                                   "padding": "md",
                                   "children": [
                                     {
+                                      "columns": 3.0,
                                       "type": "simple-grid",
-                                      "columns": 3,
                                       "children": [
                                         {
                                           "type": "stat-display",
@@ -3126,18 +3774,16 @@
                                           "type": "card",
                                           "children": [
                                             {
-                                              "type": "stack",
                                               "direction": "vertical",
+                                              "type": "stack",
                                               "gap": "sm",
                                               "children": [
                                                 {
-                                                  "type": "typography",
                                                   "variant": "caption",
+                                                  "type": "typography",
                                                   "content": "AvgResponseTime"
                                                 },
                                                 {
-                                                  "type": "typography",
-                                                  "variant": "h3",
                                                   "content": [
                                                     "object/get",
                                                     [
@@ -3145,14 +3791,15 @@
                                                       "@entity"
                                                     ],
                                                     "avgResponseTime"
-                                                  ]
+                                                  ],
+                                                  "type": "typography",
+                                                  "variant": "h3"
                                                 }
                                               ]
                                             }
                                           ]
                                         },
                                         {
-                                          "type": "stat-display",
                                           "label": "SatisfactionScore",
                                           "value": [
                                             "object/get",
@@ -3161,11 +3808,12 @@
                                               "@entity"
                                             ],
                                             "satisfactionScore"
-                                          ]
+                                          ],
+                                          "type": "stat-display"
                                         },
                                         {
-                                          "type": "stat-display",
                                           "label": "ActiveAgents",
+                                          "type": "stat-display",
                                           "value": [
                                             "object/get",
                                             [
@@ -3183,9 +3831,7 @@
                                   "type": "divider"
                                 },
                                 {
-                                  "type": "grid",
-                                  "columns": 2,
-                                  "gap": "md",
+                                  "columns": 2.0,
                                   "children": [
                                     {
                                       "type": "card",
@@ -3198,48 +3844,50 @@
                                       ]
                                     },
                                     {
-                                      "type": "card",
                                       "children": [
                                         {
-                                          "type": "typography",
                                           "variant": "caption",
+                                          "type": "typography",
                                           "content": "Graph View"
                                         }
-                                      ]
+                                      ],
+                                      "type": "card"
                                     }
-                                  ]
+                                  ],
+                                  "type": "grid",
+                                  "gap": "md"
                                 },
                                 {
-                                  "type": "line-chart",
+                                  "title": "Trend",
                                   "data": [
                                     {
                                       "date": "Jan",
-                                      "value": 12
+                                      "value": 12.0
                                     },
                                     {
-                                      "date": "Feb",
-                                      "value": 19
+                                      "value": 19.0,
+                                      "date": "Feb"
                                     },
                                     {
                                       "date": "Mar",
-                                      "value": 15
+                                      "value": 15.0
                                     },
                                     {
                                       "date": "Apr",
-                                      "value": 25
+                                      "value": 25.0
                                     },
                                     {
                                       "date": "May",
-                                      "value": 22
+                                      "value": 22.0
                                     },
                                     {
                                       "date": "Jun",
-                                      "value": 30
+                                      "value": 30.0
                                     }
                                   ],
-                                  "xKey": "date",
                                   "yKey": "value",
-                                  "title": "Trend"
+                                  "xKey": "date",
+                                  "type": "line-chart"
                                 },
                                 {
                                   "type": "chart-legend",
@@ -3256,62 +3904,76 @@
                                 },
                                 {
                                   "type": "graph-view",
+                                  "edges": [
+                                    {
+                                      "from": "a",
+                                      "to": "b"
+                                    },
+                                    {
+                                      "to": "c",
+                                      "from": "b"
+                                    }
+                                  ],
+                                  "height": 200.0,
                                   "nodes": [
                                     {
+                                      "x": 50.0,
                                       "id": "a",
                                       "label": "Start",
-                                      "x": 50,
-                                      "y": 100
+                                      "y": 100.0
                                     },
                                     {
-                                      "id": "b",
                                       "label": "Process",
-                                      "x": 200,
-                                      "y": 50
+                                      "id": "b",
+                                      "x": 200.0,
+                                      "y": 50.0
                                     },
                                     {
-                                      "id": "c",
+                                      "x": 350.0,
                                       "label": "End",
-                                      "x": 350,
-                                      "y": 100
-                                    }
-                                  ],
-                                  "edges": [
-                                    {
-                                      "from": "a",
-                                      "to": "b"
-                                    },
-                                    {
-                                      "from": "b",
-                                      "to": "c"
+                                      "y": 100.0,
+                                      "id": "c"
                                     }
                                   ],
-                                  "width": 400,
-                                  "height": 200
+                                  "width": 400.0
                                 }
-                              ]
+                              ],
+                              "direction": "vertical"
                             }
                           ]
                         }
-                      ]
+                      ],
+                      "type": "dashboard-layout",
+                      "navItems": [
+                        {
+                          "label": "Tickets",
+                          "href": "/tickets",
+                          "icon": "inbox"
+                        },
+                        {
+                          "href": "/responses",
+                          "label": "Responses",
+                          "icon": "message-circle"
+                        },
+                        {
+                          "href": "/metrics",
+                          "label": "Metrics",
+                          "icon": "layout-list"
+                        }
+                      ],
+                      "appName": "Helpdesk"
                     }
                   ]
                 ]
               }
             ]
           },
-          "listens": [
-            {
-              "event": "RESOLVE",
-              "triggers": "INIT",
-              "scope": "external"
-            }
-          ]
+          "scope": "collection"
         }
       ],
       "pages": [
         {
-          "name": "MetricsPage",
+          "name": "Metrics",
           "path": "/metrics",
           "traits": [
             {
@@ -3322,4 +3984,4 @@
       ]
     }
   ]
-}
+}