Revert "feat(homepage): add dual mount point system for extensible homepage f…" (#1752)

This reverts commit 8f47cd6.

Author: christoph-jerolimov

workspaces/homepage/.changeset/add-dual-mount-point-system.md

@@ -38,48 +38,16 @@ Cards commonly uses the [InfoCard](https://backstage.io/storybook/?path=/story/l
    );
    ```
 
-3. And finally, users can add them to their `app-config` to expose the component as mount point `home.page/cards` (for default cards) or `home.page/widgets` (for additional plugin cards):
+3. And finally, users can add them to their `app-config` to expose the component as mount point `home.page/cards`:
 
    ```yaml
    dynamicPlugins:
      frontend:
        your-plugin-id:
          mountPoints:
-           # For default cards that appear by default
            - mountPoint: home.page/cards
              importName: YourHomePageCard
              config:
-               title: 'My Custom Card' # Title for "Add widget" dialog
-               description: 'Description of what it does' # Description for dialog
-               layout: ...
-               props: ...
-           # For additional cards contributed by plugins
-           - mountPoint: home.page/widgets
-             importName: YourAdditionalCard
-             config:
-               title: 'Plugin Card' # Title for "Add widget" dialog
-               description: 'Card from external plugin' # Description for dialog
-               priority: 10 # Optional: higher priority appears first
                layout: ...
                props: ...
    ```
-
-## Configuration Options
-
-### Metadata (for "Add widget" dialog)
-
-- **`title`** (optional): Display name shown in the "Add widget" dialog
-- **`description`** (optional): Description text shown in the "Add widget" dialog
-
-If `title` and `description` are not provided in config, the component will appear in the "Add widget" dialog with its component name or without description.
-
-### Layout and Behavior
-
-- **`priority`** (optional): Number to control display order (higher priority appears first)
-- **`layouts`**: Responsive layout configuration for different screen sizes
-- **`props`**: Properties passed to the component
-
-## Mount Points
-
-- **`home.page/cards`** - Default homepage cards that appear by default
-- **`home.page/widgets`** - Additional cards contributed by other plugins that appear alongside default cards

workspaces/homepage/docs/create-a-new-card.md

@@ -11,15 +11,6 @@ The plugin provides two main components:
 - **`DynamicHomePage`** - A read-only homepage that displays configured cards without user customization
 - **`DynamicCustomizableHomePage`** - An interactive homepage that allows users to add, remove, move, and resize cards
 
-## Mount Points
-
-The plugin supports two mount points for extensibility:
-
-- **`home.page/cards`** - Default homepage cards that appear by default and are used for "restore defaults" functionality
-- **`home.page/widgets`** - Additional cards contributed by other plugins that appear alongside default cards
-
-Cards from both mount points are displayed together, with optional priority-based ordering.
-
 ## Default home page
 
 The default home page shows a "Onboarding Section" card, a "Entity Section" card, and a "Template Section" card by default.

workspaces/homepage/docs/defaults.md

@@ -1,38 +1,8 @@
-# RHDH Home Page plugin
+# RHDH Home Page pluginpage
 
 The RHDH home page plugin is based on the upstream [home plugin](https://github.com/backstage/backstage/blob/master/plugins/home/README.md).
 
-It allows primarily **admins** to customize the homepage in the `app-config`, and plugin authors to extend the home page with additional cards or content.
-
-## Key Features
-
-- **Dual Mount Point System**: Separate default cards from plugin-contributed cards
-- **Config-Based Metadata**: Add titles and descriptions directly in YAML configuration
-- **Customizable Grid**: Drag-and-drop, resizable cards with "Add widget" functionality
-- **Plugin Integration**: Easy integration for external plugins via configuration
-
-## Mount Points
-
-The plugin supports two mount points:
-
-- **`home.page/cards`** - Default homepage cards that appear by default
-- **`home.page/widgets`** - Additional cards contributed by other plugins that appear in the "Add widget" dialog
-
-## Configuration-Based Metadata
-
-Cards can have titles and descriptions defined directly in the configuration:
-
-```yaml
-dynamicPlugins:
-  frontend:
-    your-plugin:
-      mountPoints:
-        - mountPoint: home.page/widgets
-          importName: YourCard
-          config:
-            title: 'Your Card Title'
-            description: 'Description shown in Add widget dialog'
-```
+It allows primarly **admins** to customize the homepage in the `app-config`, and plugin authors to extend the home page with additional cards or content.
 
 The default home page shows a Search input field, a "Quick Access" card, and a "Your Starred Entities" card by default.
 

workspaces/homepage/docs/index.md

@@ -138,15 +138,15 @@ const mountPoints: HomePageCardMountPoint[] = [
 
 const scalprumState: ScalprumState = {
   initialized: true,
-  api: {
-    dynamicRootConfig: {
-      mountPoints: {
-        'home.page/cards': mountPoints,
-        // Additional cards from other plugins will be loaded at runtime
-        'home.page/widgets': [],
-      },
-    },
-  },
+  api: mountPoints
+    ? {
+        dynamicRootConfig: {
+          mountPoints: {
+            'home.page/cards': mountPoints,
+          },
+        },
+      }
+    : undefined,
   config: {},
   pluginStore: new PluginStore(),
 };

workspaces/homepage/packages/app/src/App.tsx

@@ -6,7 +6,6 @@ dynamicPlugins:
         - path: /
           importName: DynamicHomePage
       mountPoints:
-        # Default homepage cards - appear by default
         - mountPoint: home.page/cards
           importName: OnboardingSection
           config:
@@ -37,31 +36,3 @@ dynamicPlugins:
               sm: { w: 12, h: 5 }
               xs: { w: 12, h: 7.5 }
               xxs: { w: 12, h: 13.5 }
-
-        # Additional plugin widgets - available in "Add widget" dialog
-        - mountPoint: home.page/widgets
-          importName: RecentlyVisitedCard
-          config:
-            title: 'Recently Visited'
-            description: 'Quick access to recently viewed entities and pages'
-            priority: 2
-            layouts:
-              xl: { w: 4, h: 3 }
-              lg: { w: 4, h: 3 }
-              md: { w: 6, h: 3 }
-              sm: { w: 12, h: 3 }
-              xs: { w: 12, h: 3 }
-              xxs: { w: 12, h: 3 }
-        - mountPoint: home.page/widgets
-          importName: TopVisitedCard
-          config:
-            title: 'Most Visited'
-            description: 'Your most frequently accessed entities and services'
-            priority: 1
-            layouts:
-              xl: { w: 4, h: 3 }
-              lg: { w: 4, h: 3 }
-              md: { w: 6, h: 3 }
-              sm: { w: 12, h: 3 }
-              xs: { w: 12, h: 3 }
-              xxs: { w: 12, h: 3 }

workspaces/homepage/plugins/dynamic-home-page/app-config.dynamic.yaml

@@ -222,14 +222,10 @@ export interface HomePageCardMountPoint {
 
 // @public (undocumented)
 export interface HomePageCardMountPointConfig {
-    // (undocumented)
-    description?: string;
     // (undocumented)
     layouts?: Record<Breakpoint, Layout>;
     // (undocumented)
     priority?: number;
-    // (undocumented)
-    title?: string;
 }
 
 // @public

workspaces/homepage/plugins/dynamic-home-page/report.api.md

@@ -29,7 +29,6 @@ import { useTheme } from '@mui/material/styles';
 
 import { ErrorBoundary } from '@backstage/core-components';
 import { CustomHomepageGrid } from '@backstage/plugin-home';
-import { attachComponentData } from '@backstage/core-plugin-api';
 
 import { makeStyles } from 'tss-react/mui';
 
@@ -63,7 +62,6 @@ const useStyles = makeStyles()({
  */
 export interface CustomizableGridProps {
   mountPoints: HomePageCardMountPoint[];
-  defaultMountPoints?: HomePageCardMountPoint[]; // For config prop - only default cards
   breakpoints?: Record<string, number>;
   cols?: Record<string, number>;
 }
@@ -76,38 +74,10 @@ export const CustomizableGrid = (props: CustomizableGridProps) => {
   const theme = useTheme();
 
   const cards = useMemo<Card[]>(() => {
-    if (!props.mountPoints || !Array.isArray(props.mountPoints)) {
-      return [];
-    }
-
     return props.mountPoints.map<Card>((mountPoint, index) => {
       const id = (index + 1).toString();
       const layouts: Record<string, Layout> = {};
 
-      // Apply config-based metadata to component if provided (skip if already exists)
-      if (mountPoint.config?.title) {
-        try {
-          attachComponentData(
-            mountPoint.Component,
-            'title',
-            mountPoint.config.title,
-          );
-        } catch (error) {
-          // Ignore duplicate metadata errors - component already has title
-        }
-      }
-      if (mountPoint.config?.description) {
-        try {
-          attachComponentData(
-            mountPoint.Component,
-            'description',
-            mountPoint.config.description,
-          );
-        } catch (error) {
-          // Ignore duplicate metadata errors - component already has description
-        }
-      }
-
       if (mountPoint.config?.layouts) {
         for (const [breakpoint, layout] of Object.entries(
           mountPoint.config.layouts,
@@ -162,16 +132,13 @@ export const CustomizableGrid = (props: CustomizableGridProps) => {
     ));
   }, [cards, classes.cardWrapper]);
 
-  // Create default layout configuration for "restore defaults" functionality
-  // Use only default mount points for restore defaults, but all mount points for "Add widget" dialog
+  // Create default layout configuration for initial display AND restore defaults functionality
   const defaultConfig = useMemo(() => {
-    const configMountPoints = props.defaultMountPoints || []; // Use only default cards for restore
-
-    if (!configMountPoints || configMountPoints.length === 0) {
+    if (!props.mountPoints || props.mountPoints.length === 0) {
       return [];
     }
 
-    return configMountPoints.map((mountPoint, index) => {
+    return props.mountPoints.map((mountPoint, index) => {
       const layout = mountPoint.config?.layouts?.xl || {};
 
       return {
@@ -188,7 +155,7 @@ export const CustomizableGrid = (props: CustomizableGridProps) => {
         deletable: true,
       };
     });
-  }, [props.defaultMountPoints]);
+  }, [props.mountPoints]);
 
   return (
     <>

workspaces/homepage/plugins/dynamic-home-page/src/components/CustomizableGrid.tsx

@@ -26,7 +26,6 @@ import { CustomizableGrid } from './CustomizableGrid';
 
 export interface HomePageProps extends HeaderProps {
   cards?: HomePageCardMountPoint[];
-  defaultCards?: HomePageCardMountPoint[];
 }
 
 export const CustomizableHomePage = (props: HomePageProps) => {
@@ -56,10 +55,7 @@ export const CustomizableHomePage = (props: HomePageProps) => {
         {filteredAndSortedHomePageCards.length === 0 ? (
           <EmptyState title={t('homePage.empty')} missing="content" />
         ) : (
-          <CustomizableGrid
-            mountPoints={filteredAndSortedHomePageCards}
-            defaultMountPoints={props.defaultCards}
-          />
+          <CustomizableGrid mountPoints={filteredAndSortedHomePageCards} />
         )}
       </Content>
     </Page>

workspaces/homepage/plugins/dynamic-home-page/src/components/CustomizableHomePage.tsx

@@ -40,13 +40,7 @@ export interface DynamicCustomizableHomePageProps {
 export const DynamicCustomizableHomePage = (
   props: DynamicCustomizableHomePageProps,
 ) => {
-  const { allCards, defaultCards } = useDynamicHomePageCards();
+  const cards = useDynamicHomePageCards();
 
-  return (
-    <CustomizableHomePage
-      {...props}
-      cards={allCards}
-      defaultCards={defaultCards}
-    />
-  );
+  return <CustomizableHomePage {...props} cards={cards} />;
 };