From acb893aca6eddd0f8d4855aa4769a6cf9703be6e Mon Sep 17 00:00:00 2001 From: Jake Robertson Date: Wed, 4 Dec 2024 18:44:40 -0800 Subject: [PATCH] minor theme fixes --- src/renderer/components/about/About.tsx | 2 +- .../downloads/DeleteDownloadsModal.tsx | 35 +++++++++++++++++++ .../components/downloads/MyDownloads.tsx | 25 +++++-------- src/renderer/components/library/Library.tsx | 15 ++++---- src/renderer/index.tsx | 6 +++- src/renderer/services/ipc.tsx | 2 +- 6 files changed, 59 insertions(+), 26 deletions(-) create mode 100644 src/renderer/components/downloads/DeleteDownloadsModal.tsx diff --git a/src/renderer/components/about/About.tsx b/src/renderer/components/about/About.tsx index 6c494bed1..d43c5b269 100644 --- a/src/renderer/components/about/About.tsx +++ b/src/renderer/components/about/About.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; const { ipcRenderer } = require('electron'); -import { Title, Group } from '@mantine/core'; +import { Group } from '@mantine/core'; import packageJson from '../../../../package.json'; import ipcChannels from '@/common/constants/ipcChannels.json'; import { IconGitFork, IconHome, IconNotebook, IconScale } from '@tabler/icons'; diff --git a/src/renderer/components/downloads/DeleteDownloadsModal.tsx b/src/renderer/components/downloads/DeleteDownloadsModal.tsx new file mode 100644 index 000000000..c1800bf38 --- /dev/null +++ b/src/renderer/components/downloads/DeleteDownloadsModal.tsx @@ -0,0 +1,35 @@ +import React from 'react'; +import { Group } from '@mantine/core'; +import DefaultModal from '../general/DefaultModal'; +import DefaultText from '../general/DefaultText'; +import DefaultButton from '../general/DefaultButton'; + +type Props = { + count: number; + showing: boolean; + deleteFunc: () => void; + close: () => void; +}; + +const DeleteDownloadsModal: React.FC = (props: Props) => { + const onDelete = () => { + props.deleteFunc(); + props.close(); + }; + + return ( + + + Are you sure you want to delete {props.count} downloaded chapters? + + + Cancel + + Delete + + + + ); +}; + +export default DeleteDownloadsModal; diff --git a/src/renderer/components/downloads/MyDownloads.tsx b/src/renderer/components/downloads/MyDownloads.tsx index e016ec08a..973f0de29 100644 --- a/src/renderer/components/downloads/MyDownloads.tsx +++ b/src/renderer/components/downloads/MyDownloads.tsx @@ -4,7 +4,6 @@ const { ipcRenderer } = require('electron'); import { useRecoilValue } from 'recoil'; import { Accordion, Badge, Group, Stack } from '@mantine/core'; import { IconTrash } from '@tabler/icons'; -import { openConfirmModal } from '@mantine/modals'; import ipcChannels from '@/common/constants/ipcChannels.json'; import library from '@/renderer/services/library'; import { customDownloadsDirState } from '@/renderer/state/settingStates'; @@ -14,6 +13,7 @@ import DefaultCheckbox from '../general/DefaultCheckbox'; import DefaultText from '../general/DefaultText'; import DefaultButton from '../general/DefaultButton'; import DefaultTitle from '../general/DefaultTitle'; +import DeleteDownloadsModal from './DeleteDownloadsModal'; const defaultDownloadsDir = await ipcRenderer.invoke(ipcChannels.GET_PATH.DEFAULT_DOWNLOADS_DIR); @@ -21,6 +21,7 @@ const MyDownloads: React.FC = () => { const [seriesList, setSeriesList] = useState([]); const [chapterLists, setChapterLists] = useState<{ [key: string]: Chapter[] }>({}); const [checkedChapters, setCheckedChapters] = useState([]); + const [showingDeleteModal, setShowingDeleteModal] = useState(false); const customDownloadsDir = useRecoilValue(customDownloadsDirState); const loadDownloads = async () => { @@ -71,21 +72,7 @@ const MyDownloads: React.FC = () => { const count = new Set(checkedChapters).size; if (count > 1) { - openConfirmModal({ - title: 'Deleting downloaded chapters', - children: ( - - Are you sure you want to delete{' '} - - {count} - {' '} - downloaded chapters? - - ), - labels: { confirm: 'Delete', cancel: 'Cancel' }, - confirmProps: { color: 'red' }, - onConfirm: deleteChecked, - }); + setShowingDeleteModal(true); } else { deleteChecked(); } @@ -146,6 +133,12 @@ const MyDownloads: React.FC = () => { return ( <> + setShowingDeleteModal(false)} + /> {renderHeader()} {seriesList.length === 0 || Object.keys(chapterLists).length === 0 ? ( diff --git a/src/renderer/components/library/Library.tsx b/src/renderer/components/library/Library.tsx index 2c8d0b024..12fde4c7c 100644 --- a/src/renderer/components/library/Library.tsx +++ b/src/renderer/components/library/Library.tsx @@ -1,7 +1,7 @@ import React, { useEffect, useState } from 'react'; import { Series } from '@tiyo/common'; import { useRecoilState, useRecoilValue, useSetRecoilState } from 'recoil'; -import { ScrollArea, Text } from '@mantine/core'; +import { ScrollArea } from '@mantine/core'; import LibraryControlBar from './LibraryControlBar'; import { LibrarySort, LibraryView, ProgressFilter } from '@/common/models/types'; import { @@ -25,6 +25,7 @@ import LibraryList from './LibraryList'; import library from '@/renderer/services/library'; import EditCategoriesModal from './EditCategoriesModal'; import LibraryControlBarMultiSelect from './LibraryControlBarMultiSelect'; +import DefaultText from '../general/DefaultText'; type Props = unknown; @@ -128,19 +129,19 @@ const Library: React.FC = () => { const renderEmptyMessage = () => { return ( - + Your library is empty. Install{' '} - + Plugins - {' '} + {' '} from the tab on the left,
and then go to{' '} - + Add Series - {' '} + {' '} to start building your library. - + ); }; diff --git a/src/renderer/index.tsx b/src/renderer/index.tsx index 6b6b9d9b7..e275db9a4 100644 --- a/src/renderer/index.tsx +++ b/src/renderer/index.tsx @@ -10,6 +10,7 @@ import { MantineProvider } from '@mantine/core'; import { ErrorBoundary } from './components/general/ErrorBoundary'; import { themeState } from './state/settingStates'; import { themeProps, THEMES } from './util/themes'; +import { Theme } from '@/common/models/types'; const main = document.createElement('main'); document.body.appendChild(main); @@ -18,8 +19,11 @@ const root = createRoot(main); function Root() { const theme = useRecoilValue(themeState); + // TODO hack to ignore some remaning theme changes + const forceColorScheme = theme === Theme.Light ? 'light' : 'dark'; + return ( - +
diff --git a/src/renderer/services/ipc.tsx b/src/renderer/services/ipc.tsx index ea1ffc9db..db373e5a2 100644 --- a/src/renderer/services/ipc.tsx +++ b/src/renderer/services/ipc.tsx @@ -99,7 +99,7 @@ export const createRendererIpcHandlers = () => { Houdoku v{updateInfo.version} was released on{' '} {new Date(updateInfo.releaseDate).toLocaleDateString()}. - + {parse(updateInfo.releaseNotes as string, { transform(reactNode) {