⚒️New Rules PoC - Spike into Keystatic

[JackDevAU]

Cc: @adamcogan,@bradystroud, @BrookJeynes, @Aibono1225

Hi Team,

Pain

Rules uses a lot of old unmaintained packages and is currently relying on a lot of old technology due to these. The project is also written with JS, which makes it an on going pain when trying to maintain this project and add new features.

What code could be improved?

Lets update to the latest Gatsby, move to TS and find new alternatives to the unmaintained packages/Gatsby plugins.

Tasks

• [ ] Update Gatsby to latest
• [ ] Convert project to use TS
• [ ] Find alternative gatsby plugins
• [ ] Remove Netlify and replace with Decap CMS or an even better solution?

More Information

--- Update ---

Improving the current rules has been ruled as a waste of man power. As such a quick PoC has been spun up with next.js and Keystatic.

Screenshots

Thanks!

[JackDevAU]

Timebox to ~3 days

[JackDevAU]

CC: @adamcogan @BrookJeynes @Aibono1225 @bradystroud

As per my conversation with Brady and the Rules team, I have been looking into replacements to the current Rules engine.

This is due to a number of factors,

• Tech Debt - Current implementation uses GatsbyJS - that is becoming harder and harder to maintain
• Tech Debt - Gatsby plugins - a lot of these are made by 3rd parties and are not maintained
• Tech Debt - Packages that we rely on heavily haven't been maintained for up to 10+ years.
• Language - JavaScript - Harder to spot errors and work with external packages
• Build Time - The build time of Gatsby is nearly 1 hour. This should be minutes max.

I have looked into the following,

DecapCMS (Our current CMS implementation)

❌Development is slow ❌Critical bugs haven't been fixed for over a year ✅Yes to GitHub green squares ✅Anyone with a GitHub account has access to an editor

Keystatic - A GitHub or local CMS. (Recommended ✅)

❌Relatively new product ✅GitHub green squares ✅Anyone with a GitHub account has access to a nice editor

TinaCMS - We use this for the Website and while it works amazing for a closed content repo, for a solution like Rules this wouldn't be viable.

❌No GitHub green squares ❌Only a select few people can make edits via the editor ❌Users cost money ✅Editor is top notch ✅Familiar editing experience

And a bunch of others.. 99% of these are headless CMS - i.e. using their own hosting services and UI - meaning they wouldn't be suitable for Rules as we would need to allow users to have access to our content via their service. This could cost us $$

Figure: Other popular CMS

Proof of Concept

For the PoC I have chosen Next.js + Keystatic. The acceptance criteria are the following,

• Can handle 3,000+ rules
• Must have a good editor experience
• Must connect to GitHub + Green squares for users
• Better rules and categories management system (Rename rules + categories)
• Must have a Home page
• Must have a Categories page
• Must have a rules page
• Migrate old rules

[JackDevAU]

CC: @adamcogan @bradystroud @BrookJeynes

Hi Team,

The Proof of Concept is feature complete and has passed all but 1 remaining acceptance criteria.

• [x] Can handle 3,000+ rules
• [x] Must have a good editor experience
• [x] Must connect to GitHub + Green squares for users
• [x] Better rules and categories management system (Rename rules + categories)
• [x] Must have a Home page
• [x] Must have a Categories page
• [x] Must have a rules page
• [x] Migrate old rules

To note with just over 3,000 simple rules (Markdown + image) the build time is around 2 minutes. (This is a full build of all pages)

Screenshots (Styling still a work in progress)

Figure: Home page

Figure: Rule page

Figure: Category page

[JackDevAU]

Closing - I have spiked into Keystatic for a PoC and found that the product is too new with a bunch of issues that are getting fixed but currently make the experience unviable for Rules.