Changed network connection check logic

Network connection no longer requires internet connection. Socket connection status is used instead for checking if server is reachable. If there is no socket connection available eq. before connecting to server then connection type is used to for netrork connection check.

components/app/Appbar.vue

@@ -7,7 +7,7 @@
       <a v-if="showBack" @click="back" class="rounded-full h-10 w-10 flex items-center justify-center mr-2 cursor-pointer">
         <span class="material-icons text-3xl text-fg">arrow_back</span>
       </a>
-      <div v-if="user && currentLibrary && networkConnected">
+      <div v-if="user && currentLibrary && socketConnected">
         <div class="pl-1.5 pr-2.5 py-2 bg-bg bg-opacity-30 rounded-md flex items-center" @click="clickShowLibraryModal">
           <ui-library-icon :icon="currentLibraryIcon" :size="4" font-size="base" />
           <p class="text-sm leading-4 ml-2 mt-0.5 max-w-24 truncate">{{ currentLibraryName }}</p>
@@ -54,8 +54,8 @@ export default {
         this.$store.commit('setCastAvailable', val)
       }
     },
-    networkConnected() {
+    socketConnected() {
-      return this.$store.state.networkConnected
+      return this.$store.state.socketConnected
     },
     currentLibrary() {
       return this.$store.getters['libraries/getCurrentLibrary']
@@ -160,4 +160,4 @@ export default {
     transform: translate(10px, 0);
   }
 }
-</style>
+</style>

components/tables/podcast/EpisodesTable.vue

@@ -101,8 +101,8 @@ export default {
     isAdminOrUp() {
       return this.$store.getters['user/getIsAdminOrUp']
     },
-    networkConnected() {
+    socketConnected() {
-      return this.$store.state.networkConnected
+      return this.$store.state.socketConnected
     },
     libraryItemId() {
       return this.libraryItem?.id || null
@@ -233,7 +233,7 @@ export default {
       }
     },
     async searchEpisodes() {
-      if (!this.networkConnected) {
+      if (!this.socketConnected) {
         return this.$toast.error(this.$strings.MessageNoNetworkConnection)
       }
 
@@ -314,4 +314,4 @@ export default {
     this.$socket.$off('episode_download_finished', this.episodeDownloadFinished)
   }
 }
-</script>
+</script>

pages/bookshelf/add-podcast.vue

@@ -3,11 +3,11 @@
     <template v-if="!showSelectedFeed">
       <div class="w-full mx-auto h-20 flex items-center px-2">
         <form class="w-full" @submit.prevent="submit">
-          <ui-text-input v-model="searchInput" :disabled="processing || !networkConnected" placeholder="Enter search term or RSS feed URL" text-size="sm" />
+          <ui-text-input v-model="searchInput" :disabled="processing || !socketConnected" placeholder="Enter search term or RSS feed URL" text-size="sm" />
         </form>
       </div>
 
-      <div v-if="!networkConnected" class="w-full text-center py-6">
+      <div v-if="!socketConnected" class="w-full text-center py-6">
         <p class="text-lg text-error">{{ $strings.MessageNoNetworkConnection }}</p>
       </div>
       <div v-else class="w-full mx-auto pb-2 overflow-y-auto overflow-x-hidden h-[calc(100%-85px)]">
@@ -65,8 +65,8 @@ export default {
     }
   },
   computed: {
-    networkConnected() {
+    socketConnected() {
-      return this.$store.state.networkConnected
+      return this.$store.state.socketConnected
     }
   },
   methods: {

store/index.js

@@ -31,16 +31,16 @@ export const state = () => ({
 })
 
 export const getters = {
-  getCurrentPlaybackSessionId: state => {
+  getCurrentPlaybackSessionId: (state) => {
     return state.currentPlaybackSession?.id || null
   },
-  getIsPlayerOpen: state => {
+  getIsPlayerOpen: (state) => {
     return !!state.currentPlaybackSession
   },
-  getIsCurrentSessionLocal: state => {
+  getIsCurrentSessionLocal: (state) => {
     return state.currentPlaybackSession?.playMethod == PlayMethod.LOCAL
   },
-  getIsMediaStreaming: state => (libraryItemId, episodeId) => {
+  getIsMediaStreaming: (state) => (libraryItemId, episodeId) => {
     if (!state.currentPlaybackSession || !libraryItemId) return false
 
     // Check using local library item id and local episode id
@@ -59,30 +59,30 @@ export const getters = {
     if (!episodeId) return true
     return state.currentPlaybackSession.episodeId === episodeId
   },
-  getServerSetting: state => key => {
+  getServerSetting: (state) => (key) => {
     if (!state.serverSettings) return null
     return state.serverSettings[key]
   },
-  getJumpForwardTime: state => {
+  getJumpForwardTime: (state) => {
     if (!state.deviceData?.deviceSettings) return 10
     return state.deviceData.deviceSettings.jumpForwardTime || 10
   },
-  getJumpBackwardsTime: state => {
+  getJumpBackwardsTime: (state) => {
     if (!state.deviceData?.deviceSettings) return 10
     return state.deviceData.deviceSettings.jumpBackwardsTime || 10
   },
-  getAltViewEnabled: state => {
+  getAltViewEnabled: (state) => {
     if (!state.deviceData?.deviceSettings) return true
     return state.deviceData.deviceSettings.enableAltView
   },
-  getOrientationLockSetting: state => {
+  getOrientationLockSetting: (state) => {
     return state.deviceData?.deviceSettings?.lockOrientation
   },
-  getCanDownloadUsingCellular: state => {
+  getCanDownloadUsingCellular: (state) => {
     if (!state.deviceData?.deviceSettings?.downloadUsingCellular) return 'ALWAYS'
     return state.deviceData.deviceSettings.downloadUsingCellular || 'ALWAYS'
   },
-  getCanStreamingUsingCellular: state => {
+  getCanStreamingUsingCellular: (state) => {
     if (!state.deviceData?.deviceSettings?.streamingUsingCellular) return 'ALWAYS'
     return state.deviceData.deviceSettings.streamingUsingCellular || 'ALWAYS'
   }
@@ -124,7 +124,7 @@ export const mutations = {
   setPlaybackSession(state, playbackSession) {
     state.currentPlaybackSession = playbackSession
 
-    state.isCasting = playbackSession?.mediaPlayer === "cast-player"
+    state.isCasting = playbackSession?.mediaPlayer === 'cast-player'
   },
   setMediaPlayer(state, mediaPlayer) {
     state.isCasting = mediaPlayer === 'cast-player'
@@ -165,7 +165,11 @@ export const mutations = {
     state.isNetworkListenerInit = val
   },
   setNetworkStatus(state, val) {
-    state.networkConnected = val.connected
+    if (val.connectionType !== 'none') {
+      state.networkConnected = true
+    } else {
+      state.networkConnected = false
+    }
     state.networkConnectionType = val.connectionType
   },
   setIsNetworkUnmetered(state, val) {