kopia lustrzana https://github.com/Stopka/fedisearch
Stats page now stores the search query in url
rodzic
861e2a1476
commit
75c9fd63e7
|
@ -16,8 +16,6 @@ const CACHE_KEY = 'stats'
|
|||
|
||||
const handleGetStats = async (req: NextApiRequest, res: NextApiResponse<StatsResponse>): Promise<void> => {
|
||||
const query = await statsRequestSchema.parseAsync(req.query)
|
||||
query.sortBy = query.sortBy ?? 'nodeCount'
|
||||
query.sortWay = query.sortWay ?? 'desc'
|
||||
const cacheKey = `${CACHE_KEY}_${query.sortWay}_${query.sortBy}`
|
||||
if (!cache.has(cacheKey)) {
|
||||
console.info('Retrieving new stats', { cacheKey, query })
|
||||
|
|
|
@ -56,8 +56,8 @@ const Feeds: React.FC<InferGetServerSidePropsType<typeof getServerSideProps>> =
|
|||
setResults([])
|
||||
setHasMore(false)
|
||||
setLoaded(false)
|
||||
router.query = query
|
||||
router.push(router)
|
||||
|
||||
router.push({ query })
|
||||
|
||||
if ((query.search ?? '').length < 1) {
|
||||
console.info('Query too short.')
|
||||
|
|
|
@ -54,8 +54,7 @@ const Nodes: React.FC<InferGetServerSidePropsType<typeof getServerSideProps>> =
|
|||
const loadNewQueryResults = () => {
|
||||
console.info('Cancelling searches')
|
||||
source.cancel('New query on the way')
|
||||
router.query = query
|
||||
router.push(router)
|
||||
router.push({ query })
|
||||
setResults([])
|
||||
setHasMore(false)
|
||||
setLoaded(false)
|
||||
|
|
|
@ -8,23 +8,24 @@ import axios from 'axios'
|
|||
import { StatsResponse, statsResponseSchema } from '../types/StatsResponse'
|
||||
import SoftwareBadge from '../components/badges/SoftwareBadge'
|
||||
import ProgressBar from '../components/ProgressBar'
|
||||
import { StatsRequestSortBy } from '../types/StatsRequest'
|
||||
import { StatsRequest, statsRequestSchema, StatsRequestSortBy } from '../types/StatsRequest'
|
||||
import SortToggle from '../components/SortToggle'
|
||||
import getMatomo from '../lib/getMatomo'
|
||||
import { Sort } from '../types/Sort'
|
||||
import { useRouter } from 'next/router'
|
||||
|
||||
let source = axios.CancelToken.source()
|
||||
|
||||
const Stats: React.FC<InferGetServerSidePropsType<typeof getServerSideProps>> = ({ matomoConfig }) => {
|
||||
const router = useRouter()
|
||||
const routerQuery = statsRequestSchema.parse(router.query)
|
||||
console.log('Router query', routerQuery)
|
||||
const [query, setQuery] = useState<StatsRequest>(routerQuery)
|
||||
const [loading, setLoading] = useState<boolean>(true)
|
||||
const [loaded, setLoaded] = useState<boolean>(false)
|
||||
const [stats, setStats] = useState<StatsResponse | null>(null)
|
||||
const [sort, setSort] = useState<Sort>({
|
||||
sortBy: 'nodeCount', sortWay: 'desc'
|
||||
})
|
||||
|
||||
const toggleSort = (sortBy: StatsRequestSortBy) => {
|
||||
const sortWay = sort.sortBy === sortBy && sort.sortWay === 'asc' ? 'desc' : 'asc'
|
||||
const sortWay = query.sortBy === sortBy && query.sortWay === 'asc' ? 'desc' : 'asc'
|
||||
getMatomo(matomoConfig).trackEvent({
|
||||
category: 'stats',
|
||||
action: 'sort',
|
||||
|
@ -35,19 +36,20 @@ const Stats: React.FC<InferGetServerSidePropsType<typeof getServerSideProps>> =
|
|||
}
|
||||
]
|
||||
})
|
||||
setSort({
|
||||
sortBy: sortBy,
|
||||
sortWay: sortWay
|
||||
})
|
||||
const newQuery:StatsRequest = { ...query }
|
||||
newQuery.sortBy = sortBy
|
||||
newQuery.sortWay = sortWay
|
||||
setQuery(newQuery)
|
||||
}
|
||||
|
||||
const retrieveStats = async () => {
|
||||
console.info('Retrieving stats', { sort })
|
||||
console.info('Retrieving stats', { query })
|
||||
source = axios.CancelToken.source()
|
||||
setLoading(true)
|
||||
await router.push({ query })
|
||||
try {
|
||||
const response = await axios.get('/api/stats', {
|
||||
params: sort,
|
||||
params: query,
|
||||
cancelToken: source.token
|
||||
})
|
||||
const stats = await statsResponseSchema.parseAsync(response.data)
|
||||
|
@ -67,7 +69,7 @@ const Stats: React.FC<InferGetServerSidePropsType<typeof getServerSideProps>> =
|
|||
}
|
||||
useEffect(() => {
|
||||
loadStats()
|
||||
}, [sort])
|
||||
}, [query])
|
||||
const sum = {
|
||||
nodeCount: 0,
|
||||
accountCount: 0,
|
||||
|
@ -101,22 +103,22 @@ const Stats: React.FC<InferGetServerSidePropsType<typeof getServerSideProps>> =
|
|||
<thead>
|
||||
<tr>
|
||||
<th>
|
||||
<SortToggle onToggle={toggleSort} field={'softwareName'} sort={sort}>
|
||||
<SortToggle onToggle={toggleSort} field={'softwareName'} sort={query}>
|
||||
Software name
|
||||
</SortToggle>
|
||||
</th>
|
||||
<th className={'text-end'}>
|
||||
<SortToggle onToggle={toggleSort} field={'nodeCount'} sort={sort}>
|
||||
<SortToggle onToggle={toggleSort} field={'nodeCount'} sort={query}>
|
||||
Instance count
|
||||
</SortToggle>
|
||||
</th>
|
||||
<th className={'text-end'}>
|
||||
<SortToggle onToggle={toggleSort} field={'accountCount'} sort={sort}>
|
||||
<SortToggle onToggle={toggleSort} field={'accountCount'} sort={query}>
|
||||
Account count
|
||||
</SortToggle>
|
||||
</th>
|
||||
<th className={'text-end'}>
|
||||
<SortToggle onToggle={toggleSort} field={'channelCount'} sort={sort}>
|
||||
<SortToggle onToggle={toggleSort} field={'channelCount'} sort={query}>
|
||||
Channel count
|
||||
</SortToggle>
|
||||
</th>
|
||||
|
|
|
@ -1,9 +1,18 @@
|
|||
import { z } from 'zod'
|
||||
import { transform, undefinedToDefault } from '../lib/transform'
|
||||
export const statsRequestSortBySchema = z.enum(['nodeCount', 'accountCount', 'channelCount', 'softwareName'])
|
||||
export const statsRequestSortWaySchema = z.enum(['asc', 'desc'])
|
||||
export const statsRequestSchema = z.object({
|
||||
sortBy: z.optional(statsRequestSortBySchema),
|
||||
sortWay: z.optional(statsRequestSortWaySchema)
|
||||
sortBy: transform(
|
||||
z.optional(statsRequestSortBySchema),
|
||||
undefinedToDefault<StatsRequestSortBy>('accountCount'),
|
||||
z.optional(statsRequestSortBySchema)
|
||||
),
|
||||
sortWay: transform(
|
||||
z.optional(statsRequestSortWaySchema),
|
||||
undefinedToDefault<StatsRequestSortWay>('desc'),
|
||||
statsRequestSortWaySchema
|
||||
)
|
||||
})
|
||||
|
||||
export type StatsRequest = z.infer<typeof statsRequestSchema>
|
||||
|
|
Ładowanie…
Reference in New Issue