Fix linting errors

src/App.tsx

@@ -56,7 +56,10 @@ class App extends React.Component<AppProps, AppState> {
     message.config({ duration: 5 })
 
     this.state = {
-      client: new DicomWebManager(this.baseUri, props.config.servers),
+      client: new DicomWebManager({
+        baseUri: this.baseUri,
+        settings: props.config.servers
+      }),
       isLoading: true,
       wasAuthSuccessful: false
     }
@@ -67,7 +70,7 @@ class App extends React.Component<AppProps, AppState> {
     authorization: string
   }): void => {
     const client = this.state.client
-    client.updateHeaders({ 'Authorization': authorization})
+    client.updateHeaders({ Authorization: authorization })
     this.setState(state => ({
       user: user,
       client: client,

src/DicomWebManager.tsx

@@ -3,14 +3,16 @@ import * as dwc from 'dicomweb-client'
 import { ServerSettings } from './AppConfig'
 import { joinUrl } from './utils/url'
 
-
 export default class DicomWebManager {
-  private readonly datastores: {
+  private readonly datastores: Array<{
     isStoragePermitted: boolean
     client: dwc.api.DICOMwebClient
-  }[]
+  }>
 
-  constructor(baseUri: string, settings: ServerSettings[]) {
+  constructor ({ baseUri, settings }: {
+    baseUri: string
+    settings: ServerSettings[]
+  }) {
     this.datastores = []
     settings.forEach(serverSettings => {
       if (serverSettings === undefined) {
@@ -52,83 +54,97 @@ export default class DicomWebManager {
   }
 
   get headers (): { [name: string]: string } {
-    return this.datastores[0].client.headers
+    const store = this.datastores[0]
+    return store.client.headers
   }
 
-  storeInstances = (
+  storeInstances = async (
     options: dwc.api.StoreInstancesOptions
   ): Promise<string> => {
-    if (this.datastores[0].isStoragePermitted) {
-      return this.datastores[0].client.storeInstances(options)
+    const store = this.datastores[0]
+    if (store.isStoragePermitted) {
+      return await store.client.storeInstances(options)
     } else {
-      return Promise.reject('None of the configured servers permits storage.')
+      return await Promise.reject(
+        new Error('None of the configured servers permits storage of instances.')
+      )
     }
   }
 
-  searchForStudies = (
+  searchForStudies = async (
     options: dwc.api.SearchForStudiesOptions
   ): Promise<dwc.api.Study[]> => {
-    return this.datastores[0].client.searchForStudies(options)
+    const store = this.datastores[0]
+    return await store.client.searchForStudies(options)
   }
 
-  searchForSeries = (
+  searchForSeries = async (
     options: dwc.api.SearchForSeriesOptions
   ): Promise<dwc.api.Series[]> => {
-    return this.datastores[0].client.searchForSeries(options)
+    const store = this.datastores[0]
+    return await store.client.searchForSeries(options)
   }
 
-  searchForInstances = (
+  searchForInstances = async (
     options: dwc.api.SearchForInstancesOptions
   ): Promise<dwc.api.Instance[]> => {
-    return this.datastores[0].client.searchForInstances(options)
+    const store = this.datastores[0]
+    return await store.client.searchForInstances(options)
   }
 
-  retrieveStudyMetadata = (
+  retrieveStudyMetadata = async (
     options: dwc.api.RetrieveStudyMetadataOptions
   ): Promise<dwc.api.Metadata[]> => {
-    return this.datastores[0].client.retrieveStudyMetadata(options)
+    const store = this.datastores[0]
+    return await store.client.retrieveStudyMetadata(options)
   }
 
-  retrieveSeriesMetadata = (
+  retrieveSeriesMetadata = async (
     options: dwc.api.RetrieveSeriesMetadataOptions
   ): Promise<dwc.api.Metadata[]> => {
-    return this.datastores[0].client.retrieveSeriesMetadata(options)
+    const store = this.datastores[0]
+    return await store.client.retrieveSeriesMetadata(options)
   }
 
-  retrieveInstanceMetadata = (
+  retrieveInstanceMetadata = async (
     options: dwc.api.RetrieveInstanceMetadataOptions
   ): Promise<dwc.api.Metadata[]> => {
-    return this.datastores[0].client.retrieveInstanceMetadata(options)
+    const store = this.datastores[0]
+    return await store.client.retrieveInstanceMetadata(options)
   }
 
-  retrieveInstance = (
+  retrieveInstance = async (
     options: dwc.api.RetrieveInstanceOptions
   ): Promise<dwc.api.Dataset> => {
-    return this.datastores[0].client.retrieveInstance(options)
+    const store = this.datastores[0]
+    return await store.client.retrieveInstance(options)
   }
 
-  retrieveInstanceFrames = (
+  retrieveInstanceFrames = async (
     options: dwc.api.RetrieveInstanceFramesOptions
   ): Promise<dwc.api.Pixeldata[]> => {
-    return this.datastores[0].client.retrieveInstanceFrames(options)
+    const store = this.datastores[0]
+    return await store.client.retrieveInstanceFrames(options)
   }
 
-  retrieveInstanceRendered = (
+  retrieveInstanceRendered = async (
     options: dwc.api.RetrieveInstanceRenderedOptions
   ): Promise<dwc.api.Pixeldata> => {
-    return this.datastores[0].client.retrieveInstanceRendered(options)
+    const store = this.datastores[0]
+    return await store.client.retrieveInstanceRendered(options)
   }
 
-  retrieveInstanceFramesRendered = (
+  retrieveInstanceFramesRendered = async (
     options: dwc.api.RetrieveInstanceFramesRenderedOptions
   ): Promise<dwc.api.Pixeldata> => {
-    return this.datastores[0].client.retrieveInstanceFramesRendered(options)
+    const store = this.datastores[0]
+    return await store.client.retrieveInstanceFramesRendered(options)
   }
 
-  retrieveBulkData = (
+  retrieveBulkData = async (
     options: dwc.api.RetrieveBulkDataOptions
   ): Promise<dwc.api.Bulkdata> => {
-    return this.datastores[0].client.retrieveBulkData(options)
+    const store = this.datastores[0]
+    return await store.client.retrieveBulkData(options)
   }
 }
-

src/components/CaseViewer.tsx

@@ -109,24 +109,28 @@ class Viewer extends React.Component<ViewerProps, ViewerState> {
 
     return (
       <Layout style={{ height: '100%' }} hasSider>
-        <Layout.Sider width={300} theme='light' style={{
-          borderRight: 'solid',
-          borderRightWidth: 0.25
-        }}>
+        <Layout.Sider
+          width={300}
+          theme='light'
+          style={{
+            borderRight: 'solid',
+            borderRightWidth: 0.25
+          }}
+        >
           <Menu
             mode='inline'
             defaultOpenKeys={['patient', 'case', 'slides']}
             style={{ height: '100%' }}
             inlineIndent={14}
             theme='light'
           >
-            <Menu.SubMenu key="patient" title="Patient">
+            <Menu.SubMenu key='patient' title='Patient'>
               <Patient metadata={studyMetadata} />
             </Menu.SubMenu>
-            <Menu.SubMenu key="case" title="Case">
+            <Menu.SubMenu key='case' title='Case'>
               <Study metadata={studyMetadata} />
             </Menu.SubMenu>
-            <Menu.SubMenu key="slides" title="Slides">
+            <Menu.SubMenu key='slides' title='Slides'>
               <SeriesList
                 client={this.props.client}
                 metadata={this.state.series}

src/components/SlideViewer.tsx

@@ -18,7 +18,7 @@ import {
   Modal,
   Layout,
   Row,
-  Select,
+  Select
 } from 'antd'
 import * as dmv from 'dicom-microscopy-viewer'
 import * as dcmjs from 'dcmjs'
@@ -31,7 +31,6 @@ import SpecimenList from './SpecimenList'
 import { AnnotationSettings } from '../AppConfig'
 import { findContentItemsByName } from '../utils/sr'
 
-
 const _buildKey = (concept: dcmjs.sr.coding.CodedConcept): string => {
   const codingScheme = concept.CodingSchemeDesignator
   const codeValue = concept.CodeValue
@@ -703,7 +702,7 @@ class SlideViewer extends React.Component<SlideViewerProps, SlideViewerState> {
    * de-activate it, depending on its current state.
    */
   handleRoiDrawing ({ geometryType, markup }: {
-    geometryType: string,
+    geometryType: string
     markup?: string
   }): void {
     if (this.volumeViewer === undefined) {
@@ -921,24 +920,28 @@ class SlideViewer extends React.Component<SlideViewerProps, SlideViewerState> {
           </Modal>
         </Layout.Content>
 
-        <Layout.Sider width={300} theme='light' style={{
+        <Layout.Sider
+          width={300}
+          theme='light'
+          reverseArrow style={{
             borderLeft: 'solid',
             borderLeftWidth: 0.25
-        }}>
+          }}
+        >
           <Menu
             mode='inline'
-            defaultOpenKeys={['labelImage', 'annotations']}
+            defaultOpenKeys={['annotations']}
             style={{ height: '100%' }}
             inlineIndent={14}
             theme='light'
           >
-            <Menu.SubMenu key="labelImage" title="Slide label">
+            <Menu.SubMenu key='labelImage' title='Slide label'>
               <div style={{ height: '220px' }} ref={this.labelViewport} />
             </Menu.SubMenu>
-            <Menu.SubMenu key="specimens" title="Specimens">
+            <Menu.SubMenu key='specimens' title='Specimens'>
               <SpecimenList metadata={this.state.metadata} />
             </Menu.SubMenu>
-            <Menu.SubMenu key="annotations" title="Annotations">
+            <Menu.SubMenu key='annotations' title='Annotations'>
               {annotations}
             </Menu.SubMenu>
           </Menu>

src/components/Worklist.tsx

@@ -52,14 +52,14 @@ class Worklist extends React.Component<WorklistProps, WorklistState> {
   }
 
   fetchData ({ offset, limit, searchCriteria }: {
-    offset: number,
-    limit: number,
+    offset: number
+    limit: number
     searchCriteria?: { [attribute: string]: string }
   }): void {
     const queryParams: { [key: string]: any } = {
       ModalitiesInStudy: 'SM',
       offset: offset,
-      limit: limit,
+      limit: limit
     }
     if (searchCriteria !== undefined) {
       for (const key in searchCriteria) {
@@ -198,9 +198,11 @@ class Worklist extends React.Component<WorklistProps, WorklistState> {
     }) => (
       <div style={{ padding: 8 }}>
         <Input
-          placeholder={`Search`}
+          placeholder='Search'
           value={selectedKeys[0]}
-          onChange={e => setSelectedKeys(e.target.value ? [e.target.value] : [])}
+          onChange={e => setSelectedKeys(
+            e.target.value !== undefined ? [e.target.value] : []
+          )}
           onPressEnter={() => this.handleSearch(selectedKeys, confirm, dataIndex)}
           style={{ width: 188, marginBottom: 8, display: 'block' }}
         />
@@ -224,8 +226,10 @@ class Worklist extends React.Component<WorklistProps, WorklistState> {
         </Space>
       </div>
     ),
-    filterIcon: (filtered: string) => (
-      <SearchOutlined style={{ color: filtered ? '#1890ff' : undefined }} />
+    filterIcon: (filtered: boolean) => (
+      <SearchOutlined
+        style={{ color: filtered ? '#1890ff' : undefined }}
+      />
     )
   })
 }

types/dicom-microscopy-viewer/index.d.ts

@@ -38,13 +38,13 @@ declare module 'dicom-microscopy-viewer' {
       get isModifyInteractionActive (): boolean
       activateDragZoomInteraction (options: object): void
       deactivateDragZoomInteraction (): void
-      get isDragZoomInteractionActive (): boolen
+      get isDragZoomInteractionActive (): boolean
       activateSnapInteraction (options: object): void
       deactivateSnapInteraction (): void
-      get isSnapInteractionActive (): boolen
+      get isSnapInteractionActive (): boolean
       activateTranslateInteraction (options: object): void
       deactivateTranslateInteraction (): void
-      get isTranslateInteractionActive (): boolen
+      get isTranslateInteractionActive (): boolean
       getAllROIs (): roi.ROI[]
       removeAllROIs (): void
       getROI (uid: string): roi.ROI