Sammy/t 194 aau when i set sort back and forth the (#103)

* bugfix: use original row id in cells to make sure it rerenders

* feature: implement multiple sorts

* bugfix: recreate new array to make sure component rerenders

* feature: orderBy is an array to keep orders

* test: snapshot the searchTemplate methods

* feature: remove the console log and return undefined

* feature: use orderByTemplate instead of hardcoded orderBy

* refactor: move sort and where filters helpers out of service

* refactor: rename file helper

* refactor: move assert function in test

front/src/pages/people/people-table.tsx

@@ -17,12 +17,16 @@ import CompanyChip from '../../components/chips/CompanyChip';
 import { GraphqlQueryPerson, Person } from '../../interfaces/person.interface';
 import PipeChip from '../../components/chips/PipeChip';
 import EditableText from '../../components/table/editable-cell/EditableText';
-import { OrderByFields, updatePerson } from '../../services/people';
+import { updatePerson } from '../../services/people';
 import {
   FilterType,
   SortType,
 } from '../../components/table/table-header/interface';
-import { People_Bool_Exp } from '../../generated/graphql';
+import {
+  Order_By,
+  People_Bool_Exp,
+  People_Order_By,
+} from '../../generated/graphql';
 import {
   SEARCH_COMPANY_QUERY,
   SEARCH_PEOPLE_QUERY,
@@ -36,25 +40,44 @@ export const availableSorts = [
     key: 'fullname',
     label: 'People',
     icon: <FaRegUser />,
+    _type: 'custom_sort',
+    orderByTemplate: (order: Order_By) => ({
+      firstname: order,
+      lastname: order,
+    }),
   },
   {
     key: 'company_name',
     label: 'Company',
     icon: <FaRegBuilding />,
+    _type: 'custom_sort',
+    orderByTemplate: (order: Order_By) => ({ company: { name: order } }),
   },
   {
     key: 'email',
     label: 'Email',
     icon: <FaEnvelope />,
+    _type: 'default_sort',
+  },
+  {
+    key: 'phone',
+    label: 'Phone',
+    icon: <FaPhone />,
+    _type: 'default_sort',
   },
-  { key: 'phone', label: 'Phone', icon: <FaPhone /> },
   {
     key: 'created_at',
     label: 'Created at',
     icon: <FaCalendar />,
+    _type: 'default_sort',
   },
-  { key: 'city', label: 'City', icon: <FaMapPin /> },
-] satisfies Array<SortType<OrderByFields>>;
+  {
+    key: 'city',
+    label: 'City',
+    icon: <FaMapPin />,
+    _type: 'default_sort',
+  },
+] satisfies Array<SortType<People_Order_By>>;
 
 const fullnameFilter = {
   key: 'fullname',
@@ -80,8 +103,6 @@ const fullnameFilter = {
         },
       };
     }
-    console.error(Error(`Unhandled operand: ${operand.keyWord}`));
-    return {};
   },
   searchQuery: SEARCH_PEOPLE_QUERY,
   searchTemplate: (searchInput: string) => ({
@@ -116,8 +137,6 @@ const companyFilter = {
         _not: { company: { name: { _eq: companyName } } },
       };
     }
-    console.error(Error(`Unhandled operand: ${operand.keyWord}`));
-    return {};
   },
   searchQuery: SEARCH_COMPANY_QUERY,
   searchTemplate: (searchInput: string) => ({
@@ -149,8 +168,6 @@ const emailFilter = {
         _not: { email: { _eq: email } },
       };
     }
-    console.error(Error(`Unhandled operand: ${operand.keyWord}`));
-    return {};
   },
   searchQuery: SEARCH_PEOPLE_QUERY,
   searchTemplate: (searchInput: string) => ({
@@ -182,8 +199,6 @@ const cityFilter = {
         _not: { city: { _eq: city } },
       };
     }
-    console.error(Error(`Unhandled operand: ${operand.keyWord}`));
-    return {};
   },
   searchQuery: SEARCH_PEOPLE_QUERY,
   searchTemplate: (searchInput: string) => ({