From 7eddc918bb116daa7d8badd6bbeb79dd03ef4173 Mon Sep 17 00:00:00 2001
From: sundasnoreen12 <72802712+sundasnoreen12@users.noreply.github.com>
Date: Fri, 13 Jun 2025 19:33:14 +0500
Subject: [PATCH] fix: fixed right panel closing issue (#1732)

* fix: fixed right panel closing issue

* fix: fixed status of notificationTrayStatus in session storage

* test: added test cases to close or open notification tray
---
 .../new-sidebar/SidebarContextProvider.tsx    |  2 +
 .../discussions/DiscussionsWidget.test.tsx    | 42 ++++++++++++++++++-
 .../sidebar/sidebars/course-outline/hooks.js  |  1 +
 3 files changed, 44 insertions(+), 1 deletion(-)

diff --git a/src/courseware/course/new-sidebar/SidebarContextProvider.tsx b/src/courseware/course/new-sidebar/SidebarContextProvider.tsx
index 7ea8ffde..f916b916 100644
--- a/src/courseware/course/new-sidebar/SidebarContextProvider.tsx
+++ b/src/courseware/course/new-sidebar/SidebarContextProvider.tsx
@@ -54,6 +54,8 @@ const SidebarProvider: React.FC<Props> = ({
   }, [courseId]);
 
   useEffect(() => {
+    window.sessionStorage.setItem('hideCourseOutlineSidebar', 'true');
+    window.sessionStorage.setItem(`notificationTrayStatus.${courseId}`, 'open');
     setHideDiscussionbar(!isDiscussionbarAvailable);
     setHideNotificationbar(!isNotificationbarAvailable);
     if (initialSidebar && currentSidebar !== initialSidebar) {
diff --git a/src/courseware/course/new-sidebar/sidebars/discussions-notifications/discussions/DiscussionsWidget.test.tsx b/src/courseware/course/new-sidebar/sidebars/discussions-notifications/discussions/DiscussionsWidget.test.tsx
index 3b35d8c2..38eaf00f 100644
--- a/src/courseware/course/new-sidebar/sidebars/discussions-notifications/discussions/DiscussionsWidget.test.tsx
+++ b/src/courseware/course/new-sidebar/sidebars/discussions-notifications/discussions/DiscussionsWidget.test.tsx
@@ -1,11 +1,13 @@
 import React from 'react';
 
+import { fireEvent } from '@testing-library/react';
 import MockAdapter from 'axios-mock-adapter';
 
 import { getConfig } from '@edx/frontend-platform';
-import { getAuthenticatedHttpClient } from '@edx/frontend-platform/auth';
 import { sendTrackEvent } from '@edx/frontend-platform/analytics';
+import { getAuthenticatedHttpClient } from '@edx/frontend-platform/auth';
 
+import { getSessionStorage, setSessionStorage } from '../../../../../../data/sessionStorage';
 import {
   initializeMockApp, initializeTestStore, render, screen,
 } from '../../../../../../setupTest';
@@ -14,11 +16,19 @@ import { buildTopicsFromUnits } from '../../../../../data/__factories__/discussi
 import { getCourseDiscussionTopics } from '../../../../../data/thunks';
 import SidebarContext from '../../../SidebarContext';
 import DiscussionsNotificationsSidebar from '../DiscussionsNotificationsSidebar';
+import DiscussionsNotificationsTrigger from '../DiscussionsNotificationsTrigger';
 import DiscussionsWidget from './DiscussionsWidget';
 
 initializeMockApp();
 jest.mock('@edx/frontend-platform/analytics');
 
+jest.mock('../../../../../../data/sessionStorage', () => ({
+  getSessionStorage: jest.fn(),
+  setSessionStorage: jest.fn(),
+}));
+
+const onClickMock = jest.fn();
+
 describe('DiscussionsWidget', () => {
   let axiosMock;
   let mockData;
@@ -81,4 +91,34 @@ describe('DiscussionsWidget', () => {
     expect(screen.queryByText('Back to course')).toBeInTheDocument();
     expect(sendTrackEvent).toHaveBeenCalledTimes(1);
   });
+
+  it('should open notification tray if closed', () => {
+    (getSessionStorage as jest.Mock).mockReturnValue('closed');
+
+    renderWithProvider(() => <DiscussionsNotificationsTrigger onClick={onClickMock} />);
+
+    const button = screen.getByRole('button');
+    fireEvent.click(button);
+
+    expect(setSessionStorage).toHaveBeenCalledWith(
+      `notificationTrayStatus.${courseId}`,
+      'open',
+    );
+    expect(onClickMock).toHaveBeenCalled();
+  });
+
+  it('should close notification tray if open', () => {
+    (getSessionStorage as jest.Mock).mockReturnValue('open');
+
+    renderWithProvider(() => <DiscussionsNotificationsTrigger onClick={onClickMock} />);
+
+    const button = screen.getByRole('button');
+    fireEvent.click(button);
+
+    expect(setSessionStorage).toHaveBeenCalledWith(
+      `notificationTrayStatus.${courseId}`,
+      'open',
+    );
+    expect(onClickMock).toHaveBeenCalled();
+  });
 });
diff --git a/src/courseware/course/sidebar/sidebars/course-outline/hooks.js b/src/courseware/course/sidebar/sidebars/course-outline/hooks.js
index 6d4ea8ca..71ed4bff 100644
--- a/src/courseware/course/sidebar/sidebars/course-outline/hooks.js
+++ b/src/courseware/course/sidebar/sidebars/course-outline/hooks.js
@@ -68,6 +68,7 @@ export const useCourseOutlineSidebar = () => {
     } else {
       toggleSidebar(ID);
       window.sessionStorage.removeItem('hideCourseOutlineSidebar');
+      window.sessionStorage.setItem(`notificationTrayStatus.${courseId}`, 'closed');
     }
   };