feat: standardize slot ids (#608)

package-lock.json

@@ -20,7 +20,7 @@
         "@fortawesome/free-brands-svg-icons": "^5.15.4",
         "@fortawesome/free-solid-svg-icons": "^5.15.4",
         "@fortawesome/react-fontawesome": "^0.2.0",
-        "@openedx/frontend-plugin-framework": "^1.6.0",
+        "@openedx/frontend-plugin-framework": "^1.7.0",
         "@openedx/frontend-slot-footer": "^1.0.2",
         "@openedx/paragon": "^22.16.0",
         "@redux-devtools/extension": "3.3.0",

package.json

@@ -40,7 +40,7 @@
     "@fortawesome/free-brands-svg-icons": "^5.15.4",
     "@fortawesome/free-solid-svg-icons": "^5.15.4",
     "@fortawesome/react-fontawesome": "^0.2.0",
-    "@openedx/frontend-plugin-framework": "^1.6.0",
+    "@openedx/frontend-plugin-framework": "^1.7.0",
     "@openedx/frontend-slot-footer": "^1.0.2",
     "@openedx/paragon": "^22.16.0",
     "@redux-devtools/extension": "3.3.0",

src/plugin-slots/CourseCardActionSlot/README.md

@@ -1,6 +1,10 @@
 # Course Card Action Slot
 
-### Slot ID: `course_card_action_slot`
+### Slot ID: `org.openedx.frontend.learner_dashboard.course_card_action.v1`
+
+### Slot ID Aliases
+* `course_card_action_slot`
+
 ### Props:
 * `cardId`
 
@@ -20,7 +24,7 @@ import ActionButton from 'containers/CourseCard/components/CourseCardActions/Act
 
 const config = {
   pluginSlots: {
-    course_card_action_slot: {
+    'org.openedx.frontend.learner_dashboard.course_card_action.v1': {
       keepDefault: false,
       plugins: [
         {

src/plugin-slots/CourseCardActionSlot/index.jsx

@@ -4,7 +4,8 @@ import { PluginSlot } from '@openedx/frontend-plugin-framework';
 
 const CourseCardActionSlot = ({ cardId }) => (
   <PluginSlot
-    id="course_card_action_slot"
+    id="org.openedx.frontend.learner_dashboard.course_card_action.v1"
+    idAliases={['course_card_action_slot']}
     pluginProps={{
       cardId,
     }}

src/plugin-slots/CourseListSlot/README.md

@@ -1,6 +1,9 @@
 # Course List Slot
 
-### Slot ID: `course_list_slot`
+### Slot ID: `org.openedx.frontend.learner_dashboard.course_list.v1`
+
+### Slot ID Aliases
+* `course_list_slot`
 
 ## Plugin Props
 
@@ -25,7 +28,7 @@ import { DIRECT_PLUGIN, PLUGIN_OPERATIONS } from '@openedx/frontend-plugin-frame
 
 const config = {
   pluginSlots: {
-    course_list_slot: {
+    'org.openedx.frontend.learner_dashboard.course_list.v1': {
       // Hide the default CourseList component
       keepDefault: false,
       plugins: [

src/plugin-slots/CourseListSlot/index.jsx

@@ -4,7 +4,11 @@ import { PluginSlot } from '@openedx/frontend-plugin-framework';
 import { CourseList, courseListDataShape } from 'containers/CoursesPanel/CourseList';
 
 export const CourseListSlot = ({ courseListData }) => (
-  <PluginSlot id="course_list_slot" pluginProps={{ courseListData }}>
+  <PluginSlot
+    id="org.openedx.frontend.learner_dashboard.course_list.v1"
+    idAliases={['course_list_slot']}
+    pluginProps={{ courseListData }}
+  >
     <CourseList courseListData={courseListData} />
   </PluginSlot>
 );

src/plugin-slots/NoCoursesViewSlot/README.md

@@ -1,6 +1,9 @@
 # No Courses View Slot
 
-### Slot ID: `no_courses_view_slot`
+### Slot ID: `org.openedx.frontend.learner_dashboard.no_courses_view.v1`
+
+### Slot ID Aliases
+* `no_courses_view_slot`
 
 ## Description
 
@@ -21,7 +24,7 @@ import { DIRECT_PLUGIN, PLUGIN_OPERATIONS } from '@openedx/frontend-plugin-frame
 
 const config = {
   pluginSlots: {
-    no_courses_view_slot: {
+    'org.openedx.frontend.learner_dashboard.no_courses_view.v1': {
       // Hide the default NoCoursesView component
       keepDefault: false,
       plugins: [

src/plugin-slots/NoCoursesViewSlot/index.jsx

@@ -4,7 +4,10 @@ import { PluginSlot } from '@openedx/frontend-plugin-framework';
 import NoCoursesView from 'containers/CoursesPanel/NoCoursesView';
 
 export const NoCoursesViewSlot = () => (
-  <PluginSlot id="no_courses_view_slot">
+  <PluginSlot
+    id="org.openedx.frontend.learner_dashboard.no_courses_view.v1"
+    idAliases={['no_courses_view_slot']}
+  >
     <NoCoursesView />
   </PluginSlot>
 );

src/plugin-slots/README.md

@@ -1,8 +1,8 @@
 # `frontend-app-learner-dashboard` Plugin Slots
 
-* [`course_card_action_slot`](./CourseCardActionSlot/)
+* [`org.openedx.frontend.learner_dashboard.course_card_action.v1`](./CourseCardActionSlot/)
 * [`footer_slot`](./FooterSlot/)
-* [`widget_sidebar_slot`](./WidgetSidebarSlot/)
-* [`course_list_slot`](./CourseListSlot/)
-* [`no_courses_view_slot`](./NoCoursesViewSlot/)
+* [`org.openedx.frontend.learner_dashboard.widget_sidebar.v1`](./WidgetSidebarSlot/)
+* [`org.openedx.frontend.learner_dashboard.course_list.v1`](./CourseListSlot/)
+* [`org.openedx.frontend.learner_dashboard.no_courses_view.v1`](./NoCoursesViewSlot/)
 * [`org.openedx.frontend.learner_dashboard.dashboard_modal.v1`](./DashboardModalSlot)

src/plugin-slots/WidgetSidebarSlot/README.md

@@ -1,6 +1,9 @@
 # Widget Sidebar Slot
 
-### Slot ID: `widget_sidebar_slot`
+### Slot ID: `org.openedx.frontend.learner_dashboard.widget_sidebar.v1`
+
+### Slot ID Aliases
+* `widget_sidebar_slot`
 
 ## Description
 
@@ -21,7 +24,7 @@ import { DIRECT_PLUGIN, PLUGIN_OPERATIONS } from '@openedx/frontend-plugin-frame
 
 const config = {
   pluginSlots: {
-     widget_sidebar_slot: {
+     'org.openedx.frontend.learner_dashboard.widget_sidebar.v1': {
       // Hide the default LookingForChallenge component
       keepDefault: false,
       plugins: [

src/plugin-slots/WidgetSidebarSlot/__snapshots__/index.test.jsx.snap

@@ -2,7 +2,12 @@
 
 exports[`WidgetSidebar snapshots 1`] = `
 <PluginSlot
-  id="widget_sidebar_slot"
+  id="org.openedx.frontend.learner_dashboard.widget_sidebar.v1"
+  idAliases={
+    [
+      "widget_sidebar_slot",
+    ]
+  }
 >
   <LookingForChallengeWidget />
 </PluginSlot>

src/plugin-slots/WidgetSidebarSlot/index.jsx

@@ -5,7 +5,10 @@ import LookingForChallengeWidget from 'widgets/LookingForChallengeWidget';
 
 // eslint-disable-next-line arrow-body-style
 export const WidgetSidebarSlot = () => (
-  <PluginSlot id="widget_sidebar_slot">
+  <PluginSlot
+    id="org.openedx.frontend.learner_dashboard.widget_sidebar.v1"
+    idAliases={['widget_sidebar_slot']}
+  >
     <LookingForChallengeWidget />
   </PluginSlot>
 );