@almadar/std 6.5.2 → 7.2.0

package/dist/behaviors/registry/organisms/std-social-feed.orb

@@ -1,7 +1,7 @@
 {
   "name": "std-social-feed",
   "version": "1.0.0",
-  "description": "Social feed organism. Composes molecules via compose: - stdDetail(Post): browse + create + view posts - stdMessaging(Comment): messaging thread for comments",
+  "description": "std-social-feed as a Function",
   "orbitals": [
     {
       "name": "PostOrbital",
@@ -31,26 +31,74 @@
           },
           {
             "name": "createdAt",
-            "type": "date",
+            "type": "datetime",
             "default": ""
           },
           {
             "name": "likes",
             "type": "number",
-            "default": 0
+            "default": 0.0
           }
         ]
       },
       "traits": [
         {
           "name": "PostBrowse",
-          "linkedEntity": "Post",
           "category": "interaction",
-          "listens": [
+          "linkedEntity": "Post",
+          "emits": [
             {
-              "event": "SAVE",
-              "triggers": "INIT",
-              "scope": "internal"
+              "event": "COMMENT",
+              "scope": "external",
+              "payload": [
+                {
+                  "name": "id",
+                  "type": "string"
+                }
+              ]
+            },
+            {
+              "event": "PostLoaded",
+              "description": "Fired when Post finishes loading",
+              "scope": "internal",
+              "payload": [
+                {
+                  "name": "id",
+                  "type": "string",
+                  "required": true
+                },
+                {
+                  "name": "title",
+                  "type": "string"
+                },
+                {
+                  "name": "content",
+                  "type": "string"
+                },
+                {
+                  "name": "author",
+                  "type": "string"
+                },
+                {
+                  "name": "createdAt",
+                  "type": "datetime"
+                },
+                {
+                  "name": "likes",
+                  "type": "number"
+                }
+              ]
+            },
+            {
+              "event": "PostLoadFailed",
+              "description": "Fired when Post fails to load",
+              "scope": "internal",
+              "payload": [
+                {
+                  "name": "message",
+                  "type": "string"
+                }
+              ]
             }
           ],
           "stateMachine": {
@@ -66,12 +114,26 @@
                 "name": "Initialize"
               },
               {
-                "key": "CREATE",
-                "name": "CREATE"
+                "key": "COMMENT",
+                "name": "Comment"
+              },
+              {
+                "key": "PostLoaded",
+                "name": "Post loaded"
+              },
+              {
+                "key": "PostLoadFailed",
+                "name": "Post load failed",
+                "payload": [
+                  {
+                    "name": "message",
+                    "type": "string"
+                  }
+                ]
               },
               {
                 "key": "VIEW",
-                "name": "VIEW",
+                "name": "View",
                 "payload": [
                   {
                     "name": "id",
@@ -99,13 +161,12 @@
                     "render-ui",
                     "main",
                     {
-                      "type": "dashboard-layout",
                       "appName": "SocialFeed",
                       "navItems": [
                         {
                           "label": "Feed",
-                          "href": "/feed",
-                          "icon": "layout-list"
+                          "icon": "layout-list",
+                          "href": "/feed"
                         },
                         {
                           "label": "Messages",
@@ -113,76 +174,73 @@
                           "icon": "message-circle"
                         }
                       ],
+                      "type": "dashboard-layout",
                       "children": [
                         {
-                          "type": "stack",
-                          "direction": "vertical",
-                          "gap": "lg",
-                          "className": "max-w-5xl mx-auto w-full",
                           "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": "rss",
-                                      "size": "lg"
+                                      "name": "rss"
                                     },
                                     {
+                                      "variant": "h2",
                                       "type": "typography",
-                                      "content": "Feed",
-                                      "variant": "h2"
+                                      "content": "Feed"
                                     }
-                                  ]
+                                  ],
+                                  "gap": "sm",
+                                  "direction": "horizontal",
+                                  "align": "center"
                                 },
                                 {
-                                  "type": "stack",
                                   "direction": "horizontal",
                                   "gap": "sm",
                                   "children": [
                                     {
-                                      "type": "button",
                                       "label": "New Post",
-                                      "event": "CREATE",
+                                      "type": "button",
+                                      "icon": "plus",
                                       "variant": "primary",
-                                      "icon": "plus"
+                                      "event": "CREATE"
                                     }
-                                  ]
+                                  ],
+                                  "type": "stack"
                                 }
-                              ]
+                              ],
+                              "gap": "md",
+                              "direction": "horizontal",
+                              "justify": "space-between",
+                              "type": "stack"
                             },
                             {
                               "type": "divider"
                             },
                             {
                               "type": "data-list",
-                              "entity": "Post",
                               "emptyIcon": "inbox",
-                              "emptyTitle": "No posts yet",
                               "emptyDescription": "Share your first post.",
+                              "entity": "Post",
                               "itemActions": [
                                 {
-                                  "label": "View",
-                                  "event": "VIEW",
                                   "variant": "ghost",
-                                  "size": "sm"
+                                  "size": "sm",
+                                  "event": "VIEW",
+                                  "label": "View"
                                 }
                               ],
+                              "variant": "card",
                               "columns": [
                                 {
+                                  "icon": "rss",
                                   "name": "title",
-                                  "variant": "h3",
-                                  "icon": "rss"
+                                  "variant": "h3"
                                 },
                                 {
                                   "name": "likes",
@@ -194,20 +252,24 @@
                                   "variant": "body"
                                 },
                                 {
-                                  "name": "content",
-                                  "variant": "body"
+                                  "variant": "body",
+                                  "name": "content"
                                 },
                                 {
-                                  "name": "createdAt",
                                   "label": "Posted",
+                                  "format": "date",
                                   "variant": "caption",
-                                  "format": "date"
+                                  "name": "createdAt"
                                 }
                               ],
-                              "variant": "card",
+                              "emptyTitle": "No posts yet",
                               "gap": "sm"
                             }
-                          ]
+                          ],
+                          "direction": "vertical",
+                          "gap": "lg",
+                          "type": "stack",
+                          "className": "max-w-5xl mx-auto w-full"
                         }
                       ]
                     }
