Merge pull request #552 from osu-wams/DD-1683-deprecate-student-view

DD-1683 Deprecated myosu student view

src/features/BeaverhubCard.tsx

@@ -0,0 +1,38 @@
+import React from 'react';
+import { faGlobe } from '@fortawesome/pro-light-svg-icons';
+import {
+ Card,
+ CardHeader,
+ CardContent,
+ CardFooter,
+ CardIcon,
+} from '../ui/Card';
+import { ExternalLink, InternalLink } from '../ui/Link';
+import Button from 'src/ui/Button';
+
+export const BeaverhubCard = () => {
+
+ return (
+ <div style={{width: "50%", marginLeft: "auto", marginRight: "auto"}}>
+ <Card collapsing={false}>
+ <CardHeader title="Your OSU Student Portal Has Moved" badge={<CardIcon icon={faGlobe} />} />
+ <CardContent>
+ The student experience in MyOregonState is moving to Beaver Hub. Learn more about Beaver Hub and the new features that will be available on the Beaver Hub website.
+ If you are a student employee, you can still access employee-related tools and resources by selecting &apos;Employee Dashboard&apos; from the dropdown above.
+ </CardContent>
+ <CardFooter infoButtonId="beaverhub-card">
+ <Button btnSize='large' style={{width: "100%"}}>
+ <ExternalLink target="_self"
+ href="https://beaverhub.oregonstate.edu"
+ fg="white"
+ >
+ Proceed to Beaver Hub
+ </ExternalLink>
+ </Button>
+ </CardFooter>
+ </Card>
+ </div>
+ );
+};
+
+export default BeaverhubCard;

src/features/__tests__/DynamicCards.test.tsx

@@ -74,57 +74,6 @@ describe('<DynamicCard />', () => {
  expect(screen.queryByText(/All Students!/i)).not.toBeInTheDocument();
  expect(screen.queryByText(/Graduates Card!/i)).not.toBeInTheDocument();
  });
