Within this program, I’m trying to map a function across an Array of objects in order to render rows with information from this Array of users. When doing so, TypeScript is giving me a variety of issues when trying to access this information. I can’t see what it is I’m missing that would allow me to access the properties.
The interfaces for my objects:
type TableData = Array<Row>;
interface Row {
id: string,
twilio_sid: string,
user_sid: string,
name: string,
activity_sid: string,
activity_name: string,
activity_last_updated: string,
role_id?: string,
queues?: string,
channels: [],
role?: string
}
Attempted map thus far:
{(rowsPerPage > 0
? Object.entries(rows).slice(page * rowsPerPage, page * rowsPerPage + rowsPerPage)
: rows
).map((user) => (
<TableRow key={user.id}>
<TableCell component="th" scope="row">
{user.name}
</TableCell>
<TableCell style={{ width: 160 }} align="left">
{user.role}
</TableCell>
<TableCell style={{ width: 160 }} align="left">
{user.activity_name}
</TableCell>
<TableCell style={{ width: 160 }} align="right">
Edit
</TableCell>
</TableRow>
))}
I previously was not using the Object.entries(obj)
implementation but this still threw an error stating that slice was not a function on this type Row
.
Does an implementation exist where I can still use slice in this regard?