From 5abe28e69e92df3eccd210d00dc2905c51792146 Mon Sep 17 00:00:00 2001
From: Manuel Ruwe <manuel.ruwe@bluewin.ch>
Date: Fri, 23 Dec 2022 17:57:05 +0100
Subject: [PATCH] =?UTF-8?q?=E2=9C=A8=20Add=20configuration=20info=20in=20a?=
 =?UTF-8?q?bout=20modal?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/About/AboutModal.tsx | 27 ++++++++++++++++++++++++++-
 1 file changed, 26 insertions(+), 1 deletion(-)

diff --git a/src/components/About/AboutModal.tsx b/src/components/About/AboutModal.tsx
index f4f2bc7e8..0a29bf330 100644
--- a/src/components/About/AboutModal.tsx
+++ b/src/components/About/AboutModal.tsx
@@ -15,7 +15,9 @@ import {
 import {
   IconBrandDiscord,
   IconBrandGithub,
+  IconFile,
   IconLanguage,
+  IconSchema,
   IconVersions,
   IconVocabulary,
   IconWorldWww,
@@ -26,6 +28,8 @@ import { i18n, Trans, useTranslation } from 'next-i18next';
 import Image from 'next/image';
 import { ReactNode } from 'react';
 import { CURRENT_VERSION } from '../../../data/constants';
+import { useConfigContext } from '../../config/provider';
+import { useConfigStore } from '../../config/store';
 import { usePrimaryGradient } from '../layout/useGradient';
 
 interface AboutModalProps {
@@ -127,6 +131,9 @@ const useInformationTableItems = (newVersionAvailable?: string): InformationTabl
   // TODO: Fix this to not request. Pass it as a prop.
   const colorGradiant = usePrimaryGradient();
 
+  const { configVersion } = useConfigContext();
+  const { configs } = useConfigStore();
+
   let items: InformationTableItem[] = [];
 
   if (i18n !== null) {
@@ -157,7 +164,24 @@ const useInformationTableItems = (newVersionAvailable?: string): InformationTabl
   }
 
   items = [
-    ...items,
+    {
+      icon: <IconSchema size={20} />,
+      label: 'Configuration schema version',
+      content: (
+        <Badge variant="gradient" gradient={colorGradiant}>
+          {configVersion}
+        </Badge>
+      ),
+    },
+    {
+      icon: <IconFile size={20} />,
+      label: 'Available configurations',
+      content: (
+        <Badge variant="gradient" gradient={colorGradiant}>
+          {configs.length}
+        </Badge>
+      ),
+    },
     {
       icon: <IconVersions size={20} />,
       label: 'version',
@@ -199,6 +223,7 @@ const useInformationTableItems = (newVersionAvailable?: string): InformationTabl
         </Group>
       ),
     },
+    ...items,
   ];
 
   return items;