smedmunds/TriggerFrontend
1
0
Fork 0
Code Issues Pull Requests Actions Projects Releases Wiki Activity

Bug fixes

Browse Source
This commit is contained in:
Sean Edmunds
2025-04-03 13:57:08 -05:00
parent 6493a458ff
commit d232a7bdb0
13 changed files with 77 additions and 35 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
src/components/HelpModal/HelpModal.tsx
View File

@@ -21,6 +21,7 @@ export function HelpModal({
classNames={modalClasses}
opened={providerModalOpened}
fullScreen={isMobile}
centered
onClose={() => {
setSearchValue('');
setProviderLabel('Google Search');

1
src/components/WeatherModal/WeatherModal.tsx
View File

@@ -39,6 +39,7 @@ export function WeatherModal({
className={modalClasses.helpModal}
classNames={modalClasses}
opened={weatherModalOpened}
centered
onClose={() => {
setSearchValue('');
setProviderLabel('Google Search');

13
src/pages/settings/components/Applications/Applications.tsx
View File

@@ -46,6 +46,7 @@ const ApplicationSettings = () => {
const [searchValue, setSearchValue] = useState('');
const [debouncedSearch] = useDebouncedValue(searchValue, 500);
const [dragging, setDragging] = useState(false);
const [isOpen, setIsOpen] = useState(false);
const reorder = (list: any, startIndex: any, endIndex: any) => {
const result = Array.from(list);
@@ -319,7 +320,12 @@ const ApplicationSettings = () => {
<Grid columns={18} w={'75%'}>
{applicationData?.map((application: Application) => (
<GridCol span={6} key={application.id}>
<Popover withArrow withOverlay withinPortal={false}>
<Popover
withArrow
withOverlay
withinPortal={false}
closeOnClickOutside={!isOpen}
>
<Popover.Target>
<Box
onClick={(e) => {
@@ -335,7 +341,10 @@ const ApplicationSettings = () => {
</Box>
</Popover.Target>
<Popover.Dropdown>
<DebouncedApplication application={application} />
<DebouncedApplication
application={application}
setIsOpen={setIsOpen}
/>
</Popover.Dropdown>
</Popover>
</GridCol>

19
src/pages/settings/components/Applications/DebouncedApplication.tsx
View File

@@ -17,7 +17,10 @@ import { cardClasses, textInputClasses } from 'styles';
import type { Application } from 'types';
import DeleteItemModal from '../Shared/DeleteItemModal';
function DebouncedApplication({ application }: { application: Application }) {
function DebouncedApplication({
application,
setIsOpen,
}: { application: Application; setIsOpen: any }) {
const { theme, handleDelete } = useCommonHooks();
const [modalOpened, { open: openModal, close: closeModal }] = useDisclosure(false);
const { mutateAsync } = useMutationAPI();
@@ -25,7 +28,10 @@ function DebouncedApplication({ application }: { application: Application }) {
const [app, setApp] = useState<Application>(application);
const [update, setUpdate] = useState<any>();
const [debounced] = useDebouncedValue(update, 1000);
const handleClose = () => {
setIsOpen(false);
closeModal();
};
useEffect(() => {
if (debounced && Object.keys(debounced).length > 0) {
mutateAsync({ method: 'PATCH', endpoint: 'api/apps', body: debounced });
@@ -41,7 +47,7 @@ function DebouncedApplication({ application }: { application: Application }) {
<Card className={cardClasses.settingsItem} classNames={cardClasses}>
<DeleteItemModal
modalOpened={modalOpened}
handleClose={closeModal}
handleClose={handleClose}
title='Delete Application'
body={
<Stack gap={0} w={'100%'} h={'150px'} align='center'>
@@ -64,7 +70,7 @@ function DebouncedApplication({ application }: { application: Application }) {
styles={{ label: { color: 'black' } }}
onClick={() => {
handleDelete(app, 'api/apps');
closeModal();
handleClose();
}}
>
Delete
@@ -72,9 +78,7 @@ function DebouncedApplication({ application }: { application: Application }) {
<Button
color={'grey'}
styles={{ label: { color: 'black' } }}
onClick={() => {
closeModal();
}}
onClick={handleClose}
>
Cancel
</Button>
@@ -92,6 +96,7 @@ function DebouncedApplication({ application }: { application: Application }) {
right={16}
color='red'
onClick={() => {
setIsOpen(true);
openModal();
}}
>

13
src/pages/settings/components/Bookmarks/DebouncedBookmarkItem.tsx
View File

@@ -27,7 +27,10 @@ function DebouncedBookmarkItem({
const [bookmark, setBookmark] = useState<Bookmark>(bookmarkItem);
const [update, setUpdate] = useState<any>({});
const [debounced] = useDebouncedValue(update, 1000);
const handleClose = () => {
setIsOpen(false);
closeModal();
};
useEffect(() => {
if (Object.keys(debounced).length) {
mutateAsync({ method: 'PATCH', endpoint: 'api/links', body: debounced });
@@ -44,7 +47,7 @@ function DebouncedBookmarkItem({
<Card className={cardClasses.settingsItem} classNames={cardClasses}>
<DeleteItemModal
modalOpened={modalOpened}
handleClose={closeModal}
handleClose={handleClose}
body={
<Stack gap={0} w={'100%'} h={'150px'} align='center'>
<Text>Are you sure you want to delete this bookmark?</Text>
@@ -66,7 +69,7 @@ function DebouncedBookmarkItem({
styles={{ label: { color: 'black' } }}
onClick={() => {
handleDelete(bookmark, 'api/links');
closeModal();
handleClose();
}}
>
Delete
@@ -74,9 +77,7 @@ function DebouncedBookmarkItem({
<Button
color={'grey'}
styles={{ label: { color: 'black' } }}
onClick={() => {
closeModal();
}}
onClick={handleClose}
>
Cancel
</Button>

16
src/pages/settings/components/Search/DebouncedSearchProvider.tsx
View File

@@ -16,7 +16,7 @@ import { cardClasses, textInputClasses } from 'styles';
import type { Provider } from 'types';
import DeleteItemModal from '../Shared/DeleteItemModal';
function DebouncedSearchProvider({ searchProvider }: any) {
function DebouncedSearchProvider({ searchProvider, setIsOpen }: any) {
const { theme, handleDelete } = useCommonHooks();
const [modalOpened, { open: openModal, close: closeModal }] = useDisclosure(false);
const { mutateAsync } = useMutationAPI();
@@ -25,6 +25,11 @@ function DebouncedSearchProvider({ searchProvider }: any) {
const [update, setUpdate] = useState<any>({});
const [debounced] = useDebouncedValue(update, 1000);
const handleClose = () => {
setIsOpen(false);
closeModal();
};
useEffect(() => {
if (Object.keys(debounced).length) {
mutateAsync({ method: 'PATCH', endpoint: 'api/providers', body: debounced });
@@ -41,7 +46,7 @@ function DebouncedSearchProvider({ searchProvider }: any) {
<Card className={cardClasses.settingsItem} classNames={cardClasses}>
<DeleteItemModal
modalOpened={modalOpened}
handleClose={closeModal}
handleClose={handleClose}
title={'Delete Search Provider'}
body={
<Stack gap={0} w={'100%'} h={'150px'} align='center'>
@@ -64,7 +69,7 @@ function DebouncedSearchProvider({ searchProvider }: any) {
styles={{ label: { color: 'black' } }}
onClick={() => {
handleDelete(provider, 'api/providers');
closeModal();
handleClose();
}}
>
Delete
@@ -72,9 +77,7 @@ function DebouncedSearchProvider({ searchProvider }: any) {
<Button
color={'grey'}
styles={{ label: { color: 'black' } }}
onClick={() => {
closeModal();
}}
onClick={handleClose}
>
Cancel
</Button>
@@ -92,6 +95,7 @@ function DebouncedSearchProvider({ searchProvider }: any) {
right={16}
color='red'
onClick={() => {
setIsOpen(true);
openModal();
}}
>

13
src/pages/settings/components/Search/SearchProviders.tsx
View File

@@ -37,6 +37,7 @@ const SearchProviderSettings = () => {
const [modalOpened, { open: openModal, close: closeModal }] = useDisclosure(false);
const [searchValue, setSearchValue] = useState('');
const [debouncedSearch] = useDebouncedValue(searchValue, 500);
const [isOpen, setIsOpen] = useState(false);
const handleClose = () => {
setNewProvider(defaultProvider);
@@ -151,7 +152,12 @@ const SearchProviderSettings = () => {
<Grid columns={18} w={'75%'}>
{providerData?.map((provider: Provider) => (
<GridCol span={isMobile ? 18 : 6} key={provider.id}>
<Popover withArrow withOverlay withinPortal={false}>
<Popover
withArrow
withOverlay
withinPortal={false}
closeOnClickOutside={!isOpen}
>
<Popover.Target>
<Box
onClick={(e) => {
@@ -162,7 +168,10 @@ const SearchProviderSettings = () => {
</Box>
</Popover.Target>
<Popover.Dropdown>
<DebouncedSearchProvider searchProvider={provider} />
<DebouncedSearchProvider
searchProvider={provider}
setIsOpen={setIsOpen}
/>
</Popover.Dropdown>
</Popover>
</GridCol>

3
src/pages/settings/components/Shared/AddItemModal.tsx
View File

@@ -15,8 +15,9 @@ function AddItemModal({ modalOpened, handleClose, body, title }: any) {
style={modalStyle}
closeOnEscape
closeOnClickOutside
centered
>
<Modal.Overlay style={{ zIndex: 999 }} />
<Modal.Overlay style={{ zIndex: 999, backdropFilter: 'blur(5px)' }} />
<Modal.Content style={{ zIndex: 1000 }}>
<Modal.Header>
<Modal.Title>{title}</Modal.Title>

3
src/pages/settings/components/Shared/DeleteItemModal.tsx
View File

@@ -15,8 +15,9 @@ function DeleteItemModal({ modalOpened, handleClose, body, title }: any) {
style={modalStyle}
closeOnEscape
closeOnClickOutside
centered
>
<Modal.Overlay style={{ zIndex: 999 }} />
<Modal.Overlay style={{ zIndex: 999, backdropFilter: 'blur(5px)' }} />
<Modal.Content style={{ zIndex: 1000 }}>
<Modal.Header>
<Modal.Title>{title}</Modal.Title>

3
src/pages/settings/components/Theming/ThemeModal.tsx
View File

@@ -126,6 +126,7 @@ function ThemeModal({
opened={opened}
onClose={handleClose}
fullScreen={isMobile}
centered
style={{
'--color-text-pri': theme.primaryColor,
'--color-text-acc': theme.accentColor,
@@ -135,7 +136,7 @@ function ThemeModal({
'--image-background': `url("${theme.backgroundImage}")`,
}}
>
<Modal.Overlay />
<Modal.Overlay style={{ backdropFilter: 'blur(5px)' }} />
<Modal.Content>
<Modal.Header style={{ justifyContent: 'center' }}>
<Group pos={'absolute'}>

3
src/pages/settings/components/Theming/ThemePlaylistModal.tsx
View File

@@ -45,6 +45,7 @@ function ThemePlaylistModal({
classNames={modalClasses}
opened={opened}
fullScreen={isMobile}
centered
onClose={() => {
handleClose();
setThemeList('[]');
@@ -58,7 +59,7 @@ function ThemePlaylistModal({
'--image-background': `url("${theme.backgroundImage}")`,
}}
>
<Modal.Overlay />
<Modal.Overlay style={{ backdropFilter: 'blur(5px)' }} />
<Modal.Content>
<Modal.Header style={{ justifyContent: 'center' }}>
<Group pos={'absolute'}>

14
src/pages/settings/components/WoL/DebouncedWolClient.tsx
View File

@@ -15,7 +15,7 @@ import { FiTrash } from 'react-icons/fi';
import { cardClasses, textInputClasses } from 'styles';
import DeleteItemModal from '../Shared/DeleteItemModal';
function DebouncedWolClient({ wolClient }: any) {
function DebouncedWolClient({ wolClient, setIsOpen }: any) {
const { theme, handleDelete } = useCommonHooks();
const [modalOpened, { open: openModal, close: closeModal }] = useDisclosure(false);
const { mutateAsync } = useMutationAPI();
@@ -23,6 +23,10 @@ function DebouncedWolClient({ wolClient }: any) {
const [client, setClient] = useState<any>(wolClient);
const [update, setUpdate] = useState({});
const [debounced] = useDebouncedValue(update, 1000);
const handleClose = () => {
setIsOpen(false);
closeModal();
};
useEffect(() => {
if (Object.keys(debounced).length) {
@@ -40,7 +44,7 @@ function DebouncedWolClient({ wolClient }: any) {
<Card className={cardClasses.settingsItem} classNames={cardClasses}>
<DeleteItemModal
modalOpened={modalOpened}
handleClose={closeModal}
handleClose={handleClose}
title={'Delete WoL Client'}
body={
<Stack gap={0} w={'100%'} h={'150px'} align='center'>
@@ -63,7 +67,7 @@ function DebouncedWolClient({ wolClient }: any) {
styles={{ label: { color: 'black' } }}
onClick={() => {
handleDelete(client, 'api/WolClients');
closeModal();
handleClose();
}}
>
Delete
@@ -71,9 +75,7 @@ function DebouncedWolClient({ wolClient }: any) {
<Button
color={'grey'}
styles={{ label: { color: 'black' } }}
onClick={() => {
closeModal();
}}
onClick={handleClose}
>
Cancel
</Button>

10
src/pages/settings/components/WoL/WolClients.tsx
View File

@@ -35,6 +35,7 @@ const WolClientSettings = () => {
const [modalOpened, { open: openModal, close: closeModal }] = useDisclosure(false);
const [searchValue, setSearchValue] = useState('');
const [debouncedSearch] = useDebouncedValue(searchValue, 500);
const [isOpen, setIsOpen] = useState(false);
const handleClose = () => {
setNewWolClient(defaultWolClient);
@@ -134,7 +135,12 @@ const WolClientSettings = () => {
<Grid columns={18} w={'75%'}>
{wolClients?.map((client: WolClient) => (
<GridCol w={'100%'} span={isMobile ? 18 : 6} key={client.id}>
<Popover withArrow withOverlay withinPortal={false}>
<Popover
withArrow
withOverlay
withinPortal={false}
closeOnClickOutside={!isOpen}
>
<Popover.Target>
<Group
onClick={(e) => {
@@ -146,7 +152,7 @@ const WolClientSettings = () => {
</Group>
</Popover.Target>
<Popover.Dropdown>
<DebouncedWolClient wolClient={client} />
<DebouncedWolClient wolClient={client} setIsOpen={setIsOpen} />
</Popover.Dropdown>
</Popover>
</GridCol>