diff --git a/src/Notifications/NotificationEmptySection.jsx b/src/Notifications/NotificationEmptySection.jsx
index 9f418745..0dac3f68 100644
--- a/src/Notifications/NotificationEmptySection.jsx
+++ b/src/Notifications/NotificationEmptySection.jsx
@@ -23,7 +23,6 @@ const EmptyNotifications = () => {
src={NotificationsNone}
iconAs={Icon}
variant="light"
- id="bell-icon"
iconClassNames="text-primary-500"
className="ml-4 mr-1 notification-button notification-lg-bell-icon pl-2"
data-testid="notification-bell-icon"
diff --git a/src/Notifications/index.jsx b/src/Notifications/index.jsx
index f8babd2f..24913a96 100644
--- a/src/Notifications/index.jsx
+++ b/src/Notifications/index.jsx
@@ -143,7 +143,6 @@ const Notifications = () => {
src={NotificationsNone}
iconAs={Icon}
variant="light"
- id="bell-icon"
iconClassNames="text-primary-500"
className="ml-4 mr-1 notification-button"
data-testid="notification-bell-icon"
diff --git a/src/Notifications/tours/constants.js b/src/Notifications/tours/constants.js
index 40811a2b..8d7949dd 100644
--- a/src/Notifications/tours/constants.js
+++ b/src/Notifications/tours/constants.js
@@ -1,48 +1,18 @@
-/* eslint-disable react/jsx-filename-extension */
-import React from 'react';
-import { Icon, Hyperlink } from '@edx/paragon';
-import { Settings } from '@edx/paragon/icons';
-import { getConfig } from '@edx/frontend-platform';
import messages from './messages';
+/**
+ *
+ * @param {Object} intl
+ * @returns {Object} tour checkpoints
+ */
export default function tourCheckpoints(intl) {
return {
- NOTIFICATION_TOUR: [
+ EXAMPLE_TOUR: [
{
- body: (
- <>
-
- {intl.formatMessage(messages.notificationTourPreferenceBody)}
-
-
-
-
-
- {intl.formatMessage(messages.notificationTourGuideBody)}
-
- {intl.formatMessage(messages.notificationTourGuideLink)}
-
-
- >
- ),
- placement: 'left',
- target: '#bell-icon',
- title: intl.formatMessage(messages.notificationTourTitle),
+ title: intl.formatMessage(messages.exampleTourTitle),
+ body: intl.formatMessage(messages.exampleTourBody),
+ target: '#example-tour-target',
+ placement: 'bottom',
},
],
};
diff --git a/src/Notifications/tours/data/hooks.js b/src/Notifications/tours/data/hooks.js
index f1a9b392..21c25029 100644
--- a/src/Notifications/tours/data/hooks.js
+++ b/src/Notifications/tours/data/hooks.js
@@ -20,7 +20,7 @@ export const useTourConfiguration = () => {
}, [dispatch]);
const toursConfig = useMemo(() => (
- tours?.map((tour) => tour.tourName === intl.formatMessage(messages.notificationTourId) && (
+ tours?.map((tour) => Object.keys(tourCheckpoints(intl)).includes(tour.tourName) && (
{
tourId: tour.tourName,
dismissButtonText: intl.formatMessage(messages.dismissButtonText),
diff --git a/src/Notifications/tours/messages.js b/src/Notifications/tours/messages.js
index b6670ced..84a98352 100644
--- a/src/Notifications/tours/messages.js
+++ b/src/Notifications/tours/messages.js
@@ -1,11 +1,6 @@
import { defineMessages } from '@edx/frontend-platform/i18n';
const messages = defineMessages({
- notificationTourId: {
- id: 'notification.tour.id',
- defaultMessage: 'notification_tour',
- description: 'Notification Tour Id',
- },
dismissButtonText: {
id: 'tour.action.dismiss',
defaultMessage: 'Dismiss',
@@ -16,25 +11,15 @@ const messages = defineMessages({
defaultMessage: 'Okay',
description: 'Action to end current tour',
},
- notificationTourPreferenceBody: {
- id: 'notification.tour.preference.body',
- defaultMessage: 'Click the bell icon to see Discussion notifications and customize your preferences by clicking on the gear icon.',
- description: 'Body of the tour for the notification preferences',
- },
- notificationTourGuideBody: {
- id: 'notification.tour.guide.body',
- defaultMessage: 'Certain notifications are enabled by default, as further detailed in the ',
- description: 'Body of the tour for the notification for the guide',
- },
- notificationTourGuideLink: {
- id: 'notification.tour.guide.link',
- defaultMessage: "edX Learner's Guide.",
- description: 'Link of the tour for the notification for the guide',
+ exampleTourTitle: {
+ id: 'tour.example.title',
+ defaultMessage: 'Example Tour',
+ description: 'Title for example tour',
},
- notificationTourTitle: {
- id: 'notification.tour.title',
- defaultMessage: 'Stay informed!',
- description: 'Title of the notification tour',
+ exampleTourBody: {
+ id: 'tour.example.body',
+ defaultMessage: 'This is an example tour',
+ description: 'Body for example tour',
},
});