Felix icons (#312)

* Fix icon size in table top bar

* Replace building icon

* Replace Employees icon

* Replace map icon

* Replace calendar icon

* Replace Target icon

front/src/pages/companies/Companies.tsx

@@ -19,7 +19,7 @@ import {
 import { SelectedFilterType } from '@/filters-and-sorts/interfaces/filters/interface';
 import { EntityTableActionBar } from '@/ui/components/table/action-bar/EntityTableActionBar';
 import { EntityTable } from '@/ui/components/table/EntityTable';
-import { IconBuilding } from '@/ui/icons/index';
+import { IconBuildingSkyscraper } from '@/ui/icons/index';
 import { IconList } from '@/ui/icons/index';
 import { WithTopBarContainer } from '@/ui/layout/containers/WithTopBarContainer';
 import { BoolExpType } from '@/utils/interfaces/generic.interface';
@@ -78,7 +78,7 @@ export function Companies() {
     <AppPage>
       <WithTopBarContainer
         title="Companies"
-        icon={<IconBuilding size={16} />}
+        icon={<IconBuildingSkyscraper size={16} />}
         onAddButtonClick={handleAddButtonClick}
       >
         <>
@@ -87,7 +87,7 @@ export function Companies() {
               data={companies}
               columns={companiesColumns}
               viewName="All Companies"
-              viewIcon={<IconList />}
+              viewIcon={<IconList size={16} />}
               availableSorts={availableSorts}
               availableFilters={availableFilters}
               onSortsUpdate={updateSorts}

front/src/pages/companies/companies-columns.tsx

@@ -15,12 +15,12 @@ import { EditableRelation } from '@/ui/components/editable-cell/types/EditableRe
 import { EditableText } from '@/ui/components/editable-cell/types/EditableText';
 import { ColumnHead } from '@/ui/components/table/ColumnHead';
 import {
-  IconBuilding,
-  IconCalendar,
+  IconBuildingSkyscraper,
+  IconCalendarEvent,
   IconLink,
-  IconMapPin,
-  IconSum,
+  IconMap,
   IconUser,
+  IconUsers,
 } from '@/ui/icons/index';
 import { getCheckBoxColumn } from '@/ui/tables/utils/getCheckBoxColumn';
 import { mapToUser, User } from '@/users/interfaces/user.interface';
@@ -34,7 +34,10 @@ export const useCompaniesColumns = () => {
       getCheckBoxColumn(),
       columnHelper.accessor('name', {
         header: () => (
-          <ColumnHead viewName="Name" viewIcon={<IconBuilding size={16} />} />
+          <ColumnHead
+            viewName="Name"
+            viewIcon={<IconBuildingSkyscraper size={16} />}
+          />
         ),
         cell: (props) => (
           <CompanyEditableNameChipCell company={props.row.original} />
@@ -60,7 +63,7 @@ export const useCompaniesColumns = () => {
       }),
       columnHelper.accessor('employees', {
         header: () => (
-          <ColumnHead viewName="Employees" viewIcon={<IconSum size={16} />} />
+          <ColumnHead viewName="Employees" viewIcon={<IconUsers size={16} />} />
         ),
         cell: (props) => (
           <EditableText
@@ -83,7 +86,7 @@ export const useCompaniesColumns = () => {
       }),
       columnHelper.accessor('address', {
         header: () => (
-          <ColumnHead viewName="Address" viewIcon={<IconMapPin size={16} />} />
+          <ColumnHead viewName="Address" viewIcon={<IconMap size={16} />} />
         ),
         cell: (props) => (
           <EditableText
@@ -102,7 +105,7 @@ export const useCompaniesColumns = () => {
         header: () => (
           <ColumnHead
             viewName="Creation"
-            viewIcon={<IconCalendar size={16} />}
+            viewIcon={<IconCalendarEvent size={16} />}
           />
         ),
         cell: (props) => (

front/src/pages/companies/companies-filters.tsx

@@ -2,12 +2,12 @@ import { Company } from '@/companies/interfaces/company.interface';
 import { FilterConfigType } from '@/filters-and-sorts/interfaces/filters/interface';
 import { SEARCH_USER_QUERY } from '@/search/services/search';
 import {
-  IconBuilding,
-  IconCalendar,
+  IconBuildingSkyscraper,
+  IconCalendarEvent,
   IconLink,
-  IconMapPin,
-  IconSum,
+  IconMap,
   IconUser,
+  IconUsers,
 } from '@/ui/icons/index';
 import { mapToUser, User } from '@/users/interfaces/user.interface';
 import { QueryMode } from '~/generated/graphql';
@@ -15,7 +15,7 @@ import { QueryMode } from '~/generated/graphql';
 export const nameFilter = {
   key: 'name',
   label: 'Name',
-  icon: <IconBuilding size={16} />,
+  icon: <IconBuildingSkyscraper size={16} />,
   type: 'text',
   operands: [
     {
@@ -45,7 +45,7 @@ export const nameFilter = {
 export const employeesFilter = {
   key: 'employees',
   label: 'Employees',
-  icon: <IconSum size={16} />,
+  icon: <IconUsers size={16} />,
   type: 'text',
   operands: [
     {
@@ -105,7 +105,7 @@ export const urlFilter = {
 export const addressFilter = {
   key: 'address',
   label: 'Address',
-  icon: <IconMapPin size={16} />,
+  icon: <IconMap size={16} />,
   type: 'text',
   operands: [
     {
@@ -135,7 +135,7 @@ export const addressFilter = {
 export const ccreatedAtFilter = {
   key: 'createdAt',
   label: 'Created At',
-  icon: <IconCalendar size={16} />,
+  icon: <IconCalendarEvent size={16} />,
   type: 'date',
   operands: [
     {

front/src/pages/companies/companies-sorts.tsx

@@ -1,10 +1,10 @@
 import { SortType } from '@/filters-and-sorts/interfaces/sorts/interface';
 import {
-  IconBuilding,
-  IconCalendar,
+  IconBuildingSkyscraper,
+  IconCalendarEvent,
   IconLink,
-  IconMapPin,
-  IconSum,
+  IconMap,
+  IconUsers,
 } from '@/ui/icons/index';
 import { CompanyOrderByWithRelationInput as Companies_Order_By } from '~/generated/graphql';
 
@@ -12,13 +12,13 @@ export const availableSorts = [
   {
     key: 'name',
     label: 'Name',
-    icon: <IconBuilding size={16} />,
+    icon: <IconBuildingSkyscraper size={16} />,
     _type: 'default_sort',
   },
   {
     key: 'employees',
     label: 'Employees',
-    icon: <IconSum size={16} />,
+    icon: <IconUsers size={16} />,
     _type: 'default_sort',
   },
   {
@@ -30,13 +30,13 @@ export const availableSorts = [
   {
     key: 'address',
     label: 'Address',
-    icon: <IconMapPin size={16} />,
+    icon: <IconMap size={16} />,
     _type: 'default_sort',
   },
   {
     key: 'createdAt',
     label: 'Creation',
-    icon: <IconCalendar size={16} />,
+    icon: <IconCalendarEvent size={16} />,
     _type: 'default_sort',
   },
 ] satisfies Array<SortType<Companies_Order_By>>;

front/src/pages/opportunities/Opportunities.tsx

@@ -1,4 +1,4 @@
-import { IconTarget } from '@/ui/icons/index';
+import { IconTargetArrow } from '@/ui/icons/index';
 import { WithTopBarContainer } from '@/ui/layout/containers/WithTopBarContainer';
 import { AppPage } from '~/AppPage';
 
@@ -14,7 +14,7 @@ export function Opportunities() {
     return <div>Initial board or items not found</div>;
   return (
     <AppPage>
-      <WithTopBarContainer title="Opportunities" icon={<IconTarget />}>
+      <WithTopBarContainer title="Opportunities" icon={<IconTargetArrow />}>
         <Board initialBoard={initialBoard} items={items} />
       </WithTopBarContainer>
     </AppPage>

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

@@ -10,10 +10,10 @@ import { EditablePhone } from '@/ui/components/editable-cell/types/EditablePhone
 import { EditableText } from '@/ui/components/editable-cell/types/EditableText';
 import { ColumnHead } from '@/ui/components/table/ColumnHead';
 import {
-  IconBuilding,
-  IconCalendar,
+  IconBuildingSkyscraper,
+  IconCalendarEvent,
   IconMail,
-  IconMapPin,
+  IconMap,
   IconPhone,
   IconUser,
 } from '@/ui/icons/index';
@@ -65,7 +65,7 @@ export const usePeopleColumns = () => {
         header: () => (
           <ColumnHead
             viewName="Company"
-            viewIcon={<IconBuilding size={16} />}
+            viewIcon={<IconBuildingSkyscraper size={16} />}
           />
         ),
         cell: (props) => <PeopleCompanyCell people={props.row.original} />,
@@ -92,7 +92,7 @@ export const usePeopleColumns = () => {
         header: () => (
           <ColumnHead
             viewName="Creation"
-            viewIcon={<IconCalendar size={16} />}
+            viewIcon={<IconCalendarEvent size={16} />}
           />
         ),
         cell: (props) => (
@@ -109,7 +109,7 @@ export const usePeopleColumns = () => {
       }),
       columnHelper.accessor('city', {
         header: () => (
-          <ColumnHead viewName="City" viewIcon={<IconMapPin size={16} />} />
+          <ColumnHead viewName="City" viewIcon={<IconMap size={16} />} />
         ),
         cell: (props) => (
           <EditableText

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

@@ -6,10 +6,10 @@ import { FilterConfigType } from '@/filters-and-sorts/interfaces/filters/interfa
 import { Person } from '@/people/interfaces/person.interface';
 import { SEARCH_COMPANY_QUERY } from '@/search/services/search';
 import {
-  IconBuilding,
-  IconCalendar,
+  IconBuildingSkyscraper,
+  IconCalendarEvent,
   IconMail,
-  IconMapPin,
+  IconMap,
   IconPhone,
   IconUser,
 } from '@/ui/icons/index';
@@ -101,7 +101,7 @@ export const emailFilter = {
 export const companyFilter = {
   key: 'company_name',
   label: 'Company',
-  icon: <IconBuilding size={16} />,
+  icon: <IconBuildingSkyscraper size={16} />,
   type: 'relation',
   searchConfig: {
     query: SEARCH_COMPANY_QUERY,
@@ -165,7 +165,7 @@ export const phoneFilter = {
 export const createdAtFilter = {
   key: 'createdAt',
   label: 'Created At',
-  icon: <IconCalendar size={16} />,
+  icon: <IconCalendarEvent size={16} />,
   type: 'date',
   operands: [
     {
@@ -192,7 +192,7 @@ export const createdAtFilter = {
 export const cityFilter = {
   key: 'city',
   label: 'City',
-  icon: <IconMapPin size={16} />,
+  icon: <IconMap size={16} />,
   type: 'text',
   operands: [
     {

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

@@ -1,9 +1,9 @@
 import { SortType } from '@/filters-and-sorts/interfaces/sorts/interface';
 import {
-  IconBuilding,
-  IconCalendar,
+  IconBuildingSkyscraper,
+  IconCalendarEvent,
   IconMail,
-  IconMapPin,
+  IconMap,
   IconPhone,
   IconUser,
 } from '@/ui/icons/index';
@@ -30,7 +30,7 @@ export const availableSorts = [
   {
     key: 'company_name',
     label: 'Company',
-    icon: <IconBuilding size={16} />,
+    icon: <IconBuildingSkyscraper size={16} />,
     _type: 'custom_sort',
     orderByTemplates: [(order: Order_By) => ({ company: { name: order } })],
   },
@@ -49,13 +49,13 @@ export const availableSorts = [
   {
     key: 'createdAt',
     label: 'Created at',
-    icon: <IconCalendar size={16} />,
+    icon: <IconCalendarEvent size={16} />,
     _type: 'default_sort',
   },
   {
     key: 'city',
     label: 'City',
-    icon: <IconMapPin size={16} />,
+    icon: <IconMap size={16} />,
     _type: 'default_sort',
   },
 ] satisfies Array<SortType<People_Order_By>>;