mirror of
https://github.com/codex-storage/codex-marketplace-ui.git
synced 2025-02-24 13:48:14 +00:00
Fix style
This commit is contained in:
parent
a3b7d1fccd
commit
ceb281bdec
@ -6,10 +6,11 @@ import {
|
|||||||
} from "@codex-storage/marketplace-ui-components";
|
} from "@codex-storage/marketplace-ui-components";
|
||||||
import { classnames } from "../../utils/classnames";
|
import { classnames } from "../../utils/classnames";
|
||||||
import "./AvailabilityReservations.css";
|
import "./AvailabilityReservations.css";
|
||||||
import { useQuery } from "@tanstack/react-query";
|
import { useQuery, useQueryClient } from "@tanstack/react-query";
|
||||||
import { CodexSdk } from "../../sdk/codex";
|
import { CodexSdk } from "../../sdk/codex";
|
||||||
import { Promises } from "../../utils/promises";
|
import { Promises } from "../../utils/promises";
|
||||||
import { CodexAvailability } from "@codex-storage/sdk-js";
|
import { CodexAvailability } from "@codex-storage/sdk-js";
|
||||||
|
import { useEffect } from "react";
|
||||||
|
|
||||||
type Props = {
|
type Props = {
|
||||||
availability: CodexAvailability | null;
|
availability: CodexAvailability | null;
|
||||||
@ -22,6 +23,8 @@ export function AvailabilityReservations({
|
|||||||
onClose,
|
onClose,
|
||||||
open,
|
open,
|
||||||
}: Props) {
|
}: Props) {
|
||||||
|
const queryClient = useQueryClient();
|
||||||
|
|
||||||
const { data } = useQuery({
|
const { data } = useQuery({
|
||||||
queryFn: () => {
|
queryFn: () => {
|
||||||
if (availability) {
|
if (availability) {
|
||||||
@ -35,6 +38,10 @@ export function AvailabilityReservations({
|
|||||||
queryKey: ["reservations"],
|
queryKey: ["reservations"],
|
||||||
});
|
});
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
queryClient.invalidateQueries({ queryKey: ["reservations"] });
|
||||||
|
}, [availability]);
|
||||||
|
|
||||||
// TODO manage error
|
// TODO manage error
|
||||||
|
|
||||||
if (!availability) {
|
if (!availability) {
|
||||||
|
@ -14,6 +14,19 @@
|
|||||||
display: block;
|
display: block;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.availabilities-content {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
|
||||||
|
.availabilities-table {
|
||||||
|
order: 2;
|
||||||
|
}
|
||||||
|
|
||||||
|
.availabilities-space {
|
||||||
|
order: 1;
|
||||||
|
}
|
||||||
|
|
||||||
.availabilities-space .nodeSpaceAllocation-legendRow,
|
.availabilities-space .nodeSpaceAllocation-legendRow,
|
||||||
.availabilities-space .nodeSpaceAllocation-barItem {
|
.availabilities-space .nodeSpaceAllocation-barItem {
|
||||||
transition: opacity 0.35s;
|
transition: opacity 0.35s;
|
||||||
|
@ -54,11 +54,13 @@ export const Route = createFileRoute("/dashboard/availabilities")({
|
|||||||
<Spinner width="3rem" />
|
<Spinner width="3rem" />
|
||||||
</div>
|
</div>
|
||||||
) : (
|
) : (
|
||||||
<AvailabilitiesTable
|
<div className="availabilities-table">
|
||||||
// onEdit={onOpen}
|
<AvailabilitiesTable
|
||||||
availabilities={availabilities}
|
// onEdit={onOpen}
|
||||||
onReservationsShow={onReservationsShow}
|
availabilities={availabilities}
|
||||||
/>
|
onReservationsShow={onReservationsShow}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
<div className="availabilities-space">
|
<div className="availabilities-space">
|
||||||
|
Loading…
x
Reference in New Issue
Block a user