Skeleton: fix grid styling on hidden sidebar

Fixes urbit/landscape#1006
This commit is contained in:
Liam Fitzgerald 2021-06-29 13:11:26 +10:00
parent aa8551a3ab
commit 5e2f4215a8
No known key found for this signature in database
GPG Key ID: D390E12C61D1CFFB
2 changed files with 17 additions and 12 deletions

View File

@ -14,11 +14,12 @@ class AsyncFallback extends React.Component<
this.state = { error: false }; this.state = { error: false };
} }
componentDidCatch() { static getDerivedStateFromError(error) {
this.setState({ error: true }); return { error: true };
return false;
} }
componentDidCatch(error, info) {}
render() { render() {
const { fallback, children } = this.props; const { fallback, children } = this.props;
return ( return (

View File

@ -20,22 +20,26 @@ export const Skeleton = React.memo((props: SkeletonProps): ReactElement => {
setSidebar(s => !s); setSidebar(s => !s);
}, [])); }, []));
return !sidebar ? (<Body> {props.children} </Body>) : ( return (
<Body <Body
display="grid" display="grid"
gridTemplateColumns={ gridTemplateColumns={
['100%', 'minmax(150px, 1fr) 3fr', 'minmax(250px, 1fr) 4fr'] sidebar
? ['100%', 'minmax(150px, 1fr) 3fr', 'minmax(250px, 1fr) 4fr']
: '100%'
} }
gridTemplateRows="100%" gridTemplateRows="100%"
> >
<ErrorBoundary> <ErrorBoundary>
<Sidebar { sidebar && (
recentGroups={props.recentGroups} <Sidebar
selected={props.selected} recentGroups={props.recentGroups}
baseUrl={props.baseUrl} selected={props.selected}
mobileHide={props.mobileHide} baseUrl={props.baseUrl}
workspace={props.workspace} mobileHide={props.mobileHide}
/> workspace={props.workspace}
/>
)}
</ErrorBoundary> </ErrorBoundary>
{props.children} {props.children}
</Body> </Body>