Update TelegramNotifier URL structure and enhance admin support routing
- Modified TelegramNotifier to change the support ticket URL format, using a query parameter for ticket identification. - Enhanced the admin support route to validate search parameters, allowing for ticket-specific navigation from Telegram notifications. - Updated AdminSupportPage to utilize navigation for ticket selection, improving user experience when accessing ticket details.
This commit is contained in:
@@ -1,5 +1,5 @@
|
||||
import { useState } from 'react'
|
||||
import { createFileRoute } from '@tanstack/react-router'
|
||||
import { createFileRoute, useNavigate } from '@tanstack/react-router'
|
||||
import { useQuery } from '@tanstack/react-query'
|
||||
import { useTranslation } from 'react-i18next'
|
||||
import { Button } from '@/shared/ui/button'
|
||||
@@ -8,14 +8,22 @@ import { TicketStatusBadge } from '@/features/support/TicketStatusBadge'
|
||||
import { AdminTicketDetailDialog } from '@/features/admin/support/AdminTicketDetailDialog'
|
||||
import { listAllTickets } from '@/features/admin/support/api'
|
||||
|
||||
export const Route = createFileRoute('/admin/support')({ component: AdminSupportPage })
|
||||
export const Route = createFileRoute('/admin/support')({
|
||||
component: AdminSupportPage,
|
||||
// Ссылка из Telegram-уведомления ведёт на этот же роут с ?ticket=<id> — отдельного роута
|
||||
// на конкретный тикет нет, он открывается диалогом поверх списка.
|
||||
validateSearch: (search: Record<string, unknown>): { ticket?: string } => ({
|
||||
ticket: typeof search.ticket === 'string' ? search.ticket : undefined,
|
||||
}),
|
||||
})
|
||||
|
||||
const PAGE_SIZE = 20
|
||||
|
||||
function AdminSupportPage() {
|
||||
const { t } = useTranslation()
|
||||
const navigate = useNavigate({ from: Route.fullPath })
|
||||
const { ticket: selectedTicketId } = Route.useSearch()
|
||||
const [page, setPage] = useState(1)
|
||||
const [selectedTicketId, setSelectedTicketId] = useState<string | null>(null)
|
||||
|
||||
const { data, isLoading, isError, refetch } = useQuery({
|
||||
queryKey: ['admin-tickets', page],
|
||||
@@ -40,7 +48,7 @@ function AdminSupportPage() {
|
||||
{data && data.items.length > 0 && (
|
||||
<div className="flex flex-col gap-3">
|
||||
{data.items.map((ticket) => (
|
||||
<Card key={ticket.id} className="cursor-pointer" onClick={() => setSelectedTicketId(ticket.id)}>
|
||||
<Card key={ticket.id} className="cursor-pointer" onClick={() => navigate({ search: { ticket: ticket.id } })}>
|
||||
<CardHeader className="flex-row items-center justify-between gap-2">
|
||||
<CardTitle className="text-base">
|
||||
{ticket.userName} — {t(`support.type.${ticket.type}`)}
|
||||
@@ -69,7 +77,7 @@ function AdminSupportPage() {
|
||||
)}
|
||||
|
||||
{selectedTicketId && (
|
||||
<AdminTicketDetailDialog ticketId={selectedTicketId} onOpenChange={(open) => !open && setSelectedTicketId(null)} />
|
||||
<AdminTicketDetailDialog ticketId={selectedTicketId} onOpenChange={(open) => !open && navigate({ search: {} })} />
|
||||
)}
|
||||
</div>
|
||||
)
|
||||
|
||||
Reference in New Issue
Block a user