Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

FIX Use correct versioned state badge designs in campaign admin list items #140

Closed
wants to merge 1 commit into from
Closed

FIX Use correct versioned state badge designs in campaign admin list items #140

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion client/dist/js/bundle.js
View file
Open in desktop

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion client/dist/styles/bundle.css
View file
Open in desktop

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

5 changes: 4 additions & 1 deletion client/src/containers/CampaignAdmin/CampaignAdmin.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -63,7 +63,6 @@
}

.list-group-item {

&:hover {
.campaign-admin__item-links--is-linked {
opacity: 1;
Expand All @@ -82,6 +81,10 @@
.campaign-admin__item-links__number {
opacity: 1;
}

.versioned-badge {
color: $white;
}
}

.list-group-item__heading {
Expand Down
32 changes: 24 additions & 8 deletions client/src/containers/CampaignAdmin/CampaignAdminItem.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
import React, { Component } from 'react';
import i18n from 'i18n';
import { inject } from 'lib/Injector';
import { UncontrolledTooltip } from 'reactstrap';
import formatWrittenNumber from 'lib/formatWrittenNumber';
import PropTypes from 'prop-types';
Expand Down Expand Up @@ -111,8 +112,10 @@ class CampaignAdminItem extends Component {

render() {
let thumbnail = null;
const badge = {};
const { campaign, item } = this.props;
const badge = {
status: 'none',
};
const { campaign, item, VersionedBadgeComponent } = this.props;

// @todo customise these status messages for already-published changesets

Expand All @@ -121,20 +124,20 @@ class CampaignAdminItem extends Component {
if (campaign.State === 'open') {
switch (item.ChangeType) {
case 'created':
badge.className = 'badge badge-warning list-group-item__status';
badge.status = 'draft';
badge.Title = i18n._t('CampaignAdmin.DRAFT', 'Draft');
break;
case 'modified':
badge.className = 'badge badge-warning list-group-item__status';
badge.status = 'modified';
badge.Title = i18n._t('CampaignAdmin.MODIFIED', 'Modified');
break;
case 'deleted':
badge.className = 'badge badge-error list-group-item__status';
badge.status = 'removed';
badge.Title = i18n._t('CampaignAdmin.REMOVED', 'Removed');
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I couldn't see a way of reproducing this via the UI. When I remove a page from a campaign is just removes it from the items list.

break;
case 'none':
default:
badge.className = 'badge badge-success list-group-item__status';
badge.status = 'live';
badge.Title = i18n._t('CampaignAdmin.NO_CHANGES', 'No changes');
break;
}
Expand All @@ -157,7 +160,11 @@ class CampaignAdminItem extends Component {
<h4 className="list-group-item__heading" title={item.Title}>{item.Title}</h4>
{links}
{badge.className && badge.Title &&
<span className={badge.className}>{badge.Title}</span>
<VersionedBadgeComponent
extraClass="list-group-item__status"
status={badge.status}
message={badge.Title}
/>
}
</div>
</div>
Expand All @@ -170,6 +177,15 @@ CampaignAdminItem.propTypes = {
item: PropTypes.object.isRequired,
isLinked: PropTypes.bool,
selected: PropTypes.bool,
VersionedBadgeComponent: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),
};

export default CampaignAdminItem;
export { CampaignAdminItem as Component };

export default inject(
['VersionedBadge'],
(VersionedBadgeComponent) => ({
VersionedBadgeComponent,
}),
() => 'CampaignAdmin.CampaignAdmin.ListItem'
)(CampaignAdminItem);
2 changes: 1 addition & 1 deletion client/src/containers/CampaignAdmin/tests/CampaignAdminItem-test.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ jest.mock('reactstrap');

import React from 'react';
import ReactTestUtils from 'react-dom/test-utils';
import CampaignAdminItem from '../CampaignAdminItem';
import { Component as CampaignAdminItem } from '../CampaignAdminItem';

describe('CampaignAdminItem', () => {
let props = null;
Expand Down