Merge branch 'main' of http://192.168.1.163:3000/inmake/graff-mate-client
This commit is contained in:
@@ -11,6 +11,7 @@ import clsx from "clsx";
|
||||
import ChevronRightIcon from "./icons/ChevronRightIcon";
|
||||
import CurrentSessionModal from "./modals/CurrentSessionModal";
|
||||
import SpinIcon from "./icons/SpinIcon";
|
||||
import { useIsMutating } from "@tanstack/react-query";
|
||||
|
||||
interface IDesktopCardProps {
|
||||
server: Server;
|
||||
@@ -19,6 +20,14 @@ interface IDesktopCardProps {
|
||||
export default function DesktopCard({ server }: IDesktopCardProps) {
|
||||
const { setModal, setPosition } = useModalStore();
|
||||
|
||||
const isStarting = useIsMutating({
|
||||
mutationKey: ["create-session", server.id],
|
||||
});
|
||||
|
||||
const isEnding = useIsMutating({
|
||||
mutationKey: ["end-session", server.sessions?.[0]?.id],
|
||||
});
|
||||
|
||||
async function handleClickCreateSession() {
|
||||
setPosition("right");
|
||||
setModal(<CreateSessionModal targetServerId={server.id} />);
|
||||
@@ -52,7 +61,7 @@ export default function DesktopCard({ server }: IDesktopCardProps) {
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex gap-[0.278vw] justify-center -mt-[0.278vw]">
|
||||
{server.sessions?.[0]?.status === "starting" ? (
|
||||
{server.sessions?.[0]?.status === "starting" || isStarting ? (
|
||||
<div className="flex items-center gap-[0.278vw] bg-[#F8F7FE] p-[0.833vw] rounded-[0.833vw]">
|
||||
<span className="size-[1.111vw] animate-spin text-[#7B60F3]">
|
||||
<SpinIcon />
|
||||
|
||||
@@ -23,7 +23,7 @@ export default function CreateSessionModal({ targetServerId }: Props) {
|
||||
const [name, setName] = useState<string | null>(null);
|
||||
const [phone, setPhone] = useState<string | null>(null);
|
||||
const [email, setEmail] = useState<string | null>(null);
|
||||
const [isSessionExists, setIsSessionExists] = useState(false);
|
||||
// const [isSessionExists, setIsSessionExists] = useState(false);
|
||||
|
||||
const queryClient = useQueryClient();
|
||||
|
||||
@@ -113,21 +113,21 @@ export default function CreateSessionModal({ targetServerId }: Props) {
|
||||
},
|
||||
});
|
||||
|
||||
const { mutate: endSession } = useMutation({
|
||||
mutationKey: ["sessions", selectedServer?.sessions?.[0]?.id],
|
||||
mutationFn: () =>
|
||||
api.put(`sessions/${selectedServer?.sessions?.[0]?.id}`, {
|
||||
json: { status: "ending" },
|
||||
}),
|
||||
onMutate: () => queryClient.invalidateQueries({ queryKey: ["sessions"] }),
|
||||
});
|
||||
// const { mutate: endSession } = useMutation({
|
||||
// mutationKey: ["end-session", selectedServer?.sessions?.[0]?.id],
|
||||
// mutationFn: () =>
|
||||
// api.put(`sessions/${selectedServer?.sessions?.[0]?.id}`, {
|
||||
// json: { status: "ending" },
|
||||
// }),
|
||||
// onMutate: () => queryClient.invalidateQueries({ queryKey: ["sessions"] }),
|
||||
// });
|
||||
|
||||
async function handleClickCreateSession(e: React.FormEvent<HTMLFormElement>) {
|
||||
e.preventDefault();
|
||||
|
||||
if (!name || !phone || !selectedServer || !selectedApp) return;
|
||||
|
||||
if (selectedServer?.sessions?.[0]?.status !== "started") {
|
||||
// if (selectedServer?.sessions?.[0]?.status !== "started") {
|
||||
createClient(undefined, {
|
||||
onSuccess: (client) => {
|
||||
createSession({
|
||||
@@ -137,46 +137,46 @@ export default function CreateSessionModal({ targetServerId }: Props) {
|
||||
});
|
||||
},
|
||||
});
|
||||
return;
|
||||
// return;
|
||||
// }
|
||||
|
||||
// if (!isSessionExists) {
|
||||
// setIsSessionExists(true);
|
||||
// return;
|
||||
// }
|
||||
|
||||
// endSession(undefined, {
|
||||
// onError: (error) => {
|
||||
// console.log("Ошибка при завершении сессии:", error);
|
||||
// },
|
||||
// });
|
||||
}
|
||||
|
||||
if (!isSessionExists) {
|
||||
setIsSessionExists(true);
|
||||
return;
|
||||
}
|
||||
|
||||
endSession(undefined, {
|
||||
onError: (error) => {
|
||||
console.log("Ошибка при завершении сессии:", error);
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
if (
|
||||
selectedServer &&
|
||||
servers?.find((server) => server.id === selectedServer?.id)?.sessions?.[0]
|
||||
?.status === "ended" &&
|
||||
selectedApp &&
|
||||
isSessionExists
|
||||
)
|
||||
createClient(undefined, {
|
||||
onSuccess: (client) => {
|
||||
createSession({
|
||||
clientId: client.id,
|
||||
serverId: selectedServer?.id,
|
||||
appId: selectedApp.id,
|
||||
});
|
||||
},
|
||||
});
|
||||
}, [
|
||||
selectedApp,
|
||||
servers,
|
||||
createClient,
|
||||
createSession,
|
||||
isSessionExists,
|
||||
selectedServer,
|
||||
]);
|
||||
// useEffect(() => {
|
||||
// if (
|
||||
// selectedServer &&
|
||||
// servers?.find((server) => server.id === selectedServer?.id)?.sessions?.[0]
|
||||
// ?.status === "ended" &&
|
||||
// selectedApp
|
||||
// // && isSessionExists
|
||||
// )
|
||||
// createClient(undefined, {
|
||||
// onSuccess: (client) => {
|
||||
// createSession({
|
||||
// clientId: client.id,
|
||||
// serverId: selectedServer?.id,
|
||||
// appId: selectedApp.id,
|
||||
// });
|
||||
// },
|
||||
// });
|
||||
// }, [
|
||||
// selectedApp,
|
||||
// servers,
|
||||
// createClient,
|
||||
// createSession,
|
||||
// // isSessionExists,
|
||||
// selectedServer,
|
||||
// ]);
|
||||
|
||||
const ref = useRef<HTMLFormElement>(null);
|
||||
|
||||
@@ -257,8 +257,8 @@ export default function CreateSessionModal({ targetServerId }: Props) {
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
{isSessionExists && (
|
||||
<div className="absolute inset-0 top-[11.806vw] bg-[#FFFFFF] flex flex-col gap-[1.111vw] items-center justify-center h-[31.458vw]">
|
||||
{/* {isSessionExists && ( */}
|
||||
{/* <div className="absolute inset-0 top-[11.806vw] bg-[#FFFFFF] flex flex-col gap-[1.111vw] items-center justify-center h-[31.458vw]">
|
||||
<img
|
||||
src="/images/ghost.png"
|
||||
alt="ghost error"
|
||||
@@ -271,8 +271,8 @@ export default function CreateSessionModal({ targetServerId }: Props) {
|
||||
При запуске нового текущий будет завершен.`}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div> */}
|
||||
{/* )} */}
|
||||
<div className="flex-1 flex flex-col justify-end">
|
||||
<Button
|
||||
type="submit"
|
||||
|
||||
Reference in New Issue
Block a user