Skip to content

Commit

Permalink
Merge 73381d8 into a65d446
Browse files Browse the repository at this point in the history
  • Loading branch information
osteele committed May 19, 2018
2 parents a65d446 + 73381d8 commit c35ebfc
Show file tree
Hide file tree
Showing 11 changed files with 189 additions and 70 deletions.
2 changes: 0 additions & 2 deletions .eslintrc.yml
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,6 @@ globals:
rules:
# Intentional exceptions to Airbnb rules:
no-alert: off # currently used in the UI
no-plusplus: [error, allowForLoopAfterthoughts: true]
no-underscore-dangle: [error, allow: [__REDUX_DEVTOOLS_EXTENSION_COMPOSE__]]
no-unused-vars: [error, argsIgnorePattern: "^_" ]
react/jsx-no-target-blank: off
Expand All @@ -24,7 +23,6 @@ rules:
no-restricted-globals: warn
react/no-find-dom-node: warn
react/prop-types: off # TODO: #123
react/require-default-props: warn

# TODO: #118 accessibility
jsx-a11y/anchor-is-valid: off
Expand Down
6 changes: 3 additions & 3 deletions public/css/app.css
Original file line number Diff line number Diff line change
Expand Up @@ -343,7 +343,7 @@ span.label {
margin: 0.3rem 0.2em;
}

