72 lines
2.5 KiB
React
72 lines
2.5 KiB
React
import { useEffect, useState } from 'react'
|
|
import { Link, useLocation } from 'react-router-dom'
|
|
import { Card } from './ui'
|
|
import { StatusPill } from './ui/StatusPill'
|
|
import { databases, DATABASE_ID, COLLECTIONS, Query } from '../lib/appwrite'
|
|
import { useWebsiteProjects } from '../hooks/useWebsiteProjects'
|
|
import { ticketPath, ticketRef } from '../lib/ticketRoutes'
|
|
import { ticketNumber } from '../lib/ticketView'
|
|
|
|
/**
|
|
* Kontextbox im Ticket: "Weitere Tickets von <Kunde>" (klickbar).
|
|
* Rendert nichts, wenn dem Ticket kein Projekt zugewiesen ist.
|
|
*/
|
|
export default function ProjectContextPanel({ ticket }) {
|
|
const { fetchByTicketId } = useWebsiteProjects()
|
|
const location = useLocation()
|
|
const [context, setContext] = useState(null)
|
|
|
|
useEffect(() => {
|
|
let cancelled = false
|
|
async function load() {
|
|
try {
|
|
const assignedProjects = await fetchByTicketId(ticket.$id)
|
|
if (!assignedProjects.length) {
|
|
if (!cancelled) setContext(null)
|
|
return
|
|
}
|
|
|
|
let otherTickets = []
|
|
if (ticket.customerId) {
|
|
const res = await databases.listDocuments(DATABASE_ID, COLLECTIONS.WORKORDERS, [
|
|
Query.equal('customerId', ticket.customerId),
|
|
Query.orderDesc('$createdAt'),
|
|
Query.limit(50),
|
|
])
|
|
otherTickets = res.documents.filter((t) => t.$id !== ticket.$id)
|
|
}
|
|
if (!cancelled) setContext({ otherTickets })
|
|
} catch {
|
|
if (!cancelled) setContext(null)
|
|
}
|
|
}
|
|
load()
|
|
return () => { cancelled = true }
|
|
}, [ticket.$id, ticket.customerId, fetchByTicketId])
|
|
|
|
if (!context) return null
|
|
const { otherTickets } = context
|
|
|
|
return (
|
|
<Card title={ticket.customerName ? `Weitere Tickets von ${ticket.customerName}` : 'Weitere Tickets'}>
|
|
{!ticket.customerId ? (
|
|
<p className="muted">Kein Kunde zugeordnet — andere Tickets koennen nicht automatisch verknuepft werden.</p>
|
|
) : !otherTickets.length ? (
|
|
<p className="muted">Keine weiteren Tickets zu diesem Kunden/Projekt.</p>
|
|
) : (
|
|
<div>
|
|
{otherTickets.map((t) => (
|
|
<Link key={t.$id} className="list-row" to={ticketPath(ticketRef(t))} state={location.state}>
|
|
<span className="cell-title list-row-text">
|
|
<span className="id">{ticketNumber(t)}</span>
|
|
<span>{t.topic || t.title || '-'}</span>
|
|
</span>
|
|
<StatusPill status={t.status} />
|
|
</Link>
|
|
))}
|
|
</div>
|
|
)}
|
|
</Card>
|
|
)
|
|
}
|