| 153 | }; |
| 154 | |
| 155 | render() { |
| 156 | const targetUrl = this.getUrl(); |
| 157 | if (!targetUrl) { |
| 158 | return null; |
| 159 | } |
| 160 | |
| 161 | const tooltip = get(types, `${this.props.type}[1]`, this.props.title); |
| 162 | const className = cx("help-trigger", this.props.className); |
| 163 | const url = this.state.currentUrl; |
| 164 | const isAllowedDomain = some(allowedDomains, (domain) => startsWith(url || targetUrl, domain)); |
| 165 | const shouldRenderAsLink = this.props.renderAsLink || !isAllowedDomain; |
| 166 | |
| 167 | return ( |
| 168 | <React.Fragment> |
| 169 | <Tooltip |
| 170 | title={ |
| 171 | this.props.showTooltip ? ( |
| 172 | <> |
| 173 | {tooltip} |
| 174 | {shouldRenderAsLink && ( |
| 175 | <> |
| 176 | {" "} |
| 177 | <i className="fa fa-external-link" style={{ marginLeft: 5 }} aria-hidden="true" /> |
| 178 | <span className="sr-only">(opens in a new tab)</span> |
| 179 | </> |
| 180 | )} |
| 181 | </> |
| 182 | ) : null |
| 183 | } |
| 184 | > |
| 185 | <Link |
| 186 | href={url || this.getUrl()} |
| 187 | className={className} |
| 188 | rel="noopener noreferrer" |
| 189 | target="_blank" |
| 190 | onClick={shouldRenderAsLink ? () => {} : this.openDrawer} |
| 191 | > |
| 192 | {this.props.children} |
| 193 | </Link> |
| 194 | </Tooltip> |
| 195 | <Drawer |
| 196 | placement="right" |
| 197 | closable={false} |
| 198 | onClose={this.closeDrawer} |
| 199 | visible={this.state.visible} |
| 200 | className={cx("help-drawer", drawerClassName)} |
| 201 | destroyOnClose |
| 202 | width={400} |
| 203 | > |
| 204 | <div className="drawer-wrapper"> |
| 205 | <div className="drawer-menu"> |
| 206 | {url && ( |
| 207 | <Tooltip title="Open page in a new window" placement="left"> |
| 208 | {/* eslint-disable-next-line react/jsx-no-target-blank */} |
| 209 | <Link href={url} target="_blank"> |
| 210 | <i className="fa fa-external-link" aria-hidden="true" /> |
| 211 | <span className="sr-only">(opens in a new tab)</span> |
| 212 | </Link> |