upgrade to patternfly 2.x, pf/react-core 3.x (#184)

This commit is contained in:
Keith Grant
2019-04-30 08:19:19 -04:00
committed by GitHub
parent 6fe93f474f
commit ffade973a9
13 changed files with 1317 additions and 904 deletions

View File

@@ -1,9 +1,12 @@
import React from 'react';
import { I18n } from '@lingui/react';
import { Trans, t } from '@lingui/macro';
import { Trans } from '@lingui/macro';
import {
Badge,
Checkbox,
DataListItem,
DataListItemRow,
DataListItemCells,
DataListCheck,
DataListCell,
} from '@patternfly/react-core';
import {
Link
@@ -22,44 +25,47 @@ class OrganizationListItem extends React.Component {
onSelect,
detailUrl,
} = this.props;
const labelId = `check-action-${itemId}`;
return (
<li key={itemId} className="pf-c-data-list__item" aria-labelledby="check-action-item1">
<I18n>
{({ i18n }) => (
<Checkbox
checked={isSelected}
onChange={onSelect}
aria-label={i18n._(t`select organization ${itemId}`)}
id={`select-organization-${itemId}`}
/>
)}
</I18n>
<VerticalSeparator />
<div className="pf-c-data-list__cell">
<span id="check-action-item1">
<Link
to={`${detailUrl}`}
>
<b>{name}</b>
</Link>
</span>
</div>
<div className="pf-c-data-list__cell">
<span className="awx-c-list-group">
<Trans>Members</Trans>
<Badge className="awx-c-list-group--badge" isRead>
{memberCount}
</Badge>
</span>
<span className="awx-c-list-group">
<Trans>Teams</Trans>
<Badge className="awx-c-list-group--badge" isRead>
{teamCount}
</Badge>
</span>
</div>
<div className="pf-c-data-list__cell" />
</li>
<DataListItem key={itemId} aria-labelledby={labelId}>
<DataListItemRow>
<DataListCheck
id={`select-organization-${itemId}`}
checked={isSelected}
onChange={onSelect}
aria-labelledby={labelId}
/>
<DataListItemCells dataListCells={[
<DataListCell key="divider" className="pf-c-data-list__cell--divider">
<VerticalSeparator />
</DataListCell>,
<DataListCell key="org-name">
<span id={labelId}>
<Link
to={`${detailUrl}`}
>
<b>{name}</b>
</Link>
</span>
</DataListCell>,
<DataListCell key="org-members">
<span className="awx-c-list-group">
<Trans>Members</Trans>
<Badge className="awx-c-list-group--badge" isRead>
{memberCount}
</Badge>
</span>
<span className="awx-c-list-group">
<Trans>Teams</Trans>
<Badge className="awx-c-list-group--badge" isRead>
{teamCount}
</Badge>
</span>
</DataListCell>
]}
/>
</DataListItemRow>
</DataListItem>
);
}
}