.button.label:hover:not(.no-hover) {
.button.label:hover:not(.disabled):not(.no-hover) {
background-color: #14679e;
color: #fefefe;
cursor: pointer;
Expand All @@ -354,13 +354,13 @@ span.label {
}

.add-edit-filters .button.label,
.add-edit-filters .button.label:not(.selected):not(.no-hover):hover {
.add-edit-filters .button.label:not(.selected):not(.disabled):not(.no-hover):hover {
background-color: #14679e !important;
color: #fefefe !important;
}

.add-edit-filters .button.label:not(.selected),
.add-edit-filters .button.label.selected:not(.no-hover):hover {
.add-edit-filters .button.label.selected:not(.disabled):not(.no-hover):hover {
background-color: white !important;
border-color: #14679e !important;
color: #14679e !important;
Expand Down
77 changes: 44 additions & 33 deletions src/__test__/__snapshots__/label-pane.test.jsx.snap
Original file line number Diff line number Diff line change
Expand Up @@ -8,21 +8,23 @@ exports[`LabelPane matches snapshot 1`] = `
type="text/css"
>
.label.label-label-1.selected{background-color:red}
.label.label-label-1.selected:not(.no-hover):hover,
.label.label-label-1.selected:not(.disabled):not(.no-hover):hover,
.label.label-label-1:not(.selected)
{background-color:white;border-color:red;color:red}
.label.label-label-1:not(.no-hover):hover{background-color:red;color:white}
.label.label-label-1:not(.disabled):not(.no-hover):hover
{background-color:red;color:white}
.label.label-label-2.selected{background-color:green}
.label.label-label-2.selected:not(.no-hover):hover,
.label.label-label-2.selected:not(.disabled):not(.no-hover):hover,
.label.label-label-2:not(.selected)
{background-color:white;border-color:green;color:green}
.label.label-label-2:not(.no-hover):hover{background-color:green;color:white}
.label.label-label-2:not(.disabled):not(.no-hover):hover
{background-color:green;color:white}
</style>
<div
className="label-selector-list"
>
<button
className="button label label-label-1 "
className="button label label-label-1 "
id="label-1"
onClick={[Function]}
title="first label"
Expand All @@ -36,7 +38,7 @@ exports[`LabelPane matches snapshot 1`] = `
first
</button>
<button
className="button label label-label-2 "
className="button label label-label-2 "
id="label-2"
onClick={[Function]}
title="second label"
Expand All @@ -61,21 +63,23 @@ exports[`LabelPane not editable 1`] = `
type="text/css"
>
.label.label-label-1.selected{background-color:red}
.label.label-label-1.selected:not(.no-hover):hover,
.label.label-label-1.selected:not(.disabled):not(.no-hover):hover,
.label.label-label-1:not(.selected)
{background-color:white;border-color:red;color:red}
.label.label-label-1:not(.no-hover):hover{background-color:red;color:white}
.label.label-label-1:not(.disabled):not(.no-hover):hover
{background-color:red;color:white}
.label.label-label-2.selected{background-color:green}
.label.label-label-2.selected:not(.no-hover):hover,
.label.label-label-2.selected:not(.disabled):not(.no-hover):hover,
.label.label-label-2:not(.selected)
{background-color:white;border-color:green;color:green}
.label.label-label-2:not(.no-hover):hover{background-color:green;color:white}
.label.label-label-2:not(.disabled):not(.no-hover):hover
{background-color:green;color:white}
</style>
<div
className="label-selector-list"
>
<span
className="label label-label-1 selected"
className="label label-label-1 selected "
id="label-1"
title="first label"
>
Expand All @@ -87,7 +91,7 @@ exports[`LabelPane not editable 1`] = `
first
</span>
<span
className="label label-label-2 "
className="label label-label-2 "
id="label-2"
title="second label"
>
Expand All @@ -110,36 +114,41 @@ exports[`LabelPane sorts labels 1`] = `
type="text/css"
>
.label.label-id-0.selected{background-color:undefined}
.label.label-id-0.selected:not(.no-hover):hover,
.label.label-id-0.selected:not(.disabled):not(.no-hover):hover,
.label.label-id-0:not(.selected)
{background-color:white;border-color:undefined;color:undefined}
.label.label-id-0:not(.no-hover):hover{background-color:black;color:white}
.label.label-id-0:not(.disabled):not(.no-hover):hover
{background-color:black;color:white}
.label.label-id-4.selected{background-color:undefined}
.label.label-id-4.selected:not(.no-hover):hover,
.label.label-id-4.selected:not(.disabled):not(.no-hover):hover,
.label.label-id-4:not(.selected)
{background-color:white;border-color:undefined;color:undefined}
.label.label-id-4:not(.no-hover):hover{background-color:black;color:white}
.label.label-id-4:not(.disabled):not(.no-hover):hover
{background-color:black;color:white}
.label.label-id-3.selected{background-color:undefined}
.label.label-id-3.selected:not(.no-hover):hover,
.label.label-id-3.selected:not(.disabled):not(.no-hover):hover,
.label.label-id-3:not(.selected)
{background-color:white;border-color:undefined;color:undefined}
.label.label-id-3:not(.no-hover):hover{background-color:black;color:white}
.label.label-id-3:not(.disabled):not(.no-hover):hover
{background-color:black;color:white}
.label.label-id-2.selected{background-color:undefined}
.label.label-id-2.selected:not(.no-hover):hover,
.label.label-id-2.selected:not(.disabled):not(.no-hover):hover,
.label.label-id-2:not(.selected)
{background-color:white;border-color:undefined;color:undefined}
.label.label-id-2:not(.no-hover):hover{background-color:black;color:white}
.label.label-id-2:not(.disabled):not(.no-hover):hover
{background-color:black;color:white}
.label.label-id-1.selected{background-color:undefined}
.label.label-id-1.selected:not(.no-hover):hover,
.label.label-id-1.selected:not(.disabled):not(.no-hover):hover,
.label.label-id-1:not(.selected)
{background-color:white;border-color:undefined;color:undefined}
.label.label-id-1:not(.no-hover):hover{background-color:black;color:white}
.label.label-id-1:not(.disabled):not(.no-hover):hover
{background-color:black;color:white}
</style>
<div
className="label-selector-list"
>
<button
className="button label label-id-0 "
className="button label label-id-0 "
id="id-0"
onClick={[Function]}
title={undefined}
Expand All @@ -153,7 +162,7 @@ exports[`LabelPane sorts labels 1`] = `
featured
</button>
<button
className="button label label-id-4 "
className="button label label-id-4 "
id="id-4"
onClick={[Function]}
title={undefined}
Expand All @@ -167,7 +176,7 @@ exports[`LabelPane sorts labels 1`] = `
a-label-3
</button>
<button
className="button label label-id-3 "
className="button label label-id-3 "
id="id-3"
onClick={[Function]}
title={undefined}
Expand All @@ -181,7 +190,7 @@ exports[`LabelPane sorts labels 1`] = `
a-label-4
</button>
<button
className="button label label-id-2 "
className="button label label-id-2 "
id="id-2"
onClick={[Function]}
title={undefined}
Expand All @@ -195,7 +204,7 @@ exports[`LabelPane sorts labels 1`] = `
a-label-1
</button>
<button
className="button label label-id-1 "
className="button label label-id-1 "
id="id-1"
onClick={[Function]}
title={undefined}
Expand All @@ -220,21 +229,23 @@ exports[`LabelPane with selected labels 1`] = `
type="text/css"
>
.label.label-label-1.selected{background-color:red}
.label.label-label-1.selected:not(.no-hover):hover,
.label.label-label-1.selected:not(.disabled):not(.no-hover):hover,
.label.label-label-1:not(.selected)
{background-color:white;border-color:red;color:red}
.label.label-label-1:not(.no-hover):hover{background-color:red;color:white}
.label.label-label-1:not(.disabled):not(.no-hover):hover
{background-color:red;color:white}
.label.label-label-2.selected{background-color:green}
.label.label-label-2.selected:not(.no-hover):hover,
.label.label-label-2.selected:not(.disabled):not(.no-hover):hover,
.label.label-label-2:not(.selected)
{background-color:white;border-color:green;color:green}
.label.label-label-2:not(.no-hover):hover{background-color:green;color:white}
.label.label-label-2:not(.disabled):not(.no-hover):hover
{background-color:green;color:white}
</style>
<div
className="label-selector-list"
>
<button
className="button label label-label-1 selected"
className="button label label-label-1 selected "
id="label-1"
onClick={[Function]}
title="first label"
Expand All @@ -248,7 +259,7 @@ exports[`LabelPane with selected labels 1`] = `
first
</button>
<button
className="button label label-label-2 "
className="button label label-label-2 "
id="label-2"
onClick={[Function]}
title="second label"
Expand Down
85 changes: 85 additions & 0 deletions src/__test__/calendar-container.test.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,85 @@
import { getVisibleEvents } from '../containers/calendar-container';

describe('getVisibleEvents', () => {
const events = [
{ name: 'A', id: 1, labels: ['a'] },
{ name: 'B', id: 2, labels: ['b'] },
{ name: 'C', sid: 3, labels: ['a', 'b'] },
];
const allLabels = {
a: { color: 'red' },
b: { color: 'green' },
c: { color: 'blue' },
};
const labels = Object.keys(allLabels);
test('waits for data', () => {
expect(getVisibleEvents(null, labels, allLabels)).toEqual(null);
expect(getVisibleEvents(events, null, allLabels)).toEqual(null);
expect(getVisibleEvents(events, labels, null)).toEqual(null);
});
test('assigns ids', () => {
const es = getVisibleEvents(events, labels, allLabels);
expect(es[0].id).toEqual(1);
expect(es[1].id).toEqual(2);
expect(es[2].id).toEqual(3);
});
test('assigns color', () => {
const es = getVisibleEvents(events, labels, allLabels);
expect(es[0].color).toEqual('red');
expect(es[1].color).toEqual('green');
expect(es[2].color).toEqual('red');
});
test('filters labels', () => {
const es1 = getVisibleEvents(events, ['a'], allLabels);
expect(es1.length).toEqual(2);
expect(es1[0].id).toEqual(1);
expect(es1[1].id).toEqual(3);

const es2 = getVisibleEvents(events, ['b'], allLabels);
expect(es2.length).toEqual(2);
expect(es2[0].id).toEqual(2);
expect(es2[1].id).toEqual(3);
});
});

describe('getVisibleEvents', () => {
const events = [
{ name: 'A', id: 1, labels: ['a'] },
{ name: 'B', id: 2, labels: ['b'] },
{ name: 'C', sid: 3, labels: ['a', 'b'] },
];
const allLabels = {
a: { color: 'red' },
b: { color: 'green' },
c: { color: 'blue' },
};
const labels = Object.keys(allLabels);
test('waits for data', () => {
expect(getVisibleEvents(null, labels, allLabels)).toEqual(null);
expect(getVisibleEvents(events, null, allLabels)).toEqual(null);
expect(getVisibleEvents(events, labels, null)).toEqual(null);
});
test('assigns ids', () => {
const es = getVisibleEvents(events, labels, allLabels);
expect(es[0].id).toEqual(1);
expect(es[1].id).toEqual(2);
expect(es[2].id).toEqual(3);
});
test('assigns color', () => {
const es = getVisibleEvents(events, labels, allLabels);
expect(es[0].color).toEqual('red');
expect(es[1].color).toEqual('green');
expect(es[2].color).toEqual('red');
});
test('filters labels', () => {
const es1 = getVisibleEvents(events, ['a'], allLabels);
expect(es1.length).toEqual(2);
expect(es1[0].id).toEqual(1);
expect(es1[1].id).toEqual(3);

const es2 = getVisibleEvents(events, ['b'], allLabels);
expect(es2.length).toEqual(2);
expect(es2[0].id).toEqual(2);
expect(es2[1].id).toEqual(3);
});
});
Loading

0 comments on commit c35ebfc

Please sign in to comment.