refetch less aggressively (#231)
This commit is contained in:
@@ -1,6 +1,5 @@
|
|||||||
<!-- START doctoc generated TOC please keep comment here to allow auto update -->
|
<!-- START doctoc generated TOC please keep comment here to allow auto update -->
|
||||||
<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
|
<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
|
||||||
**Table of Contents** *generated with [DocToc](https://github.com/thlorenz/doctoc)*
|
|
||||||
|
|
||||||
- [Skyvern Frontend](#skyvern-frontend)
|
- [Skyvern Frontend](#skyvern-frontend)
|
||||||
- [Development](#development)
|
- [Development](#development)
|
||||||
|
|||||||
@@ -39,7 +39,7 @@ function TaskDetails() {
|
|||||||
query.state.data?.status === Status.Running ||
|
query.state.data?.status === Status.Running ||
|
||||||
query.state.data?.status === Status.Queued
|
query.state.data?.status === Status.Queued
|
||||||
) {
|
) {
|
||||||
return 3000;
|
return 30000;
|
||||||
}
|
}
|
||||||
return false;
|
return false;
|
||||||
},
|
},
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
import { client } from "@/api/AxiosClient";
|
import { client } from "@/api/AxiosClient";
|
||||||
import { TaskApiResponse } from "@/api/types";
|
import { TaskApiResponse } from "@/api/types";
|
||||||
import { keepPreviousData, useQuery } from "@tanstack/react-query";
|
import { useQuery } from "@tanstack/react-query";
|
||||||
import {
|
import {
|
||||||
Table,
|
Table,
|
||||||
TableBody,
|
TableBody,
|
||||||
@@ -44,7 +44,7 @@ function TaskList() {
|
|||||||
isError,
|
isError,
|
||||||
error,
|
error,
|
||||||
} = useQuery<Array<TaskApiResponse>>({
|
} = useQuery<Array<TaskApiResponse>>({
|
||||||
queryKey: ["tasks", page],
|
queryKey: ["tasks", "all", page],
|
||||||
queryFn: async () => {
|
queryFn: async () => {
|
||||||
return client
|
return client
|
||||||
.get("/tasks", {
|
.get("/tasks", {
|
||||||
@@ -55,8 +55,6 @@ function TaskList() {
|
|||||||
})
|
})
|
||||||
.then((response) => response.data);
|
.then((response) => response.data);
|
||||||
},
|
},
|
||||||
refetchInterval: 3000,
|
|
||||||
placeholderData: keepPreviousData,
|
|
||||||
});
|
});
|
||||||
|
|
||||||
if (isError) {
|
if (isError) {
|
||||||
|
|||||||
@@ -56,7 +56,7 @@ function LatestScreenshot({ id }: Props) {
|
|||||||
|
|
||||||
return Promise.reject("No screenshots found");
|
return Promise.reject("No screenshots found");
|
||||||
},
|
},
|
||||||
refetchInterval: 2000,
|
refetchInterval: 5000,
|
||||||
placeholderData: keepPreviousData,
|
placeholderData: keepPreviousData,
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
import { client } from "@/api/AxiosClient";
|
import { client } from "@/api/AxiosClient";
|
||||||
import { Status, TaskApiResponse } from "@/api/types";
|
import { Status, TaskApiResponse } from "@/api/types";
|
||||||
import { keepPreviousData, useQuery } from "@tanstack/react-query";
|
import { useQuery } from "@tanstack/react-query";
|
||||||
import { basicTimeFormat } from "@/util/timeFormat";
|
import { basicTimeFormat } from "@/util/timeFormat";
|
||||||
import {
|
import {
|
||||||
Table,
|
Table,
|
||||||
@@ -16,12 +16,16 @@ import { StatusBadge } from "@/components/StatusBadge";
|
|||||||
function QueuedTasks() {
|
function QueuedTasks() {
|
||||||
const navigate = useNavigate();
|
const navigate = useNavigate();
|
||||||
const { data: tasks } = useQuery<Array<TaskApiResponse>>({
|
const { data: tasks } = useQuery<Array<TaskApiResponse>>({
|
||||||
queryKey: ["tasks"],
|
queryKey: ["tasks", "queued"],
|
||||||
queryFn: async () => {
|
queryFn: async () => {
|
||||||
return client.get("/tasks").then((response) => response.data);
|
return client
|
||||||
|
.get("/tasks", {
|
||||||
|
params: {
|
||||||
|
task_status: "queued",
|
||||||
|
},
|
||||||
|
})
|
||||||
|
.then((response) => response.data);
|
||||||
},
|
},
|
||||||
refetchInterval: 3000,
|
|
||||||
placeholderData: keepPreviousData,
|
|
||||||
});
|
});
|
||||||
|
|
||||||
const queuedTasks = tasks
|
const queuedTasks = tasks
|
||||||
|
|||||||
@@ -1,7 +1,7 @@
|
|||||||
import { client } from "@/api/AxiosClient";
|
import { client } from "@/api/AxiosClient";
|
||||||
import { Status, TaskApiResponse } from "@/api/types";
|
import { TaskApiResponse } from "@/api/types";
|
||||||
import { keepPreviousData, useQuery } from "@tanstack/react-query";
|
import { useQuery } from "@tanstack/react-query";
|
||||||
import { useNavigate, useSearchParams } from "react-router-dom";
|
import { useNavigate } from "react-router-dom";
|
||||||
import {
|
import {
|
||||||
Card,
|
Card,
|
||||||
CardContent,
|
CardContent,
|
||||||
@@ -10,33 +10,25 @@ import {
|
|||||||
CardHeader,
|
CardHeader,
|
||||||
CardTitle,
|
CardTitle,
|
||||||
} from "@/components/ui/card";
|
} from "@/components/ui/card";
|
||||||
import { PAGE_SIZE } from "../constants";
|
|
||||||
import { basicTimeFormat } from "@/util/timeFormat";
|
import { basicTimeFormat } from "@/util/timeFormat";
|
||||||
import { LatestScreenshot } from "./LatestScreenshot";
|
import { LatestScreenshot } from "./LatestScreenshot";
|
||||||
|
|
||||||
function RunningTasks() {
|
function RunningTasks() {
|
||||||
const navigate = useNavigate();
|
const navigate = useNavigate();
|
||||||
const [searchParams] = useSearchParams();
|
|
||||||
const page = searchParams.get("page") ? Number(searchParams.get("page")) : 1;
|
|
||||||
|
|
||||||
const { data: tasks } = useQuery<Array<TaskApiResponse>>({
|
const { data: runningTasks } = useQuery<Array<TaskApiResponse>>({
|
||||||
queryKey: ["tasks", page],
|
queryKey: ["tasks", "running"],
|
||||||
queryFn: async () => {
|
queryFn: async () => {
|
||||||
return client
|
return client
|
||||||
.get("/tasks", {
|
.get("/tasks", {
|
||||||
params: {
|
params: {
|
||||||
page: 1,
|
task_status: "running",
|
||||||
page_size: PAGE_SIZE,
|
|
||||||
},
|
},
|
||||||
})
|
})
|
||||||
.then((response) => response.data);
|
.then((response) => response.data);
|
||||||
},
|
},
|
||||||
refetchInterval: 3000,
|
|
||||||
placeholderData: keepPreviousData,
|
|
||||||
});
|
});
|
||||||
|
|
||||||
const runningTasks = tasks?.filter((task) => task.status === Status.Running);
|
|
||||||
|
|
||||||
if (runningTasks?.length === 0) {
|
if (runningTasks?.length === 0) {
|
||||||
return <div>No running tasks</div>;
|
return <div>No running tasks</div>;
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user