1880 Refactored Dropdown components (#1884)

* updated DropdownButton props

* refactoring in progress

* working but layout is wrong

* fixed bug

* wip on ColumnHeadWithDropdown

* fix bug

* fix bug

* remove unused styled component

* fix z-index bug

* add an optional argument to DropdownMenu to control the offset of the menu

* add an optional argument to DropdownMenu to control the offset of the menu

* modify files after PR comments

* clean the way the offset is handled

* fix lint

front/src/modules/ui/data-table/components/ColumnHeadWithDropdown.tsx

@@ -0,0 +1,38 @@
+import { DropdownMenu } from '@/ui/dropdown/components/DropdownMenu';
+import { FieldMetadata } from '@/ui/field/types/FieldMetadata';
+
+import { ColumnDefinition } from '../types/ColumnDefinition';
+
+import { ColumnHead } from './ColumnHead';
+import { TableColumnDropdownMenu } from './TableColumnDropdownMenu';
+
+type ColumnHeadProps = {
+  column: ColumnDefinition<FieldMetadata>;
+  isFirstColumn: boolean;
+  isLastColumn: boolean;
+  primaryColumnKey: string;
+};
+
+export const ColumnHeadWithDropdown = ({
+  column,
+  isFirstColumn,
+  isLastColumn,
+  primaryColumnKey,
+}: ColumnHeadProps) => {
+  return (
+    <DropdownMenu
+      clickableComponent={<ColumnHead column={column} />}
+      dropdownId={column.key + '-header'}
+      dropdownComponents={
+        <TableColumnDropdownMenu
+          column={column}
+          isFirstColumn={isFirstColumn}
+          isLastColumn={isLastColumn}
+          primaryColumnKey={primaryColumnKey}
+        />
+      }
+      dropdownHotkeyScope={{ scope: column.key + '-header' }}
+      dropdownOffset={{ x: 0, y: -8 }}
+    />
+  );
+};