Merge pull request #430 from AppQuality/UN-511-move-empty-state-before-tables

fix: Render empty state before excuting table hooks if no bugs

Author: cannarocks

src/pages/Bugs/BugsTable/AllBugs.tsx

@@ -7,7 +7,6 @@ import {
   selectBug,
 } from 'src/features/bugsPage/bugsPageSlice';
 import { TableBugType } from '../types';
-import { EmptyState } from './components/EmptyState';
 import { InfoRow } from './components/InfoRow';
 import { mapBugsToTableData } from './utils/mapBugsToTableData';
 import { useTableColumns } from './hooks/useTableColumns';
@@ -18,10 +17,6 @@ export const AllBugs = ({ bugs }: { bugs: TableBugType[] }) => {
   const { columns } = useTableColumns();
   const dispatch = useAppDispatch();
 
-  if (!bugs.length) {
-    return <EmptyState />;
-  }
-
   return (
     <div>
       <InfoRow bugs={bugs} />

src/pages/Bugs/BugsTable/index.tsx

@@ -2,6 +2,7 @@ import { useAppSelector } from 'src/app/hooks';
 import { AllBugs } from './AllBugs';
 import { BugsBySeverity } from './BugsBySeverity';
 import { BugsByUsecase } from './BugsByUsecase';
+import { EmptyState } from './components/EmptyState';
 import { LoadingState } from './components/LoadingState';
 import { useTableData } from './hooks/useTableData';
 
@@ -13,6 +14,10 @@ const BugsTable = ({ campaignId }: { campaignId: number }) => {
     return <LoadingState />;
   }
 
+  if (!data.allBugs.length) {
+    return <EmptyState />;
+  }
+
   return (
     <div>
       {pageView === 'byUsecase' && (