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

Fix Tooltip component for server side rendering (#2265)

Browse Source 
Co-authored-by: Mell <oleh.melnechyk@gmail.com>
This commit is contained in:
Jaco Greeff 2020-02-11 15:35:20 +01:00 committed by GitHub
parent 643d62c29b
commit 8fabef3a47
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 8 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
packages/react-components/src/Tooltip.tsx
View File

@ -11,7 +11,9 @@ import styled from 'styled-components';
import { classes } from './util';
const rootElement = document.getElementById('tooltips');
const rootElement = typeof document === 'undefined'
? null // This hack is required for server side renreding
: document.getElementById('tooltips');
interface Props extends BareProps {
dataFor?: string;
@ -28,7 +30,11 @@ interface Props extends BareProps {
}
function Tooltip ({ className, effect = 'solid', offset, place = 'bottom', text, trigger }: Props): React.ReactElement<Props> | null {
const [tooltipContainer] = useState(document.createElement('div'));
const defaultTooltipContainer = typeof document === 'undefined'
? {} as HTMLElement // This hack is required for server side renreding
: document.createElement('div');
const [tooltipContainer] = useState(defaultTooltipContainer);
useEffect((): () => void => {
if (rootElement !== null) {