@@ -216,29 +278,55 @@
               }
             ]
           },
+          "scope": "collection"
+        },
+        {
+          "name": "PostCreate",
+          "category": "interaction",
+          "linkedEntity": "Post",
           "emits": [
             {
-              "event": "COMMENT",
-              "description": "Navigate to comments for a post",
+              "event": "PostLoaded",
+              "description": "Fired when Post finishes loading",
+              "scope": "internal",
               "payload": [
                 {
                   "name": "id",
                   "type": "string",
                   "required": true
+                },
+                {
+                  "name": "title",
+                  "type": "string"
+                },
+                {
+                  "name": "content",
+                  "type": "string"
+                },
+                {
+                  "name": "author",
+                  "type": "string"
+                },
+                {
+                  "name": "createdAt",
+                  "type": "datetime"
+                },
+                {
+                  "name": "likes",
+                  "type": "number"
                 }
-              ],
-              "scope": "external"
-            }
-          ]
-        },
-        {
-          "name": "PostCreate",
-          "linkedEntity": "Post",
-          "category": "interaction",
-          "emits": [
+              ]
+            },
             {
-              "event": "SAVE",
-              "scope": "internal"
+              "event": "PostLoadFailed",
+              "description": "Fired when Post fails to load",
+              "scope": "internal",
+              "payload": [
+                {
+                  "name": "message",
+                  "type": "string"
+                }
+              ]
             }
           ],
           "stateMachine": {
@@ -258,7 +346,7 @@
               },
               {
                 "key": "CREATE",
-                "name": "Open"
+                "name": "Create"
               },
               {
                 "key": "CLOSE",
@@ -274,6 +362,20 @@
                     "required": true
                   }
                 ]
