fixed typescript errors

src/components/StickerDesc.tsx

@@ -23,10 +23,15 @@ class StickerDesc extends React.PureComponent<Props, State> {
   blockMouse = e => {
     e.preventDefault();
     e.stopPropagation();
+
+    if (!this.input) {
+      return
+    }
+
     this.input.focus();
   };
 
-  input: HTMLTextAreaElement;
+  input: HTMLTextAreaElement | null = null;
 
   render() {
     const { value: text } = this.props;

src/components/dialogs/MapListDialog.tsx

@@ -64,9 +64,8 @@ export interface State {
 
 class MapListDialogUnconnected extends PureComponent<Props, State> {
   state = {
-    menu_target: null,
-    editor_target: null,
-
+    menu_target: '',
+    editor_target: '',
     is_editing: false,
     is_dropping: false,
   };
@@ -74,7 +73,7 @@ class MapListDialogUnconnected extends PureComponent<Props, State> {
   startEditing = (editor_target: IRouteListItem['address']): void =>
     this.setState({
       editor_target,
-      menu_target: null,
+      menu_target: '',
       is_editing: true,
       is_dropping: false,
     });
@@ -86,19 +85,19 @@ class MapListDialogUnconnected extends PureComponent<Props, State> {
 
   hideMenu = (): void =>
     this.setState({
-      menu_target: null,
+      menu_target: '',
     });
 
   showDropCard = (editor_target: IRouteListItem['address']): void =>
     this.setState({
       editor_target,
-      menu_target: null,
+      menu_target: '',
       is_editing: false,
       is_dropping: true,
     });
 
   stopEditing = (): void => {
-    this.setState({ editor_target: null });
+    this.setState({ editor_target: '' });
   };
 
   setTitle = ({ target: { value } }: { target: { value: string } }): void => {

src/components/dialogs/ProviderDialog.tsx

@@ -27,7 +27,7 @@ const ProviderDialogUnconnected = ({ provider, mapSetProvider }: Props) => (
               backgroundImage: `url(${replaceProviderUrl(item, { x: 5980, y: 2589, zoom: 13 })})`,
             }}
             onMouseDown={() => mapSetProvider(item)}
-            key={PROVIDERS[item].name}
+            key={PROVIDERS[item]?.name}
           >
             {
               provider === item &&
@@ -44,4 +44,4 @@ const ProviderDialogUnconnected = ({ provider, mapSetProvider }: Props) => (
 
 const ProviderDialog = connect(mapStateToProps, mapDispatchToProps)(ProviderDialogUnconnected)
 
-export { ProviderDialog }
+export { ProviderDialog }

src/components/dialogs/TitleDialog.tsx

@@ -42,7 +42,7 @@ export class TitleDialogUnconnected extends React.PureComponent<Props, State> {
     this.setMaxHeight();
   }
 
-  setMaxHeight = (): number => {
+  setMaxHeight = () => {
     if (!this.ref_sizer || !this.ref_title || !this.ref_text) return 0;
 
     const { height: sizer_height } = this.ref_sizer.getBoundingClientRect();

src/components/maps/RouteRowView.tsx

@@ -40,7 +40,7 @@ export const RouteRowView = ({
   is_admin,
   is_published,
   toggleStarred
-}: Props): ReactElement<Props, null> => (
+}: Props): ReactElement<Props> => (
   <div className={classnames("route-row-view", { has_menu: tab === "my" })}>
     {(tab === TABS.PENDING || tab === TABS.STARRED) && is_admin && (
       <div className="route-row-fav" onClick={toggleStarred.bind(null, address)}>

src/components/panels/EditorPanel.tsx

@@ -1,4 +1,4 @@
-import React, { PureComponent, useState, useCallback } from 'react';
+import React, { PureComponent } from 'react';
 import { MODES } from '~/constants/modes';
 import classnames from 'classnames';
 
@@ -7,12 +7,12 @@ import { EditorDialog } from '~/components/panels/EditorDialog';
 import { connect } from 'react-redux';
 import {
   editorChangeMode,
+  editorKeyPressed,
+  editorRedo,
   editorStartEditing,
   editorStopEditing,
   editorTakeAShot,
-  editorKeyPressed,
   editorUndo,
-  editorRedo,
 } from '~/redux/editor/actions';
 import { Tooltip } from '~/components/panels/Tooltip';
 import { IState } from '~/redux/store';
@@ -47,6 +47,10 @@ type Props = ReturnType<typeof mapStateToProps> & typeof mapDispatchToProps & {}
 
 class EditorPanelUnconnected extends PureComponent<Props, void> {
   componentDidMount() {
+    if (!this.panel) {
+      return;
+    }
+
     window.addEventListener('keydown', this.onKeyPress as any);
 
     const obj = document.getElementById('control-dialog');
@@ -57,7 +61,7 @@ class EditorPanelUnconnected extends PureComponent<Props, void> {
     obj.style.width = String(width);
   }
 
-  panel: HTMLElement = null;
+  panel: HTMLDivElement | null = null;
 
   componentWillUnmount() {
     window.removeEventListener('keydown', this.onKeyPress as any);

src/components/renderer/Renderer.tsx

@@ -31,6 +31,10 @@ class Component extends React.Component<Props, State> {
   };
 
   onImageLoaded = () => {
+    if (!this.image) {
+      return
+    }
+
     this.croppr = new Croppr(this.image, {
       onInitialize: this.onCropInit,
     });
@@ -57,12 +61,12 @@ class Component extends React.Component<Props, State> {
     regionEl.append(this.logo);
   };
 
-  croppr: Croppr;
-  logo: HTMLDivElement;
-  image: HTMLImageElement;
-  logoImg: HTMLImageElement;
+  croppr?: Croppr;
+  logo: HTMLDivElement | null = null;
+  image: HTMLImageElement | null = null;
+  logoImg: HTMLImageElement | null = null;
 
-  getImage = () => this.props.editorCropAShot(this.croppr.getValue());
+  getImage = () => this.props.editorCropAShot(this.croppr?.getValue());
 
   render() {
     const { data } = this.props.editor.renderer;

src/components/search/MapListDialogHead.tsx

@@ -7,7 +7,7 @@ interface Props {
   max: number;
   search: string;
   distance: [number, number];
-  onDistanceChange: (val: [number, number]) => void;
+  onDistanceChange: (val: number[]) => void;
   onSearchChange: ChangeEventHandler<HTMLInputElement>;
 }