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: , + label: 'Configuration schema version', + content: ( + + {configVersion} + + ), + }, + { + icon: , + label: 'Available configurations', + content: ( + + {configs.length} + + ), + }, { icon: , label: 'version', @@ -199,6 +223,7 @@ const useInformationTableItems = (newVersionAvailable?: string): InformationTabl ), }, + ...items, ]; return items;