yujunjun/strapi
1
0
Fork 0
mirror of https://github.com/strapi/strapi.git synced 2025-11-07 21:58:23 +00:00
Code Issues Packages Projects Releases Wiki Activity

Relation: Make all strings translateable, Use small SimpleMenu

Browse Source
This commit is contained in:
Gustav Hansen 2022-03-11 14:36:13 +01:00
parent a5cd9f553c
commit 80527907cf
2 changed files with 21 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

32
packages/core/admin/admin/src/content-manager/components/DynamicTable/CellContent/Relation/index.js
View File

@ -6,6 +6,7 @@ import { Typography } from '@strapi/design-system/Typography';
import { Box } from '@strapi/design-system/Box'; import { Box } from '@strapi/design-system/Box';
import { Badge } from '@strapi/design-system/Badge'; import { Badge } from '@strapi/design-system/Badge';
import { SimpleMenu, MenuItem } from '@strapi/design-system/SimpleMenu'; import { SimpleMenu, MenuItem } from '@strapi/design-system/SimpleMenu';
import { Loader } from '@strapi/design-system/Loader';
import styled from 'styled-components'; import styled from 'styled-components';
import { useNotifyAT } from '@strapi/design-system/LiveRegions'; import { useNotifyAT } from '@strapi/design-system/LiveRegions';
import { stopPropagation } from '@strapi/helper-plugin'; import { stopPropagation } from '@strapi/helper-plugin';
@ -19,11 +20,6 @@ const TypographyMaxWidth = styled(Typography)`
max-width: 500px; max-width: 500px;
`; `;
const SimpleMenuAdapted = styled(SimpleMenu)`
margin-left: -6px;
padding-left: 4px;
`;
const fetchRelation = async (endPoint, notifyStatus) => { const fetchRelation = async (endPoint, notifyStatus) => {
const { const {
data: { results, pagination }, data: { results, pagination },
@ -64,11 +60,9 @@ const Relation = ({ fieldSchema, metadatas, queryInfos, name, rowId, value }) =>
const { data, status } = useQuery( const { data, status } = useQuery(
[fieldSchema.targetModel, rowId], [fieldSchema.targetModel, rowId],
() => fetchRelation(requestURL, notify), () => fetchRelation(requestURL, notify),
{
staleTime: 0,
},
{ {
enabled: isOpen, enabled: isOpen,
staleTime: 0,
} }
); );
@ -85,14 +79,20 @@ const Relation = ({ fieldSchema, metadatas, queryInfos, name, rowId, value }) =>
return ( return (
<Box {...stopPropagation}> <Box {...stopPropagation}>
<SimpleMenuAdapted <SimpleMenu
label={Label} label={Label}
size="S"
onOpen={() => setIsOpen(true)} onOpen={() => setIsOpen(true)}
onClose={() => setIsOpen(false)} onClose={() => setIsOpen(false)}
> >
{status !== 'success' && ( {status !== 'success' && (
<MenuItem aria-disabled> <MenuItem aria-disabled>
<TypographyMaxWidth ellipsis>Loading ...</TypographyMaxWidth> <Loader small>
{formatMessage({
id: getTrad('DynamicTable.relation-loading'),
defaultMessage: 'The relations are loading',
})}
</Loader>
</MenuItem> </MenuItem>
)} )}
@ -109,11 +109,17 @@ const Relation = ({ fieldSchema, metadatas, queryInfos, name, rowId, value }) =>
))} ))}
{status === 'success' && data?.pagination.total > 10 && ( {status === 'success' && data?.pagination.total > 10 && (
<MenuItem aria-disabled> <MenuItem
<Typography>[...]</Typography> aria-disabled
aria-label={formatMessage({
id: getTrad('DynamicTable.relation-more'),
defaultMessage: 'This relation contains more entities than displayed',
})}
>
<Typography>...</Typography>
</MenuItem> </MenuItem>
)} )}
</SimpleMenuAdapted> </SimpleMenu>
</Box> </Box>
); );
}; };

2
packages/core/admin/admin/src/translations/en.json
View File

@ -486,6 +486,8 @@
"components.popUpWarning.title": "Please confirm", "components.popUpWarning.title": "Please confirm",
"content-manager.App.schemas.data-loaded": "The schemas have been successfully loaded", "content-manager.App.schemas.data-loaded": "The schemas have been successfully loaded",
"content-manager.DynamicTable.relation-loaded": "The relations have been loaded", "content-manager.DynamicTable.relation-loaded": "The relations have been loaded",
"content-manager.DynamicTable.relation-loading": "The relations are loading",
"content-manager.DynamicTable.relation-more": "This relation contains more entities than displayed",
"content-manager.EditRelations.title": "Relational data", "content-manager.EditRelations.title": "Relational data",
"content-manager.HeaderLayout.button.label-add-entry": "Create new entry", "content-manager.HeaderLayout.button.label-add-entry": "Create new entry",
"content-manager.api.id": "API ID", "content-manager.api.id": "API ID",