Update Tracker Connections UI

This commit is contained in:
nocnico
2025-06-02 21:36:02 +02:00
parent b98e69518f
commit 1599226f53

View File

@@ -3,6 +3,7 @@ import { useQuery } from "@tanstack/react-query";
import { Badge } from "_components/Badge/Badge"; import { Badge } from "_components/Badge/Badge";
import { getConnectedAircraftsAPI } from "_querys/aircrafts"; import { getConnectedAircraftsAPI } from "_querys/aircrafts";
import { getConnectedDispatcherAPI } from "_querys/connected-user"; import { getConnectedDispatcherAPI } from "_querys/connected-user";
import { Plane, Workflow } from "lucide-react";
export const ConnectedDispatcher = () => { export const ConnectedDispatcher = () => {
const { data: dispatcher } = useQuery({ const { data: dispatcher } = useQuery({
@@ -21,18 +22,23 @@ export const ConnectedDispatcher = () => {
<div className="collapse collapse-arrow bg-base-100 border-base-300 border"> <div className="collapse collapse-arrow bg-base-100 border-base-300 border">
<input type="checkbox" /> <input type="checkbox" />
{/* <div className="collapse-title font-semibold">Kein Disponent Online</div> */} {/* <div className="collapse-title font-semibold">Kein Disponent Online</div> */}
<div className="collapse-title font-semibold"> <div className="collapse-title font-semibold flex items-center justify-between">
{(aircrafts?.length || 0) + (dispatcher?.length || 0)} Verbundene Mitglieder <span>{(aircrafts?.length || 0) + (dispatcher?.length || 0)} Verbundene Mitglieder</span>
<div className="gap-2 flex items-center">
<div
className={`badge badge-outline ${
(dispatcher?.length || 0) > 0 ? "badge-success" : "badge-error"
}`}
>
<Workflow size={14} /> {dispatcher?.length || 0}
</div>
<div className="badge badge-outline badge-primary">
<Plane size={14} /> {aircrafts?.length || 0}
</div>
</div>
</div> </div>
<div className="collapse-content"> <div className="collapse-content">
<ul className="list bg-base-100 rounded-box shadow-md"> <ul className="list bg-base-100 rounded-box shadow-md">
<li className="text-xs opacity-60 tracking-wide">
Disponenten: {dispatcher?.length || 0}
</li>
<li className="pb-2 text-xs opacity-60 tracking-wide">
Piloten: {aircrafts?.length || 0}
</li>
{dispatcher?.map((d) => { {dispatcher?.map((d) => {
return ( return (
<li className="list-row" key={d.id}> <li className="list-row" key={d.id}>