Skip to content

Commit

Permalink
fix code smells
Browse files Browse the repository at this point in the history
  • Loading branch information
Dmytro-Melnyshyn committed Jan 9, 2025
1 parent e2105fa commit 32bdf35
Show file tree
Hide file tree
Showing 5 changed files with 54 additions and 43 deletions.
5 changes: 4 additions & 1 deletion src/components/search-form/search-filters.js
Original file line number Diff line number Diff line change
Expand Up @@ -124,7 +124,10 @@ const SearchFilters = ({
const hasSelectedOption = ![undefined, defaultValue].includes(activeFilters[name]);

return (
<div className={styles.groupContainer}>
<div
key={name}
className={styles.groupContainer}
>
<div className={styles.groupTitle}>
<Label
id={accordionLabelId}
Expand Down
81 changes: 45 additions & 36 deletions src/components/search-section/action-menu/action-menu.js
Original file line number Diff line number Diff line change
Expand Up @@ -40,6 +40,7 @@ const propTypes = {
filterCount: PropTypes.number.isRequired,
onFilterChange: PropTypes.func.isRequired,
onStandaloneFilterChange: PropTypes.func.isRequired,
onToggleActions: PropTypes.func.isRequired,
onToggleFilter: PropTypes.func.isRequired,
packagesFacetCollection: PropTypes.object,
params: PropTypes.object,
Expand Down Expand Up @@ -70,6 +71,7 @@ const ActionMenu = ({
filterCount,
onFilterChange,
onToggleFilter,
onToggleActions,
onStandaloneFilterChange,
}) => {
const intl = useIntl();
Expand Down Expand Up @@ -137,7 +139,7 @@ const ActionMenu = ({
const tagsOptions = getSortedDataOptions();

return (
<div role="tablist">
<div>
<IfPermission perm="ui-tags.all">
<TagsFilter
isLoading={tagsModelOfAlreadyAddedTags.isLoading}
Expand Down Expand Up @@ -167,47 +169,54 @@ const ActionMenu = ({
);
};

const renderActionMenuContent = ({ onToggle, open, keyHandler }) => (
const renderActionMenuContent = () => (
<DropdownMenu>
{renderActionMenu({ onToggle, open, keyHandler })}
{renderActionMenu()}
</DropdownMenu>
);

// // eslint-disable-next-line react/prop-types
const renderActionMenuToggle = ({ onToggle, triggerRef, keyHandler, open, ariaProps, getTriggerProps }) => (
<div className={styles.actionMenuToggle}>
<Button
buttonStyle="primary"
marginBottom0
onClick={onToggle}
onKeyDown={keyHandler}
ref={triggerRef}
{...getTriggerProps()}
{...ariaProps}
>
<Icon icon={open ? 'triangle-up' : 'triangle-down'} iconPosition="end">
<FormattedMessage id="stripes-components.paneMenuActionsToggleLabel" />
</Icon>
</Button>
{filterCount > 0 && (
<Tooltip
text={intl.formatMessage({ id: 'ui-eholdings.actionMenu.filterBadgeTooltip' }, { count: filterCount })}
id="filter-badge-tooltip"
const renderActionMenuToggle = ({ onToggle, triggerRef, keyHandler, open, ariaProps, getTriggerProps }) => {
const handleActionMenuToggle = (e) => {
onToggleActions(!open);
onToggle(e);
};

return (
<div className={styles.actionMenuToggle}>
<Button
buttonStyle="primary"
marginBottom0
onKeyDown={keyHandler}
ref={triggerRef}
{...getTriggerProps()}
{...ariaProps}
onClick={handleActionMenuToggle}
>
{({ ref, ariaIds }) => (
<div
ref={ref}
aria-labelledby={ariaIds.text}
>
<Badge>
{filterCount}
</Badge>
</div>
)}
</Tooltip>
)}
</div>
);
<Icon icon={open ? 'triangle-up' : 'triangle-down'} iconPosition="end">
<FormattedMessage id="stripes-components.paneMenuActionsToggleLabel" />
</Icon>
</Button>
{filterCount > 0 && (
<Tooltip
text={intl.formatMessage({ id: 'ui-eholdings.actionMenu.filterBadgeTooltip' }, { count: filterCount })}
id="filter-badge-tooltip"
>
{({ ref, ariaIds }) => (
<div
ref={ref}
aria-labelledby={ariaIds.text}
>
<Badge>
{filterCount}
</Badge>
</div>
)}
</Tooltip>
)}
</div>
);
};

return (
<Dropdown
Expand Down
3 changes: 3 additions & 0 deletions src/components/search-section/search-section.js
Original file line number Diff line number Diff line change
Expand Up @@ -27,6 +27,7 @@ const EMPTY_OBJECT = {};
const propTypes = {
accessTypes: PropTypes.object.isRequired,
onFilter: PropTypes.func.isRequired,
onToggleActions: PropTypes.func.isRequired,
packagesFacetCollection: PropTypes.object,
params: PropTypes.object,
prevDataOfOptedPackage: PropTypes.object,
Expand All @@ -48,6 +49,7 @@ const SearchSection = ({
titlesFacets = EMPTY_OBJECT,
packagesFacetCollection = EMPTY_OBJECT,
onFilter,
onToggleActions,
}) => {
const intl = useIntl();

Expand Down Expand Up @@ -194,6 +196,7 @@ const SearchSection = ({
<ActionMenu
searchType={searchType}
onStandaloneFilterChange={handleStandaloneFilterChange}
onToggleActions={onToggleActions}
tagsModelOfAlreadyAddedTags={tagsModelOfAlreadyAddedTags}
searchByTagsEnabled={searchByTagsEnabled}
searchByAccessTypesEnabled={searchByAccessTypesEnabled}
Expand Down
6 changes: 1 addition & 5 deletions src/components/tags-filter/tags-filter.js
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,6 @@ import { useRef } from 'react';
import PropTypes from 'prop-types';
import { useIntl } from 'react-intl';

import { Icon } from '@folio/stripes/components';
import { MultiSelectionFilter } from '@folio/stripes/smart-components';

import { ClearButton } from '../clear-button';
Expand Down Expand Up @@ -44,10 +43,6 @@ const TagsFilter = ({
labelRef.current?.focus();
};

if (isLoading) {
return <Icon icon="spinner-ellipsis" />;
}

return (
<>
<div className={styles.headline}>
Expand Down Expand Up @@ -81,6 +76,7 @@ const TagsFilter = ({
selectedValues={selectedValues}
disabled={!searchByTagsEnabled}
aria-labelledby="selectTagFilter-label"
showLoading={isLoading}
/>
</div>
</>
Expand Down
2 changes: 1 addition & 1 deletion src/routes/package-show-route/package-show-route.js
Original file line number Diff line number Diff line change
Expand Up @@ -397,7 +397,6 @@ class PackageShowRoute extends Component {

const {
pkgSearchParams,
queryId,
isTitlesUpdating,
} = this.state;

Expand Down Expand Up @@ -446,6 +445,7 @@ class PackageShowRoute extends Component {
accessTypes={accessStatusTypes}
searchType={listTypes.TITLES}
onFilter={this.searchTitles}
onToggleActions={this.toggleSearchModal}
/>
}
/>
Expand Down

0 comments on commit 32bdf35

Please sign in to comment.