neptune/ghost-portal
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Adjust AccountName display for address-only (#8915)

Browse Source
This commit is contained in:
Jaco 2023-02-01 14:22:36 +02:00 committed by GitHub
parent 466c84044d
commit 10e2d2b6d2
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 21 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

29
packages/react-components/src/AccountName.tsx
View File

@ -80,7 +80,7 @@ export function getParentAccount (value: string): string | undefined {
return parentCache.get(value);
}
function defaultOrAddr (defaultName = '', _address: AccountId | AccountIndex | Address | string | Uint8Array, _accountIndex?: AccountIndex | null): [React.ReactNode, boolean, boolean, boolean] {
function defaultOrAddr (defaultName = '', _address: AccountId | AccountIndex | Address | string | Uint8Array, _accountIndex?: AccountIndex | null): [displayName: React.ReactNode, isLocal: boolean, isAddress: boolean, isSpecial: boolean] {
let known: string | null = null;
for (let i = 0; known === null && i < MATCHERS.length; i++) {
@ -109,6 +109,14 @@ function defaultOrAddr (defaultName = '', _address: AccountId | AccountIndex | A
return [extracted, !isAddressExtracted, isAddressExtracted, false];
}
function defaultOrAddrNode (defaultName = '', address: AccountId | AccountIndex | Address | string | Uint8Array, accountIndex?: AccountIndex | null): React.ReactNode {
const [node,, isAddress] = defaultOrAddr(defaultName, address, accountIndex);
return isAddress
? <span className='isAddress'>{node}</span>
: node;
}
function extractName (address: string, accountIndex?: AccountIndex, defaultName?: string): React.ReactNode {
const displayCached = displayCache.get(address);
@ -195,12 +203,12 @@ function AccountName ({ children, className = '', defaultName, label, onClick, o
} else if (nickname) {
setName(nickname);
} else {
setName(defaultOrAddr(defaultName, cacheAddr, accountIndex));
setName(defaultOrAddrNode(defaultName, cacheAddr, accountIndex));
}
}, [api, defaultName, info, toggle, value]);
const _onNameEdit = useCallback(
() => setName(defaultOrAddr(defaultName, (value || '').toString())),
() => setName(defaultOrAddrNode(defaultName, (value || '').toString())),
[defaultName, value]
);
@ -235,6 +243,16 @@ const StyledSpan = styled.span`
cursor: help !important;
}
.isAddress {
display: inline-block;
min-width: var(--width-shortaddr);
max-width: var(--width-shortaddr);
overflow: hidden;
text-overflow: ellipsis;
text-transform: none;
white-space: nowrap;
}
.via-identity {
word-break: break-all;
@ -250,12 +268,7 @@ const StyledSpan = styled.span`
}
&.isAddress {
display: inline-block;
min-width: var(--width-shortaddr);
max-width: var(--width-shortaddr);
opacity: var(--opacity-light);
text-transform: none;
white-space: nowrap;
}
.sub,