feat: report issue popup (#261)

* feat: report issue popup

* style: modified styles in feedback form

* chore: minor UI fixes

* chore: update useEffect

* chore: change width to 400px

---------

Co-authored-by: doprz <52579214+doprz@users.noreply.github.com>
Co-authored-by: Isaiah David Rodriguez <51803892+IsaDavRod@users.noreply.github.com>
This commit is contained in:
Sriram Hariharan
2024-10-12 20:31:26 -05:00
committed by GitHub
parent bd17e33537
commit 65ff6bfbbf
14 changed files with 1855 additions and 989 deletions

View File

@@ -1,22 +1,26 @@
import splashText from '@assets/insideJokes';
import createSchedule from '@pages/background/lib/createSchedule';
import { background } from '@shared/messages';
import { initSettings, OptionsStore } from '@shared/storage/OptionsStore';
import { UserScheduleStore } from '@shared/storage/UserScheduleStore';
import { openReportWindow } from '@shared/util/openReportWindow';
import Divider from '@views/components/common/Divider';
import ExtensionRoot from '@views/components/common/ExtensionRoot/ExtensionRoot';
import List from '@views/components/common/List';
import Text from '@views/components/common/Text/Text';
import useSchedules, { getActiveSchedule, replaceSchedule, switchSchedule } from '@views/hooks/useSchedules';
import { getUpdatedAtDateTimeString } from '@views/lib/getUpdatedAtDateTimeString';
import { openTabFromContentScript } from '@views/lib/openNewTabFromContentScript';
import clsx from 'clsx';
import useKC_DABR_WASM from 'kc-dabr-wasm';
import React, { useEffect, useState } from 'react';
import AddSchedule from '~icons/material-symbols/add';
import CalendarIcon from '~icons/material-symbols/calendar-month';
import Feedback from '~icons/material-symbols/flag';
import RefreshIcon from '~icons/material-symbols/refresh';
import SettingsIcon from '~icons/material-symbols/settings';
import { Button } from './common/Button';
import CourseStatus from './common/CourseStatus';
import DialogProvider from './common/DialogProvider/DialogProvider';
import { SmallLogo } from './common/LogoIcon';
@@ -34,10 +38,13 @@ export default function PopupMain(): JSX.Element {
useKC_DABR_WASM();
useEffect(() => {
initSettings().then(({ enableCourseStatusChips, enableDataRefreshing }) => {
const initAllSettings = async () => {
const { enableCourseStatusChips, enableDataRefreshing } = await initSettings();
setEnableCourseStatusChips(enableCourseStatusChips);
setEnableDataRefreshing(enableDataRefreshing);
});
};
initAllSettings();
const l1 = OptionsStore.listen('enableCourseStatusChips', async ({ newValue }) => {
setEnableCourseStatusChips(newValue);
@@ -68,7 +75,7 @@ export default function PopupMain(): JSX.Element {
const handleOpenOptions = async () => {
const url = chrome.runtime.getURL('/options.html');
await openTabFromContentScript(url);
background.openNewTab({ url });
};
const handleCalendarOpenOnClick = async () => {
@@ -93,6 +100,9 @@ export default function PopupMain(): JSX.Element {
<button className='bg-transparent px-2 py-1.25 btn' onClick={handleOpenOptions}>
<SettingsIcon className='size-6 color-ut-black' />
</button>
<button className='bg-transparent px-2 py-1.25 btn' onClick={openReportWindow}>
<Feedback className='size-6 color-ut-black' />
</button>
</div>
</div>
</div>
@@ -122,6 +132,16 @@ export default function PopupMain(): JSX.Element {
/>
)}
</List>
<div className='bottom-0 right-0 mt-2.5 w-full flex justify-end'>
<Button
variant='filled'
color='ut-burntorange'
className='h-fit p-0 btn'
onClick={() => createSchedule('New Schedule')}
>
<AddSchedule className='h-6 w-6' />
</Button>
</div>
</ScheduleDropdown>
</div>
{activeSchedule?.courses?.length === 0 && (