18 lines
710 B
TypeScript
18 lines
710 B
TypeScript
import React from 'react';
|
|
import { groupByQuadrants, Item, Group } from '../../model';
|
|
import { quadrantsMap } from '../../config';
|
|
import QuadrantSection from '../QuadrantSection/QuadrantSection';
|
|
import './quadrant-grid.scss';
|
|
const renderQuadrant = (quadrantName: string, groups: Group) => {
|
|
return (
|
|
<div key={quadrantName} className='quadrant-grid__quadrant'>
|
|
<QuadrantSection quadrantName={quadrantName} groups={groups} />
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default function QuadrantGrid({ items }: { items: Item[] }) {
|
|
const groups = groupByQuadrants(items);
|
|
return <div className='quadrant-grid'>{Object.keys(quadrantsMap).map((quadrantName) => renderQuadrant(quadrantName, groups))}</div>;
|
|
}
|