feat(settings): add option to always open calendar in new tab (#488)

* feat(settings): add option to always open calendar in new tab

* fix: await setting

---------

Co-authored-by: doprz <52579214+doprz@users.noreply.github.com>
This commit is contained in:
Samuel Gunter
2025-01-20 23:18:00 -06:00
committed by GitHub
parent b74c698866
commit 009de62828
3 changed files with 39 additions and 2 deletions

View File

@@ -90,6 +90,7 @@ export default function Settings(): JSX.Element {
const [highlightConflicts, setHighlightConflicts] = useState<boolean>(false);
const [loadAllCourses, setLoadAllCourses] = useState<boolean>(false);
const [_enableDataRefreshing, setEnableDataRefreshing] = useState<boolean>(false);
const [calendarNewTab, setCalendarNewTab] = useState<boolean>(false);
const showMigrationDialog = useMigrationDialog();
@@ -122,12 +123,14 @@ export default function Settings(): JSX.Element {
enableHighlightConflicts,
enableScrollToLoad,
enableDataRefreshing,
alwaysOpenCalendarInNewTab,
} = await initSettings();
setEnableCourseStatusChips(enableCourseStatusChips);
setShowTimeLocation(enableTimeAndLocationInPopup);
setHighlightConflicts(enableHighlightConflicts);
setLoadAllCourses(enableScrollToLoad);
setEnableDataRefreshing(enableDataRefreshing);
setCalendarNewTab(alwaysOpenCalendarInNewTab);
};
fetchGitHubStats();
@@ -167,6 +170,11 @@ export default function Settings(): JSX.Element {
// console.log('enableDataRefreshing', newValue);
});
const l6 = OptionsStore.listen('alwaysOpenCalendarInNewTab', async ({ newValue }) => {
setCalendarNewTab(newValue);
// console.log('alwaysOpenCalendarInNewTab', newValue);
});
// Remove listeners when the component is unmounted
return () => {
OptionsStore.removeListener(l1);
@@ -174,6 +182,7 @@ export default function Settings(): JSX.Element {
OptionsStore.removeListener(l3);
OptionsStore.removeListener(l4);
OptionsStore.removeListener(l5);
OptionsStore.removeListener(l6);
window.removeEventListener('keydown', handleKeyPress);
};
@@ -431,6 +440,27 @@ export default function Settings(): JSX.Element {
<Divider size='auto' orientation='horizontal' />
<div className='flex items-center justify-between'>
<div className='max-w-xs'>
<Text variant='h4' className='text-ut-burntorange font-semibold'>
Always Open Calendar in New Tab
</Text>
<p className='text-sm text-gray-600'>
Always opens the calendar view in a new tab when navigating to the calendar
page. May prevent issues where the calendar refuses to open.
</p>
</div>
<SwitchButton
isChecked={calendarNewTab}
onChange={() => {
setCalendarNewTab(!calendarNewTab);
OptionsStore.set('alwaysOpenCalendarInNewTab', !calendarNewTab);
}}
/>
</div>
<Divider size='auto' orientation='horizontal' />
<div className='flex items-center justify-between'>
<div className='max-w-xs'>
<Text variant='h4' className='text-ut-burntorange font-semibold'>