openreplay/frontend/app/components/shared/SessionItem/SessionMetaList/SessionMetaList.tsx
2022-07-08 11:12:19 +02:00

27 lines
737 B
TypeScript

import React from 'react'
import { Popup } from 'UI'
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 = 4 } = props
return (
<div className={cn("text-sm flex items-center", className)}>
{metaList.slice(0, maxLength).map(({ label, value }, index) => (
<MetaItem key={index} label={label} value={''+value} className="mr-3" />
))}
{metaList.length > maxLength && (
<MetaMoreButton list={metaList} maxLength={maxLength} />
)}
</div>
)
}