The requirements
My application has hierarchical contexts which are configured via JSON properties.
Those are overlaid to create a single JSON properties file.
Properties can be inherited or overridden based on parent/child relationships.
The user can view or edit the properties within each context.
When working in a context that has a parent, the user needs to see properties that are inherited or overridden.
Example properties files
The source properties, each in it's own context, may look like this:
// Root
{
"A": "init_a_value",
"B": {
"C": "init_c_value"
}
}
// Child of Root
{
"A": "override_a_value",
}
// Leaf of Root
{
"B": {
"D": "add_d_value"
}
}
When that is all rolled together (or "composed"), you get this consolidated result:
// Leaf Composed
{
"A": "override_a_value",
"B": {
"C": "init_c_value",
"D": "add_d_value"
}
}
The challenge
When the user is editing properties for each context …
How can we make these factors clear?
- Hierarchical relationships
- Inheritance
- Overrides
What we've tried
One idea:
- Visually flatten the parent/child relationships into dot-separated notation.
- Show two tables: Inherited (read-only) properties and editable properties at the current context.
In practice, it could look like this:
+----------------------------------------+
# INHERITED #
+-----+---------------+------------------+
| KEY | SOURCE | VALUE |
+-----+---------------+------------------+
| A | Child of Root | override_a_value |
| B.C | Root | init_c_value |
+-----+---------------+------------------+
+-------------------+
# EDITABLE #
+-----+-------------+
| KEY | VALUE |
+-----+-------------+
| B.D | add_d_value |
+-----+-------------+
[ + Add new property ]
We could also cross-out an inherited property that the current context itself overrides to show the side effect of adding a property that already exists.
Bottom line
Is there a clearer way to display this data?
Does anyone know of any examples of this in action?
