diff --git a/packages/cozy-sharing/src/components/Recipient/LinkRecipientLite.jsx b/packages/cozy-sharing/src/components/Recipient/LinkRecipientLite.jsx new file mode 100644 index 0000000000..1d4681f8ef --- /dev/null +++ b/packages/cozy-sharing/src/components/Recipient/LinkRecipientLite.jsx @@ -0,0 +1,49 @@ +import PropTypes from 'prop-types' +import React from 'react' + +import Circle from 'cozy-ui/transpiled/react/Circle' +import Icon from 'cozy-ui/transpiled/react/Icon' +import LinkIcon from 'cozy-ui/transpiled/react/Icons/Link' +import ListItem from 'cozy-ui/transpiled/react/ListItem' +import ListItemIcon from 'cozy-ui/transpiled/react/ListItemIcon' +import ListItemText from 'cozy-ui/transpiled/react/ListItemText' +import Typography from 'cozy-ui/transpiled/react/Typography' +import { useI18n } from 'cozy-ui/transpiled/react/providers/I18n' + +import { checkIsReadOnlyPermissions } from '../../helpers/permissions' +import withLocales from '../../hoc/withLocales' +import styles from '../../styles/recipient.styl' + +const LinkRecipientLite = ({ permissions, link }) => { + const { t } = useI18n() + + if (!link) return null + + const isReadOnlyPermissions = checkIsReadOnlyPermissions(permissions) + + return ( + + + + + + + + + {t( + `Share.type.${isReadOnlyPermissions ? 'one-way' : 'two-way'}` + ).toLowerCase()} + + + ) +} + +LinkRecipientLite.propTypes = { + permissions: PropTypes.array, + link: PropTypes.string +} + +export default withLocales(LinkRecipientLite) diff --git a/packages/cozy-sharing/src/components/Recipient/MemberRecipientLite.jsx b/packages/cozy-sharing/src/components/Recipient/MemberRecipientLite.jsx new file mode 100644 index 0000000000..572a949df9 --- /dev/null +++ b/packages/cozy-sharing/src/components/Recipient/MemberRecipientLite.jsx @@ -0,0 +1,59 @@ +import PropTypes from 'prop-types' +import React from 'react' + +import { useClient } from 'cozy-client' +import ListItem from 'cozy-ui/transpiled/react/ListItem' +import ListItemIcon from 'cozy-ui/transpiled/react/ListItemIcon' +import ListItemText from 'cozy-ui/transpiled/react/ListItemText' +import Typography from 'cozy-ui/transpiled/react/Typography' +import { useI18n } from 'cozy-ui/transpiled/react/providers/I18n' + +import MemberRecipientStatus from './MemberRecipientStatus' +import { DEFAULT_DISPLAY_NAME } from '../../helpers/recipients' +import withLocales from '../../hoc/withLocales' +import { getDisplayName } from '../../models' +import { MemberAvatar } from '../Avatar/MemberAvatar' + +const MemberRecipientLite = ({ recipient, isOwner, ...props }) => { + const { t } = useI18n() + const client = useClient() + + const isMe = + (isOwner && recipient.status === 'owner') || + recipient.instance === client.options.uri + + return ( + + + + + + } + /> + + {isMe + ? t(`Share.status.${recipient.status}`).toLowerCase() + : t(`Share.type.${recipient.type ?? 'one-way'}`).toLowerCase()} + + + ) +} + +MemberRecipientLite.propTypes = { + recipient: PropTypes.object, + isOwner: PropTypes.bool +} + +export default withLocales(MemberRecipientLite) diff --git a/packages/cozy-sharing/src/index.jsx b/packages/cozy-sharing/src/index.jsx index 101fa78ffc..d631581d42 100644 --- a/packages/cozy-sharing/src/index.jsx +++ b/packages/cozy-sharing/src/index.jsx @@ -14,6 +14,8 @@ export { SharedStatus } from './SharedStatus' export { SharedBadge } from './SharedBadge' export { SharingOwnerAvatar } from './SharingOwnerAvatar' export { SharedRecipients } from './SharedRecipients' +export { default as MemberRecipientLite } from './components/Recipient/MemberRecipientLite' +export { default as LinkRecipientLite } from './components/Recipient/LinkRecipientLite' export { SharedRecipientsList } from './SharedRecipientsList' export { ShareButton } from './ShareButton' export { ShareModal } from './components/ShareModal/ShareModal'