fix: redirect from mods page to search page on searching
This commit is contained in:
parent
ec4c434b66
commit
64b5c7194f
@ -6,14 +6,16 @@ import React, {
|
|||||||
useCallback,
|
useCallback,
|
||||||
useEffect,
|
useEffect,
|
||||||
useMemo,
|
useMemo,
|
||||||
|
useRef,
|
||||||
useState
|
useState
|
||||||
} from 'react'
|
} from 'react'
|
||||||
|
import { createSearchParams, useNavigate } from 'react-router-dom'
|
||||||
import { LoadingSpinner } from '../components/LoadingSpinner'
|
import { LoadingSpinner } from '../components/LoadingSpinner'
|
||||||
import { ModCard } from '../components/ModCard'
|
import { ModCard } from '../components/ModCard'
|
||||||
import { MOD_FILTER_LIMIT } from '../constants'
|
import { MOD_FILTER_LIMIT } from '../constants'
|
||||||
import { MetadataController } from '../controllers'
|
import { MetadataController } from '../controllers'
|
||||||
import { useAppSelector, useDidMount, useMuteLists } from '../hooks'
|
import { useAppSelector, useDidMount, useMuteLists } from '../hooks'
|
||||||
import { getModPageRoute } from '../routes'
|
import { appRoutes, getModPageRoute } from '../routes'
|
||||||
import '../styles/filters.css'
|
import '../styles/filters.css'
|
||||||
import '../styles/pagination.css'
|
import '../styles/pagination.css'
|
||||||
import '../styles/search.css'
|
import '../styles/search.css'
|
||||||
@ -227,6 +229,27 @@ export const ModsPage = () => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
const PageTitleRow = React.memo(() => {
|
const PageTitleRow = React.memo(() => {
|
||||||
|
const navigate = useNavigate()
|
||||||
|
const searchTermRef = useRef<HTMLInputElement>(null)
|
||||||
|
|
||||||
|
const handleSearch = () => {
|
||||||
|
const value = searchTermRef.current?.value || '' // Access the input value from the ref
|
||||||
|
if (value !== '') {
|
||||||
|
const searchParams = createSearchParams({
|
||||||
|
searchTerm: value,
|
||||||
|
searching: 'Mods'
|
||||||
|
})
|
||||||
|
navigate({ pathname: appRoutes.search, search: `?${searchParams}` })
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Handle "Enter" key press inside the input
|
||||||
|
const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>) => {
|
||||||
|
if (event.key === 'Enter') {
|
||||||
|
handleSearch()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className='IBMSecMain'>
|
<div className='IBMSecMain'>
|
||||||
<div className='SearchMainWrapper'>
|
<div className='SearchMainWrapper'>
|
||||||
@ -236,8 +259,19 @@ const PageTitleRow = React.memo(() => {
|
|||||||
<div className='SearchMain'>
|
<div className='SearchMain'>
|
||||||
<div className='SearchMainInside'>
|
<div className='SearchMainInside'>
|
||||||
<div className='SearchMainInsideWrapper'>
|
<div className='SearchMainInsideWrapper'>
|
||||||
<input type='text' className='SMIWInput' />
|
<input
|
||||||
<button className='btn btnMain SMIWButton' type='button'>
|
type='text'
|
||||||
|
className='SMIWInput'
|
||||||
|
ref={searchTermRef}
|
||||||
|
onKeyDown={handleKeyDown}
|
||||||
|
placeholder='Enter search term'
|
||||||
|
/>
|
||||||
|
|
||||||
|
<button
|
||||||
|
className='btn btnMain SMIWButton'
|
||||||
|
type='button'
|
||||||
|
onClick={handleSearch}
|
||||||
|
>
|
||||||
<svg
|
<svg
|
||||||
xmlns='http://www.w3.org/2000/svg'
|
xmlns='http://www.w3.org/2000/svg'
|
||||||
viewBox='0 0 512 512'
|
viewBox='0 0 512 512'
|
||||||
|
Loading…
Reference in New Issue
Block a user