fix: prevent empty state flash on fresh page loads

- Add checks for undefined data in TaskList and FileList
- Check isDatasetsLoading state in FileList for multi-step query
- Show proper loading spinner until all data is fetched
- Eliminates "flash of empty content" user experience issue

apps/web/src/app/components/TaskList.tsx

@@ -434,7 +434,8 @@ export default function TaskList({
 
   const displayTasks = paginatedData;
 
-  if (isLoading) return <LoadingCard message="Loading tasks..." />;
+  // Show loading state if data is still being fetched or if data is undefined
+  if (isLoading || !data) return <LoadingCard message="Loading tasks..." />;
   if (error) {
     return (
       <div className="text-center p-8 bg-red-50 dark:bg-red-900/20 border border-red-200 dark:border-red-800 rounded-lg">

apps/web/src/app/files/FileList.tsx

@@ -19,7 +19,7 @@ export default function FileList() {
   const { addNotification } = useNotifications();
 
   // Get available datasets
-  const { data: datasets } = useQuery({
+  const { data: datasets, isLoading: isDatasetsLoading } = useQuery({
     queryKey: ["datasets"],
     queryFn: () => get(`/files/all-datasets`)
   });
@@ -446,7 +446,10 @@ export default function FileList() {
 
   const displayFiles = paginatedData;
 
-  if (isLoading) return <LoadingCard message="Loading files..." />;
+  // Show loading state if datasets are loading, allFiles is loading, or data is undefined
+  if (isDatasetsLoading || isLoading || !allFiles) {
+    return <LoadingCard message="Loading files..." />;
+  }
   if (error) {
     return (
       <div className="text-center p-8 bg-red-50 dark:bg-red-900/20 border border-red-200 dark:border-red-800 rounded-lg">