From db3a389158156dd11cd6a0202314f1ff8016b6de Mon Sep 17 00:00:00 2001 From: vicksey Date: Thu, 5 Dec 2024 15:03:11 -0800 Subject: [PATCH 1/5] Adding Help Menu to aggregate elements on the main page --- apps/antalmanac/src/components/HelpMenu.tsx | 156 ++++++++++++++++++++ apps/antalmanac/src/routes/Feedback.tsx | 2 +- apps/antalmanac/src/routes/Home.tsx | 3 +- 3 files changed, 159 insertions(+), 2 deletions(-) create mode 100644 apps/antalmanac/src/components/HelpMenu.tsx diff --git a/apps/antalmanac/src/components/HelpMenu.tsx b/apps/antalmanac/src/components/HelpMenu.tsx new file mode 100644 index 000000000..aec7047ed --- /dev/null +++ b/apps/antalmanac/src/components/HelpMenu.tsx @@ -0,0 +1,156 @@ +import FeedbackIcon from '@mui/icons-material/Feedback'; +import HelpIcon from '@mui/icons-material/Help'; +import LightbulbIcon from '@mui/icons-material/Lightbulb'; +import ReplayIcon from '@mui/icons-material/Replay'; +import { Fab, Tooltip, Box, IconButton } from '@mui/material'; +import { useTour } from '@reactour/tour'; +import React, { useState } from 'react'; + +import HelpBox from '$components/RightPane/CoursePane/SearchForm/HelpBox'; +import Feedback from '$routes/Feedback'; + +export function HelpMenu() { + const [isHovered, setIsHovered] = useState(false); + const [showHelpBox, setShowHelpBox] = useState(false); + const [showTutorial, setShowTutorial] = useState(false); + const { setIsOpen } = useTour(); + + const handleMouseEnter = () => { + setIsHovered(true); + }; + + const handleMouseLeave = () => { + setIsHovered(false); + }; + + const openFeedbackForm = () => { + Feedback(); + }; + + const openHelpBox = () => { + setShowHelpBox(true); + }; + + const closeHelpBox = () => { + setShowHelpBox(false); + }; + + const openTutorial = () => { + setIsOpen(true); + }; + + return ( + + {/* Main Help Menu Icon */} + + + + + + + {/* Hovered Icons */} + {isHovered && ( + + {/* Tutorial Button */} + + + + + + + {/* Feedback Form Button */} + + + + + + + {/* Help Box Button */} + + + + + + + )} + + {/* Show HelpBox */} + {showHelpBox && ( + + + + )} + + ); +} + +export default HelpMenu; diff --git a/apps/antalmanac/src/routes/Feedback.tsx b/apps/antalmanac/src/routes/Feedback.tsx index 0f794b088..c211497aa 100644 --- a/apps/antalmanac/src/routes/Feedback.tsx +++ b/apps/antalmanac/src/routes/Feedback.tsx @@ -1,4 +1,4 @@ export default function Feedback() { - window.location.replace('https://forms.gle/k81f2aNdpdQYeKK8A'); + window.open('https://forms.gle/k81f2aNdpdQYeKK8A', '_blank'); return null; } diff --git a/apps/antalmanac/src/routes/Home.tsx b/apps/antalmanac/src/routes/Home.tsx index c3f1b9b91..be3318462 100644 --- a/apps/antalmanac/src/routes/Home.tsx +++ b/apps/antalmanac/src/routes/Home.tsx @@ -6,6 +6,7 @@ import Split from 'react-split'; import Calendar from '$components/Calendar/CalendarRoot'; import Header from '$components/Header'; +import { HelpMenu } from '$components/HelpMenu'; // Added the new HelpMenu component import NotificationSnackbar from '$components/NotificationSnackbar'; import PatchNotes from '$components/PatchNotes'; import ScheduleManagement from '$components/SharedRoot'; @@ -78,7 +79,7 @@ function DesktopHome() { - + ); } From 7aa1f3e82b004dd8db801002681966d9336e2478 Mon Sep 17 00:00:00 2001 From: vicksey Date: Thu, 5 Dec 2024 15:04:20 -0800 Subject: [PATCH 2/5] Adding Help Menu to aggregate elements on the main page --- apps/antalmanac/src/components/HelpMenu.tsx | 14 -------------- 1 file changed, 14 deletions(-) diff --git a/apps/antalmanac/src/components/HelpMenu.tsx b/apps/antalmanac/src/components/HelpMenu.tsx index aec7047ed..f016db8f0 100644 --- a/apps/antalmanac/src/components/HelpMenu.tsx +++ b/apps/antalmanac/src/components/HelpMenu.tsx @@ -131,20 +131,6 @@ export function HelpMenu() { {showHelpBox && ( From 8cdae4bb2e73a2eed4a5bf2e0e25ec901522caa8 Mon Sep 17 00:00:00 2001 From: vicksey Date: Sat, 28 Dec 2024 17:17:41 -0500 Subject: [PATCH 3/5] Working help menu. --- .../759b514fb2013120-turbo.log.2024-12-20 | 2 + apps/antalmanac/src/components/HelpMenu.tsx | 46 ++++++++----------- .../CoursePane/SearchForm/SearchForm.tsx | 3 ++ apps/antalmanac/src/components/Tutorial.tsx | 20 +++----- apps/antalmanac/src/routes/Home.tsx | 4 +- 5 files changed, 31 insertions(+), 44 deletions(-) create mode 100644 .turbo/daemon/759b514fb2013120-turbo.log.2024-12-20 diff --git a/.turbo/daemon/759b514fb2013120-turbo.log.2024-12-20 b/.turbo/daemon/759b514fb2013120-turbo.log.2024-12-20 new file mode 100644 index 000000000..1e69b66f7 --- /dev/null +++ b/.turbo/daemon/759b514fb2013120-turbo.log.2024-12-20 @@ -0,0 +1,2 @@ +2024-12-20T19:43:09.183783Z WARN daemon_server: turborepo_lib::commands::daemon: daemon already running +2024-12-20T19:44:53.433895Z INFO turborepo_lib::daemon::server: triggering shutdown diff --git a/apps/antalmanac/src/components/HelpMenu.tsx b/apps/antalmanac/src/components/HelpMenu.tsx index f016db8f0..4e2c01486 100644 --- a/apps/antalmanac/src/components/HelpMenu.tsx +++ b/apps/antalmanac/src/components/HelpMenu.tsx @@ -1,19 +1,16 @@ import FeedbackIcon from '@mui/icons-material/Feedback'; import HelpIcon from '@mui/icons-material/Help'; import LightbulbIcon from '@mui/icons-material/Lightbulb'; -import ReplayIcon from '@mui/icons-material/Replay'; -import { Fab, Tooltip, Box, IconButton } from '@mui/material'; -import { useTour } from '@reactour/tour'; -import React, { useState } from 'react'; - +import { Fab, Tooltip, Box, IconButton, Paper } from '@mui/material'; +import { useState } from 'react'; import HelpBox from '$components/RightPane/CoursePane/SearchForm/HelpBox'; + import Feedback from '$routes/Feedback'; +import { Tutorial } from '$components/Tutorial'; export function HelpMenu() { const [isHovered, setIsHovered] = useState(false); const [showHelpBox, setShowHelpBox] = useState(false); - const [showTutorial, setShowTutorial] = useState(false); - const { setIsOpen } = useTour(); const handleMouseEnter = () => { setIsHovered(true); @@ -35,17 +32,13 @@ export function HelpMenu() { setShowHelpBox(false); }; - const openTutorial = () => { - setIsOpen(true); - }; - return ( {/* Tutorial Button */} - - - - - + {/* Feedback Form Button */} @@ -127,12 +108,21 @@ export function HelpMenu() { )} - {/* Show HelpBox */} {showHelpBox && ( - + + + )} diff --git a/apps/antalmanac/src/components/RightPane/CoursePane/SearchForm/SearchForm.tsx b/apps/antalmanac/src/components/RightPane/CoursePane/SearchForm/SearchForm.tsx index 83b909602..f5e0d76c5 100644 --- a/apps/antalmanac/src/components/RightPane/CoursePane/SearchForm/SearchForm.tsx +++ b/apps/antalmanac/src/components/RightPane/CoursePane/SearchForm/SearchForm.tsx @@ -15,6 +15,7 @@ import TermSelector from './TermSelector'; import analyticsEnum, { logAnalytics } from '$lib/analytics'; import { getLocalStorageHelpBoxDismissalTime, setLocalStorageHelpBoxDismissalTime } from '$lib/localStorage'; import { useCoursePaneStore } from '$stores/CoursePaneStore'; +import { HelpMenu } from '$components/HelpMenu'; const styles: Styles = { rightPane: { @@ -115,6 +116,8 @@ const SearchForm = (props: { classes: ClassNameMap; toggleSearch: () => void }) {displayHelpBox && } + + ); }; diff --git a/apps/antalmanac/src/components/Tutorial.tsx b/apps/antalmanac/src/components/Tutorial.tsx index 7f205df8b..36cdb5e46 100644 --- a/apps/antalmanac/src/components/Tutorial.tsx +++ b/apps/antalmanac/src/components/Tutorial.tsx @@ -1,5 +1,5 @@ import ReplayIcon from '@mui/icons-material/Replay'; -import { Fab, Tooltip } from '@mui/material'; +import { Fab, Tooltip, IconButton } from '@mui/material'; import { useTour } from '@reactour/tour'; import { useEffect, useMemo } from 'react'; @@ -41,23 +41,17 @@ export function Tutorial() { /** Floating action button (FAB) in the bottom right corner to reactivate the tutorial */ return ( - restartTour()} - style={{ - position: 'fixed', - bottom: '1rem', - right: '1rem', - zIndex: 999, - opacity: 0.5, - width: '4rem', - height: '4rem', + size="large" + sx={{ + backgroundColor: '#fff', + ':hover': { backgroundColor: '#e0f7fa' }, }} > - + ); } diff --git a/apps/antalmanac/src/routes/Home.tsx b/apps/antalmanac/src/routes/Home.tsx index be3318462..27ee50a98 100644 --- a/apps/antalmanac/src/routes/Home.tsx +++ b/apps/antalmanac/src/routes/Home.tsx @@ -6,7 +6,7 @@ import Split from 'react-split'; import Calendar from '$components/Calendar/CalendarRoot'; import Header from '$components/Header'; -import { HelpMenu } from '$components/HelpMenu'; // Added the new HelpMenu component +import { HelpMenu } from '$components/HelpMenu'; import NotificationSnackbar from '$components/NotificationSnackbar'; import PatchNotes from '$components/PatchNotes'; import ScheduleManagement from '$components/SharedRoot'; @@ -78,8 +78,6 @@ function DesktopHome() { - - ); } From 37dfc4b69fa7f8edb5e05b3dd3988f7be0f2d8e4 Mon Sep 17 00:00:00 2001 From: vicksey Date: Sat, 28 Dec 2024 17:25:05 -0500 Subject: [PATCH 4/5] Deleted accidental typo. --- apps/antalmanac/src/routes/Feedback.tsx | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/apps/antalmanac/src/routes/Feedback.tsx b/apps/antalmanac/src/routes/Feedback.tsx index b7ce3a520..b39cbebef 100644 --- a/apps/antalmanac/src/routes/Feedback.tsx +++ b/apps/antalmanac/src/routes/Feedback.tsx @@ -3,5 +3,4 @@ export const FEEDBACK_LINK = 'https://form.asana.com/?k=fZ3SGnuGknDmzTYdocgIUg&d export default function Feedback() { window.location.replace(FEEDBACK_LINK); return null; -} -git add \ No newline at end of file +} \ No newline at end of file From 28da13778d5fa31715e8d2ac13ef41adbc56bbd1 Mon Sep 17 00:00:00 2001 From: vicksey Date: Sat, 28 Dec 2024 17:34:03 -0500 Subject: [PATCH 5/5] Opens new tab for feedback form. --- apps/antalmanac/src/routes/Feedback.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/apps/antalmanac/src/routes/Feedback.tsx b/apps/antalmanac/src/routes/Feedback.tsx index b39cbebef..1e6f91fd8 100644 --- a/apps/antalmanac/src/routes/Feedback.tsx +++ b/apps/antalmanac/src/routes/Feedback.tsx @@ -1,6 +1,6 @@ export const FEEDBACK_LINK = 'https://form.asana.com/?k=fZ3SGnuGknDmzTYdocgIUg&d=1208267282546207'; export default function Feedback() { - window.location.replace(FEEDBACK_LINK); + window.open(FEEDBACK_LINK, '_blank'); return null; } \ No newline at end of file