feat: removed sort and filter tour (#535)

Author: awais-ansari

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"

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"

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: (
-          <>
-            <p>
-              {intl.formatMessage(messages.notificationTourPreferenceBody)}
-              <Hyperlink
-                destination={`${getConfig().ACCOUNT_SETTINGS_URL}/notifications`}
-                target="_blank"
-                rel="noopener noreferrer"
-                showLaunchIcon={false}
-                className="d-inline-block px-1.5"
-              >
-                <Icon
-                  src={Settings}
-                  className="icon-size-20 text-primary-500"
-                  data-testid="tour-setting-icon"
-                  screenReaderText="preferences settings icon"
-                />
-              </Hyperlink>
-            </p>
-            <p>
-              {intl.formatMessage(messages.notificationTourGuideBody)}
-              <Hyperlink
-                destination="https://edx.readthedocs.io/projects/open-edx-learner-guide/en/latest/sfd_notifications/managing_notifications.html"
-                target="_blank"
-                rel="noopener noreferrer"
-              >
-                {intl.formatMessage(messages.notificationTourGuideLink)}
-              </Hyperlink>
-            </p>
-          </>
-        ),
-        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',
       },
     ],
   };

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),

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',
   },
 });