Complete Fix view work (#2272)

* Fix views

* Make view sorts and view filters functional

* Complete Company table view fix

* Fix model creation

* Start fixing board

* Complete work

front/src/pages/opportunities/Opportunities.tsx

@@ -1,3 +1,5 @@
+import styled from '@emotion/styled';
+
 import { CompanyBoard } from '@/companies/board/components/CompanyBoard';
 import { CompanyBoardRecoilScopeContext } from '@/companies/states/recoil-scope-contexts/CompanyBoardRecoilScopeContext';
 import { PipelineAddButton } from '@/pipeline/components/PipelineAddButton';
@@ -11,6 +13,11 @@ import { RecoilScope } from '@/ui/utilities/recoil-scope/components/RecoilScope'
 import { useUpdatePipelineStageMutation } from '~/generated/graphql';
 import { opportunitiesBoardOptions } from '~/pages/opportunities/opportunitiesBoardOptions';
 
+const StyledBoardContainer = styled.div`
+  display: flex;
+  width: 100%;
+`;
+
 export const Opportunities = () => {
   const { handlePipelineStageAdd, handlePipelineStageDelete } =
     usePipelineStages();
@@ -51,11 +58,13 @@ export const Opportunities = () => {
               scopeId="opportunities"
               CustomRecoilScopeContext={CompanyBoardRecoilScopeContext}
             >
-              <CompanyBoard
-                onColumnAdd={handlePipelineStageAdd}
-                onColumnDelete={handlePipelineStageDelete}
-                onEditColumnTitle={handleEditColumnTitle}
-              />
+              <StyledBoardContainer>
+                <CompanyBoard
+                  onColumnAdd={handlePipelineStageAdd}
+                  onColumnDelete={handlePipelineStageDelete}
+                  onEditColumnTitle={handleEditColumnTitle}
+                />
+              </StyledBoardContainer>
             </RecoilScope>
           </BoardOptionsContext.Provider>
         </PageBody>

front/src/pages/opportunities/constants/opportunityBoardFilterDefinitions.tsx

@@ -8,31 +8,31 @@ import {
 } from '@/ui/display/icon/index';
 import { PipelineProgress } from '~/generated/graphql';
 
-import { FilterDropdownPeopleSearchSelect } from '../../modules/people/components/FilterDropdownPeopleSearchSelect';
+import { FilterDropdownPeopleSearchSelect } from '../../../modules/people/components/FilterDropdownPeopleSearchSelect';
 
-export const opportunitiesFilters: FilterDefinitionByEntity<PipelineProgress>[] =
+export const opportunityBoardFilterDefinitions: FilterDefinitionByEntity<PipelineProgress>[] =
   [
     {
-      key: 'amount',
+      fieldId: 'amount',
       label: 'Amount',
       Icon: IconCurrencyDollar,
       type: 'number',
     },
     {
-      key: 'closeDate',
+      fieldId: 'closeDate',
       label: 'Close date',
       Icon: IconCalendarEvent,
       type: 'date',
     },
     {
-      key: 'companyId',
+      fieldId: 'companyId',
       label: 'Company',
       Icon: IconBuildingSkyscraper,
       type: 'entity',
       entitySelectComponent: <FilterDropdownCompanySearchSelect />,
     },
     {
-      key: 'pointOfContactId',
+      fieldId: 'pointOfContactId',
       label: 'Point of contact',
       Icon: IconUser,
       type: 'entity',

front/src/pages/opportunities/constants/opportunityBoardSortDefinitions.tsx

@@ -1,19 +1,19 @@
 import { SortDefinition } from '@/ui/data/sort/types/SortDefinition';
 import { IconCalendarEvent, IconCurrencyDollar } from '@/ui/display/icon/index';
 
-export const opportunitiesSorts: SortDefinition[] = [
+export const opportunityBoardSortDefinitions: SortDefinition[] = [
   {
-    key: 'createdAt',
+    fieldId: 'createdAt',
     label: 'Creation',
     Icon: IconCalendarEvent,
   },
   {
-    key: 'amount',
+    fieldId: 'amount',
     label: 'Amount',
     Icon: IconCurrencyDollar,
   },
   {
-    key: 'closeDate',
+    fieldId: 'closeDate',
     label: 'Expected close date',
     Icon: IconCalendarEvent,
   },

front/src/pages/opportunities/opportunitiesBoardOptions.tsx

@@ -2,12 +2,12 @@ import { CompanyBoardCard } from '@/companies/components/CompanyBoardCard';
 import { NewCompanyProgressButton } from '@/companies/components/NewCompanyProgressButton';
 import { BoardOptions } from '@/ui/layout/board/types/BoardOptions';
 
-import { opportunitiesFilters } from './opportunities-filters';
-import { opportunitiesSorts } from './opportunities-sorts';
+import { opportunityBoardFilterDefinitions } from './constants/opportunityBoardFilterDefinitions';
+import { opportunityBoardSortDefinitions } from './constants/opportunityBoardSortDefinitions';
 
 export const opportunitiesBoardOptions: BoardOptions = {
   newCardComponent: <NewCompanyProgressButton />,
   CardComponent: CompanyBoardCard,
-  filters: opportunitiesFilters,
-  sorts: opportunitiesSorts,
+  filterDefinitions: opportunityBoardFilterDefinitions,
+  sortDefinitions: opportunityBoardSortDefinitions,
 };