More typing

src/pages/settings/components/Theming/ThemePlaylistCard.tsx

@@ -11,10 +11,19 @@ import { useDisclosure } from '@mantine/hooks';
 import { useCommonHooks, useMutationAPI } from 'hooks';
 import { useState } from 'react';
 import { FiEdit, FiRefreshCcw, FiTrash } from 'react-icons/fi';
+import type { Theme, ThemePlaylist } from 'types';
 import DeleteItemModal from '../Shared/DeleteItemModal';
 import ThemeMiniCard from './ThemeMiniCard';
 
-function ThemePlaylistCard({ cardPlaylist, handleOpen, allThemes }: any) {
+function ThemePlaylistCard({
+	cardPlaylist,
+	handleOpen,
+	allThemes,
+}: {
+	cardPlaylist: any;
+	handleOpen: (cardPlaylist: ThemePlaylist) => void;
+	allThemes: Theme[];
+}) {
 	const [hover, setHover] = useState(false);
 	const { setThemeName, setCurrentThemePlaylist, theme, handleDelete } = useCommonHooks();
 	const syncableLists = ['All', 'Backgrounds', 'No Backgrounds'];
@@ -36,7 +45,7 @@ function ThemePlaylistCard({ cardPlaylist, handleOpen, allThemes }: any) {
 		>
 			<DeleteItemModal
 				modalOpened={modalOpened}
-				closeModal={closeModal}
+				handleClose={closeModal}
 				title='Delete Theme Playlist'
 				body={
 					<Stack gap={0} w={'100%'} h={'150px'} align='center'>
@@ -120,7 +129,7 @@ function ThemePlaylistCard({ cardPlaylist, handleOpen, allThemes }: any) {
 								body: {
 									id: cardPlaylist.id,
 									name: 'All',
-									themeList: JSON.stringify(allThemes.map((theme: any) => theme.id)),
+									themeList: JSON.stringify(allThemes.map((theme: Theme) => theme.id)),
 								},
 							});
 						}
@@ -134,9 +143,9 @@ function ThemePlaylistCard({ cardPlaylist, handleOpen, allThemes }: any) {
 									themeList: JSON.stringify(
 										allThemes
 											.filter(
-												(theme: any) => theme.backgroundImage.toLowerCase() !== 'none',
+												(theme: Theme) => theme.backgroundImage.toLowerCase() !== 'none',
 											)
-											.map((theme: any) => theme.id),
+											.map((theme: Theme) => theme.id),
 									),
 								},
 							});
@@ -151,9 +160,9 @@ function ThemePlaylistCard({ cardPlaylist, handleOpen, allThemes }: any) {
 									themeList: JSON.stringify(
 										allThemes
 											.filter(
-												(theme: any) => theme.backgroundImage.toLowerCase() === 'none',
+												(theme: Theme) => theme.backgroundImage.toLowerCase() === 'none',
 											)
-											.map((theme: any) => theme.id),
+											.map((theme: Theme) => theme.id),
 									),
 								},
 							});
@@ -243,7 +252,7 @@ function ThemePlaylistCard({ cardPlaylist, handleOpen, allThemes }: any) {
 							<ScrollArea h={'255px'} w={'100%'} style={{ zIndex: 2 }}>
 								<Stack gap={4}>
 									{themeList.length > 0 &&
-										themeList.map((item: any) => {
+										themeList.map((item: number) => {
 											return (
 												<ThemeMiniCard key={item} item={item} allThemes={allThemes} />
 											);