fix: clear search state when route to Homepage with asPath = /

pull/98/head
tiendn 4 months ago
parent ae52d64286
commit e80405b897
  1. 11
      src/features/messages/MessageSearch.tsx

@ -1,4 +1,5 @@
import { useState } from 'react'; import { useRouter } from 'next/router';
import { useEffect, useState } from 'react';
import { Fade } from '../../components/animations/Fade'; import { Fade } from '../../components/animations/Fade';
import { Card } from '../../components/layout/Card'; import { Card } from '../../components/layout/Card';
@ -38,6 +39,9 @@ export function MessageSearch() {
const [startTimeFilter, setStartTimeFilter] = useState<number | null>(null); const [startTimeFilter, setStartTimeFilter] = useState<number | null>(null);
const [endTimeFilter, setEndTimeFilter] = useState<number | null>(null); const [endTimeFilter, setEndTimeFilter] = useState<number | null>(null);
// Router
const router = useRouter();
// GraphQL query and results // GraphQL query and results
const { isValidInput, isError, isFetching, hasRun, messageList, isMessagesFound } = const { isValidInput, isError, isFetching, hasRun, messageList, isMessagesFound } =
useMessageSearchQuery( useMessageSearchQuery(
@ -72,6 +76,11 @@ export function MessageSearch() {
// Keep url in sync // Keep url in sync
useSyncQueryParam(QUERY_SEARCH_PARAM, isValidInput ? sanitizedInput : ''); useSyncQueryParam(QUERY_SEARCH_PARAM, isValidInput ? sanitizedInput : '');
// Reset query input when Router to homepage (no params)
useEffect(() => {
if (router.asPath === '/') setSearchInput('');
}, [router.asPath]);
return ( return (
<> <>
<SearchBar <SearchBar

Loading…
Cancel
Save