7143260147

Committed 08 Dec 2023 03:34PM UTC coverage: 23.662% (-0.006%) from 23.668%

Build # 7143260147

Build Type

push

github

Committed by

gustavo-salazar

Commit Message

removing the genome3d subpage from an entry page

Run Details

905 of 5288 branches covered (0.0%)

Branch coverage included in aggregate %.

2 of 7 new or added lines in 3 files covered. (28.57%)

4 existing lines in 2 files now uncovered.

2172 of 7716 relevant lines covered (28.15%)

47.77 hits per line

Source File
Press 'n' to go to next uncovered line, 'b' for previous

25.0

/src/components/SimpleCommonComponents/ColumnIcons/index.js

// @flow
import React from 'react';
import T from 'prop-types';

import { connect } from 'react-redux';
import { createSelector } from 'reselect';
import { goToCustomLocation } from 'actions/creators';

import { SearchBox } from 'components/Table';

import { foundationPartial } from 'styles/foundation';

import fonts from 'EBI-Icon-fonts/fonts.css';

const f = foundationPartial(fonts);

const NUMBER_OF_SORT_MODES = 3;
const SORT_OFF = 0;
const SORT_UP = 1;
const SORT_DOWN = 2;

const OPACITY_OFF = 0.4;

export const SortButton = (
  { mode, onClick } /*: {mode: number, onClick: function} */,
) => {
  let icon = '&#xf0dd;';
  let iconClass = 'icon-sort';
  if (SORT_UP === mode) {
    icon = '&#xf0de;';
    iconClass = 'icon-sort-up';
  }
  if (SORT_DOWN === mode) {
    icon = '&#xf0dd;';
    iconClass = 'icon-sort-down';
  }
  return (
    <button onClick={onClick}>
      <span
        className={f(iconClass, 'icon', 'icon-common')}
        data-icon={icon}
        style={{
          opacity: mode === SORT_OFF ? OPACITY_OFF : 1,
        }}
      />
    </button>
  );
};
SortButton.propTypes = {
  mode: T.number,
  onClick: T.func,
};

const _ConnectedSortButton = ({
  description,
  search,
  field,
  goToCustomLocation,
}) => {
  let mode = SORT_OFF;
  const { sort_by: sortBy } = search;

  // If multiple columns are added to sort
  if (sortBy?.split(',').length > 1) {
    if (sortBy.includes(field)) mode = SORT_UP;
  } else {
    if (sortBy === field) mode = SORT_UP;
    if (sortBy === `-${field}`) mode = SORT_DOWN;
  }
  const handleClick = () => {
    const newMode = (mode + 1) % NUMBER_OF_SORT_MODES;

    if (newMode > 0) {
      search.sort_by = `${newMode === SORT_DOWN ? '-' : ''}${field}`;
    } else {
      delete search.sort_by;
    }
    goToCustomLocation({ description: description, search: { ...search } });
  };

  return <SortButton mode={mode} onClick={handleClick} />;
};
_ConnectedSortButton.propTypes = {
  description: T.object.isRequired,
  search: T.shape({
    sort_by: T.string,
  }),
  field: T.string,
  goToCustomLocation: T.func.isRequired,
};

const mapStateToProps = createSelector(
  (state) => state.customLocation.description,
  (state) => state.customLocation.search,
  (description, search) => ({ description, search }),
);

export const ConnectedSortButton = connect(mapStateToProps, {
  goToCustomLocation,
})(_ConnectedSortButton);

export const FilterButton = (
  { isOpen, onClick } /*: {isOpen: boolean, onClick?: ?function} */,
) => {
  return (
    <button onClick={onClick}>
      <span
        className={f('icon-filter', 'icon', 'icon-common')}
        data-icon="f"
        style={{
          opacity: isOpen ? 1 : OPACITY_OFF,
        }}
      />
    </button>
  );
};

FilterButton.propTypes = {
  isOpen: T.bool,
  onClick: T.func,
};

