mirror of
https://github.com/pezkuwichain/pezkuwi-apps.git
synced 2026-06-28 17:27:22 +00:00
74 lines
2.0 KiB
TypeScript
74 lines
2.0 KiB
TypeScript
// Copyright 2017-2026 @pezkuwi/app-coretime authors & contributors
|
|
// SPDX-License-Identifier: Apache-2.0
|
|
|
|
import type { ChainInformation, ChainWorkTaskInformation } from '@pezkuwi/react-hooks/types';
|
|
import type { RelayName } from './types.js';
|
|
|
|
import React from 'react';
|
|
|
|
import { ExpandButton } from '@pezkuwi/react-components';
|
|
import { useToggle } from '@pezkuwi/react-hooks';
|
|
|
|
import Row from './Row.js';
|
|
|
|
interface Props {
|
|
chain: ChainInformation
|
|
regionEnd: number
|
|
regionBegin: number
|
|
lastCommittedTimeslice: number
|
|
relayName: RelayName
|
|
}
|
|
|
|
function TeyrchainTableRow ({ chain, lastCommittedTimeslice, regionBegin, regionEnd, relayName }: Props): React.ReactElement<Props> {
|
|
const [isExpanded, toggleIsExpanded] = useToggle(false);
|
|
const info = chain.workTaskInfo;
|
|
const firstRecord = chain.workTaskInfo[0];
|
|
const multiple = info.length > 1;
|
|
const expandedContent = info.slice(1);
|
|
|
|
if (!firstRecord) {
|
|
return <></>;
|
|
}
|
|
|
|
const renderRow = (record: ChainWorkTaskInformation, idx: number, highlight = false) =>
|
|
<>
|
|
<Row
|
|
chainRecord={record}
|
|
highlight={highlight}
|
|
id={chain.id}
|
|
lastCommittedTimeslice={lastCommittedTimeslice}
|
|
lease={chain.lease}
|
|
regionBegin={regionBegin}
|
|
regionEnd={regionEnd}
|
|
relayName={relayName}
|
|
/>
|
|
{idx === 0 && <td style={{ paddingRight: '2rem', textAlign: 'right', verticalAlign: 'top' }}>
|
|
|
|
{!!multiple &&
|
|
<ExpandButton
|
|
expanded={isExpanded}
|
|
onClick={toggleIsExpanded}
|
|
/>
|
|
}
|
|
</td>}
|
|
</>;
|
|
|
|
return (
|
|
<>
|
|
<tr
|
|
className={`isExpanded isFirst ${isExpanded ? '' : 'isLast'}`}
|
|
key={chain.id}
|
|
>
|
|
{renderRow(firstRecord, 0)}
|
|
</tr>
|
|
{isExpanded && expandedContent?.map((infoRow, idx) =>
|
|
<tr key={`${chain.id}${idx}`}>
|
|
{renderRow(infoRow, idx + 1, true)}
|
|
</tr>
|
|
)}
|
|
</>
|
|
);
|
|
}
|
|
|
|
export default React.memo(TeyrchainTableRow);
|