mirror of
https://github.com/Buriburizaem0n/nezha-dash-v1.git
synced 2026-09-19 17:50:13 +00:00
fix: add service fetching and conditional rendering for service button
This commit is contained in:
+40
-22
@@ -20,7 +20,7 @@ import { SORT_TYPES } from "@/context/sort-context";
|
||||
import { useSort } from "@/hooks/use-sort";
|
||||
import { useStatus } from "@/hooks/use-status";
|
||||
import { useWebSocketContext } from "@/hooks/use-websocket-context";
|
||||
import { fetchServerGroup } from "@/lib/nezha-api";
|
||||
import { fetchServerGroup, fetchService } from "@/lib/nezha-api";
|
||||
import { cn, formatNezhaInfo } from "@/lib/utils";
|
||||
import type { NezhaWebsocketResponse, ServerGroup } from "@/types/nezha-api";
|
||||
|
||||
@@ -31,6 +31,16 @@ export default function Servers() {
|
||||
queryKey: ["server-group"],
|
||||
queryFn: () => fetchServerGroup(),
|
||||
});
|
||||
const { data: serviceData } = useQuery({
|
||||
queryKey: ["service"],
|
||||
queryFn: () => fetchService(),
|
||||
refetchOnMount: true,
|
||||
refetchOnWindowFocus: true,
|
||||
refetchInterval: 10000,
|
||||
});
|
||||
const hasServices =
|
||||
!!serviceData?.data?.services &&
|
||||
Object.keys(serviceData.data.services).length > 0;
|
||||
const { lastMessage, connected } = useWebSocketContext();
|
||||
const { status } = useStatus();
|
||||
const [showServices, setShowServices] = useState<string>("0");
|
||||
@@ -69,6 +79,12 @@ export default function Servers() {
|
||||
}
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
if (!hasServices) {
|
||||
setShowServices("0");
|
||||
}
|
||||
}, [hasServices]);
|
||||
|
||||
useEffect(() => {
|
||||
const checkInlineSettings = () => {
|
||||
const isMobile = window.innerWidth < 768;
|
||||
@@ -305,27 +321,29 @@ export default function Servers() {
|
||||
>
|
||||
<MapIcon className="size-[13px]" />
|
||||
</button>
|
||||
<button
|
||||
onClick={() => {
|
||||
setShowServices(showServices === "0" ? "1" : "0");
|
||||
localStorage.setItem(
|
||||
"showServices",
|
||||
showServices === "0" ? "1" : "0",
|
||||
);
|
||||
}}
|
||||
className={cn(
|
||||
"inset-shadow-2xs inset-shadow-white/20 flex cursor-pointer flex-col items-center gap-0 rounded-[50px] bg-blue-100 p-2.5 text-blue-600 transition-all dark:bg-blue-900 dark:text-blue-100",
|
||||
{
|
||||
"inset-shadow-black/20 bg-blue-600 text-white dark:bg-blue-100 dark:text-blue-600":
|
||||
showServices === "1",
|
||||
},
|
||||
{
|
||||
"bg-opacity-70 dark:bg-opacity-70": customBackgroundImage,
|
||||
},
|
||||
)}
|
||||
>
|
||||
<ChartBarSquareIcon className="size-[13px]" />
|
||||
</button>
|
||||
{hasServices && (
|
||||
<button
|
||||
onClick={() => {
|
||||
setShowServices(showServices === "0" ? "1" : "0");
|
||||
localStorage.setItem(
|
||||
"showServices",
|
||||
showServices === "0" ? "1" : "0",
|
||||
);
|
||||
}}
|
||||
className={cn(
|
||||
"inset-shadow-2xs inset-shadow-white/20 flex cursor-pointer flex-col items-center gap-0 rounded-[50px] bg-blue-100 p-2.5 text-blue-600 transition-all dark:bg-blue-900 dark:text-blue-100",
|
||||
{
|
||||
"inset-shadow-black/20 bg-blue-600 text-white dark:bg-blue-100 dark:text-blue-600":
|
||||
showServices === "1",
|
||||
},
|
||||
{
|
||||
"bg-opacity-70 dark:bg-opacity-70": customBackgroundImage,
|
||||
},
|
||||
)}
|
||||
>
|
||||
<ChartBarSquareIcon className="size-[13px]" />
|
||||
</button>
|
||||
)}
|
||||
<button
|
||||
onClick={() => {
|
||||
setInline(inline === "0" ? "1" : "0");
|
||||
|
||||
Reference in New Issue
Block a user