mirror of
https://github.com/sct/overseerr.git
synced 2025-09-17 17:24:35 +02:00
fix(frontend): 'Recent Requests' slider should link to request list w/ same filter (#1235)
* fix(frontend): 'Recent Requests' slider should link to request list w/ same filter * fix(frontend): use 'all' instead of 'unavailable' filter for recent requests slider * refactor: use enum for request list filter
This commit is contained in:
@@ -38,7 +38,7 @@ const Discover: React.FC = () => {
|
|||||||
data: requests,
|
data: requests,
|
||||||
error: requestError,
|
error: requestError,
|
||||||
} = useSWR<RequestResultsResponse>(
|
} = useSWR<RequestResultsResponse>(
|
||||||
'/api/v1/request?filter=unavailable&take=10&sort=modified&skip=0',
|
'/api/v1/request?filter=all&take=10&sort=modified&skip=0',
|
||||||
{ revalidateOnMount: true }
|
{ revalidateOnMount: true }
|
||||||
);
|
);
|
||||||
|
|
||||||
@@ -63,7 +63,7 @@ const Discover: React.FC = () => {
|
|||||||
))}
|
))}
|
||||||
/>
|
/>
|
||||||
<div className="slider-header">
|
<div className="slider-header">
|
||||||
<Link href="/requests">
|
<Link href="/requests?filter=all">
|
||||||
<a className="slider-title">
|
<a className="slider-title">
|
||||||
<span>{intl.formatMessage(messages.recentrequests)}</span>
|
<span>{intl.formatMessage(messages.recentrequests)}</span>
|
||||||
<svg
|
<svg
|
||||||
|
@@ -17,13 +17,21 @@ const messages = defineMessages({
|
|||||||
sortModified: 'Last Modified',
|
sortModified: 'Last Modified',
|
||||||
});
|
});
|
||||||
|
|
||||||
type Filter = 'all' | 'pending' | 'approved' | 'processing' | 'available';
|
enum Filter {
|
||||||
|
ALL = 'all',
|
||||||
|
PENDING = 'pending',
|
||||||
|
APPROVED = 'approved',
|
||||||
|
PROCESSING = 'processing',
|
||||||
|
AVAILABLE = 'available',
|
||||||
|
UNAVAILABLE = 'unavailable',
|
||||||
|
}
|
||||||
|
|
||||||
type Sort = 'added' | 'modified';
|
type Sort = 'added' | 'modified';
|
||||||
|
|
||||||
const RequestList: React.FC = () => {
|
const RequestList: React.FC = () => {
|
||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
const intl = useIntl();
|
const intl = useIntl();
|
||||||
const [currentFilter, setCurrentFilter] = useState<Filter>('pending');
|
const [currentFilter, setCurrentFilter] = useState<Filter>(Filter.PENDING);
|
||||||
const [currentSort, setCurrentSort] = useState<Sort>('added');
|
const [currentSort, setCurrentSort] = useState<Sort>('added');
|
||||||
const [currentPageSize, setCurrentPageSize] = useState<number>(10);
|
const [currentPageSize, setCurrentPageSize] = useState<number>(10);
|
||||||
|
|
||||||
@@ -47,7 +55,12 @@ const RequestList: React.FC = () => {
|
|||||||
setCurrentSort(filterSettings.currentSort);
|
setCurrentSort(filterSettings.currentSort);
|
||||||
setCurrentPageSize(filterSettings.currentPageSize);
|
setCurrentPageSize(filterSettings.currentPageSize);
|
||||||
}
|
}
|
||||||
}, []);
|
|
||||||
|
// If filter value is provided in query, use that instead
|
||||||
|
if (Object.values(Filter).includes(router.query.filter as Filter)) {
|
||||||
|
setCurrentFilter(router.query.filter as Filter);
|
||||||
|
}
|
||||||
|
}, [router.query.filter]);
|
||||||
|
|
||||||
// Set filter values to local storage any time they are changed
|
// Set filter values to local storage any time they are changed
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
@@ -118,6 +131,9 @@ const RequestList: React.FC = () => {
|
|||||||
<option value="available">
|
<option value="available">
|
||||||
{intl.formatMessage(globalMessages.available)}
|
{intl.formatMessage(globalMessages.available)}
|
||||||
</option>
|
</option>
|
||||||
|
<option value="unavailable">
|
||||||
|
{intl.formatMessage(globalMessages.unavailable)}
|
||||||
|
</option>
|
||||||
</select>
|
</select>
|
||||||
</div>
|
</div>
|
||||||
<div className="flex flex-grow mb-2 sm:mb-0 lg:flex-grow-0">
|
<div className="flex flex-grow mb-2 sm:mb-0 lg:flex-grow-0">
|
||||||
@@ -167,11 +183,11 @@ const RequestList: React.FC = () => {
|
|||||||
<span className="text-2xl text-gray-400">
|
<span className="text-2xl text-gray-400">
|
||||||
{intl.formatMessage(globalMessages.noresults)}
|
{intl.formatMessage(globalMessages.noresults)}
|
||||||
</span>
|
</span>
|
||||||
{currentFilter !== 'all' && (
|
{currentFilter !== Filter.ALL && (
|
||||||
<div className="mt-4">
|
<div className="mt-4">
|
||||||
<Button
|
<Button
|
||||||
buttonType="primary"
|
buttonType="primary"
|
||||||
onClick={() => setCurrentFilter('all')}
|
onClick={() => setCurrentFilter(Filter.ALL)}
|
||||||
>
|
>
|
||||||
{intl.formatMessage(messages.showallrequests)}
|
{intl.formatMessage(messages.showallrequests)}
|
||||||
</Button>
|
</Button>
|
||||||
|
Reference in New Issue
Block a user