From 5563c5bc6f0c5a5b5f3d7e4feed2581d17b49c85 Mon Sep 17 00:00:00 2001
From: Arnei <arnewilken@yahoo.de>
Date: Tue, 2 Jul 2024 16:58:19 +0200
Subject: [PATCH] Add typing to ModalNavigation

Adds typescript to the ModalNavigation component.
---
 .../partials/wizard/ThemeDetails.tsx             |  6 ++++++
 src/components/shared/modals/ModalNavigation.tsx | 16 +++++++++++-----
 2 files changed, 17 insertions(+), 5 deletions(-)

diff --git a/src/components/configuration/partials/wizard/ThemeDetails.tsx b/src/components/configuration/partials/wizard/ThemeDetails.tsx
index c5849261ba..08c188bb75 100644
--- a/src/components/configuration/partials/wizard/ThemeDetails.tsx
+++ b/src/components/configuration/partials/wizard/ThemeDetails.tsx
@@ -48,31 +48,37 @@ const ThemeDetails : React.FC<{
 			name: "generalForm",
 			tabTranslation: "CONFIGURATION.THEMES.DETAILS.GENERAL.CAPTION",
 			translation: "CONFIGURATION.THEMES.DETAILS.GENERAL.CAPTION",
+			accessRole: "ROLE_UI_THEMES_EDIT",
 		},
 		{
 			name: "bumperForm",
 			tabTranslation: "CONFIGURATION.THEMES.DETAILS.BUMPER.CAPTION",
 			translation: "CONFIGURATION.THEMES.DETAILS.BUMPER.CAPTION",
+			accessRole: "ROLE_UI_THEMES_EDIT",
 		},
 		{
 			name: "trailerForm",
 			tabTranslation: "CONFIGURATION.THEMES.DETAILS.TRAILER.CAPTION",
 			translation: "CONFIGURATION.THEMES.DETAILS.TRAILER.CAPTION",
+			accessRole: "ROLE_UI_THEMES_EDIT",
 		},
 		{
 			name: "titleSlideForm",
 			tabTranslation: "CONFIGURATION.THEMES.DETAILS.TITLE.CAPTION",
 			translation: "CONFIGURATION.THEMES.DETAILS.TITLE.CAPTION",
+			accessRole: "ROLE_UI_THEMES_EDIT",
 		},
 		{
 			name: "watermarkForm",
 			tabTranslation: "CONFIGURATION.THEMES.DETAILS.WATERMARK.CAPTION",
 			translation: "CONFIGURATION.THEMES.DETAILS.WATERMARK.CAPTION",
+			accessRole: "ROLE_UI_THEMES_EDIT",
 		},
 		{
 			name: "usage",
 			tabTranslation: "CONFIGURATION.THEMES.DETAILS.USAGE.CAPTION",
 			translation: "CONFIGURATION.THEMES.DETAILS.USAGE.CAPTION",
+			accessRole: "ROLE_UI_THEMES_EDIT",
 		},
 	];
 
diff --git a/src/components/shared/modals/ModalNavigation.tsx b/src/components/shared/modals/ModalNavigation.tsx
index 456c6d1dc1..f17cf053f8 100644
--- a/src/components/shared/modals/ModalNavigation.tsx
+++ b/src/components/shared/modals/ModalNavigation.tsx
@@ -9,10 +9,17 @@ import { useAppSelector } from "../../../store";
  * This component renders the navigation in details modals
  */
 const ModalNavigation = ({
-    tabInformation,
-    page,
-    openTab,
-}: any) => {
+	tabInformation,
+	page,
+	openTab,
+}: {
+	tabInformation: {
+		accessRole: string,
+		tabTranslation: string
+	}[],
+	page: number,
+	openTab: (key: number) => unknown,
+}) => {
 	const { t } = useTranslation();
 
 	const user = useAppSelector(state => getUserInformation(state));
@@ -20,7 +27,6 @@ const ModalNavigation = ({
 	return (
 		<nav className="modal-nav" id="modal-nav">
 			{tabInformation.map(
-// @ts-expect-error TS(7006): Parameter 'tab' implicitly has an 'any' type.
 				(tab, key) =>
 					hasAccess(tab.accessRole, user) && (
 						<button