-
+
{isEnrolled &&
}
{isEnrolled &&
}
diff --git a/src/plugin-slots/CourseBannerSlot/README.md b/src/plugin-slots/CourseBannerSlot/README.md
new file mode 100644
index 000000000..aaf0a0acf
--- /dev/null
+++ b/src/plugin-slots/CourseBannerSlot/README.md
@@ -0,0 +1,47 @@
+# Course Card Action Slot
+
+### Slot ID: `course_banner_slot`
+### Props:
+* `cardId`
+
+## Description
+
+This slot is used for replacing or adding content for the `CourseBanner` component. This banner is rendered as a child of the `CourseCard`.
+
+The default CourseBanner looks like this when audit access has expired for the course:
+
+
+## Example
+
+The following `env.config.jsx` will render a custom implemenation of a CourseBanner under every `CourseCard`.
+
+
+
+```js
+import { DIRECT_PLUGIN, PLUGIN_OPERATIONS } from '@openedx/frontend-plugin-framework';
+
+const config = {
+ pluginSlots: {
+ course_banner_slot: {
+ keepDefault: false,
+ plugins: [
+ {
+ op: PLUGIN_OPERATIONS.Insert,
+ widget: {
+ id: 'custom_course_banner',
+ type: DIRECT_PLUGIN,
+ priority: 60,
+ RenderWidget: ({ cardId }) => (
+
+ Course banner for course with {cardId}
+
+ ),
+ },
+ },
+ ],
+ },
+ },
+}
+
+export default config;
+```
diff --git a/src/plugin-slots/CourseBannerSlot/images/course_banner_slot_default.png b/src/plugin-slots/CourseBannerSlot/images/course_banner_slot_default.png
new file mode 100644
index 000000000..9098bcf78
Binary files /dev/null and b/src/plugin-slots/CourseBannerSlot/images/course_banner_slot_default.png differ
diff --git a/src/plugin-slots/CourseBannerSlot/images/custom_course_banner.png b/src/plugin-slots/CourseBannerSlot/images/custom_course_banner.png
new file mode 100644
index 000000000..405d38709
Binary files /dev/null and b/src/plugin-slots/CourseBannerSlot/images/custom_course_banner.png differ
diff --git a/src/plugin-slots/CourseBannerSlot/index.jsx b/src/plugin-slots/CourseBannerSlot/index.jsx
new file mode 100644
index 000000000..78bb52c99
--- /dev/null
+++ b/src/plugin-slots/CourseBannerSlot/index.jsx
@@ -0,0 +1,23 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import { PluginSlot } from '@openedx/frontend-plugin-framework';
+import CourseBanner from 'containers/CourseCard/components/CourseCardBanners/CourseBanner';
+
+const CourseBannerSlot = ({ cardId }) => (
+
+
+
+);
+
+CourseBannerSlot.propTypes = {
+ cardId: PropTypes.string.isRequired,
+};
+
+export default CourseBannerSlot;