improve network error handling/messaging

app/screens/ServerView.tsx

@@ -5,10 +5,11 @@ import { selectSettings } from '@app/state/settings'
 import { useStore } from '@app/state/store'
 import colors from '@app/styles/colors'
 import font from '@app/styles/font'
+import toast from '@app/util/toast'
 import { useNavigation } from '@react-navigation/native'
 import md5 from 'md5'
 import React, { useCallback, useState } from 'react'
-import { StyleSheet, Text, TextInput, ToastAndroid, View } from 'react-native'
+import { StyleSheet, Text, TextInput, View } from 'react-native'
 import { v4 as uuidv4 } from 'uuid'
 
 const ServerView: React.FC<{
@@ -81,7 +82,6 @@ const ServerView: React.FC<{
         }
         exit()
       } catch (err) {
-        console.error(err)
         setSaving(false)
       }
     }
@@ -99,7 +99,6 @@ const ServerView: React.FC<{
         await removeServer(id as string)
         exit()
       } catch (err) {
-        console.error(err)
         setRemoving(false)
       }
     }
@@ -113,9 +112,9 @@ const ServerView: React.FC<{
     const ping = async () => {
       const res = await pingServer(potential)
       if (res) {
-        ToastAndroid.show(`Connection to ${potential.address} OK!`, ToastAndroid.SHORT)
+        toast(`Connection to ${potential.address} OK!`)
       } else {
-        ToastAndroid.show(`Connection to ${potential.address} failed, check settings or server`, ToastAndroid.SHORT)
+        toast(`Connection to ${potential.address} failed, check settings or server`)
       }
       setTesting(false)
     }

app/state/music.ts

@@ -330,15 +330,18 @@ export const createMusicSlice = (set: SetState<Store>, get: GetState<Store>): Mu
       const promises: Promise<any>[] = []
       for (const type of types) {
         promises.push(
-          client.getAlbumList2({ type: type as GetAlbumList2TypeBase, size: 20 }).then(response => {
+          client
-            const list = response.data.albums.map(get().mapAlbumID3toAlbumListItem)
+            .getAlbumList2({ type: type as GetAlbumList2TypeBase, size: 20 })
-            set(
+            .then(response => {
-              produce<MusicSlice>(state => {
+              const list = response.data.albums.map(get().mapAlbumID3toAlbumListItem)
-                state.homeLists[type] = list
+              set(
-                state.starredAlbums = reduceStarred(state.starredAlbums, state.homeLists[type])
+                produce<MusicSlice>(state => {
-              }),
+                  state.homeLists[type] = list
-            )
+                  state.starredAlbums = reduceStarred(state.starredAlbums, state.homeLists[type])
-          }),
+                }),
+              )
+            })
+            .catch(() => {}),
         )
       }
       await Promise.all(promises)

app/subsonic/api.ts

@@ -1,5 +1,4 @@
-import { DOMParser } from 'xmldom'
+import { Server } from '@app/models/settings'
-import RNFS from 'react-native-fs'
 import {
   GetAlbumList2Params,
   GetAlbumListParams,
@@ -34,8 +33,8 @@ import {
   Search3Response,
   SubsonicResponse,
 } from '@app/subsonic/responses'
-import { Server } from '@app/models/settings'
+import toast from '@app/util/toast'
-import PromiseQueue from '@app/util/PromiseQueue'
+import { DOMParser } from 'xmldom'
 
 export class SubsonicApiError extends Error {
   method: string
@@ -52,8 +51,6 @@ export class SubsonicApiError extends Error {
   }
 }
 
-const downloadQueue = new PromiseQueue(1)
-
 export class SubsonicApiClient {
   address: string
   username: string
@@ -81,28 +78,19 @@ export class SubsonicApiClient {
       }
     }
 
-    const url = `${this.address}/rest/${method}?${query}`
+    return `${this.address}/rest/${method}?${query}`
-    // console.log(`${method}: ${url}`)
-    return url
-  }
-
-  private async apiDownload(method: string, path: string, params?: { [key: string]: any }): Promise<string> {
-    const download = RNFS.downloadFile({
-      fromUrl: this.buildUrl(method, params),
-      toFile: path,
-    }).promise
-
-    await downloadQueue.enqueue(() => download)
-    await downloadQueue.enqueue(() => new Promise(resolve => setTimeout(resolve, 100)))
-
-    return path
   }
 
   private async apiGetXml(method: string, params?: { [key: string]: any }): Promise<Document> {
-    const response = await fetch(this.buildUrl(method, params))
+    let text: string
-    const text = await response.text()
 
-    // console.log(text)
+    try {
+      const response = await fetch(this.buildUrl(method, params))
+      text = await response.text()
+    } catch (err) {
+      toast(`Network error: ${this.address}`)
+      throw err
+    }
 
     const xml = new DOMParser().parseFromString(text)
     if (xml.documentElement.getAttribute('status') !== 'ok') {

app/util/toast.ts

@@ -0,0 +1,7 @@
+import { ToastAndroid } from 'react-native'
+
+function toast(message: string) {
+  ToastAndroid.showWithGravityAndOffset(message, ToastAndroid.SHORT, ToastAndroid.BOTTOM, 0, 180)
+}
+
+export default toast