export const _ColumnSelectMenu = ({
  field,
  options,
  search,
  description,
  goToCustomLocation,
}) => {
  const onSelection = ({ target: { value: option } }) => {
    search[field] = option;
    goToCustomLocation({ description: description, search: { ...search } });
  };
  return (
    <select
      className={'inline-select'}
      name={'column-select'}
      onChange={onSelection}
      onBlur={onSelection}
      value={search[field]}
    >
      <option className={f('placeholder')} value="">
        Select
      </option>
      {options.map((opt) => (
        <option key={opt} value={opt}>
          {opt}
        </option>
      ))}
    </select>
  );
};

_ColumnSelectMenu.propTypes = {
  field: T.string.isRequired,
  options: T.array.isRequired,
  search: T.object,
  description: T.object.isRequired,
  goToCustomLocation: T.func.isRequired,
};

export const ColumnSelectMenu = connect(mapStateToProps, {
  goToCustomLocation,
})(_ColumnSelectMenu);

const _ColumnSearchBox = ({
  field,
  forceToShow,
  search,
  showOptions,
  options,
  customiseSearch,
}) => {
  if (!forceToShow && !(field in search)) return null;
  if (showOptions) return <ColumnSelectMenu field={field} options={options} />;
  return (
    <SearchBox field={field} customiseSearch={customiseSearch}>
      {customiseSearch?.placeholder}
    </SearchBox>
  );
};

_ColumnSearchBox.propTypes = {
  field: T.string.isRequired,
  forceToShow: T.bool,
  search: T.object,
  showOptions: T.bool,
  options: T.array,
  customiseSearch: T.object,
};

export const ColumnSearchBox = connect(mapStateToProps)(_ColumnSearchBox);

