Skip to content

Commit 18f32f3

Browse files
committed
fix: set tableStyle only once
1 parent 5dbfac8 commit 18f32f3

File tree

1 file changed

+28
-22
lines changed

1 file changed

+28
-22
lines changed

src/containers/Storage/PaginatedStorageNodes.tsx

+28-22
Original file line numberDiff line numberDiff line change
@@ -80,17 +80,20 @@ function StorageNodesComponent({
8080
viewContext,
8181
});
8282

83-
const [tableStyle, setTableStyle] = React.useState<React.CSSProperties>({});
84-
85-
const handleDataFetched = React.useCallback((data: any) => {
86-
if (data?.columnSettings) {
87-
const {maxSlotsPerDisk, maxDisksPerNode} = data.columnSettings;
88-
setTableStyle({
89-
[MAX_SLOTS_CSS_VAR]: maxSlotsPerDisk,
90-
[MAX_DISKS_CSS_VAR]: maxDisksPerNode,
91-
} as React.CSSProperties);
92-
}
93-
}, []);
83+
const [tableStyle, setTableStyle] = React.useState<React.CSSProperties | undefined>(undefined);
84+
85+
const handleDataFetched = React.useCallback(
86+
(data: PaginatedTableData<PreparedStorageNode>) => {
87+
if (data?.columnSettings && !tableStyle) {
88+
const {maxSlotsPerDisk, maxDisksPerNode} = data.columnSettings;
89+
setTableStyle({
90+
[MAX_SLOTS_CSS_VAR]: maxSlotsPerDisk,
91+
[MAX_DISKS_CSS_VAR]: maxDisksPerNode,
92+
} as React.CSSProperties);
93+
}
94+
},
95+
[tableStyle],
96+
);
9497

9598
const renderControls: RenderControls = ({totalEntities, foundEntities, inited}) => {
9699
return (
@@ -245,17 +248,20 @@ function StorageNodesTableGroupContent({
245248
columns,
246249
initialEntitiesCount,
247250
}: StorageNodesTableGroupContentProps) {
248-
const [tableStyle, setTableStyle] = React.useState<React.CSSProperties>({});
249-
250-
const handleDataFetched = React.useCallback((data: PaginatedTableData<PreparedStorageNode>) => {
251-
if (data?.columnSettings) {
252-
const {maxSlotsPerDisk, maxDisksPerNode} = data.columnSettings;
253-
setTableStyle({
254-
[MAX_SLOTS_CSS_VAR]: maxSlotsPerDisk,
255-
[MAX_DISKS_CSS_VAR]: maxDisksPerNode,
256-
} as React.CSSProperties);
257-
}
258-
}, []);
251+
const [tableStyle, setTableStyle] = React.useState<React.CSSProperties | undefined>(undefined);
252+
253+
const handleDataFetched = React.useCallback(
254+
(data: PaginatedTableData<PreparedStorageNode>) => {
255+
if (data?.columnSettings && !tableStyle) {
256+
const {maxSlotsPerDisk, maxDisksPerNode} = data.columnSettings;
257+
setTableStyle({
258+
[MAX_SLOTS_CSS_VAR]: maxSlotsPerDisk,
259+
[MAX_DISKS_CSS_VAR]: maxDisksPerNode,
260+
} as React.CSSProperties);
261+
}
262+
},
263+
[tableStyle],
264+
);
259265

260266
return (
261267
<PaginatedStorageNodesTable

0 commit comments

Comments
 (0)