openreplay/frontend/app/components/shared/SessionItem/SessionMetaList/SessionMetaList.tsx
2025-03-11 10:35:08 +01:00

28 lines
761 B
TypeScript

import React from 'react';
import cn from 'classnames';
import MetaItem from '../MetaItem';
import MetaMoreButton from '../MetaMoreButton';
interface Props {
className?: string;
metaList: any[];
maxLength?: number;
}
export default function SessionMetaList(props: Props) {
const { className = '', metaList, maxLength = 14 } = props;
return (
<div className={cn('flex items-center flex-wrap gap-1', className)}>
{metaList.slice(0, maxLength).map(({ label, value }, index) => (
<React.Fragment key={index}>
<MetaItem label={label} value={`${value}`} />
</React.Fragment>
))}
{metaList.length > maxLength && (
<MetaMoreButton list={metaList} maxLength={maxLength} />
)}
</div>
);
}