Update Tracker Connections UI
This commit is contained in:
@@ -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}>
|
||||||
|
|||||||
Reference in New Issue
Block a user