feat(create): add counterpart component for drawing field
This commit is contained in:
parent
671bb0561a
commit
4131eb5de1
@ -0,0 +1,3 @@
|
||||
.counterpartSelectValue {
|
||||
display: flex;
|
||||
}
|
46
src/components/DrawPDFFields/internal/Counterpart.tsx
Normal file
46
src/components/DrawPDFFields/internal/Counterpart.tsx
Normal file
@ -0,0 +1,46 @@
|
||||
import React from 'react'
|
||||
import { ProfileMetadata, User } from '../../../types'
|
||||
import _ from 'lodash'
|
||||
import { npubToHex, getProfileUsername } from '../../../utils'
|
||||
import { AvatarIconButton } from '../../UserAvatarIconButton'
|
||||
import styles from './Counterpart.module.scss'
|
||||
|
||||
interface CounterpartProps {
|
||||
npub: string
|
||||
metadata: {
|
||||
[key: string]: ProfileMetadata
|
||||
}
|
||||
signers: User[]
|
||||
}
|
||||
|
||||
export const Counterpart = React.memo(
|
||||
({ npub, metadata, signers }: CounterpartProps) => {
|
||||
let displayValue = _.truncate(npub, { length: 16 })
|
||||
|
||||
const signer = signers.find((u) => u.pubkey === npubToHex(npub))
|
||||
if (signer) {
|
||||
const signerMetadata = metadata[signer.pubkey]
|
||||
displayValue = getProfileUsername(npub, signerMetadata)
|
||||
|
||||
return (
|
||||
<div className={styles.counterpartSelectValue}>
|
||||
<AvatarIconButton
|
||||
src={signerMetadata.picture}
|
||||
hexKey={signer.pubkey || undefined}
|
||||
sx={{
|
||||
padding: 0,
|
||||
marginRight: '6px',
|
||||
'> img': {
|
||||
width: '21px',
|
||||
height: '21px'
|
||||
}
|
||||
}}
|
||||
/>
|
||||
{displayValue}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
return displayValue
|
||||
}
|
||||
)
|
Loading…
Reference in New Issue
Block a user