fix(UI): glitches in ui fixed

frontend/src/app/(app)/projects/[projectId]/page.tsx

@@ -105,6 +105,8 @@ export default function Project() {
     hasNextPage,
     isFetchingNextPage,
     isLoading: isAssetsLoading,
+    isFetching: isAssetsFetching,
+    refetch: refetchAssets,
   } = useInfiniteQuery({
     queryKey: ["projectAssets", id],
     queryFn: ({ pageParam = 1 }) => GetProjectAssets(id, pageParam, pageSize),
@@ -200,11 +202,11 @@ export default function Project() {
 
   const handleFileUpload = async (fileList: FileList | null) => {
     if (fileList) {
+      setUploadingFile(true);
       const files = Array.from(fileList);
       setUploadingFiles((prev) => [...prev, ...files]);
 
       try {
-        setUploadingFile(true);
         for (const file of files) {
           const response = await AddProjectAsset(id, file);
 
@@ -216,7 +218,7 @@ export default function Project() {
         setUploadingFile(false);
         setUploadingFiles([]);
         setUploadedFiles([]);
-        queryClient.invalidateQueries({ queryKey: ["projectAssets"] });
+        refetchAssets();
       } catch (error) {
         console.error("Error uploading files:", error);
         setUploadingFiles([]);
@@ -370,7 +372,10 @@ export default function Project() {
 
           {activeTab === "assets" && (
             <>
-              {!uploadingFile && assets && assets?.length === 0 ? (
+              {!uploadingFile &&
+              !isAssetsLoading &&
+              !isAssetsFetching &&
+              (!assets || assets.length === 0) ? (
                 <DragAndDrop
                   onFileSelect={handleFileUpload}
                   accept={[".pdf", "application/pdf"]}

frontend/src/app/(app)/projects/[projectId]/processes/[processId]/page.tsx

@@ -4,7 +4,11 @@ import Head from "next/head";
 import { useParams } from "next/navigation";
 import Breadcrumb from "@/components/ui/Breadcrumb";
 import { Download } from "lucide-react";
-import { ProcessDetailsResponse, ProcessStatus } from "@/interfaces/processes";
+import {
+  ProcessData,
+  ProcessDetailsResponse,
+  ProcessStatus,
+} from "@/interfaces/processes";
 import { Column, Table } from "@/components/ui/Table";
 import Label from "@/components/ui/Label";
 import DateLabel from "@/components/ui/Date";
@@ -18,6 +22,8 @@ import { truncateTextFromCenter } from "@/lib/utils";
 import { useQuery } from "@tanstack/react-query";
 import PageLoader from "@/components/ui/PageLoader";
 import { Card } from "@/components/ui/Card";
+import File from "@/components/FileIconCard";
+import { useRouter } from "next/navigation";
 
 const statusLabel = (process: ProcessDetailsResponse) => {
   switch (process.status) {
@@ -68,6 +74,7 @@ const columns: Column<ProcessDetailsResponse>[] = [
 
 export default function Process() {
   const params = useParams();
+  const router = useRouter();
   const processId = (params?.processId as string) || "";
   const projectId = (params?.projectId as string) || "";
   const {
@@ -97,6 +104,10 @@ export default function Process() {
   const project = processResponse?.data?.data?.[0]?.process?.project;
   const process = processResponse?.data?.data?.[0]?.process;
 
+  const handleFileClick = (process: ProcessData) => {
+    router.push(`/projects/${projectId}/processes/${process.id}/csv`);
+  };
+
   useEffect(() => {
     if (isError) {
       setErrorMessage("Something went wrong fetching process");
@@ -134,6 +145,15 @@ export default function Process() {
         </div>
       )}
 
+      <div className="pb-4">
+        <File
+          key={process?.id}
+          name={`${process?.name}.csv`}
+          type="spreadsheet"
+          onClick={() => handleFileClick(process)}
+        />
+      </div>
+
       {isLoading ? (
         <PageLoader />
       ) : errorMessage ? (

frontend/src/app/(app)/projects/page.tsx

@@ -63,7 +63,13 @@ export default function Projects() {
 
   const { data: response, isLoading } = useQuery({
     queryKey: ["projects", page, pageSize],
-    queryFn: () => GetProjects(page, pageSize),
+    queryFn: async () => {
+      const resp = await GetProjects(page, pageSize);
+      if (resp?.data?.data.length == 0) {
+        newProject();
+      }
+      return resp;
+    },
   });
 
   const projects: ProjectData[] = response?.data?.data || [];
@@ -78,10 +84,6 @@ export default function Projects() {
     router.push("/projects/new");
   };
 
-  if (!isLoading && projects?.length === 0) {
-    newProject();
-  }
-
   const breadcrumbItems = [{ label: "Projects", href: "/" }];
 
   const viewOptions = [