@@ -14,7 +14,6 @@ import type { ProxyContextValue } from "contexts/ProxyContext";
1414import { useWebpushNotifications } from "contexts/useWebpushNotifications" ;
1515import { useEmbeddedMetadata } from "hooks/useEmbeddedMetadata" ;
1616import { NotificationsInbox } from "modules/notifications/NotificationsInbox/NotificationsInbox" ;
17- import type { Task } from "modules/tasks/tasks" ;
1817import { data } from "pages/TasksPage/TasksPage" ;
1918import type { FC } from "react" ;
2019import { useQuery } from "react-query" ;
@@ -161,15 +160,15 @@ const NavItems: FC<NavItemsProps> = ({ className, user }) => {
161160if ( location . pathname . startsWith ( "/@" ) ) {
162161isActive = true ;
163162}
164- return cn ( linkStyles . default , isActive ? linkStyles . active : "" ) ;
163+ return cn ( linkStyles . default , { [ linkStyles . active ] : isActive } ) ;
165164} }
166165to = "/workspaces"
167166>
168167Workspaces
169168</ NavLink >
170169< NavLink
171170className = { ( { isActive} ) => {
172- return cn ( linkStyles . default , isActive ? linkStyles . active : "" ) ;
171+ return cn ( linkStyles . default , { [ linkStyles . active ] : isActive } ) ;
173172} }
174173to = "/templates"
175174>
@@ -198,58 +197,51 @@ const TasksNavItem: FC<TasksNavItemProps> = ({ user }) => {
198197avatarUrl :user . avatar_url ,
199198} ,
200199} ;
201- const { data :idleTasks } = useQuery ( {
200+ const { data :idleCount } = useQuery ( {
202201queryKey :[ "tasks" , filter ] ,
203202queryFn :( ) => data . fetchTasks ( filter ) ,
204203refetchInterval :1_000 * 60 ,
205204enabled :canSeeTasks ,
206205refetchOnWindowFocus :true ,
206+ initialData :[ ] ,
207207select :( data ) =>
208- data . filter ( ( task ) => task . workspace . latest_app_status ?. state === "idle" ) ,
208+ data . filter ( ( task ) => task . workspace . latest_app_status ?. state === "idle" )
209+ . length ,
209210} ) ;
210211
211212if ( ! canSeeTasks ) {
212213return null ;
213214}
214215
215- const search =
216- idleTasks && idleTasks . length > 0
217- ?new URLSearchParams ( {
218- username :user . username ,
219- tab :"waiting-for-input" ,
220- } ) . toString ( )
221- :undefined ;
222-
223216return (
224217< NavLink
225- to = { { pathname : "/tasks" , search } }
218+ to = "/tasks"
226219className = { ( { isActive} ) => {
227- return cn ( linkStyles . default , isActive ? linkStyles . active : "" ) ;
220+ return cn ( linkStyles . default , { [ linkStyles . active ] : isActive } ) ;
228221} }
229222>
230223Tasks
231- { idleTasks && idleTasks . length > 0 && (
224+ { idleCount > 0 && (
232225< TooltipProvider >
233226< Tooltip >
234227< TooltipTrigger asChild >
235228< Badge
236229variant = "info"
237230size = "xs"
238231className = "ml-2"
239- aria-label = { idleTasksLabel ( idleTasks ) }
232+ aria-label = { idleTasksLabel ( idleCount ) }
240233>
241- { idleTasks . length }
234+ { idleCount }
242235</ Badge >
243236</ TooltipTrigger >
244- < TooltipContent > { idleTasksLabel ( idleTasks ) } </ TooltipContent >
237+ < TooltipContent > { idleTasksLabel ( idleCount ) } </ TooltipContent >
245238</ Tooltip >
246239</ TooltipProvider >
247240) }
248241</ NavLink >
249242) ;
250243} ;
251244
252- function idleTasksLabel ( idleTasks :Task [ ] ) {
253- const count = idleTasks . length ;
245+ function idleTasksLabel ( count :number ) {
254246return `You have${ count } ${ count === 1 ?"task" :"tasks" } ;
255247}