+              },
+              {
+                "key": "PostLoaded",
+                "name": "Post loaded"
+              },
+              {
+                "key": "PostLoadFailed",
+                "name": "Post load failed",
+                "payload": [
+                  {
+                    "name": "message",
+                    "type": "string"
+                  }
+                ]
               }
             ],
             "transitions": [
@@ -295,30 +397,36 @@
                 "effects": [
                   [
                     "fetch",
-                    "Post"
+                    "Post",
+                    {
+                      "emit": {
+                        "failure": "PostLoadFailed",
+                        "success": "PostLoaded"
+                      }
+                    }
                   ],
                   [
                     "render-ui",
                     "modal",
                     {
+                      "gap": "md",
                       "type": "stack",
                       "direction": "vertical",
-                      "gap": "md",
                       "children": [
                         {
-                          "type": "stack",
                           "direction": "horizontal",
                           "gap": "sm",
+                          "type": "stack",
                           "children": [
                             {
-                              "type": "icon",
                               "name": "plus-circle",
+                              "type": "icon",
                               "size": "md"
                             },
                             {
+                              "variant": "h3",
                               "type": "typography",
-                              "content": "Create Post",
-                              "variant": "h3"
+                              "content": "Create Post"
                             }
                           ]
                         },
@@ -326,17 +434,17 @@
                           "type": "divider"
                         },
                         {
+                          "mode": "create",
                           "type": "form-section",
                           "entity": "Post",
-                          "mode": "create",
-                          "submitEvent": "SAVE",
                           "cancelEvent": "CLOSE",
                           "fields": [
                             "title",
                             "content",
                             "author",
                             "likes"
-                          ]
+                          ],
+                          "submitEvent": "SAVE"
                         }
                       ]
                     }
@@ -353,6 +461,13 @@
                     "modal",
                     null
                   ],
+                  [
+                    "render-ui",
+                    "main",
+                    {
+                      "type": "box"
+                    }
+                  ],
                   [
                     "notify",
                     "Cancelled",
@@ -375,20 +490,67 @@
                     "render-ui",
                     "modal",
                     null
+                  ],
+                  [
+                    "render-ui",
+                    "main",
+                    {
+                      "type": "box"
+                    }
                   ]
                 ]
               }
             ]
