Fabric: Improved printing of Yoga's Edges data structure

Summary:
Yoga represents concepts like `margin`, `padding` and `position` as `edges` (aka std::array<YGValue, YGEdgeCount>).
This diff improves conversion of this data structure to string (primarily for debugging purposes).

Reviewed By: fkgozali

Differential Revision: D7958241

fbshipit-source-id: 6931c7b5d2395c28821c8daef62f609b13f112c6

ReactCommon/fabric/view/conversions.h

@@ -337,16 +337,25 @@ inline std::string toString(const std::array<YGValue, YGDimensionCount> &value)
 }
 
 inline std::string toString(const std::array<YGValue, YGEdgeCount> &value) {
-  return "{" +
-    toString(value[0]) + ", " +
-    toString(value[1]) + ", " +
-    toString(value[2]) + ", " +
-    toString(value[3]) + ", " +
-    toString(value[4]) + ", " +
-    toString(value[5]) + ", " +
-    toString(value[6]) + ", " +
-    toString(value[7]) + ", " +
-    toString(value[8]) + "}";
+  static std::array<std::string, YGEdgeCount> names = {
+    {"left", "top", "right", "bottom", "start", "end", "horizontal", "vertical", "all"}
+  };
+
+  std::string result;
+  std::string separator = ", ";
+
+  for (int i = 0; i < YGEdgeCount; i++) {
+    if (value[i].unit == YGUnitUndefined) {
+      continue;
+    }
+    result += names[i] + ": " + toString(value[i]) + separator;
+  }
+
+  if (!result.empty()) {
+    result.erase(result.length() - separator.length());
+  }
+
+  return "{" + result + "}";
 }
 
 } // namespace react