Inspiration
I was using Airtable in a POC to pitch to my colleagues when I realised that while powerful, self-related tables are difficult to navigate and update. Especially if similar names are used at various different places in the tree. It is not possible to know a records exact place in the tree by looking at it in grid view.
What it does
Hierarchy presents a self related table as a drill-down list of siblings - you only ever see records that has the same parent. It provides a trace route of breadcrumbs links to all the branches the user clicked on. At any level you can quickly add a new child to a parent, knowing it is in the correct spot - no guessing. There is also pruning and grafting capabilities, that helps to make sure that your self-related table's data is clean and accurate.
How I built it
I did the tutorial and then dove straight in. I wanted to build it with just basic javascript with the Airtable api so that it is fast.
Challenges I ran into
I am not that familiar with JavaScript and React so getting the finicky syntax of colons, braces etc was a challenge. Also figuring out what in the code is causing an error is not always obvious or intuitive.
Accomplishments that I'm proud of
I think the whole block is quite an accomplishment, from navigation, to building the breadcrumbs, adding new records and pruning and grafting.
What I learned
To be patient with JavaScript.
What's next for Hierarchy
On the GitHub page I have a roadmap of where I think Hierarchy can go. Linked record lists, Customised display card, Roll-up values and Branch templates, to name a few.
Log in or sign up for Devpost to join the conversation.