-          }
+          },
+          "scope": "collection"
         },
         {
           "name": "PostView",
-          "linkedEntity": "Post",
           "category": "interaction",
+          "linkedEntity": "Post",
           "emits": [
             {
-              "event": "SAVE",
-              "scope": "internal"
+              "event": "PostLoaded",
+              "description": "Fired when Post finishes loading",
+              "scope": "internal",
+              "payload": [
+                {
+                  "name": "id",
+                  "type": "string",
+                  "required": true
+                },
+                {
+                  "name": "title",
+                  "type": "string"
+                },
+                {
+                  "name": "content",
+                  "type": "string"
+                },
+                {
+                  "name": "author",
+                  "type": "string"
+                },
+                {
+                  "name": "createdAt",
+                  "type": "datetime"
+                },
+                {
+                  "name": "likes",
+                  "type": "number"
+                }
+              ]
+            },
+            {
+              "event": "PostLoadFailed",
+              "description": "Fired when Post fails to load",
+              "scope": "internal",
+              "payload": [
+                {
+                  "name": "message",
+                  "type": "string"
+                }
+              ]
             }
           ],
           "stateMachine": {
@@ -408,7 +570,7 @@
               },
               {
                 "key": "VIEW",
-                "name": "Open",
+                "name": "View",
                 "payload": [
                   {
                     "name": "id",
@@ -431,6 +593,20 @@
                     "required": true
                   }
                 ]
+              },
+              {
+                "key": "PostLoaded",
+                "name": "Post loaded"
+              },
+              {
+                "key": "PostLoadFailed",
+                "name": "Post load failed",
+                "payload": [
+                  {
+                    "name": "message",
+                    "type": "string"
+                  }
+                ]
               }
             ],
             "transitions": [
@@ -454,109 +630,111 @@
                     "fetch",
                     "Post",
                     {
-                      "id": "@payload.id"
+                      "id": "@payload.id",
+                      "emit": {
+                        "failure": "PostLoadFailed",
+                        "success": "PostLoaded"
+                      }
                     }
                   ],
                   [
                     "render-ui",
                     "modal",
                     {
-                      "type": "stack",
-                      "direction": "vertical",
                       "gap": "md",
+                      "direction": "vertical",
+                      "type": "stack",
                       "children": [
                         {
-                          "type": "stack",
-                          "direction": "horizontal",
-                          "gap": "sm",
-                          "align": "center",
                           "children": [
                             {
+                              "size": "md",
                               "type": "icon",
-                              "name": "eye",
-                              "size": "md"
+                              "name": "eye"
                             },
                             {
-                              "type": "typography",
                               "variant": "h3",
+                              "type": "typography",
                               "content": "@entity.title"
                             }
-                          ]
+                          ],
+                          "type": "stack",
+                          "direction": "horizontal",
+                          "align": "center",
+                          "gap": "sm"
                         },
                         {
                           "type": "divider"
                         },
                         {
-                          "type": "stack",
-                          "direction": "horizontal",
                           "gap": "md",
                           "children": [
                             {
-                              "type": "typography",
+                              "content": "Title",
                               "variant": "caption",
-                              "content": "Title"
+                              "type": "typography"
                             },
                             {
                               "type": "typography",
-                              "variant": "body",
-                              "content": "@entity.title"
+                              "content": "@entity.title",
+                              "variant": "body"
                             }
-                          ]
+                          ],
+                          "type": "stack",
+                          "direction": "horizontal"
                         },
                         {
-                          "type": "stack",
                           "direction": "horizontal",
-                          "gap": "md",
                           "children": [
                             {
                               "type": "typography",
-                              "variant": "caption",
-                              "content": "Content"
+                              "content": "Content",
+                              "variant": "caption"
                             },
                             {
-                              "type": "typography",
                               "variant": "body",
+                              "type": "typography",
                               "content": "@entity.content"
                             }
-                          ]
+                          ],
+                          "gap": "md",
+                          "type": "stack"
                         },
                         {
                           "type": "stack",
-                          "direction": "horizontal",
-                          "gap": "md",
                           "children": [
                             {
-                              "type": "typography",
                               "variant": "caption",
-                              "content": "Author"
+                              "content": "Author",
+                              "type": "typography"
                             },
                             {
                               "type": "typography",
                               "variant": "body",
                               "content": "@entity.author"
                             }
-                          ]
+                          ],
+                          "gap": "md",
+                          "direction": "horizontal"
                         },
                         {
-                          "type": "stack",
-                          "direction": "horizontal",
                           "gap": "md",
+                          "type": "stack",
                           "children": [
                             {
+                              "content": "Created At",
                               "type": "typography",
-                              "variant": "caption",
-                              "content": "Created At"
+                              "variant": "caption"
                             },
                             {
                               "type": "typography",
                               "variant": "body",
                               "content": "@entity.createdAt"
                             }
-                          ]
+                          ],
+                          "direction": "horizontal"
                         },
                         {
-                          "type": "stack",
-                          "direction": "horizontal",
                           "gap": "md",
                           "children": [
                             {
@@ -565,11 +743,13 @@
                               "content": "Likes"
                             },
                             {
-                              "type": "typography",
                               "variant": "body",
+                              "type": "typography",
                               "content": "@entity.likes"
                             }
-                          ]
+                          ],
+                          "direction": "horizontal",
+                          "type": "stack"
                         },
                         {
                           "type": "divider"
@@ -577,16 +757,16 @@
                         {
                           "type": "stack",
                           "direction": "horizontal",
-                          "gap": "sm",
-                          "justify": "end",
                           "children": [
                             {
-                              "type": "button",
-                              "label": "Close",
                               "event": "CLOSE",
-                              "variant": "ghost"
+                              "label": "Close",
+                              "variant": "ghost",
+                              "type": "button"
                             }
-                          ]
+                          ],
+                          "gap": "sm",
+                          "justify": "end"
                         }
                       ]
                     }
@@ -603,6 +783,13 @@
                     "modal",
                     null
                   ],
+                  [
+                    "render-ui",
+                    "main",
+                    {
+                      "type": "box"
+                    }
+                  ],
                   [
                     "notify",
                     "Cancelled",
@@ -619,18 +806,25 @@
                     "render-ui",
                     "modal",
                     null
+                  ],
+                  [
+                    "render-ui",
+                    "main",
+                    {
+                      "type": "box"
+                    }
                   ]
                 ]
               }
             ]
