Ensure worldbuilding changes are working on legacy worldbuilding world and adjust attribute form styling

module/actor-sheet.js

@@ -36,17 +36,16 @@ export class SimpleActorSheet extends ActorSheet {
     data.data.ungroupedAttributes = {};
 
     // Build an array of sorted group keys.
-    let groupKeys = Object.keys(data.data.groups).sort((a, b) => {
+    const groups = data.data.groups || {};
-      // Attempt to sort by the label, but fall back to the key.
+    let groupKeys = Object.keys(groups).sort((a, b) => {
-      let aSort = data.data.groups[a].label ? data.data.groups[a].label : a;
+      let aSort = groups[a].label ?? a;
-      let bSort = data.data.groups[b].label ? data.data.groups[b].label : b;
+      let bSort = groups[b].label ?? b;
       return aSort.localeCompare(bSort);
     });
 
-    // Iterate over the sorted groups to add their attributes..
+    // Iterate over the sorted groups to add their attributes.
-    groupKeys.forEach(key => {
+    for ( let key of groupKeys ) {
-      // Retrieve the group.
+      let group = data.data.attributes[key] || {};
-      let group = data.data.attributes[key];
 
       // Initialize the attributes container for this group.
       if ( !data.data.groups[key]['attributes'] ) data.data.groups[key]['attributes'] = {};
@@ -58,7 +57,7 @@ export class SimpleActorSheet extends ActorSheet {
         group[attr]['isResource'] = group[attr]['dtype'] === 'Resource';
         data.data.groups[key]['attributes'][attr] = group[attr];
       });
-    });
+    }
 
     // Sort the remaining attributes attributes.
     Object.keys(data.data.attributes).filter(a => !groupKeys.includes(a)).sort((a, b) => a.localeCompare(b)).forEach(key => {

module/actor.js

@@ -4,6 +4,15 @@
  */
 export class SimpleActor extends Actor {
 
+  /** @override */
+  prepareData() {
+    super.prepareData();
+    this.data.data.groups = this.data.data.groups || {};
+    this.data.data.attributes = this.data.data.attributes || {};
+  }
+
+  /* -------------------------------------------- */
+
   /** @override */
   getRollData() {
     const data = super.getRollData();

styles/simple.css

@@ -150,21 +150,15 @@
   position: sticky;
   top: 0;
   left: 0;
-  right: 0;
+  align-items: center;
-  padding: 5px;
+  padding: 0 5px;
   margin: 5px 0;
   background: #cfcdc2;
   border: 1px solid #AAA;
   border-radius: 2px;
-  text-align: center;
+  text-align: left;
   font-weight: bold;
 }
-.worldbuilding .attributes-header .attribute-label {
-  flex: 1.5;
-}
-.worldbuilding .attributes-header .attribute-control {
-  flex: 0 0 20px;
-}
 .worldbuilding .attributes-list {
   list-style: none;
   margin: 0;
@@ -199,20 +193,24 @@
 .worldbuilding .group-header input[type="text"]:focus::placeholder {
   opacity: 1;
 }
+.worldbuilding .group-controls {
+  margin: 5px;
+}
 .worldbuilding .groups-list {
   list-style: none;
   margin: 0;
   padding: 0;
 }
 .worldbuilding .group {
-  margin: 20px 0;
+  margin: 5px 0 0;
   padding: 0;
 }
 .worldbuilding .group-header {
+  align-items: center;
   background: rgba(0, 0, 0, 0.05);
   border: 1px solid #AAA;
   border-radius: 2px;
-  padding: 5px;
+  padding: 2px 5px;
 }
 .worldbuilding .group-key,
 .worldbuilding .group-label {
@@ -224,12 +222,15 @@
   margin-right: 6px;
 }
 .worldbuilding .group-key {
-  flex: 0 0 126px;
   opacity: 0.75;
 }
+.worldbuilding .group-label {
+  flex: 2;
+}
 .worldbuilding .group-dtype {
+  height: 24px;
+  flex: 0 0 116px;
   margin: 0 5px;
-  flex: 0;
 }
 .worldbuilding.sheet.actor {
   min-width: 560px;

styles/simple.less

@@ -172,22 +172,14 @@
     position: sticky;
     top: 0;
     left: 0;
-    right: 0;
+    align-items: center;
-    padding: 5px;
+    padding: 0 5px;
     margin: 5px 0;
     background: #cfcdc2;
     border: 1px solid #AAA;
     border-radius: 2px;
-    text-align: center;
+    text-align: left;
     font-weight: bold;
-
-    .attribute-label {
-      flex: 1.5;
-    }
-
-    .attribute-control {
-      flex: 0 0 20px;
-    }
   }
 
   .attributes-list {
@@ -235,6 +227,10 @@
     }
   }
 
+  .group-controls {
+    margin: 5px;
+  }
+
   .groups-list {
     list-style: none;
     margin: 0;
@@ -242,15 +238,16 @@
   }
 
   .group {
-    margin: 20px 0;
+    margin: 5px 0 0;
     padding: 0;
   }
 
   .group-header {
+    align-items: center;
     background: rgba(0, 0, 0, 0.05);
     border: 1px solid #AAA;
     border-radius: 2px;
-    padding: 5px;
+    padding: 2px 5px;
   }
 
   .group-key,
@@ -264,13 +261,17 @@
   }
 
   .group-key {
-    flex: 0 0 126px;
     opacity: 0.75;
   }
 
+  .group-label {
+    flex: 2;
+  }
+
   .group-dtype {
+    height: 24px;
+    flex: 0 0 116px;
     margin: 0 5px;
-    flex: 0;
   }
 }