From 79e1457df5de83b47f540257d6e2fd0784fa1a49 Mon Sep 17 00:00:00 2001
From: Chris Beer <cabeer@stanford.edu>
Date: Fri, 15 May 2020 12:09:50 -0700
Subject: [PATCH] Add a hack to get our window view click handlers working
right
---
src/components/WindowViewSettings.js | 17 ++++++++---------
1 file changed, 8 insertions(+), 9 deletions(-)
diff --git a/src/components/WindowViewSettings.js b/src/components/WindowViewSettings.js
index f8faba985..fdc059465 100644
--- a/src/components/WindowViewSettings.js
+++ b/src/components/WindowViewSettings.js
@@ -59,8 +59,6 @@ export class WindowViewSettings extends Component {
classes, handleClose, t, windowViewType, viewTypes,
} = this.props;
- if (viewTypes.length === 0) return null;
-
const iconMap = {
book: BookViewIcon,
gallery: GalleryViewIcon,
@@ -68,29 +66,30 @@ export class WindowViewSettings extends Component {
single: SingleIcon,
};
- /** */
- const ViewItem = ({ Icon, value }) => (
+ /** Suspiciously similar to a component, yet if it is invoked through JSX
+ none of the click handlers work? */
+ const menuItem = ({ value, Icon }) => (
<MenuItem
+ key={value}
className={classes.MenuItem}
- ref={ref => this.handleSelectedRef(ref)}
+ ref={windowViewType === value && (ref => this.handleSelectedRef(ref))}
onClick={() => { this.handleChange(value); handleClose(); }}
>
<FormControlLabel
value={value}
classes={{ label: windowViewType === value ? classes.selectedLabel : classes.label }}
- control={Icon && <Icon color={windowViewType === value ? 'secondary' : undefined} />}
+ control={<Icon color={windowViewType === value ? 'secondary' : undefined} />}
label={t(value)}
labelPlacement="bottom"
/>
</MenuItem>
);
+ if (viewTypes.length === 0) return null;
return (
<>
<ListSubheader role="presentation" disableSticky tabIndex="-1">{t('view')}</ListSubheader>
- {viewTypes.map(value => (
- <ViewItem Icon={iconMap[value]} key={value} value={value} />
- ))}
+ { viewTypes.map(value => menuItem({ Icon: iconMap[value], value })) }
</>
);
}
--
GitLab