-          }
+          },
+          "scope": "collection"
         }
       ],
       "pages": [
         {
           "name": "FeedPage",
           "path": "/feed",
-          "isInitial": true,
           "traits": [
             {
               "ref": "PostBrowse"
@@ -658,8 +852,7 @@
           },
           {
             "name": "body",
-            "type": "string",
-            "default": ""
+            "type": "string"
           },
           {
             "name": "author",
@@ -668,12 +861,11 @@
           },
           {
             "name": "postId",
-            "type": "string",
-            "default": ""
+            "type": "string"
           },
           {
             "name": "createdAt",
-            "type": "date",
+            "type": "datetime",
             "default": ""
           }
         ]
@@ -681,18 +873,64 @@
       "traits": [
         {
           "name": "CommentBrowse",
-          "linkedEntity": "Comment",
           "category": "interaction",
+          "linkedEntity": "Comment",
+          "emits": [
+            {
+              "event": "CommentLoaded",
+              "description": "Fired when Comment finishes loading",
+              "scope": "internal",
+              "payload": [
+                {
+                  "name": "id",
+                  "type": "string",
+                  "required": true
+                },
+                {
+                  "name": "body",
+                  "type": "string"
+                },
+                {
+                  "name": "author",
+                  "type": "string"
+                },
+                {
+                  "name": "postId",
+                  "type": "string"
+                },
+                {
+                  "name": "createdAt",
+                  "type": "datetime"
+                }
+              ]
+            },
+            {
+              "event": "CommentLoadFailed",
+              "description": "Fired when Comment fails to load",
+              "scope": "internal",
+              "payload": [
+                {
+                  "name": "message",
+                  "type": "string"
+                }
+              ]
+            }
+          ],
           "listens": [
             {
               "event": "SEND",
               "triggers": "INIT",
-              "scope": "internal"
+              "source": {
+                "kind": "trait",
+                "trait": "CommentCompose"
+              }
             },
             {
               "event": "COMMENT",
               "triggers": "INIT",
-              "scope": "external"
+              "source": {
+                "kind": "any"
+              }
             }
           ],
           "stateMachine": {
@@ -708,21 +946,16 @@
                 "name": "Initialize"
               },
               {
-                "key": "COMPOSE",
-                "name": "COMPOSE"
+                "key": "CommentLoaded",
+                "name": "Comment loaded"
               },
               {
-                "key": "VIEW",
-                "name": "VIEW",
+                "key": "CommentLoadFailed",
+                "name": "Comment load failed",
                 "payload": [
                   {
-                    "name": "id",
-                    "type": "string",
-                    "required": true
-                  },
-                  {
-                    "name": "row",
-                    "type": "object"
+                    "name": "message",
+                    "type": "string"
                   }
                 ]
               }
@@ -741,13 +974,13 @@
                     "render-ui",
                     "main",
                     {
-                      "type": "dashboard-layout",
                       "appName": "SocialFeed",
+                      "type": "dashboard-layout",
                       "navItems": [
                         {
-                          "label": "Feed",
+                          "icon": "layout-list",
                           "href": "/feed",
-                          "icon": "layout-list"
+                          "label": "Feed"
                         },
                         {
                           "label": "Messages",
@@ -757,69 +990,59 @@
                       ],
                       "children": [
                         {
+                          "gap": "lg",
                           "type": "stack",
                           "direction": "vertical",
-                          "gap": "lg",
                           "className": "max-w-5xl mx-auto w-full",
                           "children": [
                             {
-                              "type": "stack",
-                              "direction": "horizontal",
-                              "gap": "md",
-                              "justify": "space-between",
                               "align": "center",
+                              "justify": "space-between",
+                              "type": "stack",
                               "children": [
                                 {
-                                  "type": "stack",
                                   "direction": "horizontal",
-                                  "gap": "sm",
                                   "align": "center",
+                                  "gap": "sm",
                                   "children": [
                                     {
-                                      "type": "icon",
                                       "name": "message-circle",
-                                      "size": "lg"
+                                      "size": "lg",
+                                      "type": "icon"
                                     },
                                     {
                                       "type": "typography",
                                       "content": "Messages",
                                       "variant": "h2"
                                     }
-                                  ]
+                                  ],
+                                  "type": "stack"
                                 },
                                 {
-                                  "type": "stack",
                                   "direction": "horizontal",
+                                  "type": "stack",
                                   "gap": "sm",
                                   "children": [
                                     {
-                                      "type": "button",
+                                      "variant": "primary",
                                       "label": "Compose",
+                                      "type": "button",
                                       "event": "COMPOSE",
-                                      "variant": "primary",
                                       "icon": "edit"
                                     }
                                   ]
                                 }
-                              ]
+                              ],
+                              "direction": "horizontal",
+                              "gap": "md"
                             },
                             {
                               "type": "divider"
                             },
                             {
                               "type": "data-list",
-                              "entity": "Comment",
                               "emptyIcon": "inbox",
-                              "emptyTitle": "No messages yet",
-                              "emptyDescription": "Start a new conversation.",
-                              "itemActions": [
-                                {
-                                  "label": "View",
-                                  "event": "VIEW",
-                                  "variant": "ghost",
-                                  "size": "sm"
-                                }
-                              ],
+                              "gap": "sm",
                               "columns": [
                                 {
                                   "name": "author",
@@ -832,12 +1055,22 @@
                                 },
                                 {
                                   "name": "createdAt",
-                                  "variant": "caption",
-                                  "format": "date"
+                                  "format": "date",
+                                  "variant": "caption"
                                 }
                               ],
-                              "variant": "card",
-                              "gap": "sm"
+                              "itemActions": [
+                                {
+                                  "variant": "ghost",
+                                  "event": "VIEW",
+                                  "label": "View",
+                                  "size": "sm"
+                                }
+                              ],
+                              "entity": "Comment",
+                              "emptyDescription": "Start a new conversation.",
+                              "emptyTitle": "No messages yet",
+                              "variant": "card"
                             }
                           ]
                         }
@@ -847,16 +1080,55 @@
                 ]
               }
             ]
-          }
+          },
+          "scope": "collection"
         },
         {
           "name": "CommentCompose",
-          "linkedEntity": "Comment",
           "category": "interaction",
+          "linkedEntity": "Comment",
           "emits": [
             {
-              "event": "SEND",
-              "scope": "internal"
+              "event": "SEND"
+            },
+            {
+              "event": "CommentLoaded",
+              "description": "Fired when Comment finishes loading",
+              "scope": "internal",
+              "payload": [
+                {
+                  "name": "id",
+                  "type": "string",
+                  "required": true
+                },
+                {
+                  "name": "body",
+                  "type": "string"
+                },
+                {
+                  "name": "author",
+                  "type": "string"
+                },
+                {
+                  "name": "postId",
+                  "type": "string"
+                },
+                {
+                  "name": "createdAt",
+                  "type": "datetime"
+                }
+              ]
+            },
+            {
+              "event": "CommentLoadFailed",
+              "description": "Fired when Comment fails to load",
+              "scope": "internal",
+              "payload": [
+                {
+                  "name": "message",
+                  "type": "string"
+                }
+              ]
             }
           ],
           "stateMachine": {
@@ -876,7 +1148,7 @@
               },
               {
                 "key": "COMPOSE",
-                "name": "Open"
+                "name": "Compose"
               },
               {
                 "key": "CLOSE",
@@ -884,12 +1156,25 @@
               },
               {
                 "key": "SEND",
-                "name": "Save",
+                "name": "Send",
                 "payload": [
                   {
                     "name": "data",
-                    "type": "object",
-                    "required": true
+                    "type": "string"
+                  }
+                ]
+              },
+              {
+                "key": "CommentLoaded",
+                "name": "Comment loaded"
+              },
+              {
+                "key": "CommentLoadFailed",
+                "name": "Comment load failed",
+                "payload": [
+                  {
+                    "name": "message",
+                    "type": "string"
                   }
                 ]
               }
@@ -916,23 +1201,21 @@
                     "modal",
                     {
                       "type": "stack",
-                      "direction": "vertical",
-                      "gap": "md",
                       "children": [
                         {
                           "type": "stack",
-                          "direction": "horizontal",
                           "gap": "sm",
+                          "direction": "horizontal",
                           "children": [
                             {
+                              "size": "md",
                               "type": "icon",
-                              "name": "edit",
-                              "size": "md"
+                              "name": "edit"
                             },
                             {
+                              "variant": "h3",
                               "type": "typography",
-                              "content": "New Comment",
-                              "variant": "h3"
+                              "content": "New Comment"
                             }
                           ]
                         },
@@ -940,18 +1223,20 @@
                           "type": "divider"
                         },
                         {
-                          "type": "form-section",
-                          "entity": "Comment",
-                          "mode": "create",
-                          "submitEvent": "SEND",
                           "cancelEvent": "CLOSE",
                           "fields": [
                             "body",
                             "author",
                             "postId"
-                          ]
+                          ],
+                          "mode": "create",
+                          "entity": "Comment",
+                          "submitEvent": "SEND",
+                          "type": "form-section"
                         }
-                      ]
+                      ],
+                      "gap": "md",
+                      "direction": "vertical"
                     }
                   ]
                 ]
