yujunjun/strapi
1
0
Fork 0
mirror of https://github.com/strapi/strapi.git synced 2025-10-16 10:33:34 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #15260 from strapi/fix/RelationInput-read-only

Browse Source
This commit is contained in:
Josh 2023-01-04 09:28:33 +00:00 committed by GitHub
commit 99bd18d096
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 23 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
packages/core/admin/admin/src/content-manager/components/RelationInput/RelationInput.js
View File

@ -38,12 +38,13 @@ export const LinkEllipsis = styled(Link)`
export const DisconnectButton = styled.button`
svg path {
fill: ${({ theme }) => theme.colors.neutral500};
fill: ${({ theme, disabled }) =>
disabled ? theme.colors.neutral600 : theme.colors.neutral500};
}
&:hover svg path,
&:focus svg path {
fill: ${({ theme }) => theme.colors.neutral600};
fill: ${({ theme, disabled }) => !disabled && theme.colors.neutral600};
}
`;
@ -103,8 +104,7 @@ const RelationInput = ({
);
const shouldDisplayLoadMoreButton =
(!!labelLoadMore && !disabled && paginatedRelations.hasNextPage) ||
paginatedRelations.isLoading;
(!!labelLoadMore && paginatedRelations.hasNextPage) || paginatedRelations.isLoading;
const options = useMemo(
() =>
@ -503,9 +503,7 @@ const ListItem = ({ data, index, style }) => {
<Box minWidth={0} paddingTop={1} paddingBottom={1} paddingRight={4}>
<Tooltip description={mainField ?? `${id}`}>
{href ? (
<LinkEllipsis to={href} disabled={disabled}>
{mainField ?? id}
</LinkEllipsis>
<LinkEllipsis to={href}>{mainField ?? id}</LinkEllipsis>
) : (
<Typography textColor={disabled ? 'neutral600' : 'primary600'} ellipsis>
{mainField ?? id}

3
packages/core/admin/admin/src/content-manager/components/RelationInput/components/RelationItem.js
View File

@ -83,8 +83,8 @@ export const RelationItem = ({
paddingRight={4}
hasRadius
borderSize={1}
background={disabled ? 'neutral150' : 'neutral0'}
borderColor="neutral200"
background={disabled ? 'neutral150' : 'neutral0'}
justifyContent="space-between"
ref={canDrag ? composedRefs : undefined}
data-handler-id={handlerId}
@ -99,6 +99,7 @@ export const RelationItem = ({
aria-label={iconButtonAriaLabel}
noBorder
onKeyDown={handleKeyDown}
disabled={disabled}
>
<Drag />
</IconButton>

23
packages/core/admin/admin/src/content-manager/components/RelationInput/tests/RelationInput.test.js
View File

@ -136,12 +136,12 @@ describe('Content-Manager || RelationInput', () => {
});
test('should call onRelationLoadMore', () => {
const spy = jest.fn();
setup({ onRelationLoadMore: spy });
const onRelationLoadMoreSpy = jest.fn();
setup({ onRelationLoadMore: onRelationLoadMoreSpy });
fireEvent.click(screen.getByText('Load more'));
expect(spy).toHaveBeenCalled();
expect(onRelationLoadMoreSpy).toHaveBeenCalled();
});
test('should call onSearch', () => {
@ -306,7 +306,7 @@ describe('Content-Manager || RelationInput', () => {
},
});
expect(screen.getByRole('button', { name: /load more/i })).toHaveAttribute(
expect(screen.getByRole('button', { name: 'Load more' })).toHaveAttribute(
'aria-disabled',
'true'
);
@ -318,12 +318,21 @@ describe('Content-Manager || RelationInput', () => {
expect(screen.getByText('This is an error')).toBeInTheDocument();
});
test('should apply disabled state', () => {
const { queryByText, getByTestId, container } = setup({ disabled: true });
test('should display disabled state with only read permission', () => {
const onRelationLoadMoreSpy = jest.fn();
const { getAllByRole, getByRole, getByTestId, getByText, container } = setup({
disabled: true,
onRelationLoadMore: onRelationLoadMoreSpy,
});
fireEvent.click(getByText('Load more'));
expect(onRelationLoadMoreSpy).toHaveBeenCalledTimes(1);
expect(queryByText('Load more')).not.toBeInTheDocument();
expect(container.querySelector('input')).toBeDisabled();
expect(getByTestId('remove-relation-1')).toBeDisabled();
const [dragButton] = getAllByRole('button', { name: 'Drag' });
expect(dragButton).toHaveAttribute('aria-disabled', 'true');
expect(getByRole('link', { name: 'Relation 1' })).toBeInTheDocument();
});
});
});