diff --git a/package-lock.json b/package-lock.json
index 67582cf..99a9f84 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -23,6 +23,7 @@
         "@capacitor/haptics": "7.0.2",
         "@capacitor/ios": "^7.2.0",
         "@capacitor/keyboard": "7.0.1",
+        "@capacitor/network": "^7.0.4",
         "@capacitor/preferences": "^7.0.1",
         "@capacitor/status-bar": "7.0.1",
         "@ionic/angular": "^8.0.0",
@@ -3191,6 +3192,15 @@
         "@capacitor/core": ">=7.0.0"
       }
     },
+    "node_modules/@capacitor/network": {
+      "version": "7.0.4",
+      "resolved": "https://registry.npmjs.org/@capacitor/network/-/network-7.0.4.tgz",
+      "integrity": "sha512-fNhN3968AQWMnzasPJ0B8e+nyk7+R6V9PWIBQWSQRHrKndDgWRHpxkjEzJPgnJr3EjnKLjbwO+UYy+EwBlGs3A==",
+      "license": "MIT",
+      "peerDependencies": {
+        "@capacitor/core": ">=7.0.0"
+      }
+    },
     "node_modules/@capacitor/preferences": {
       "version": "7.0.1",
       "resolved": "https://registry.npmjs.org/@capacitor/preferences/-/preferences-7.0.1.tgz",
diff --git a/package.json b/package.json
index 45ebe51..ad0293e 100644
--- a/package.json
+++ b/package.json
@@ -34,6 +34,7 @@
     "@capacitor/haptics": "7.0.2",
     "@capacitor/ios": "^7.2.0",
     "@capacitor/keyboard": "7.0.1",
+    "@capacitor/network": "^7.0.4",
     "@capacitor/preferences": "^7.0.1",
     "@capacitor/status-bar": "7.0.1",
     "@ionic/angular": "^8.0.0",
diff --git a/src/app/components/snapcast-group-preview/snapcast-group-preview.component.html b/src/app/components/snapcast-group-preview/snapcast-group-preview.component.html
index e9065c4..82cd9d1 100644
--- a/src/app/components/snapcast-group-preview/snapcast-group-preview.component.html
+++ b/src/app/components/snapcast-group-preview/snapcast-group-preview.component.html
@@ -11,8 +11,18 @@
 
   <ng-container *ngIf="activeStream && activeStream.properties.metadata else noStreamData">
 
-    <img *ngIf="activeStream.properties.metadata.artData as artData"
+    <img *ngIf="activeStream.properties.metadata.artData as artData; else noBase64"
       [src]="convertCoverDataBase64(artData.data, artData.extension)" class="cover">
+
+    <ng-template #noBase64>
+      <!-- try url if no url show placeholder -->
+      <img *ngIf="activeStream.properties.metadata.artUrl as artUrl; else noArtUrl" [src]="artUrl" class="cover"
+        alt="Album Art">
+      <ng-template #noArtUrl>
+        <img [src]="'assets/placeholder/cover_art_placeholder.svg'" class="cover" alt="Placeholder Image">
+      </ng-template>
+    </ng-template>
+
     <ng-conainer [ngSwitch]="activeStream.status">
       <ng-container *ngSwitchCase="'playing'">
         <ion-icon class="status-icon" name="play-circle"></ion-icon>
diff --git a/src/app/components/snapcast-stream-preview/snapcast-stream-preview.component.html b/src/app/components/snapcast-stream-preview/snapcast-stream-preview.component.html
index d7aa173..cabaff7 100644
--- a/src/app/components/snapcast-stream-preview/snapcast-stream-preview.component.html
+++ b/src/app/components/snapcast-stream-preview/snapcast-stream-preview.component.html
@@ -19,8 +19,11 @@
 
     <div *ngIf="stream.properties.metadata as meta"
       class="d-flex flex-column align-items-center justify-content-center ion-text-center">
-      <img *ngIf="meta.artData as artData" class="cover-image"
+      <img *ngIf="meta.artData as artData; else noBase64" class="cover-image"
         [src]="convertCoverDataBase64(artData.data, artData.extension)" alt="Album Art" />
+      <ng-template #noBase64>
+        <img class="cover-image" src="/assets/streams/default-cover.svg" alt="Default Album Art" />
+      </ng-template>
 
 
       <p>{{ meta.album }}<br>
diff --git a/src/app/pages/setup/ble-wifi-setup/ble-wifi-setup.page.html b/src/app/pages/setup/ble-wifi-setup/ble-wifi-setup.page.html
index 29c744c..fc20a6b 100644
--- a/src/app/pages/setup/ble-wifi-setup/ble-wifi-setup.page.html
+++ b/src/app/pages/setup/ble-wifi-setup/ble-wifi-setup.page.html
@@ -28,10 +28,11 @@
           <div class="ion-margin">
             <ion-text color="medium">
               <p>
-                Plug in your Beatnik. Hold the setup button for 5 seconds until the LED pulses blue. Then tap "Scan
+                Plug in your Beatnik. Make sure you're connected to your home Wi-Fi. Hold the setup button for 5 seconds until the LED pulses blue. Then tap "Scan
                 for
                 Devices".
               </p>
+              <p *ngIf="smartphoneNetworkStatus">Your smartphone is currently {{ smartphoneNetworkStatus.connected ? 'connected' : 'disconnected' }} to {{smartphoneNetworkStatus.connectionType }}</p>
             </ion-text>
           </div>
           <div class="animation-container">
diff --git a/src/app/pages/setup/ble-wifi-setup/ble-wifi-setup.page.ts b/src/app/pages/setup/ble-wifi-setup/ble-wifi-setup.page.ts
index 72e41de..648130f 100644
--- a/src/app/pages/setup/ble-wifi-setup/ble-wifi-setup.page.ts
+++ b/src/app/pages/setup/ble-wifi-setup/ble-wifi-setup.page.ts
@@ -4,6 +4,8 @@ import { NavController } from '@ionic/angular';
 import { firstValueFrom, Observable } from 'rxjs';
 import { BeatnikBlenoService, BleNetwork, WifiStatus } from 'src/app/services/beatnik-bleno.service';
 import Swiper, { SwiperOptions } from 'swiper';
+import { Network, ConnectionStatus } from '@capacitor/network';
+
 
 @Component({
   selector: 'app-ble-wifi-setup',
@@ -35,13 +37,21 @@ export class BleWifiSetupPage implements OnInit {
   private swiperInstance: Swiper | undefined;
   public slideIndex: number = 0;
 
+  smartphoneNetworkStatus: ConnectionStatus | null = null;
+
   constructor(
     private beatikBlenoService: BeatnikBlenoService,
     private router: Router,
     private navCtrl: NavController
   ) { }
 
-  ngOnInit() {
+  async ngOnInit() {
+    this.smartphoneNetworkStatus = await Network.getStatus();
+    console.log('Initial smartphone network status:', this.smartphoneNetworkStatus);
+    Network.addListener('networkStatusChange', status => {
+      console.log('Network status changed', status);
+      this.smartphoneNetworkStatus = status;
+    });
   }
 
   async scanForServices() {
@@ -50,6 +60,7 @@ export class BleWifiSetupPage implements OnInit {
     const result = await this.beatikBlenoService.findAndConnectWithouhtDialog();
     console.log('Scan result:', result);
     this.subsribeToDeviceConnectionStatus();
+    
   }
 
   stopScan() {