@@ -966,6 +1251,13 @@
                     "modal",
                     null
                   ],
+                  [
+                    "render-ui",
+                    "main",
+                    {
+                      "type": "box"
+                    }
+                  ],
                   [
                     "notify",
                     "Cancelled",
@@ -988,20 +1280,63 @@
                     "render-ui",
                     "modal",
                     null
+                  ],
+                  [
+                    "render-ui",
+                    "main",
+                    {
+                      "type": "box"
+                    }
                   ]
                 ]
               }
             ]
-          }
+          },
+          "scope": "collection"
         },
         {
           "name": "CommentView",
-          "linkedEntity": "Comment",
           "category": "interaction",
+          "linkedEntity": "Comment",
           "emits": [
             {
-              "event": "SAVE",
-              "scope": "internal"
+              "event": "CommentLoaded",
+              "description": "Fired when Comment finishes loading",
+              "scope": "internal",
+              "payload": [
+                {
+                  "name": "id",
+                  "type": "string",
+                  "required": true
+                },
+                {
+                  "name": "body",
+                  "type": "string"
+                },
+                {
+                  "name": "author",
+                  "type": "string"
+                },
+                {
+                  "name": "postId",
+                  "type": "string"
+                },
+                {
+                  "name": "createdAt",
+                  "type": "datetime"
+                }
+              ]
+            },
+            {
+              "event": "CommentLoadFailed",
+              "description": "Fired when Comment fails to load",
+              "scope": "internal",
+              "payload": [
+                {
+                  "name": "message",
+                  "type": "string"
+                }
+              ]
             }
           ],
           "stateMachine": {
@@ -1021,12 +1356,11 @@
               },
               {
                 "key": "VIEW",
-                "name": "Open",
+                "name": "View",
                 "payload": [
                   {
                     "name": "id",
-                    "type": "string",
-                    "required": true
+                    "type": "string"
                   }
                 ]
               },
@@ -1036,12 +1370,19 @@
               },
               {
                 "key": "SAVE",
-                "name": "Save",
+                "name": "Save"
+              },
+              {
+                "key": "CommentLoaded",
+                "name": "Comment loaded"
+              },
+              {
+                "key": "CommentLoadFailed",
+                "name": "Comment load failed",
                 "payload": [
                   {
-                    "name": "data",
-                    "type": "object",
-                    "required": true
+                    "name": "message",
+                    "type": "string"
                   }
                 ]
               }
