feat(#20): refactor and fix small things in tree table

- disable back/forward button when there is no more data to show
- separate the filter button in a const
- fix end index that is show

closes #20

dashboard/src/components/Table/TreeTable.tsx

@@ -1,5 +1,7 @@
 import { useMemo } from "react";
 
+import { FormattedMessage } from "react-intl";
+
 import { TableRow, TableCell } from "../ui/table";
 
 import { TreeTableBody } from "../../types/tree/Tree";
@@ -19,13 +21,18 @@ const treeTableColumnsLabelId = [
 ];
 
 const TreeTableRow = (row: TreeTableBody): JSX.Element => {
+  const backgroundClassName = "flex flex-row bg-lightGray w-fit h-fit p-1 rounded-lg";
   return (
     <TableRow>
       <TableCell>{row.name}</TableCell>
       <TableCell>{row.branch}</TableCell>
       <TableCell>{row.commit}</TableCell>
-      <TableCell><div className="bg-lightGray w-fit h-fit p-1 rounded-lg">{row.buildStatus}</div></TableCell>
-      <TableCell><div className="bg-lightGray w-fit h-fit p-1 rounded-lg">{row.testStatus}</div></TableCell>
+      <TableCell><div className={backgroundClassName}>{row.buildStatus}</div></TableCell>
+      <TableCell>
+        <div className={backgroundClassName}>
+          <FormattedMessage id="treeTable.finished" />
+          <div className="pl-1">{row.testStatus}</div>
+        </div></TableCell>
     </TableRow>
   );
 };

dashboard/src/locales/messages/index.ts

@@ -18,8 +18,9 @@ export const messages = {
     },
     treeTable: {
       branch: "Branch",
-      build: "Build Status",
+      build: "Build Status (valid / invalid)",
       commit: "Commit/tag",
+      finished: "Finished",
       test: "Test Status",
       tree: "Tree",
     },