-
- it('Undergrad should find "All Students" Dynamic Card', async () => {
- render(<Dashboard />, { initialStates: mockInitialState() });
-
- const cardTitle = await screen.findByText(/All Students!/i);
- expect(cardTitle).toBeInTheDocument();
-
- const dynamicCard = cardTitle.closest('div');
- expect(dynamicCard).toHaveTextContent(/This card is for all students/i);
- // expect(await screen.findByText(/This card is for all students/i)).toBeInTheDocument();
-
- // Finds the resource included in card
- expect(dynamicCard).toHaveTextContent(/Academics for Student Athletes/i);
- expect(await screen.findByText(/Everyone!/i)).toBeInTheDocument();
-
- // Does not find Student affiliation dynamic card
- expect(screen.queryByText(/All Employees!/i)).not.toBeInTheDocument();
- expect(screen.queryByText(/Graduates Card!/i)).not.toBeInTheDocument();
- });
-
- it('Grad Student should find "All Students" Dynamic Card', async () => {
- render(<Dashboard />, { initialStates: mockInitialState(), user: mockGradUser });
-
- expect(await screen.findByText(/All Students!/i)).toBeInTheDocument();
- expect(await screen.findByText(/This card is for all students/i)).toBeInTheDocument();
-
- const cardTitle = await screen.findByText(/Graduates Card!/i);
- expect(cardTitle).toBeInTheDocument();
- const dynamicCard = cardTitle.closest('div');
-
- expect(
- within(dynamicCard!).getByText(/This card is for graduates only/i)
- ).toBeInTheDocument();
-
- // Finds the resource included in card
- expect(within(dynamicCard!).getByText(/Academics for Student Athletes/i)).toBeInTheDocument();
-
- // Does not find Employee affiliation dynamic card
- expect(screen.queryByText(/All Employees!/i)).not.toBeInTheDocument();
- });
-
- it('Student Employee should find "All Students" and "Everyone!" Dynamic Card', async () => {
- render(<Dashboard />, { initialStates: mockInitialState(), user: mockStudentEmployeeUser });
-
- expect(await screen.findByText(/All Students!/i)).toBeInTheDocument();
- expect(await screen.findByText(/This card is for all students/i)).toBeInTheDocument();
- expect(await screen.findByText(/Everyone!/i)).toBeInTheDocument();
-
- // Does not find Employee affiliation dynamic card
- expect(screen.queryByText(/Graduates Card!/i)).not.toBeInTheDocument();
- });
  });
 
  describe('Finances', () => {

src/pages/Dashboard/StudentDashboard.tsx

@@ -1,17 +1,8 @@
 import React from 'react';
-import { faStars } from '@fortawesome/pro-light-svg-icons';
 import { State } from '@osu-wams/hooks';
-import PageTitle from 'src/ui/PageTitle';
-import ScheduleCard from 'src/features/ScheduleCard';
-import EventCardContainer from 'src/ui/EventCardContainer';
 import { MainGridWrapper, Masonry } from 'src/ui/grid';
-import ResourcesCard from 'src/features/ResourcesCard';
-import { FavoriteResources } from 'src/features/FavoriteResources';
-import { TrendingResources } from 'src/features/TrendingResources';
 import { useRecoilValue } from 'recoil';
-import { DynamicCard } from 'src/ui/Card/variants/DynamicCard';
-import { ITSystemStatus } from 'src/features/it-systems-status/ITSystemStatus';
-import BeaverhubAlert from 'src/features/BeaverhubAlert';
+import BeaverhubCard from 'src/features/BeaverhubCard';
 
 const { ANNOUNCEMENT_PAGES, filteredCards } = State;
 
@@ -21,22 +12,8 @@ const StudentDashboard = () => {
  return (
  <>
  <MainGridWrapper data-testid="student-dashboard-page">
- <BeaverhubAlert />
- <PageTitle title="Overview" />
- <Masonry>
- <>
- <ScheduleCard />
- <ITSystemStatus />
- </>
- <FavoriteResources />
- <TrendingResources />
- <ResourcesCard categ="featured" icon={faStars} />
- {cards.map((c) => (
- <DynamicCard key={c.id} data={c} />
- ))}
- </Masonry>
+ <BeaverhubCard />
  </MainGridWrapper>
- <EventCardContainer page={ANNOUNCEMENT_PAGES.dashboard} />
  </>
  );
 };

src/pages/__tests__/Dashboard.test.tsx

@@ -20,11 +20,6 @@ describe('<StudentDashboard />', () => {
  it('renders the student dashboard', async () => {
  expect(screen.getByTestId('student-dashboard-page')).toBeInTheDocument();
  });
-
- it('should find "Courses" and IT System status card in the Student Dashboard', async () => {
- expect(screen.getByText('Courses')).toBeInTheDocument();
- expect(await screen.findByText(/Major Outage/i)).toBeInTheDocument();
- });
 });
 
 describe('<EmployeeDashboard />', () => {

src/routers/Student.tsx

@@ -1,22 +1,13 @@
 import { Routes as Router, Route } from 'react-router-dom';
 import React from 'react';
-import { Routes } from '@osu-wams/utils';
 import Dashboard from '../pages/Dashboard';
-import Profile from '../pages/Profile';
-import Academics from '../pages/Academics';
-import Finances from '../pages/Finances';
-import Resources from '../pages/Resources';
 import { useResetScroll } from 'src/hooks/useResetScroll';
 import PageNotFound from 'src/pages/PageNotFound';
 
 export const Student = () => {
  useResetScroll();
  return (
  <Router key="student-dashboard">
- <Route path={Routes.Routes().profile.path} element={<Profile />} />
- <Route path={Routes.Routes().academics.path + '/*'} element={<Academics />} />
- <Route path={Routes.Routes().finances.path} element={<Finances />} />
- <Route path={Routes.Routes().resources.path} element={<Resources />} />
  <Route path="/" element={<Dashboard />} />
  <Route path="*" element={<PageNotFound />} />
  </Router>

src/ui/Link.tsx

@@ -56,8 +56,9 @@ const HighlightExternalLinkStyles = styled(LinkStyles)<StyleProps>(() => ({
 const ExternalLink = (props: LinkProps) => {
  const themeContext = useContext(ThemeContext);
  const { children, fg, hideIcon } = props;
+ const target = props.target || "_blank"
  return (
- <LinkStyles {...props} target="_blank">
+ <LinkStyles {...props} target={target}>
  {children}
  {!hideIcon && (
  <Icon icon={faLongArrowRight} color={fg ?? themeContext.ui.link.icon.external.color} />

src/ui/MainNav/MainNavStudent.tsx

@@ -1,10 +1,8 @@
 import React from 'react';
-import { faHome, faGraduationCap, faHandsUsd, faList } from '@fortawesome/pro-light-svg-icons';
+import { faHome, faList } from '@fortawesome/pro-light-svg-icons';
 import Icon from '../Icon';
 import { Event } from 'src/util/gaTracking';
-import { FullMobileMenu } from './FullMobileMenu';
 import { Nav, NavLink } from './MainNavStyles';
-import { Mobile, Desktop } from 'src/hooks/useMediaQuery';
 import { Routes } from '@osu-wams/utils';
 
 const MainNavStudent = (...props) => {
@@ -18,30 +16,6 @@ const MainNavStudent = (...props) => {
  <Icon icon={faHome} />
  Overview
  </NavLink>
- <NavLink
- end
- to={Routes.Routes().academics.fullPath}
- onClick={() => Event('student-navigation-main', 'Academics link clicked')}
- >
- <Icon icon={faGraduationCap} />
- Academics
- </NavLink>
- <NavLink
- end
- to={Routes.Routes().finances.fullPath}
- onClick={() => Event('student-navigation-main', 'Finances link clicked')}
- >
- <Icon icon={faHandsUsd} />
- Finances
- </NavLink>
-
- <Mobile>
- <FullMobileMenu />
- </Mobile>
-
- <Desktop>
- <DesktopLinks />
- </Desktop>
  </Nav>
  );
 };

src/ui/__tests__/Header.test.tsx

@@ -43,79 +43,6 @@ describe('Dashboard Headers', () => {
 });
 
 describe('Student mobile menu interactions', () => {
- it('Student Dashboard title only visible when menu is expanded', async () => {
- render(<Header />);
-
- const title = 'Student Dashboard';
- const studentDashboard = screen.queryByText(title);
- expect(studentDashboard).toBeInTheDocument(); // !TODO: check visibile?
-
- const menu = screen.getByRole('button', { name: /menu/i });
-
- userEvent.click(menu);
-
- const studentDashboardMenu = screen.getByText(title, { selector: 'h2' });
- expect(studentDashboardMenu).toBeVisible();
-
- expect(mockGAEvent).toHaveBeenCalledTimes(1);
- });
-
- it('Clicking "menu" opens and clicking the close dismisses the modal', async () => {
- render(<Header />);
-
- const menu = screen.getByText('Menu');
- userEvent.click(menu);
-
- const close = screen.getByText(/close/i);
- userEvent.click(close);
-
- const studentDashboard = screen.getByText('Student Dashboard');
- expect(studentDashboard).toBeInTheDocument(); // !TODO: check visibile?
-
- expect(mockGAEvent).toHaveBeenCalledTimes(1);
- });
-
- it('Clicking main link inside the modal dismisses the modal', async () => {
- render(<Header />);
-
- const menu = screen.getByText('Menu');
- userEvent.click(menu);
-
- const overview = screen.getByText(/overview/i, { selector: '[role="dialog"] a' });
- userEvent.click(overview);
-
- const studentDashboard = screen.getByText('Student Dashboard');
- expect(studentDashboard).toBeInTheDocument(); // !TODO: check visibile?
-
- expect(mockGAEvent).toHaveBeenCalledTimes(2);
- });
-
- it('Clicking footer link inside the modal dismisses the modal', async () => {
- render(<Header />);
-
- const menu = screen.getByText('Menu');
- userEvent.click(menu);
-
- const about = screen.getByText(/about/i, { selector: '[role="dialog"] nav a' });
- userEvent.click(about);
- const studentDashboard = screen.getByText('Student Dashboard');
- expect(studentDashboard).toBeInTheDocument(); // !TODO: check visibile?
-
- expect(mockGAEvent).toHaveBeenCalledTimes(2);
- });
-
- it('Cannot find mobile menu in desktop version, all links visible immediately', async () => {
- render(<Header />, { isDesktop: true });
-
- const menu = screen.queryByText('Menu');
- expect(menu).not.toBeInTheDocument();
-
- expect(await screen.findByText(/overview/i, { selector: 'nav a' })).toBeInTheDocument();
- expect(await screen.findByText(/academics/i, { selector: 'nav a' })).toBeInTheDocument();
- expect(await screen.findByText(/finances/i, { selector: 'nav a' })).toBeInTheDocument();
- expect(await screen.findByText(/resources/i, { selector: 'nav a' })).toBeInTheDocument();
- });
-
  it('Help and Profile menu open and have their respective menu items', async () => {
  render(<Header />);
 

src/ui/__tests__/MainNav.test.tsx

@@ -5,36 +5,6 @@ import { mockEmployeeUser, renderWithRouter as render } from 'src/util/test-util
 import MainNav from '../MainNav/';
 import { mockGAEvent } from 'src/setupTests';
 
-describe('student main navigation', () => {
- it('Main Navigation Links for students are to be present and tracked in Google Analytics', async () => {
- render(<MainNav />);
-
- const home = screen.getByText('Overview');
- const academics = screen.getByText('Academics');
- const finances = screen.getByText('Finances');
- const menu = screen.getByText('Menu');
- userEvent.click(home);
- userEvent.click(academics);
- userEvent.click(finances);
- userEvent.click(menu);
-
- expect(mockGAEvent).toHaveBeenCalledTimes(4);
- });
-
- it('Main Navigation in desktop has "Resources" link tracked in Google Analytics', async () => {
- render(<MainNav />, { isDesktop: true });
-
- const resources = screen.getByText('Resources');
- const menu = screen.queryByText('Menu');
-
- expect(resources).toBeInTheDocument();
- expect(menu).not.toBeInTheDocument();
-
- userEvent.click(resources);
- expect(mockGAEvent).toHaveBeenCalledTimes(1);
- });
-});
-
 it('Main Navigation for Employee visible and tracked in Google Analytics', async () => {
  render(<MainNav />, {
  user: mockEmployeeUser,