@@ -1067,34 +1408,35 @@
                     "fetch",
                     "Comment",
                     {
-                      "id": "@payload.id"
+                      "id": "@payload.id",
+                      "emit": {
+                        "success": "CommentLoaded",
+                        "failure": "CommentLoadFailed"
+                      }
                     }
                   ],
                   [
                     "render-ui",
                     "modal",
                     {
-                      "type": "stack",
-                      "direction": "vertical",
-                      "gap": "md",
                       "children": [
                         {
-                          "type": "stack",
-                          "direction": "horizontal",
-                          "gap": "sm",
-                          "align": "center",
                           "children": [
                             {
-                              "type": "icon",
                               "name": "eye",
-                              "size": "md"
+                              "size": "md",
+                              "type": "icon"
                             },
                             {
                               "type": "typography",
                               "variant": "h3",
                               "content": "@entity.body"
                             }
-                          ]
+                          ],
+                          "align": "center",
+                          "type": "stack",
+                          "gap": "sm",
+                          "direction": "horizontal"
                         },
                         {
                           "type": "divider"
@@ -1102,68 +1444,68 @@
                         {
                           "type": "stack",
                           "direction": "horizontal",
-                          "gap": "md",
                           "children": [
                             {
-                              "type": "typography",
                               "variant": "caption",
-                              "content": "Body"
+                              "content": "Body",
+                              "type": "typography"
                             },
                             {
+                              "content": "@entity.body",
                               "type": "typography",
-                              "variant": "body",
-                              "content": "@entity.body"
+                              "variant": "body"
                             }
-                          ]
+                          ],
+                          "gap": "md"
                         },
                         {
-                          "type": "stack",
-                          "direction": "horizontal",
-                          "gap": "md",
                           "children": [
                             {
-                              "type": "typography",
                               "variant": "caption",
-                              "content": "Author"
+                              "content": "Author",
+                              "type": "typography"
                             },
                             {
-                              "type": "typography",
+                              "content": "@entity.author",
                               "variant": "body",
-                              "content": "@entity.author"
+                              "type": "typography"
                             }
-                          ]
+                          ],
+                          "type": "stack",
+                          "gap": "md",
+                          "direction": "horizontal"
                         },
                         {
-                          "type": "stack",
                           "direction": "horizontal",
-                          "gap": "md",
                           "children": [
                             {
-                              "type": "typography",
                               "variant": "caption",
-                              "content": "Post ID"
+                              "content": "Post ID",
+                              "type": "typography"
                             },
                             {
                               "type": "typography",
-                              "variant": "body",
-                              "content": "@entity.postId"
+                              "content": "@entity.postId",
+                              "variant": "body"
                             }
-                          ]
+                          ],
+                          "type": "stack",
+                          "gap": "md"
                         },
                         {
-                          "type": "stack",
                           "direction": "horizontal",
                           "gap": "md",
+                          "type": "stack",
                           "children": [
                             {
+                              "content": "Created At",
                               "type": "typography",
-                              "variant": "caption",
-                              "content": "Created At"
+                              "variant": "caption"
                             },
                             {
-                              "type": "typography",
+                              "content": "@entity.createdAt",
                               "variant": "body",
-                              "content": "@entity.createdAt"
+                              "type": "typography"
                             }
                           ]
                         },
