Copy parsing of ENS descriptions from the official implementation in the explorer. Thanks, Adam

This commit is contained in:
Marco van Dijk 2022-05-05 22:33:32 +02:00
parent 14fa31cbc1
commit 3480796c09

View File

@ -27,6 +27,17 @@ function copyLink(addr) {
}); });
} }
function nl2br(str) {
if (typeof str === "undefined" || str === null) {
return "";
}
var breakTag = "<br>"; // "<br />"
return (str + "").replace(
/([^>\r\n]?)(\r\n|\n\r|\r|\n)/g,
"$1" + breakTag + "$2"
);
}
const OrchInfoViewer = (obj) => { const OrchInfoViewer = (obj) => {
const [opened, setOpened] = useState(false); const [opened, setOpened] = useState(false);
const livepeer = useSelector((state) => state.livepeerstate); const livepeer = useSelector((state) => state.livepeerstate);
@ -122,26 +133,32 @@ const OrchInfoViewer = (obj) => {
if (ensDescription) { if (ensDescription) {
if (ensDescription.length < 200) { if (ensDescription.length < 200) {
descriptionObj = descriptionObj =
<p className="darkText" style={{ overflowWrap: 'break-word' }}> <div className="darkText" style={{ overflowWrap: 'break-word' }}
{ensDescription} dangerouslySetInnerHTML={{
</p> __html: nl2br(ensDescription),
}}
/>
} else { } else {
descriptionObj = descriptionObj =
<Popover className="strokeSmollLeft" style={{ cursor: 'pointer', marginTop: '0.2em', marginBottom: '0.2em' }} <Popover className="strokeSmollLeft" style={{ cursor: 'pointer', marginTop: '0.2em', marginBottom: '0.2em' }}
opened={opened} opened={opened}
onClose={() => setOpened(false)} onClose={() => setOpened(false)}
target={ target={
<p className="darkText" style={{ overflowWrap: 'break-word' }} onClick={() => setOpened((o) => !o)}> <div className="darkText" style={{ overflowWrap: 'break-word' }} onClick={() => setOpened((o) => !o)}
{ensDescription.substring(0, 200)}... dangerouslySetInnerHTML={{
</p> __html: nl2br(ensDescription.substring(0, 200) + "..."),
}}
/>
} }
width={260} width={260}
position="right" position="right"
withArrow withArrow
> >
<p className="darkText" style={{ overflowWrap: 'break-word' }}> <div className="darkText" style={{ overflowWrap: 'break-word' }}
{ensDescription} dangerouslySetInnerHTML={{
</p> __html: nl2br(ensDescription),
}}
/>
</Popover> </Popover>
} }
} }