1	// @flow
2	import React from 'react';
3	import T from 'prop-types';
4
5	import { connect } from 'react-redux';
6	import { createSelector } from 'reselect';
7	import { goToCustomLocation } from 'actions/creators';
8
9	import { SearchBox } from 'components/Table';
10
11	import { foundationPartial } from 'styles/foundation';
12
13	import fonts from 'EBI-Icon-fonts/fonts.css';
14
15	const f = foundationPartial(fonts);	2✔
16
17	const NUMBER_OF_SORT_MODES = 3;	2✔
18	const SORT_OFF = 0;	2✔
19	const SORT_UP = 1;	2✔
20	const SORT_DOWN = 2;	2✔
21
22	const OPACITY_OFF = 0.4;	2✔
23
24	export const SortButton = (	2✔
25	{ mode, onClick } /: {mode: number, onClick: function} /,
26	) => {
27	let icon = '';	×
28	let iconClass = 'icon-sort';	×
29	if (SORT_UP === mode) {	×
30	icon = '';	×
31	iconClass = 'icon-sort-up';	×
32	}
33	if (SORT_DOWN === mode) {	×
34	icon = '';	×
35	iconClass = 'icon-sort-down';	×
36	}
37	return (	×
38	<button onClick={onClick}>
39	<span
40	className={f(iconClass, 'icon', 'icon-common')}
41	data-icon={icon}
42	style={{
43	opacity: mode === SORT_OFF ? OPACITY_OFF : 1,	×
44	}}
45	/>
46	</button>
47	);
48	};
49	SortButton.propTypes = {	2✔
50	mode: T.number,
51	onClick: T.func,
52	};
53
54	const _ConnectedSortButton = ({	2✔
55	description,
56	search,
57	field,
58	goToCustomLocation,
59	}) => {
60	let mode = SORT_OFF;	×
61	const { sort_by: sortBy } = search;	×
62
63	// If multiple columns are added to sort
64	if (sortBy?.split(',').length > 1) {	×
65	if (sortBy.includes(field)) mode = SORT_UP;	×
66	} else {
67	if (sortBy === field) mode = SORT_UP;	×
68	if (sortBy === `-${field}`) mode = SORT_DOWN;	×
69	}
70	const handleClick = () => {	×
NEW 71	const newMode = (mode + 1) % NUMBER_OF_SORT_MODES;	×
72
NEW 73	if (newMode > 0) {	×
NEW 74	search.sort_by = `${newMode === SORT_DOWN ? '-' : ''}${field}`;	×
75	} else {
NEW 76	delete search.sort_by;	×
77	}
78	goToCustomLocation({ description: description, search: { ...search } });	×
79	};
80
81	return <SortButton mode={mode} onClick={handleClick} />;	×
82	};
83	_ConnectedSortButton.propTypes = {	2✔
84	description: T.object.isRequired,
85	search: T.shape({
86	sort_by: T.string,
87	}),
88	field: T.string,
89	goToCustomLocation: T.func.isRequired,
90	};
91
92	const mapStateToProps = createSelector(	2✔
93	(state) => state.customLocation.description,	×
94	(state) => state.customLocation.search,	×
95	(description, search) => ({ description, search }),	×
96	);
97
98	export const ConnectedSortButton = connect(mapStateToProps, {	2✔
99	goToCustomLocation,
100	})(_ConnectedSortButton);
101
102	export const FilterButton = (	2✔
103	{ isOpen, onClick } /: {isOpen: boolean, onClick?: ?function} /,
104	) => {
105	return (	×
106	<button onClick={onClick}>
107	<span
108	className={f('icon-filter', 'icon', 'icon-common')}
109	data-icon="f"
110	style={{
111	opacity: isOpen ? 1 : OPACITY_OFF,	×
112	}}
113	/>
114	</button>
115	);
116	};
117
118	FilterButton.propTypes = {	2✔
119	isOpen: T.bool,
120	onClick: T.func,
121	};
122
123	export const _ColumnSelectMenu = ({	2✔
124	field,
125	options,
126	search,
127	description,
128	goToCustomLocation,
129	}) => {
130	const onSelection = ({ target: { value: option } }) => {	×
131	search[field] = option;	×
132	goToCustomLocation({ description: description, search: { ...search } });	×
133	};
134	return (	×
135	<select
136	className={'inline-select'}
137	name={'column-select'}
138	onChange={onSelection}
139	onBlur={onSelection}
140	value={search[field]}
141	>
142	<option className={f('placeholder')} value="">
143	Select
144	</option>
145	{options.map((opt) => (
146	<option key={opt} value={opt}>	×
147	{opt}
148	</option>
149	))}
150	</select>
151	);
152	};
153
154	_ColumnSelectMenu.propTypes = {	2✔
155	field: T.string.isRequired,
156	options: T.array.isRequired,
157	search: T.object,
158	description: T.object.isRequired,
159	goToCustomLocation: T.func.isRequired,
160	};
161
162	export const ColumnSelectMenu = connect(mapStateToProps, {	2✔
163	goToCustomLocation,
164	})(_ColumnSelectMenu);
165
166	const _ColumnSearchBox = ({	2✔
167	field,
168	forceToShow,
169	search,
170	showOptions,
171	options,
172	customiseSearch,
173	}) => {
174	if (!forceToShow && !(field in search)) return null;	×
175	if (showOptions) return <ColumnSelectMenu field={field} options={options} />;	×
176	return (	×
177	<SearchBox field={field} customiseSearch={customiseSearch}>
178	{customiseSearch?.placeholder}
179	</SearchBox>
180	);
181	};
182
183	_ColumnSearchBox.propTypes = {	2✔
184	field: T.string.isRequired,
185	forceToShow: T.bool,
186	search: T.object,
187	showOptions: T.bool,
188	options: T.array,
189	customiseSearch: T.object,
190	};
191
192	export const ColumnSearchBox = connect(mapStateToProps)(_ColumnSearchBox);	2✔

ProteinsWebTeam / interpro7-client / 7143260147

Source File Press 'n' to go to next uncovered line, 'b' for previous

Source File
Press 'n' to go to next uncovered line, 'b' for previous