fix(next/web): search pagination

Author: sdjdd

next/web/src/App/Admin/Tickets/index.tsx

@@ -2,16 +2,10 @@ import { useEffect, useState } from 'react';
 import { Route, Routes } from 'react-router-dom';
 import _ from 'lodash';
 
-import {
-  useSearchTicketCustomField,
-  useSearchTickets,
-  useTickets,
-  UseTicketsOptions,
-} from '@/api/ticket';
+import { useSearchTickets, useTickets, UseTicketsOptions } from '@/api/ticket';
 import { usePage, usePageSize } from '@/utils/usePage';
 import { Topbar, useOrderBy } from './Topbar';
 import {
-  FieldFilters,
   FilterForm,
   Filters,
   LocalFiltersProvider,
@@ -27,7 +21,6 @@ import {
   useTicketSwitchType,
 } from './useTicketSwitchType';
 import { useViewTickets } from '@/api/view';
-import { decodeDateRange } from '@/utils/date-range';
 import { useTicketTableColumn } from './hooks/useTicketTableColumns';
 
 const DEFAULT_PAGE_SIZE = 20;
@@ -51,8 +44,6 @@ function useSmartSearchTickets({
   const isFieldSearch = filters.type === 'field' && !isProcessableSearch;
   const isKeywordSearch = filters.type === 'normal' && !!filters.keyword && !isProcessableSearch;
 
-  const dateRange = filters.createdAt && decodeDateRange(filters.createdAt);
-
   const useTicketResult = useTickets({
     filters: _.omit(filters, ['type', 'fieldId', 'fieldValue']),
     ...options,
@@ -62,12 +53,14 @@ function useSmartSearchTickets({
     },
   });
 
-  const useSearchTicketsResult = useSearchTickets((filters as NormalFilters).keyword!, {
-    filters: _.omit(filters, ['keyword', 'type', 'fieldId', 'fieldValue']) as NormalFilters,
+  const useSearchTicketsResult = useSearchTickets({
+    filters: (isKeywordSearch
+      ? _.omit(filters, ['type', 'fieldId', 'fieldValue'])
+      : _.pick(filters, ['createdAt', 'fieldId', 'fieldValue'])) as NormalFilters,
     ...options,
     queryOptions: {
       ...queryOptions,
-      enabled: isKeywordSearch,
+      enabled: isKeywordSearch || isFieldSearch,
     },
   });
 
@@ -79,28 +72,11 @@ function useSmartSearchTickets({
     },
   });
 
-  const { fieldId, fieldValue } = filters as FieldFilters;
-
-  const useFieldSearchResult = useSearchTicketCustomField(
-    {
-      fieldId,
-      fieldValue,
-      createdAt: dateRange ? [dateRange.from, dateRange.to] : undefined,
-      orderKey: options.orderKey,
-      orderType: options.orderType,
-    },
-    {
-      enabled: isFieldSearch,
-    }
-  );
-
   return {
     ...(isProcessableSearch
       ? useProcessableTicketsResult
-      : isKeywordSearch
+      : isKeywordSearch || isFieldSearch
       ? useSearchTicketsResult
-      : isFieldSearch
-      ? useFieldSearchResult
       : useTicketResult),
     mode: isProcessableSearch ? 'view' : isKeywordSearch || isFieldSearch ? 'search' : 'normal',
   };

next/web/src/api/ticket.ts

@@ -60,8 +60,9 @@ export interface FetchTicketFilters {
   tagValue?: string;
   privateTagKey?: string;
   privateTagValue?: string;
-  fieldName?: string;
+  fieldId?: string;
   fieldValue?: string;
+  keyword?: string;
   where?: Record<string, any>;
 }
 
@@ -74,8 +75,9 @@ export function encodeTicketFilters(filters: FetchTicketFilters) {
     tagValue: filters.tagValue,
     privateTagKey: filters.privateTagKey,
     privateTagValue: filters.privateTagValue,
-    fieldName: filters.fieldName,
+    fieldId: filters.fieldId,
     fieldValue: filters.fieldValue,
+    keyword: filters.keyword,
   };
   if (filters.assigneeId) {
     params.assigneeId = castArray(filters.assigneeId).join(',');
@@ -158,19 +160,15 @@ async function fetchTickets({
   return { tickets: data, totalCount: parseInt(headers['x-total-count']) };
 }
 
-async function searchTickets(
-  keyword: string,
-  {
-    page = 1,
-    pageSize = 10,
-    orderKey = 'createdAt',
-    orderType = 'desc',
-    filters = {},
-  }: FetchTicketsOptions = {}
-) {
+async function searchTickets({
+  page = 1,
+  pageSize = 10,
+  orderKey = 'createdAt',
+  orderType = 'desc',
+  filters = {},
+}: FetchTicketsOptions = {}) {
   const params: any = {
     ...encodeTicketFilters(filters),
-    keyword,
     page,
     pageSize,
     orderBy: `${orderKey}-${orderType}`,
@@ -270,13 +268,10 @@ export function useTickets({ queryOptions, ...options }: UseTicketsOptions = {})
   };
 }
 
-export function useSearchTickets(
-  keyword: string,
-  { queryOptions, ...options }: UseTicketsOptions = {}
-) {
+export function useSearchTickets({ queryOptions, ...options }: UseTicketsOptions = {}) {
   const { data, ...rest } = useQuery({
-    queryKey: ['searchTicketsResult', keyword, options],
-    queryFn: () => searchTickets(keyword, options),
+    queryKey: ['searchTicketsResult', options],
+    queryFn: () => searchTickets(options),
     ...queryOptions,
   });
 
@@ -323,48 +318,6 @@ export function useOperateTicket(
   });
 }
 
-interface SearchTicketCustomFieldOptions {
-  fieldId?: string;
-  fieldValue?: string;
-  createdAt?: [Date | undefined, Date | undefined];
-  orderKey?: string;
-  orderType?: string;
-}
-
-async function searchTicketCustomField({
-  fieldId,
-  fieldValue,
-  createdAt,
-  orderKey = 'createdAt',
-  orderType = 'desc',
-}: SearchTicketCustomFieldOptions) {
-  const res = await http.get<TicketSchema[]>('/api/2/tickets/search/v2', {
-    params: {
-      fieldId,
-      fieldValue,
-      createdAt: createdAt?.map((d) => (d ? d.toISOString() : '*')).join('..'),
-      orderBy: `${orderKey}-${orderType}`,
-    },
-  });
-  return { tickets: res.data, totalCount: Number(res.headers['x-total-count']) };
-}
-
-export function useSearchTicketCustomField(
-  searchOptions: SearchTicketCustomFieldOptions,
-  options?: UseQueryOptions<FetchTicketsResult, Error>
-) {
-  const { data, ...rest } = useQuery({
-    queryKey: ['searchTicketCustomField', searchOptions],
-    queryFn: () => searchTicketCustomField(searchOptions),
-    ...options,
-  });
-
-  return {
-    ...rest,
-    data: data?.tickets,
-    totalCount: data?.totalCount,
-  };
-}
 type exportType = 'json' | 'csv';
 interface ExportParams extends FetchTicketsOptions {
   type: exportType;