aboutsummaryrefslogtreecommitdiffstats
path: root/packages/website/ts/pages
diff options
context:
space:
mode:
authorFabio Berger <me@fabioberger.com>2017-12-18 03:22:54 +0800
committerFabio Berger <me@fabioberger.com>2017-12-18 03:22:54 +0800
commitedbe6915e07a516f5fad2a38eb8ffe96a7b28318 (patch)
tree3e2ab815b5ed259e78a35366c307dba8b7106a68 /packages/website/ts/pages
parentfd3e8cd8133510a02aa6779a780c20018bebabe0 (diff)
downloaddexon-sol-tools-edbe6915e07a516f5fad2a38eb8ffe96a7b28318.tar
dexon-sol-tools-edbe6915e07a516f5fad2a38eb8ffe96a7b28318.tar.gz
dexon-sol-tools-edbe6915e07a516f5fad2a38eb8ffe96a7b28318.tar.bz2
dexon-sol-tools-edbe6915e07a516f5fad2a38eb8ffe96a7b28318.tar.lz
dexon-sol-tools-edbe6915e07a516f5fad2a38eb8ffe96a7b28318.tar.xz
dexon-sol-tools-edbe6915e07a516f5fad2a38eb8ffe96a7b28318.tar.zst
dexon-sol-tools-edbe6915e07a516f5fad2a38eb8ffe96a7b28318.zip
Fixed https://github.com/0xProject/wiki/issues/19 by disabling re-rendering of markdownCodeBlock renderer if props haven't updated
Diffstat (limited to 'packages/website/ts/pages')
-rw-r--r--packages/website/ts/pages/shared/markdown_code_block.tsx29
1 files changed, 19 insertions, 10 deletions
diff --git a/packages/website/ts/pages/shared/markdown_code_block.tsx b/packages/website/ts/pages/shared/markdown_code_block.tsx
index 621e5b606..aded15f0c 100644
--- a/packages/website/ts/pages/shared/markdown_code_block.tsx
+++ b/packages/website/ts/pages/shared/markdown_code_block.tsx
@@ -7,14 +7,23 @@ interface MarkdownCodeBlockProps {
language: string;
}
-export function MarkdownCodeBlock(props: MarkdownCodeBlockProps) {
- return (
- <span style={{fontSize: 16}}>
- <HighLight
- className={props.language || 'js'}
- >
- {props.literal}
- </HighLight>
- </span>
- );
+interface MarkdownCodeBlockState {}
+
+export class MarkdownCodeBlock extends React.Component<MarkdownCodeBlockProps, MarkdownCodeBlockState> {
+ // Re-rendering a codeblock causes any use selection to become de-selected. This is annoying when trying
+ // to copy-paste code examples. We therefore noop re-renders on this component if it's props haven't changed.
+ public shouldComponentUpdate(nextProps: MarkdownCodeBlockProps, nextState: MarkdownCodeBlockState) {
+ return nextProps.literal !== this.props.literal || nextProps.language !== this.props.language;
+ }
+ public render() {
+ return (
+ <span style={{fontSize: 16}}>
+ <HighLight
+ className={this.props.language || 'javascript'}
+ >
+ {this.props.literal}
+ </HighLight>
+ </span>
+ );
+ }
}