renamed component and refs

This commit is contained in:
Vladimir Khvan 2023-03-14 16:44:59 +05:00
parent 9ad2e74c2a
commit cb1089afed

View File

@ -1,4 +1,4 @@
import React, { useState, useRef } from "react"; import React, { useRef } from "react";
import styled from "styled-components"; import styled from "styled-components";
@ -6,7 +6,7 @@ import TableContainer from "@docspace/components/table-container/TableContainer"
import TableHeader from "@docspace/components/table-container/TableHeader"; import TableHeader from "@docspace/components/table-container/TableHeader";
import TableBody from "@docspace/components/table-container/TableBody"; import TableBody from "@docspace/components/table-container/TableBody";
import { WebhooksListRow } from "../WebhooksListRow"; import { WebhooksTableRow } from "../WebhooksTableRow";
import { Consumer } from "@docspace/components/utils/context"; import { Consumer } from "@docspace/components/utils/context";
@ -14,10 +14,10 @@ const TableWrapper = styled(TableContainer)`
margin-top: 16px; margin-top: 16px;
`; `;
export const WebhooksList = ({ webhooks, toggleEnabled, deleteWebhook, editWebhook }) => { export const WebhooksTable = ({ webhooks, toggleEnabled, deleteWebhook, editWebhook }) => {
const ref = useRef(null); const tableRef = useRef(null);
const [columns, setColumns] = useState([ const columns = useRef([
{ {
key: "Name", key: "Name",
title: "Name", title: "Name",
@ -48,10 +48,10 @@ export const WebhooksList = ({ webhooks, toggleEnabled, deleteWebhook, editWebho
<Consumer> <Consumer>
{(context) => { {(context) => {
return ( return (
<TableWrapper forwardedRef={ref}> <TableWrapper forwardedRef={tableRef}>
<TableHeader <TableHeader
columns={columns} columns={columns.current}
containerRef={ref} containerRef={tableRef}
checkboxMargin="12px" checkboxMargin="12px"
checkboxSize="48px" checkboxSize="48px"
sectionWidth={context.sectionWidth} sectionWidth={context.sectionWidth}
@ -59,7 +59,7 @@ export const WebhooksList = ({ webhooks, toggleEnabled, deleteWebhook, editWebho
/> />
<TableBody> <TableBody>
{webhooks.map((webhook, index) => ( {webhooks.map((webhook, index) => (
<WebhooksListRow <WebhooksTableRow
key={webhook.id} key={webhook.id}
webhook={webhook} webhook={webhook}
index={index} index={index}