aboutsummaryrefslogtreecommitdiffstats
path: root/packages/react-shared/src/components/markdown_link_block.tsx
diff options
context:
space:
mode:
authorFabio Berger <me@fabioberger.com>2018-03-14 22:18:16 +0800
committerGitHub <noreply@github.com>2018-03-14 22:18:16 +0800
commite16feb27f4ec1987259a87f360824a0158bd8b10 (patch)
treee94cb3bc89e215c4df38ab161379023ab8e0c4e9 /packages/react-shared/src/components/markdown_link_block.tsx
parent3f3e8be004818ddaa1921b3dff12bdd46052278b (diff)
parent83ae7ba08d55fa964bf7b7a985aea0fe1520c5c7 (diff)
downloaddexon-sol-tools-e16feb27f4ec1987259a87f360824a0158bd8b10.tar.gz
dexon-sol-tools-e16feb27f4ec1987259a87f360824a0158bd8b10.tar.zst
dexon-sol-tools-e16feb27f4ec1987259a87f360824a0158bd8b10.zip
Merge pull request #450 from 0xProject/convertScriptsToTs
Convert Scripts to TS & Other Misc. Fixes
Diffstat (limited to 'packages/react-shared/src/components/markdown_link_block.tsx')
-rw-r--r--packages/react-shared/src/components/markdown_link_block.tsx47
1 files changed, 47 insertions, 0 deletions
diff --git a/packages/react-shared/src/components/markdown_link_block.tsx b/packages/react-shared/src/components/markdown_link_block.tsx
new file mode 100644
index 000000000..8f5862249
--- /dev/null
+++ b/packages/react-shared/src/components/markdown_link_block.tsx
@@ -0,0 +1,47 @@
+import * as _ from 'lodash';
+import * as React from 'react';
+
+import { constants } from '../utils/constants';
+import { utils } from '../utils/utils';
+
+export interface MarkdownLinkBlockProps {
+ href: string;
+}
+
+export interface MarkdownLinkBlockState {}
+
+export class MarkdownLinkBlock extends React.Component<MarkdownLinkBlockProps, MarkdownLinkBlockState> {
+ // Re-rendering a linkBlock causes it to remain unclickable.
+ // We therefore noop re-renders on this component if it's props haven't changed.
+ public shouldComponentUpdate(nextProps: MarkdownLinkBlockProps, nextState: MarkdownLinkBlockState) {
+ return nextProps.href !== this.props.href;
+ }
+ public render() {
+ const href = this.props.href;
+ const isLinkToSection = _.startsWith(href, '#');
+ // If protocol is http or https, we can open in a new tab, otherwise don't for security reasons
+ if (_.startsWith(href, 'http') || _.startsWith(href, 'https')) {
+ return (
+ <a href={href} target="_blank" rel="nofollow noreferrer noopener">
+ {this.props.children}
+ </a>
+ );
+ } else if (isLinkToSection) {
+ return (
+ <a
+ style={{ cursor: 'pointer', textDecoration: 'underline' }}
+ onClick={this._onHashUrlClick.bind(this, href)}
+ >
+ {this.props.children}
+ </a>
+ );
+ } else {
+ return <a href={href}>{this.props.children}</a>;
+ }
+ }
+ private _onHashUrlClick(href: string) {
+ const hash = href.split('#')[1];
+ utils.scrollToHash(hash, constants.SCROLL_CONTAINER_ID);
+ utils.setUrlHash(hash);
+ }
+}