@@ -1171,20 +1513,23 @@
                           "type": "divider"
                         },
                         {
-                          "type": "stack",
-                          "direction": "horizontal",
                           "gap": "sm",
                           "justify": "end",
+                          "type": "stack",
+                          "direction": "horizontal",
                           "children": [
                             {
                               "type": "button",
-                              "label": "Close",
+                              "variant": "ghost",
                               "event": "CLOSE",
-                              "variant": "ghost"
+                              "label": "Close"
                             }
                           ]
                         }
-                      ]
+                      ],
+                      "type": "stack",
+                      "gap": "md",
+                      "direction": "vertical"
                     }
                   ]
                 ]
@@ -1199,6 +1544,13 @@
                     "modal",
                     null
                   ],
+                  [
+                    "render-ui",
+                    "main",
+                    {
+                      "type": "box"
+                    }
+                  ],
                   [
                     "notify",
                     "Cancelled",
@@ -1215,16 +1567,24 @@
                     "render-ui",
                     "modal",
                     null
+                  ],
+                  [
+                    "render-ui",
+                    "main",
+                    {
+                      "type": "box"
+                    }
                   ]
                 ]
               }
             ]
-          }
+          },
+          "scope": "collection"
         }
       ],
       "pages": [
         {
-          "name": "MessagesPage",
+          "name": "Messages",
           "path": "/messages",
           "traits": [
             {
@@ -1241,4 +1601,4 @@
       ]
     }
   ]
-}
+}