AJR/TechRadarAJR
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Add quadrant overview pages

Browse Source
This commit is contained in:
Tom Raithel
2017-02-21 21:10:24 +01:00
parent 61d46f96bb
commit c0dd1809e3
8 changed files with 185 additions and 76 deletions
Download Patch File Download Diff File Expand all files Collapse all files

46
js/components/QuadrantGrid.js
View File

@@ -1,52 +1,12 @@
import React from 'react';
import { groupByQuadrants } from '../../common/model';
import { translate, quadrants, rings } from '../../common/config';
const renderRing = (ringName, quadrantName, groups) => {
if (!groups[quadrantName][ringName] || groups[quadrantName][ringName].length === 0) {
return null;
}
return (
<div key={ringName} className="quadrant-section__ring">
<div className="ring-list">
<div className="ring-list__header"><span className={`badge badge--${ringName}`}>{ringName}</span></div>
{
(groups[quadrantName][ringName]).map(item => (
<span
key={item.name}
className="ring-list__item"
>
<a className="link" href={`/${item.quadrant}/${item.name}.html`}>{item.title}</a>
</span>
))
}
</div>
</div>
);
}
import { quadrants } from '../../common/config';
import QuadrantSection from './QuadrantSection';
const renderQuadrant = (quadrantName, groups) => {
return (
<div key={quadrantName} className="quadrant-grid__quadrant">
<div className="quadrant-section">
<div className="quadrant-section__header">
<div className="split">
<div className="split__left">
<h4 className="headline">{translate(quadrantName)}</h4>
</div>
<div className="split__right">
<a className="icon-link" href={`/${quadrantName}.html`}>
<span className="icon icon--pie icon-link__icon"></span>Quadrant Overview
</a>
</div>
</div>
</div>
<div className="quadrant-section__rings">
{
rings.map((ringName) => renderRing(ringName, quadrantName, groups))
}
</div>
</div>
<QuadrantSection quadrantName={quadrantName} groups={groups} />
</div>
);
}