mirrors/jellyfin-web
1
0
Fork 0
mirror of https://github.com/jellyfin/jellyfin-web synced 2025-03-30 19:56:21 +00:00
Code Activity

Refactor Search Page

Browse source
This commit is contained in:
grafixeyehero 2024-06-11 00:23:57 +03:00
parent e1d17a0a6b
commit 9352ec12dc
10 changed files with 660 additions and 498 deletions
Download patch file Download diff file Expand all files Collapse all files

45
src/apps/stable/routes/search.tsx
View file

@ -1,24 +1,25 @@
import React, { type FC, useEffect, useState } from 'react';
import { useSearchParams } from 'react-router-dom';
import Page from 'components/Page';
import SearchFields from 'components/search/SearchFields';
import SearchResults from 'components/search/SearchResults';
import SearchSuggestions from 'components/search/SearchSuggestions';
import LiveTVSearchResults from 'components/search/LiveTVSearchResults';
import { useDebounceValue } from 'usehooks-ts';
import { usePrevious } from 'hooks/usePrevious';
import globalize from 'scripts/globalize';
import Page from 'components/Page';
import SearchFields from 'components/search/SearchFields';
import SearchSuggestions from 'components/search/SearchSuggestions';
import SearchResults from 'components/search/SearchResults';
const COLLECTION_TYPE_PARAM = 'collectionType';
const PARENT_ID_PARAM = 'parentId';
const QUERY_PARAM = 'query';
const SERVER_ID_PARAM = 'serverId';
const Search: FC = () => {
const [ searchParams, setSearchParams ] = useSearchParams();
const [searchParams, setSearchParams] = useSearchParams();
const parentIdQuery = searchParams.get(PARENT_ID_PARAM) || undefined;
const collectionTypeQuery = searchParams.get(COLLECTION_TYPE_PARAM) || undefined;
const urlQuery = searchParams.get(QUERY_PARAM) || '';
const [ query, setQuery ] = useState(urlQuery);
const [query, setQuery] = useState(urlQuery);
const prevQuery = usePrevious(query, '');
const [debouncedQuery] = useDebounceValue(query, 500);
useEffect(() => {
if (query !== prevQuery) {
@ -49,23 +50,17 @@ const Search: FC = () => {
className='mainAnimatedPage libraryPage allLibraryPage noSecondaryNavPage'
>
<SearchFields query={query} onSearch={setQuery} />
{!query
&& <SearchSuggestions
parentId={searchParams.get(PARENT_ID_PARAM)}
{!query ? (
<SearchSuggestions
parentId={parentIdQuery}
/>
}
<SearchResults
serverId={searchParams.get(SERVER_ID_PARAM) || window.ApiClient.serverId()}
parentId={searchParams.get(PARENT_ID_PARAM)}
collectionType={searchParams.get(COLLECTION_TYPE_PARAM)}
query={query}
/>
<LiveTVSearchResults
serverId={searchParams.get(SERVER_ID_PARAM) || window.ApiClient.serverId()}
parentId={searchParams.get(PARENT_ID_PARAM)}
collectionType={searchParams.get(COLLECTION_TYPE_PARAM)}
query={query}
/>
) : (
<SearchResults
parentId={parentIdQuery}
collectionType={collectionTypeQuery}
query={debouncedQuery}
/>
)}
</Page>
);
};