feat: implement manual installation functionality for APKs and folders

- Added IPC handlers for showing file and folder pickers to facilitate manual installations.
- Implemented the installManualFile method in the DownloadService to handle APK and folder installations, including validation checks for device connectivity and file existence.
- Enhanced the GamesView component with a menu for manual installation options, providing user feedback during the installation process.
- Introduced a dialog to display installation progress and success/failure messages, improving user experience during manual installations.

Author: jimzrt

AUR/PKGBUILD

@@ -1,7 +1,7 @@
 # Maintainer: jimzrt <jimzrt1@gmail.com>
 
 pkgname=apprenticevr-bin
-pkgver=1.3.1
+pkgver=1.3.2
 pkgrel=1
 pkgdesc="A modern, cross-platform desktop application designed for managing and sideloading content onto Meta Quest devices"
 arch=('x86_64' 'aarch64')

package.json

@@ -1,6 +1,6 @@
 {
   "name": "apprenticevr",
-  "version": "1.3.1",
+  "version": "1.3.2",
   "description": "An Electron application with React and TypeScript",
   "main": "./out/main/index.js",
   "author": "example.com",

src/main/index.ts

@@ -539,6 +539,65 @@ app.whenReady().then(async () => {
     return filePaths[0]
   })
 
+  // Manual installation handlers
+  typedIpcMain.handle('dialog:show-manual-install-picker', async () => {
+    if (!mainWindow) return null
+
+    const { canceled, filePaths } = await dialog.showOpenDialog(mainWindow, {
+      properties: ['openFile', 'openDirectory'],
+      title: 'Select APK file or folder to install',
+      filters: [
+        { name: 'APK Files', extensions: ['apk'] },
+        { name: 'All Files', extensions: ['*'] }
+      ]
+    })
+
+    if (canceled || filePaths.length === 0) {
+      return null
+    }
+
+    return filePaths[0]
+  })
+
+  typedIpcMain.handle('dialog:show-apk-file-picker', async () => {
+    if (!mainWindow) return null
+
+    const { canceled, filePaths } = await dialog.showOpenDialog(mainWindow, {
+      properties: ['openFile'],
+      title: 'Select APK file to install',
+      filters: [
+        { name: 'APK Files', extensions: ['apk'] },
+        { name: 'All Files', extensions: ['*'] }
+      ]
+    })
+
+    if (canceled || filePaths.length === 0) {
+      return null
+    }
+
+    return filePaths[0]
+  })
+
+  typedIpcMain.handle('dialog:show-folder-picker', async () => {
+    if (!mainWindow) return null
+
+    const { canceled, filePaths } = await dialog.showOpenDialog(mainWindow, {
+      properties: ['openDirectory'],
+      title: 'Select folder to install'
+    })
+
+    if (canceled || filePaths.length === 0) {
+      return null
+    }
+
+    return filePaths[0]
+  })
+
+  typedIpcMain.handle('downloads:install-manual', async (_event, filePath, deviceId) => {
+    console.log(`[IPC] Manual install requested for ${filePath} on device ${deviceId}`)
+    return await downloadService.installManualFile(filePath, deviceId)
+  })
+
   // Validate that all IPC channels have handlers registered
   const allHandled = typedIpcMain.validateAllHandlersRegistered()
   if (!allHandled) {

src/main/services/downloadService.ts

@@ -666,6 +666,119 @@ class DownloadService extends EventEmitter implements DownloadAPI {
       throw error // Re-throw so the IPC handler logs it
     }
   }
+
+  public async installManualFile(filePath: string, deviceId: string): Promise<boolean> {
+    console.log(`[Service] Manual install requested for ${filePath} on device ${deviceId}`)
+
+    // Check if the app is connected to the target device
+    const targetDeviceForInstall = this.getTargetDeviceForInstallation()
+    if (!targetDeviceForInstall) {
+      console.error(
+        `[Service installManualFile] App is not connected to any device. Cannot install ${filePath}.`
+      )
+      return false
+    }
+
+    if (targetDeviceForInstall !== deviceId) {
+      console.error(
+        `[Service installManualFile] App is connected to ${targetDeviceForInstall} but installation requested for ${deviceId}.`
+      )
+      return false
+    }
+
+    // Check if the target device is still connected and authorized at the ADB level
+    try {
+      const devices = await this.adbService.listDevices()
+      const targetDevice = devices.find((d) => d.id === deviceId && d.type === 'device')
+      if (!targetDevice) {
+        console.error(
+          `[Service installManualFile] Target device ${deviceId} not found or not authorized at ADB level.`
+        )
+        return false
+      }
+    } catch (err) {
+      console.error(`[Service installManualFile] Error verifying target device ${deviceId}:`, err)
+      return false
+    }
+
+    // Check if the file/folder exists
+    if (!existsSync(filePath)) {
+      console.error(`[Service installManualFile] File/folder not found: ${filePath}`)
+      return false
+    }
+
+    try {
+      const stats = await fs.stat(filePath)
+
+      if (stats.isFile() && filePath.toLowerCase().endsWith('.apk')) {
+        // Single APK file installation
+        console.log(`[Service installManualFile] Installing single APK: ${filePath}`)
+        const success = await this.adbService.installPackage(deviceId, filePath, {
+          flags: ['-r', '-g']
+        })
+        if (success) {
+          console.log(`[Service installManualFile] Successfully installed APK: ${filePath}`)
+          this.emit('installation:success', deviceId)
+        }
+        return success
+      } else if (stats.isDirectory()) {
+        // Folder installation - create a temporary DownloadItem to use existing installation logic
+        console.log(`[Service installManualFile] Installing folder: ${filePath}`)
+
+        // Generate a unique identifier for this manual installation
+        const manualId = `manual-${Date.now()}-${Math.random().toString(36).substring(2, 9)}`
+
+        // Try to extract package name from folder structure if possible
+        let packageName = ''
+        try {
+          const folderContents = await fs.readdir(filePath)
+          const apkFiles = folderContents.filter((f) => f.toLowerCase().endsWith('.apk'))
+          if (apkFiles.length > 0) {
+            // Look for potential package directory (common pattern in extracted games)
+            const potentialPackageDirs = folderContents.filter((item) => {
+              // Common package name patterns
+              return item.includes('.') && !item.includes(' ') && item.length > 5
+            })
+            if (potentialPackageDirs.length === 1) {
+              packageName = potentialPackageDirs[0]
+            }
+          }
+        } catch (error) {
+          console.log(`[Service installManualFile] Could not analyze folder structure: ${error}`)
+        }
+
+        // Create a temporary DownloadItem
+        const tempItem: DownloadItem = {
+          gameId: manualId,
+          releaseName: manualId,
+          packageName: packageName,
+          gameName: `Manual Install: ${filePath.split(/[/\\]/).pop()}`,
+          status: 'Completed',
+          progress: 100,
+          extractProgress: 100,
+          addedDate: Date.now(),
+          downloadPath: filePath
+        }
+
+        // Use the installation processor to handle the folder
+        const success = await this.installationProcessor.startInstallation(tempItem, deviceId)
+        if (success) {
+          console.log(`[Service installManualFile] Successfully installed folder: ${filePath}`)
+          this.emit('installation:success', deviceId)
+        }
+        return success
+      } else {
+        console.error(`[Service installManualFile] Unsupported file type: ${filePath}`)
+        return false
+      }
+    } catch (error) {
+      console.error(
+        `[Service installManualFile] Error during manual installation of ${filePath}:`,
+        error
+      )
+      return false
+    }
+  }
 }
 
 export default new DownloadService()

