From 6e122691d114d042a76e1d585a11a238a1f35f47 Mon Sep 17 00:00:00 2001 From: Fabio Berger Date: Mon, 6 Aug 2018 11:57:56 -0400 Subject: Fix bug related to react-scroll's scrollSpy and the render order of elements --- packages/website/ts/components/top_bar/top_bar.tsx | 14 ++++++++++++-- 1 file changed, 12 insertions(+), 2 deletions(-) (limited to 'packages/website') diff --git a/packages/website/ts/components/top_bar/top_bar.tsx b/packages/website/ts/components/top_bar/top_bar.tsx index c921867d7..41b01c57b 100644 --- a/packages/website/ts/components/top_bar/top_bar.tsx +++ b/packages/website/ts/components/top_bar/top_bar.tsx @@ -1,5 +1,11 @@ import { DocsInfo, DocsMenu } from '@0xproject/react-docs'; -import { colors, MenuSubsectionsBySection, NestedSidebarMenu, Styles } from '@0xproject/react-shared'; +import { + colors, + MenuSubsectionsBySection, + NestedSidebarMenu, + Styles, + constants as sharedConstants, +} from '@0xproject/react-shared'; import * as _ from 'lodash'; import Drawer from 'material-ui/Drawer'; import Menu from 'material-ui/Menu'; @@ -409,7 +415,11 @@ export class TopBar extends React.Component { const isViewingDocsPage = _.some(DOC_WEBSITE_PATHS_TO_KEY, (_key, websitePath) => { return this._doesUrlInclude(websitePath); }); - if (!isViewingDocsPage || _.isUndefined(this.props.menu)) { + // HACK: We need to make sure the SCROLL_CONTAINER is loaded before rendering the Sidebar + // because the sidebar renders `react-scroll` links which depend on the scroll container already + // being rendered. + const documentationContainer = document.getElementById(sharedConstants.SCROLL_CONTAINER_ID); + if (!isViewingDocsPage || _.isUndefined(this.props.menu) || _.isNull(documentationContainer)) { return undefined; } return ( -- cgit v1.2.3