yujunjun/strapi
1
0
Fork 0
mirror of https://github.com/strapi/strapi.git synced 2025-09-18 13:02:18 +00:00
Code Issues Packages Projects Releases Wiki Activity

Apply auto open for ce

Browse Source 
Signed-off-by: soupette <cyril.lpz@gmail.com>
This commit is contained in:
soupette 2021-02-08 15:38:30 +01:00
parent d0e89da94c
commit c27b7c67d7
2 changed files with 27 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

38
packages/strapi-admin/admin/src/components/Roles/ConditionsSelect/MenuList/index.js
View File

@ -1,5 +1,5 @@
/* eslint-disable jsx-a11y/click-events-have-key-events */ /* eslint-disable jsx-a11y/click-events-have-key-events */
import React, { useState, useCallback } from 'react'; import React, { useState, useCallback, useMemo } from 'react';
import PropTypes from 'prop-types'; import PropTypes from 'prop-types';
import { components } from 'react-select'; import { components } from 'react-select';
import { groupBy, intersectionWith } from 'lodash'; import { groupBy, intersectionWith } from 'lodash';
@ -12,11 +12,23 @@ import Ul from './Ul';
import UpperFirst from './UpperFirst'; import UpperFirst from './UpperFirst';
/* eslint-disable jsx-a11y/no-static-element-interactions */ /* eslint-disable jsx-a11y/no-static-element-interactions */
const createCollapsesObject = arrayOfCategories =>
arrayOfCategories.reduce((acc, current, index) => {
acc[current[0]] = index === 0;
return acc;
}, {});
const MenuList = ({ selectProps, ...rest }) => { const MenuList = ({ selectProps, ...rest }) => {
const Component = components.MenuList; const Component = components.MenuList;
const [collapses, setCollapses] = useState({}); const arrayOfOptionsGroupedByCategory = useMemo(() => {
const optionsGroupByCategory = groupBy(selectProps.options, 'category'); return Object.entries(groupBy(selectProps.options, 'category'));
}, [selectProps.options]);
const initCollapses = useMemo(() => createCollapsesObject(arrayOfOptionsGroupedByCategory), [
arrayOfOptionsGroupedByCategory,
]);
const [collapses, setCollapses] = useState(initCollapses);
const toggleCollapse = collapseName => { const toggleCollapse = collapseName => {
setCollapses(prevState => ({ ...prevState, [collapseName]: !collapses[collapseName] })); setCollapses(prevState => ({ ...prevState, [collapseName]: !collapses[collapseName] }));
}; };
@ -53,9 +65,11 @@ const MenuList = ({ selectProps, ...rest }) => {
return ( return (
<Component {...rest}> <Component {...rest}>
<Ul disabled> <Ul disabled>
{Object.entries(optionsGroupByCategory).map((category, index) => { {arrayOfOptionsGroupedByCategory.map((category, index) => {
const [categoryName, conditions] = category;
return ( return (
<li key={category[0]}> <li key={categoryName}>
<div> <div>
<Flex justifyContent="space-between"> <Flex justifyContent="space-between">
<Label htmlFor="overrideReactSelectBehavior"> <Label htmlFor="overrideReactSelectBehavior">
@ -63,17 +77,17 @@ const MenuList = ({ selectProps, ...rest }) => {
<Checkbox <Checkbox
disabled disabled
id="checkCategory" id="checkCategory"
name={category[0]} name={categoryName}
onChange={() => {}} onChange={() => {}}
value={hasAllCategoryAction(category)} value={hasAllCategoryAction(category)}
someChecked={hasSomeCategoryAction(category)} someChecked={hasSomeCategoryAction(category)}
/> />
<UpperFirst content={category[0]} /> <UpperFirst content={categoryName} />
</Flex> </Flex>
</Label> </Label>
<div <div
style={{ flex: 1, textAlign: 'end', cursor: 'pointer' }} style={{ flex: 1, textAlign: 'end', cursor: 'pointer' }}
onClick={() => toggleCollapse(category[0])} onClick={() => toggleCollapse(categoryName)}
> >
<FontAwesomeIcon <FontAwesomeIcon
style={{ style={{
@ -81,13 +95,13 @@ const MenuList = ({ selectProps, ...rest }) => {
fontSize: '11px', fontSize: '11px',
color: '#919bae', color: '#919bae',
}} }}
icon={collapses[category[0]] ? 'chevron-up' : 'chevron-down'} icon={collapses[categoryName] ? 'chevron-up' : 'chevron-down'}
/> />
</div> </div>
</Flex> </Flex>
</div> </div>
<SubUl tag="ul" isOpen={collapses[category[0]]}> <SubUl tag="ul" isOpen={collapses[categoryName]}>
{category[1].map(action => { {conditions.map(action => {
return ( return (
<li key={action.id}> <li key={action.id}>
<Flex> <Flex>
@ -108,7 +122,7 @@ const MenuList = ({ selectProps, ...rest }) => {
); );
})} })}
</SubUl> </SubUl>
{index + 1 < Object.entries(optionsGroupByCategory).length && ( {index + 1 < arrayOfOptionsGroupedByCategory.length.length && (
<div style={{ paddingTop: '17px' }} /> <div style={{ paddingTop: '17px' }} />
)} )}
</li> </li>

2
packages/strapi-admin/ee/admin/components/Roles/ConditionsSelect/MenuList/index.js
View File

@ -97,7 +97,7 @@ const MenuList = ({ selectProps, ...rest }) => {
<Flex> <Flex>
<Checkbox <Checkbox
id="checkCategory" id="checkCategory"
name={category[0]} name={categoryName}
onChange={() => {}} onChange={() => {}}
value={hasAllCategoryAction(category)} value={hasAllCategoryAction(category)}
someChecked={hasSomeCategoryAction(category)} someChecked={hasSomeCategoryAction(category)}