Add icon prop to BaseCard

src/apps/dashboard/components/BaseCard.tsx

@@ -6,7 +6,6 @@ import CardMedia from '@mui/material/CardMedia';
 import IconButton from '@mui/material/IconButton';
 import Typography from '@mui/material/Typography';
 import MoreVertIcon from '@mui/icons-material/MoreVert';
-import ExtensionIcon from '@mui/icons-material/Extension';
 import { getDefaultBackgroundClass } from 'components/cardbuilder/cardBuilderUtils';
 import CardActionArea from '@mui/material/CardActionArea';
 
@@ -14,13 +13,14 @@ interface IProps {
     title?: string;
     text?: string;
     image?: string | null;
+    icon?: React.ReactNode;
     onClick?: () => void;
     action?: boolean;
     actionRef: React.MutableRefObject<HTMLButtonElement | null>;
     onActionClick?: () => void;
 };
 
-const BaseCard = ({ title, text, image, onClick, action, actionRef, onActionClick }: IProps) => {
+const BaseCard = ({ title, text, image, icon, onClick, action, actionRef, onActionClick }: IProps) => {
     return (
         <Card
             sx={{
@@ -47,7 +47,7 @@ const BaseCard = ({ title, text, image, onClick, action, actionRef, onActionClic
                         alignItems: 'center',
                         justifyContent: 'center'
                     }}>
-                        <ExtensionIcon sx={{ width: 80, height: 80 }} />
+                        {icon}
                     </Box>
                 )}
             </CardActionArea>

src/apps/dashboard/features/plugins/components/PluginCard.tsx

@@ -11,6 +11,7 @@ import Settings from '@mui/icons-material/Settings';
 import Delete from '@mui/icons-material/Delete';
 import CheckCircleOutlineIcon from '@mui/icons-material/CheckCircleOutline';
 import BlockIcon from '@mui/icons-material/Block';
+import ExtensionIcon from '@mui/icons-material/Extension';
 import ListItemText from '@mui/material/ListItemText';
 import { PluginStatus } from '@jellyfin/sdk/lib/generated-client/models/plugin-status';
 import type { ConfigurationPageInfo } from '@jellyfin/sdk/lib/generated-client/models/configuration-page-info';
@@ -80,6 +81,7 @@ const PluginCard = ({ plugin, configurationPage }: IProps) => {
                 title={plugin.Name}
                 text={`${globalize.translate('LabelStatus')} ${plugin.Status}`}
                 image={plugin.HasImage ? api?.getUri(`/Plugins/${plugin.Id}/${plugin.Version}/Image`) : null}
+                icon={<ExtensionIcon sx={{ width: 80, height: 80 }} />}
                 action={true}
                 actionRef={actionRef}
                 onClick={navigateToPluginSettings}