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 new file mode 100644 index 000000000..56f1cbe66 --- /dev/null +++ b/apps/antalmanac/src/components/HelpMenu.tsx @@ -0,0 +1,158 @@ +import FeedbackIcon from '@mui/icons-material/Feedback'; +import HelpIcon from '@mui/icons-material/Help'; +import LightbulbIcon from '@mui/icons-material/Lightbulb'; +import { Fab, Tooltip, Box, IconButton, Paper, keyframes } from '@mui/material'; +import { useState } from 'react'; + +import HelpBox from '$components/RightPane/CoursePane/SearchForm/HelpBox'; +import { Tutorial } from '$components/Tutorial'; +import Feedback from '$routes/Feedback'; + +export function HelpMenu() { + const [isHovered, setIsHovered] = useState(false); + const [showHelpBox, setShowHelpBox] = useState(false); + + const handleMouseEnter = () => { + setIsHovered(true); + }; + + const handleMouseLeave = () => { + setIsHovered(false); + }; + + const openFeedbackForm = () => { + Feedback(); + }; + + const openHelpBox = () => { + setShowHelpBox(true); + }; + + const closeHelpBox = () => { + setShowHelpBox(false); + }; + + const riseAnimation = keyframes` + 0% { + opacity: 0; + transform: translateY(20px); + } + 100% { + opacity: 1; + transform: translateY(0); + } +`; + + + return ( + + {/* Main Help Menu Icon */} + + + + + + + {/* Hovered Icons */} + {isHovered && ( + + {/* Tutorial Button */} + + + + + {/* Feedback Form Button */} + + + + + + + {/* Help Box Button */} + + + + + + + )} + + {showHelpBox && ( + + + + + + )} + + ); +} + +export default HelpMenu; diff --git a/apps/antalmanac/src/components/RightPane/CoursePane/SearchForm/SearchForm.tsx b/apps/antalmanac/src/components/RightPane/CoursePane/SearchForm/SearchForm.tsx index 83b909602..cb19f4921 100644 --- a/apps/antalmanac/src/components/RightPane/CoursePane/SearchForm/SearchForm.tsx +++ b/apps/antalmanac/src/components/RightPane/CoursePane/SearchForm/SearchForm.tsx @@ -12,6 +12,7 @@ import LegacySearch from './LegacySearch'; import PrivacyPolicyBanner from './PrivacyPolicyBanner'; import TermSelector from './TermSelector'; +import { HelpMenu } from '$components/HelpMenu'; import analyticsEnum, { logAnalytics } from '$lib/analytics'; import { getLocalStorageHelpBoxDismissalTime, setLocalStorageHelpBoxDismissalTime } from '$lib/localStorage'; import { useCoursePaneStore } from '$stores/CoursePaneStore'; @@ -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/Feedback.tsx b/apps/antalmanac/src/routes/Feedback.tsx index 41d9d3715..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 diff --git a/apps/antalmanac/src/routes/Home.tsx b/apps/antalmanac/src/routes/Home.tsx index e326eef86..1be54bc64 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 { ScheduleCalendar } from '$components/Calendar/CalendarRoot'; import Header from '$components/Header'; +import { HelpMenu } from '$components/HelpMenu'; import NotificationSnackbar from '$components/NotificationSnackbar'; import PatchNotes from '$components/PatchNotes'; import ScheduleManagement from '$components/SharedRoot'; @@ -77,8 +78,6 @@ function DesktopHome() { - - ); }