Added random sorting option for library (#1129)

* Update useGetVisibleLibraryMangas.ts

Begin implementation of random sort

* Update LibraryOptionsPanel.tsx

Added random sort option

* Update Library.types.ts

Adding random to LibrarySortMode types

* Moved sorting process to before filter

Changed the order of the sorting/filter process. Now sorts through entries before filtering them.

* Implementing Reviewer Feedback: Replacing Random Icon

Replaced icon with Replay icon from mui.

* Update SortRadioInput.tsx

Replaced random icon with replay icon from mui to replicate mihon functionality

* Fixed Formatting

* Update CHANGELOG.md

Added proposed changes from pull request.

* Update CHANGELOG.md

Co-authored-by: schroda <50052685+schroda@users.noreply.github.com>

---------

Co-authored-by: jburkh10 <jburkh10@terpmail.umd.edu>
Co-authored-by: schroda <50052685+schroda@users.noreply.github.com>
This commit is contained in:
themaskedshell
2026-07-20 19:01:28 -04:00
committed by GitHub
parent 8b8da30335
commit 08dcd932dc
6 changed files with 53 additions and 22 deletions

View File

@@ -15,7 +15,7 @@ import { useMemo } from 'react';
import uniqBy from 'lodash/fp/uniqBy';
import { CheckboxInput } from '@/base/components/inputs/CheckboxInput.tsx';
import { RadioInput } from '@/base/components/inputs/RadioInput.tsx';
import { SortRadioInput } from '@/base/components/inputs/SortRadioInput.tsx';
import { SortRadioInput, SortRadioInputRandom } from '@/base/components/inputs/SortRadioInput.tsx';
import { ThreeStateCheckboxInput } from '@/base/components/inputs/ThreeStateCheckboxInput.tsx';
import { OptionsTabs } from '@/base/components/modals/OptionsTabs.tsx';
import { requestManager } from '@/lib/requests/RequestManager.ts';
@@ -51,6 +51,7 @@ const SORT_OPTIONS: [LibrarySortMode, MessageDescriptor][] = [
['lastRead', msg`Recently read`],
['latestFetchedChapter', msg`Latest fetched chapter`],
['latestUploadedChapter', msg`Latest uploaded chapter`],
['random', msg`Random`],
];
export const LibraryOptionsPanel = ({
@@ -174,19 +175,33 @@ export const LibraryOptionsPanel = ({
);
}
if (key === 'sort') {
return SORT_OPTIONS.map(([mode, label]) => (
<SortRadioInput
key={mode}
label={t(label)}
checked={categoryLibraryOptions.sortBy === mode}
sortDescending={categoryLibraryOptions.sortDesc}
onClick={() =>
mode !== categoryLibraryOptions.sortBy
? updateCategoryLibraryOptions('sortBy', mode)
: updateCategoryLibraryOptions('sortDesc', !categoryLibraryOptions.sortDesc)
}
/>
));
return SORT_OPTIONS.map(([mode, label]) =>
mode === 'random' ? (
<SortRadioInputRandom
key={mode}
label={t(label)}
checked={categoryLibraryOptions.sortBy === mode}
sortDescending={categoryLibraryOptions.sortDesc}
onClick={() =>
mode !== categoryLibraryOptions.sortBy
? updateCategoryLibraryOptions('sortBy', mode)
: updateCategoryLibraryOptions('sortDesc', !categoryLibraryOptions.sortDesc)
}
/>
) : (
<SortRadioInput
key={mode}
label={t(label)}
checked={categoryLibraryOptions.sortBy === mode}
sortDescending={categoryLibraryOptions.sortDesc}
onClick={() =>
mode !== categoryLibraryOptions.sortBy
? updateCategoryLibraryOptions('sortBy', mode)
: updateCategoryLibraryOptions('sortDesc', !categoryLibraryOptions.sortDesc)
}
/>
),
);
}
if (key === 'display') {
return (