♻️ Add static CSS class names (#699)

src/components/Dashboard/Tiles/Apps/AppTile.tsx

@@ -33,9 +33,10 @@ export const AppTile = ({ className, app }: AppTileProps) => {
           justify="space-around"
           align="center"
           style={{ height: '100%', width: '100%' }}
+          className="dashboard-tile-app"
         >
           <Box hidden={false}>
-            <Title order={5} size="md" ta="center" lineClamp={1} className={classes.appName}>
+            <Title order={5} size="md" ta="center" lineClamp={1} className={cx(classes.appName, 'dashboard-tile-app-title')}>
               {app.name}
             </Title>
           </Box>

src/components/Dashboard/Tiles/HomarrCardWrapper.tsx

@@ -18,7 +18,7 @@ export const HomarrCardWrapper = ({ ...props }: HomarrCardWrapperProps) => {
   return (
     <Card
       {...restProps}
-      className={cx(restProps.className, cardClass)}
+      className={cx(restProps.className, cardClass, 'dashboard-gs-generic-item')}
       withBorder
       style={{ cursor: isEditMode ? 'move' : 'default' }}
       radius="lg"

src/components/Dashboard/Wrappers/Category/Category.tsx

@@ -16,7 +16,7 @@ export const DashboardCategory = ({ category }: DashboardCategoryProps) => {
   const { refs, apps, widgets } = useGridstack('category', category.id);
   const isEditMode = useEditModeStore((x) => x.enabled);
   const { config } = useConfigContext();
-  const { classes: cardClasses } = useCardStyles(true);
+  const { classes: cardClasses, cx } = useCardStyles(true);
 
   const categoryList = config?.categories.map((x) => x.name) ?? [];
   const [toggledCategories, setToggledCategories] = useLocalStorage({
@@ -28,7 +28,7 @@ export const DashboardCategory = ({ category }: DashboardCategoryProps) => {
   return (
     <Accordion
       classNames={{
-        item: cardClasses.card,
+        item: cx(cardClasses.card, 'dashboard-gs-category'),
       }}
       mx={10}
       chevronPosition="left"