src/preload/index.ts

@@ -114,6 +114,8 @@ const api = {
       typedIpcRenderer.invoke('download:delete-files', releaseName),
     installFromCompleted: (releaseName: string, deviceId: string): Promise<void> =>
       typedIpcRenderer.invoke('download:install-from-completed', releaseName, deviceId),
+    installManualFile: (filePath: string, deviceId: string): Promise<boolean> =>
+      typedIpcRenderer.invoke('downloads:install-manual', filePath, deviceId),
     onQueueUpdated: (callback: (queue: DownloadItem[]) => void): (() => void) => {
       const listener = (_: IpcRendererEvent, queue: DownloadItem[]): void => callback(queue)
       typedIpcRenderer.on('download:queue-updated', listener)
@@ -236,7 +238,13 @@ const api = {
       typedIpcRenderer.invoke('dialog:show-directory-picker'),
     showFilePicker: (options?: {
       filters?: { name: string; extensions: string[] }[]
-    }): Promise<string | null> => typedIpcRenderer.invoke('dialog:show-file-picker', options)
+    }): Promise<string | null> => typedIpcRenderer.invoke('dialog:show-file-picker', options),
+    showManualInstallPicker: (): Promise<string | null> =>
+      typedIpcRenderer.invoke('dialog:show-manual-install-picker'),
+    showApkFilePicker: (): Promise<string | null> =>
+      typedIpcRenderer.invoke('dialog:show-apk-file-picker'),
+    showFolderPicker: (): Promise<string | null> =>
+      typedIpcRenderer.invoke('dialog:show-folder-picker')
   },
   // WiFi bookmarks API
   wifiBookmarks: {

src/renderer/src/assets/games-view.css

@@ -41,8 +41,8 @@
   display: flex;
   justify-content: space-between;
   align-items: center;
-  margin-bottom: 16px;
-  padding-bottom: 12px;
+  margin-bottom: 8px;
+  padding-bottom: 8px;
   border-bottom: 1px solid #e0e0e0;
   flex-shrink: 0; /* Prevent toolbar from shrinking */
 }
@@ -153,12 +153,14 @@
   display: flex;
   align-items: center;
   gap: 16px;
+  /* move to the right */
+  margin-left: auto;
 }
 
 .table-wrapper {
   overflow-y: auto; /* Make table body scrollable */
   flex-grow: 1;
-  margin-top: 16px;
+  margin-top: 8px;
   border: 1px solid var(--colorNeutralForeground2);
   border-radius: 4px;
   position: relative; /* Added: Needed for absolute positioning of children like popover */

src/renderer/src/components/AppLayout.tsx

@@ -62,7 +62,7 @@ const useStyles = makeStyles({
   header: {
     display: 'flex',
     alignItems: 'center',
-    padding: `${tokens.spacingVerticalL} ${tokens.spacingHorizontalL}`,
+    padding: `${tokens.spacingVerticalNone} ${tokens.spacingHorizontalL}`,
     borderBottom: `${tokens.strokeWidthThin} solid ${tokens.colorNeutralStroke1}`,
     backgroundColor: tokens.colorNeutralBackground3,
     gap: tokens.spacingHorizontalM,