hendrik/lens
1
0
Fork 0
mirror of https://github.com/lensapp/lens.git synced 2025-05-20 05:10:56 +00:00
Code Issues Projects Releases Wiki Activity

Setting different widths for columns

Browse Source 
Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>
This commit is contained in:
Alex Andreev 2022-08-23 15:52:32 +03:00
parent 44f1e824e3
commit 9247f932dc
1 changed files with 23 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

33
src/renderer/components/table/virtual-table.tsx
View File

@ -5,7 +5,7 @@
import React from "react";
import { flexRender, Row } from "@tanstack/react-table"
import type { Table } from "@tanstack/react-table";
import type { Table, Cell } from "@tanstack/react-table";
import { TableHeader } from "./table-header";
import { useVirtualizer } from "@tanstack/react-virtual";
@ -22,11 +22,10 @@
getScrollElement: () => tableContainerRef.current,
estimateSize: () => 55,
overscan: 5,
count: rows.length
count: rows.length,
paddingStart: 60 // header width
})
console.log(`${rowVirtualizer.getTotalSize()}px`)
return (
<>
<div className={className} ref={tableContainerRef}>
@ -55,11 +54,7 @@
>
{row.getVisibleCells().map(cell => {
return (
<div key={cell.id} style={{
width: cell.column.getSize(),
flexGrow: 0,
flexShrink: 0,
}}>
<div key={cell.id} style={getCellWidthStyles(table, cell)}>
{flexRender(
cell.column.columnDef.cell,
cell.getContext()
@ -76,4 +71,22 @@
</>
)
}
function getCellWidthStyles<T>(table: Table<T>, cell: Cell<T, unknown>) {
const cellResized = cell.column.id in table.getState().columnSizing;
const cellFixed = cell.column.getCanResize();
if (cellResized || cellFixed) {
return {
flexGrow: 0,
flexShrink: 0,
flexBasis: cell.column.getSize()
}
}
return {
flexGrow: 1,
flexShrink: 0,
flexBasis: "0%",
}
}