mirror of
https://github.com/marcogll/TaxHacker_s23.git
synced 2026-01-13 13:25:18 +00:00
fix: useTransactionFilters now respect other params
This commit is contained in:
@@ -26,7 +26,10 @@ export default async function TransactionsPage({ searchParams }: { searchParams:
|
|||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<header className="flex flex-wrap items-center justify-between gap-2 mb-8">
|
<header className="flex flex-wrap items-center justify-between gap-2 mb-8">
|
||||||
<h2 className="text-3xl font-bold tracking-tight">Transactions</h2>
|
<h2 className="flex flex-row gap-3 md:gap-5">
|
||||||
|
<span className="text-3xl font-bold tracking-tight">Transactions</span>
|
||||||
|
<span className="text-3xl tracking-tight opacity-20">{transactions.length}</span>
|
||||||
|
</h2>
|
||||||
<div className="flex gap-2">
|
<div className="flex gap-2">
|
||||||
<ExportTransactionsDialog fields={fields} categories={categories} projects={projects}>
|
<ExportTransactionsDialog fields={fields} categories={categories} projects={projects}>
|
||||||
<Button variant="outline">
|
<Button variant="outline">
|
||||||
|
|||||||
@@ -3,7 +3,7 @@ import { format } from "date-fns"
|
|||||||
import { useRouter, useSearchParams } from "next/navigation"
|
import { useRouter, useSearchParams } from "next/navigation"
|
||||||
import { useEffect, useState } from "react"
|
import { useEffect, useState } from "react"
|
||||||
|
|
||||||
const filters = ["search", "dateFrom", "dateTo", "ordering", "categoryCode", "projectCode"]
|
const filterKeys = ["search", "dateFrom", "dateTo", "ordering", "categoryCode", "projectCode"]
|
||||||
|
|
||||||
export function useTransactionFilters(defaultFilters?: TransactionFilters) {
|
export function useTransactionFilters(defaultFilters?: TransactionFilters) {
|
||||||
const router = useRouter()
|
const router = useRouter()
|
||||||
@@ -14,7 +14,7 @@ export function useTransactionFilters(defaultFilters?: TransactionFilters) {
|
|||||||
})
|
})
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
const newSearchParams = filtersToSearchParams(filters)
|
const newSearchParams = filtersToSearchParams(filters, searchParams)
|
||||||
router.push(`?${newSearchParams.toString()}`)
|
router.push(`?${newSearchParams.toString()}`)
|
||||||
}, [filters])
|
}, [filters])
|
||||||
|
|
||||||
@@ -26,14 +26,26 @@ export function useTransactionFilters(defaultFilters?: TransactionFilters) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
export function searchParamsToFilters(searchParams: URLSearchParams) {
|
export function searchParamsToFilters(searchParams: URLSearchParams) {
|
||||||
return filters.reduce((acc, filter) => {
|
return filterKeys.reduce((acc, filter) => {
|
||||||
acc[filter] = searchParams.get(filter) || ""
|
acc[filter] = searchParams.get(filter) || ""
|
||||||
return acc
|
return acc
|
||||||
}, {} as Record<string, string>)
|
}, {} as Record<string, string>) as TransactionFilters
|
||||||
}
|
}
|
||||||
|
|
||||||
export function filtersToSearchParams(filters: TransactionFilters): URLSearchParams {
|
export function filtersToSearchParams(
|
||||||
|
filters: TransactionFilters,
|
||||||
|
currentSearchParams?: URLSearchParams
|
||||||
|
): URLSearchParams {
|
||||||
|
// Copy of all non-filter parameters back to the URL
|
||||||
const searchParams = new URLSearchParams()
|
const searchParams = new URLSearchParams()
|
||||||
|
if (currentSearchParams) {
|
||||||
|
currentSearchParams.forEach((value, key) => {
|
||||||
|
if (!filterKeys.includes(key)) {
|
||||||
|
searchParams.set(key, value)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
if (filters.search) {
|
if (filters.search) {
|
||||||
searchParams.set("search", filters.search)
|
searchParams.set("search", filters.search)
|
||||||
} else {
|
} else {
|
||||||
|
|||||||
Reference in New Issue
Block a user