Marking progress on roadmap

lib/renderer/renderer.ts

@@ -1,4 +1,8 @@
-import { getRGBFromDecimalColor, makeSVGElement } from './utils';
+import {
+  getRGBFromDecimalColor,
+  makeSVGElement,
+  removeSortingInfo,
+} from './utils';
 import {
   ARROW_WIDTH,
   BORDER_WIDTH,
@@ -257,12 +261,17 @@ export class Renderer {
 
   __group__(control: any, container: any) {
     const controlName = control?.properties?.controlName;
+    const groupId = removeSortingInfo(controlName);
+    const isDone = localStorage.getItem(groupId) === 'done';
 
     let group = makeSVGElement(
       'g',
       {
         ...(controlName
-          ? { class: 'clickable-group', 'data-group-id': controlName }
+          ? {
+              class: `clickable-group ${isDone ? 'done' : ''}`,
+              'data-group-id': controlName,
+            }
           : {}),
       },
       container

lib/renderer/utils.ts

@@ -1,3 +1,7 @@
+export function removeSortingInfo(groupId: string) {
+  return (groupId || '').replace(/^\d+-/, '');
+}
+
 export function getRGBFromDecimalColor(color: number) {
   let red = (color >> 16) & 0xff;
   let green = (color >> 8) & 0xff;