From ab45873082e944236d2ec70f462eaafb167ae212 Mon Sep 17 00:00:00 2001
From: Alex Andreev <alex.andreev.email@gmail.com>
Date: Thu, 25 Aug 2022 10:06:32 +0300
Subject: [PATCH] Add width styles to <Table/>

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>
---
 src/renderer/components/table/react-table.tsx | 12 +++++++++---
 1 file changed, 9 insertions(+), 3 deletions(-)

diff --git a/src/renderer/components/table/react-table.tsx b/src/renderer/components/table/react-table.tsx
index 8245c227f9..4b05a1df8a 100644
--- a/src/renderer/components/table/react-table.tsx
+++ b/src/renderer/components/table/react-table.tsx
@@ -3,9 +3,9 @@
  * Licensed under MIT License. See LICENSE in root directory for more information.
  */
 
-import React from "react";
+import React, { CSSProperties } from "react";
 import { flexRender } from '@tanstack/react-table'
-import type { Table } from "@tanstack/react-table";
+import type { Table, Header, Cell } from "@tanstack/react-table";
 import { TableHeader } from "./table-header";
 
 interface TableProps<T> {
@@ -17,7 +17,7 @@ export function Table<Data>({ className, table }: TableProps<Data>) {
   return (
     <div className={className}>
       <table>
-        <TableHeader table={table}/>
+        <TableHeader table={table} getColumnSizeStyles={getWidthStyles}/>
         <tbody>
           {table.getRowModel().rows.map(row => (
             <tr key={row.id}>
@@ -33,3 +33,9 @@ export function Table<Data>({ className, table }: TableProps<Data>) {
     </div>
   )
 }
+
+function getWidthStyles<T>(table: Table<T>, cell: Cell<T, unknown> | Header<T, unknown>): CSSProperties {
+  return {
+    width: cell.column.getSize(),
+  }
+}