diff --git a/resources/views/livewire/studio/manage/order/index.blade.php b/resources/views/livewire/studio/manage/order/index.blade.php
index 58a1762..288d98c 100644
--- a/resources/views/livewire/studio/manage/order/index.blade.php
+++ b/resources/views/livewire/studio/manage/order/index.blade.php
@@ -21,10 +21,10 @@
                     </div>
                 </template>
                 <template x-if="isConnected">
-                    <div
-                        class="ms-2 flex items-center gap-2 text-green-600 bg-green-50 px-3 py-1 rounded-lg border border-green-200">
-                        <flux:icon.check-circle class="size-4" />
-                        <span class="text-sm font-medium">Printer Connected</span>
+                    <div class="flex gap-2 ms-2">
+                        <flux:button variant="primary" color="red" wire:click="$dispatch('disconnectPrinter')">
+                            Disconnect
+                        </flux:button>
                     </div>
                 </template>
             </div>
@@ -127,6 +127,44 @@ class="ms-2 flex items-center gap-2 text-green-600 bg-green-50 px-3 py-1 rounded
                 }
             });
 
+            Livewire.on('disconnectPrinter', async (event) => {
+                try {
+                    // Clear USB connection
+                    if (window.printerDevice) {
+                        try {
+                            await window.printerDevice.close();
+                        } catch (err) {
+                            console.log('Error closing USB device:', err);
+                        }
+                        window.printerDevice = null;
+                    }
+
+                    // Clear Bluetooth connection
+                    if (window.btCharacteristic) {
+                        try {
+                            await window.btCharacteristic.service.device.gatt.disconnect();
+                        } catch (err) {
+                            console.log('Error disconnecting Bluetooth:', err);
+                        }
+                        window.btCharacteristic = null;
+                    }
+
+                    // Clear localStorage
+                    localStorage.removeItem('printerDevice');
+                    localStorage.removeItem('btPrinterDevice');
+
+                    console.log('Printer disconnected');
+                    window.dispatchEvent(new CustomEvent('printer-status-change', {
+                        detail: {
+                            connected: false
+                        }
+                    }));
+
+                } catch (err) {
+                    console.error('Gagal disconnect printer:', err);
+                }
+            });
+
             Livewire.on('connectBluetooth', async (event) => {
                 try {
                     const device = await navigator.bluetooth.requestDevice({
@@ -302,8 +340,8 @@ function getMaxChar(widthMM) {
 
                 // Close modal
                 // Assuming Flux handles close on click or we dispatch close
-                // We will try to close it via dispatching 'close-modal' if configured, but Flux 
-                // buttons inside modal might need `data-flux-close` or similar? 
+                // We will try to close it via dispatching 'close-modal' if configured, but Flux
+                // buttons inside modal might need `data-flux-close` or similar?
                 // The provided code used $dispatch('modal-close') which might be custom.
                 // We will proceed to print.