diff --git a/app/src/components/SettingsDrawer/Settings.tsx b/app/src/components/SettingsDrawer/Settings.tsx
index 957aac2..f8aa513 100644
--- a/app/src/components/SettingsDrawer/Settings.tsx
+++ b/app/src/components/SettingsDrawer/Settings.tsx
@@ -133,8 +133,8 @@ class Settings extends React.Component<Props, {}> {
     )
   }
 
-  private onChangeAutoExpand = (e: React.ChangeEvent<HTMLSelectElement>) => {
-    this.props.actions.settings.setAutoExpandLimit(parseInt(e.target.value, 10))
+  private onChangeAutoExpand = (e: React.ChangeEvent<{value: unknown}>) => {
+    this.props.actions.settings.setAutoExpandLimit(parseInt(String(e.target.value), 10))
   }
 
   private renderNodeOrder() {
@@ -160,7 +160,7 @@ class Settings extends React.Component<Props, {}> {
     </div>)
   }
 
-  private onChangeSorting = (e: React.ChangeEvent<HTMLSelectElement>) => {
+  private onChangeSorting = (e: React.ChangeEvent<{value: unknown}>) => {
     this.props.actions.settings.setTopicOrder(e.target.value as TopicOrder)
   }
 
diff --git a/app/src/components/SettingsDrawer/TimeLocale.tsx b/app/src/components/SettingsDrawer/TimeLocale.tsx
index 168a374..a7404f7 100644
--- a/app/src/components/SettingsDrawer/TimeLocale.tsx
+++ b/app/src/components/SettingsDrawer/TimeLocale.tsx
@@ -32,16 +32,21 @@ function TimeLocaleSettings(props: Props) {
     </MenuItem>
   ))
 
+  function updateLocale(e: React.ChangeEvent<{value: unknown}>) {
+    const locale = e.target.value ? String(e.target.value) : ''
+    actions.settings.setTimeLocale(locale)
+  }
+
   return (
     <div style={{ padding: '8px', display: 'flex' }}>
       <InputLabel htmlFor="time-locale" style={{ flex: '1', marginTop: '8px' }}>Time Locale</InputLabel>
       <Select
           value={timeLocale}
-          onChange={e => actions.settings.setTimeLocale(e.target.value)}
+          onChange={updateLocale}
           input={<Input name="time-locale" id="time-locale-label-placeholder" />}
           name="time-locale"
           className={classes.input}
-          renderValue={(v) => <span>{v}</span>}
+          renderValue={v => <span>{String(v)}</span>}
           style={{ flex: '1' }}
       >
         {localeMenuItems}