From 4e94ac50b0c1a6018a78da1b8e360f64fa508edf Mon Sep 17 00:00:00 2001 From: Awais Ansari Date: Fri, 8 Sep 2023 16:11:46 +0500 Subject: [PATCH] fix: moved feedback widget behind env variables --- .env | 5 +- .env.development | 5 +- .env.test | 5 +- .jest/setEnvVars.js | 2 - jest.config.js | 4 +- .../discussions-home/DiscussionsHome.jsx | 4 - .../discussions-home/FeedbackWrapper.jsx | 5 +- .../discussions-home/InformationBanner.jsx | 64 --------- .../InformationBanner.test.jsx | 136 ------------------ src/discussions/messages.js | 15 -- src/index.jsx | 3 +- 11 files changed, 13 insertions(+), 235 deletions(-) delete mode 100644 .jest/setEnvVars.js delete mode 100644 src/discussions/discussions-home/InformationBanner.jsx delete mode 100644 src/discussions/discussions-home/InformationBanner.test.jsx diff --git a/.env b/.env index 2fa791447..273646442 100644 --- a/.env +++ b/.env @@ -20,6 +20,5 @@ SEGMENT_KEY='' SITE_NAME='' USER_INFO_COOKIE_NAME='' SUPPORT_URL='' -TA_FEEDBACK_FORM= '' -STAFF_FEEDBACK_FORM= '' -DISPLAY_FEEDBACK_BANNER='false' +LEARNER_FEEDBACK_URL='' +STAFF_FEEDBACK_URL='' diff --git a/.env.development b/.env.development index 3c85d691a..ae4b3cee5 100644 --- a/.env.development +++ b/.env.development @@ -21,6 +21,5 @@ SEGMENT_KEY='' SITE_NAME=localhost USER_INFO_COOKIE_NAME='edx-user-info' SUPPORT_URL='https://support.edx.org' -TA_FEEDBACK_FORM='https://learner-form.test' -STAFF_FEEDBACK_FORM='https://staff-form.test' -DISPLAY_FEEDBACK_BANNER='false' +LEARNER_FEEDBACK_URL='' +STAFF_FEEDBACK_URL='' diff --git a/.env.test b/.env.test index abbd6339f..84bc122cd 100644 --- a/.env.test +++ b/.env.test @@ -19,6 +19,5 @@ SEGMENT_KEY='' SITE_NAME='localhost' USER_INFO_COOKIE_NAME='edx-user-info' SUPPORT_URL='https://support.edx.org' -TA_FEEDBACK_FORM='https://learner-form.test' -STAFF_FEEDBACK_FORM='https://staff-form.test' -DISPLAY_FEEDBACK_BANNER='false' +LEARNER_FEEDBACK_URL='' +STAFF_FEEDBACK_URL='' diff --git a/.jest/setEnvVars.js b/.jest/setEnvVars.js deleted file mode 100644 index e31f19e60..000000000 --- a/.jest/setEnvVars.js +++ /dev/null @@ -1,2 +0,0 @@ -process.env.TA_FEEDBACK_FORM= 'https://learner-form.test'; -process.env.STAFF_FEEDBACK_FORM= 'https://staff-form.test'; \ No newline at end of file diff --git a/jest.config.js b/jest.config.js index fe3adf370..31737d3c3 100644 --- a/jest.config.js +++ b/jest.config.js @@ -1,9 +1,9 @@ const { createConfig } = require('@edx/frontend-build'); module.exports = createConfig('jest', { - // setupFilesAfterEnv is used after the jest environment has been loaded. In general this is what you want. + // setupFilesAfterEnv is used after the jest environment has been loaded. In general this is what you want. // If you want to add config BEFORE jest loads, use setupFiles instead. - setupFiles: ['/.jest/setEnvVars.js'], + setupFiles: ['/.env.test'], setupFilesAfterEnv: [ '/src/setupTest.js', ], diff --git a/src/discussions/discussions-home/DiscussionsHome.jsx b/src/discussions/discussions-home/DiscussionsHome.jsx index 104350a24..851d79322 100644 --- a/src/discussions/discussions-home/DiscussionsHome.jsx +++ b/src/discussions/discussions-home/DiscussionsHome.jsx @@ -8,7 +8,6 @@ import { import Footer from '@edx/frontend-component-footer'; import { LearningHeader as Header } from '@edx/frontend-component-header'; -import { getConfig } from '@edx/frontend-platform'; import { PostActionsBar } from '../../components'; import { CourseTabsNavigation } from '../../components/NavigationBar'; @@ -30,7 +29,6 @@ import BlackoutInformationBanner from './BlackoutInformationBanner'; import DiscussionContent from './DiscussionContent'; import DiscussionSidebar from './DiscussionSidebar'; import useFeedbackWrapper from './FeedbackWrapper'; -import InformationBanner from './InformationBanner'; const DiscussionsHome = () => { const location = useLocation(); @@ -46,7 +44,6 @@ const DiscussionsHome = () => { const isOnDesktop = useIsOnDesktop(); let displaySidebar = useSidebarVisible(); const enableInContextSidebar = Boolean(new URLSearchParams(location.search).get('inContextSidebar') !== null); - const isFeedbackBannerVisible = getConfig().DISPLAY_FEEDBACK_BANNER === 'true'; const { courseId, postId, topicId, category, learnerUsername, } = params; @@ -95,7 +92,6 @@ const DiscussionsHome = () => { {!enableInContextSidebar && } - {isFeedbackBannerVisible && } {provider === DiscussionProvider.LEGACY && ( diff --git a/src/discussions/discussions-home/FeedbackWrapper.jsx b/src/discussions/discussions-home/FeedbackWrapper.jsx index 74d668bb0..1627f869a 100644 --- a/src/discussions/discussions-home/FeedbackWrapper.jsx +++ b/src/discussions/discussions-home/FeedbackWrapper.jsx @@ -2,6 +2,7 @@ import { useEffect } from 'react'; import { useSelector } from 'react-redux'; +import { getConfig } from '@edx/frontend-platform'; import { logError } from '@edx/frontend-platform/logging'; import { RequestStatus } from '../../data/constants'; @@ -22,9 +23,9 @@ export default function useFeedbackWrapper() { useEffect(() => { if (configStatus === RequestStatus.SUCCESSFUL) { - let url = '//w.usabilla.com/9e6036348fa1.js'; + let url = getConfig().LEARNER_FEEDBACK_URL; if (isStaff || isUserGroupTA || isCourseAdmin || isCourseStaff) { - url = '//w.usabilla.com/767740a06856.js'; + url = getConfig().STAFF_FEEDBACK_URL; } try { // eslint-disable-next-line no-undef diff --git a/src/discussions/discussions-home/InformationBanner.jsx b/src/discussions/discussions-home/InformationBanner.jsx deleted file mode 100644 index f26db7467..000000000 --- a/src/discussions/discussions-home/InformationBanner.jsx +++ /dev/null @@ -1,64 +0,0 @@ -import React, { useState } from 'react'; - -import { useSelector } from 'react-redux'; - -import { injectIntl, intlShape } from '@edx/frontend-platform/i18n'; -import { Hyperlink, PageBanner } from '@edx/paragon'; - -import { selectUserIsStaff, selectUserRoles } from '../data/selectors'; -import messages from '../messages'; - -const InformationBanner = ({ - intl, -}) => { - const [showBanner, setShowBanner] = useState(true); - const userRoles = useSelector(selectUserRoles); - const isAdmin = useSelector(selectUserIsStaff); - const learnMoreLink = 'https://openedx.atlassian.net/wiki/spaces/COMM/pages/3509551260/Overview+New+discussions+experience'; - const TAFeedbackLink = process.env.TA_FEEDBACK_FORM; - const staffFeedbackLink = process.env.STAFF_FEEDBACK_FORM; - const hideLearnMoreButton = ((userRoles.includes('Student') && userRoles.length === 1) || !userRoles.length) && !isAdmin; - const showStaffLink = isAdmin || userRoles.includes('Moderator') || userRoles.includes('Administrator'); - - return ( - setShowBanner(false)} - > -
- {intl.formatMessage(messages.bannerMessage)} - {!hideLearnMoreButton - && ( - - {intl.formatMessage(messages.learnMoreBannerLink)} - - )} - - {intl.formatMessage(messages.shareFeedback)} - -
- - ); -}; - -InformationBanner.propTypes = { - intl: intlShape.isRequired, -}; - -export default injectIntl(InformationBanner); diff --git a/src/discussions/discussions-home/InformationBanner.test.jsx b/src/discussions/discussions-home/InformationBanner.test.jsx deleted file mode 100644 index 05af082c3..000000000 --- a/src/discussions/discussions-home/InformationBanner.test.jsx +++ /dev/null @@ -1,136 +0,0 @@ -import { render, screen } from '@testing-library/react'; -import { IntlProvider } from 'react-intl'; - -import { initializeMockApp } from '@edx/frontend-platform'; -import { AppProvider } from '@edx/frontend-platform/react'; - -import { initializeStore } from '../../store'; -import { DiscussionContext } from '../common/context'; -import { fetchConfigSuccess } from '../data/slices'; -import messages from '../messages'; -import InformationBanner from './InformationBanner'; - -import '../posts/data/__factories__'; - -let store; -let container; -const courseId = 'course-v1:edX+DemoX+Demo_Course'; - -const getConfigData = (isAdmin = true, roles = []) => ({ - id: 'course-v1:edX+DemoX+Demo_Course', - userRoles: roles, - hasModerationPrivileges: false, - isGroupTa: false, - isUserAdmin: isAdmin, -}); - -function renderComponent() { - const wrapper = render( - - - - - - - , - ); - container = wrapper.container; - return container; -} - -describe('Information Banner learner view', () => { - let element; - beforeEach(async () => { - initializeMockApp({ - authenticatedUser: { - userId: 3, - username: 'abc123', - administrator: false, - roles: ['Student'], - }, - }); - store = initializeStore(); - store.dispatch(fetchConfigSuccess(getConfigData(false, ['Student']))); - renderComponent(true); - element = await screen.findByRole('alert'); - }); - - test('Test Banner is visible on app load', async () => { - expect(element).toHaveTextContent(messages.bannerMessage.defaultMessage); - }); - - test('Test Banner do not have learn more button', async () => { - expect(element).not.toHaveTextContent(messages.learnMoreBannerLink.defaultMessage); - }); - test('Test Banner has share feedback button', async () => { - expect(element).toHaveTextContent(messages.shareFeedback.defaultMessage); - }); -}); - -describe('Information Banner moderators/staff/admin view', () => { - let element; - beforeEach(async () => { - initializeMockApp({ - authenticatedUser: { - userId: 3, - username: 'abc123', - administrator: true, - roles: [], - }, - }); - - store = initializeStore(); - store.dispatch(fetchConfigSuccess(getConfigData(true, ['Student', 'Moderator']))); - renderComponent(true); - element = await screen.findByRole('alert'); - }); - - test('Test Banner is visible on app load', async () => { - expect(element).toHaveTextContent(messages.bannerMessage.defaultMessage); - }); - - test('Test Banner has learn more button', async () => { - expect(element).toHaveTextContent(messages.learnMoreBannerLink.defaultMessage); - }); - test('Test Banner has share feedback button', async () => { - expect(element).toHaveTextContent(messages.shareFeedback.defaultMessage); - }); -}); - -describe('User is redirected according to url according to role', () => { - beforeEach(async () => { - initializeMockApp({ - authenticatedUser: { - userId: 3, - username: 'abc123', - administrator: true, - roles: [], - }, - }); - store = initializeStore(); - }); - - test('TAs are redirected to learners feedback form', async () => { - store.dispatch(fetchConfigSuccess(getConfigData(false, ['Student', 'Community TA']))); - renderComponent(true); - expect(screen.getByText(messages.shareFeedback.defaultMessage) - .closest('a')) - .toHaveAttribute('href', process.env.TA_FEEDBACK_FORM); - }); - - test('moderators/administrators are redirected to moderators feedback form', async () => { - store.dispatch(fetchConfigSuccess(getConfigData(false, ['Student', 'Moderator', 'Administrator']))); - renderComponent(true); - expect(screen.getByText(messages.shareFeedback.defaultMessage) - .closest('a')) - .toHaveAttribute('href', process.env.STAFF_FEEDBACK_FORM); - }); - - test('user with only isAdmin true are redirected to moderators feedback form', async () => { - store.dispatch(fetchConfigSuccess(getConfigData(true, ['Student']))); - renderComponent(true); - expect(screen.getByText(messages.shareFeedback.defaultMessage) - .closest('a')) - .toHaveAttribute('href', process.env.STAFF_FEEDBACK_FORM); - }); -}); diff --git a/src/discussions/messages.js b/src/discussions/messages.js index c1cc14ed7..3df80c16e 100644 --- a/src/discussions/messages.js +++ b/src/discussions/messages.js @@ -168,21 +168,6 @@ const messages = defineMessages({ defaultMessage: 'anonymous', description: 'Author name displayed when a post is anonymous', }, - bannerMessage: { - id: 'discussion.banner.welcomeMessage', - defaultMessage: '🎉 Welcome to the new and improved discussions experience!', - description: 'Information banner welcome text', - }, - learnMoreBannerLink: { - id: 'discussion.banner.learnMore', - defaultMessage: 'Learn more', - description: 'learn more button to redirect users to know more about new discussion experience ', - }, - shareFeedback: { - id: 'discussion.banner.shareFeedback', - defaultMessage: 'Share feedback', - description: 'Share feedback button to open feedback forms', - }, blackoutDiscussionInformation: { id: 'discussion.blackoutBanner.information', defaultMessage: 'Posting in discussions is temporarily disabled by the course team', diff --git a/src/index.jsx b/src/index.jsx index 4ce7c6140..338880171 100755 --- a/src/index.jsx +++ b/src/index.jsx @@ -45,7 +45,8 @@ initialize({ config: () => { mergeConfig({ LEARNING_BASE_URL: process.env.LEARNING_BASE_URL, - DISPLAY_FEEDBACK_BANNER: process.env.DISPLAY_FEEDBACK_BANNER || 'false', + LEARNER_FEEDBACK_URL: process.env.LEARNER_FEEDBACK_URL, + STAFF_FEEDBACK_URL: process.env.STAFF_FEEDBACK_URL, }, 'DiscussionsConfig'); }, },