feat: allow to change order of sections on main page

closes #445

src/lib/config.ts

@@ -13,4 +13,7 @@ if (userConfig.labels)
 if (userConfig.toggles)
   config.toggles = { ...defaultConfig.toggles, ...userConfig.toggles };
 
+if (userConfig.sections)
+  config.sections = { ...defaultConfig.sections, ...userConfig.sections };
+
 export default config;

src/lib/data.ts

@@ -12,6 +12,10 @@ export function getToggle(key: keyof typeof config.toggles) {
   return config.toggles[key] || false;
 }
 
+export function getSections() {
+  return config.sections;
+}
+
 export function getAppName() {
   return getLabel("title");
 }

src/pages/index.tsx

@@ -10,6 +10,7 @@ import {
   getQuadrants,
   getReleases,
   getRings,
+  getSections,
   getTags,
   getToggle,
 } from "@/lib/data";
@@ -20,6 +21,7 @@ const Home: CustomPage = () => {
   const tag = router.query.tag as string | undefined;
   const appName = getAppName();
   const chartConfig = getChartConfig();
+  const sections = getSections();
   const version = getReleases().length;
   const rings = getRings();
   const quadrants = getQuadrants();
@@ -36,18 +38,32 @@ const Home: CustomPage = () => {
           Version #{version}
         </span>
       </h1>
-      {getToggle("showChart") && (
-        <Radar
-          size={chartConfig.size}
-          quadrants={quadrants}
-          rings={rings}
-          items={items}
-        />
-      )}
-      {getToggle("showTagFilter") && tags.length > 0 && (
-        <Tags tags={tags} activeTag={tag} />
-      )}
-      {getToggle("showQuadrantList") && <QuadrantList items={items} />}
+      {sections.map((section) => {
+        switch (section) {
+          case "radar":
+            return (
+              getToggle("showChart") && (
+                <Radar
+                  size={chartConfig.size}
+                  quadrants={quadrants}
+                  rings={rings}
+                  items={items}
+                />
+              )
+            );
+          case "tags":
+            return (
+              getToggle("showTagFilter") &&
+              tags.length > 0 && <Tags tags={tags} activeTag={tag} />
+            );
+          case "list":
+            return (
+              getToggle("showQuadrantList") && <QuadrantList items={items} />
+            );
+          default:
+            return null;
+        }
+      })}
     </>
   );
 };