Added FILE setting type + RANGE slider fix

Author: ItsRiprod

DeskThingServer/package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "deskthing",
-  "version": "0.11.9",
+  "version": "0.11.10",
   "description": "A DeskThing server UI to interface with the DeskThing car thing app",
   "main": "./out/main/index.js",
   "author": "Riprod",
@@ -51,7 +51,7 @@
     "zustand": "^5.0.0-rc.2"
   },
   "devDependencies": {
-    "@deskthing/types": "^0.11.8",
+    "@deskthing/types": "^0.11.11",
     "@electron-toolkit/eslint-config-prettier": "^3.0.0",
     "@electron-toolkit/eslint-config-ts": "^3.0.0",
     "@electron-toolkit/preload": "^3.0.1",

DeskThingServer/package.json

@@ -18,7 +18,8 @@ import {
   AppDataInterface,
   PlatformTypes,
   TagTypes,
-  AppLatestJSONLatest
+  AppLatestJSONLatest,
+  SettingsFile
 } from '@deskthing/types'
 import { AppData, LegacyAppData } from '@shared/types'
 
@@ -97,6 +98,8 @@ export const isValidSettings: (setting: unknown) => asserts setting is SettingsT
       if (typeof typedSetting.value !== 'string')
         throw new Error('[isValidSetting] Color setting value must be a string')
       break
+    case SETTING_TYPES.FILE:
+      break
     default:
       throw new Error(`[isValidSetting] Invalid setting type: ${JSON.stringify(typedSetting)}`)
   }
@@ -199,6 +202,15 @@ export const sanitizeSettings: (setting: Partial<SettingsType>) => SettingsType
         description: setting.description || ''
       } as SettingsColor
       break
+    case SETTING_TYPES.FILE:
+      setting = {
+        type: SETTING_TYPES.FILE,
+        value: setting.value,
+        label: setting.label,
+        description: setting.description || '',
+        fileTypes: setting.fileTypes || []
+      } as SettingsFile
+      break
     default:
       throw new Error(`[isValidSetting] Unknown setting type: ${setting}`)
   }

DeskThingServer/src/main/services/apps/appValidator.ts

@@ -69,6 +69,12 @@ export const utilityHandler: {
         return await supporterStore.fetchSupporters(data.payload)
     }
   },
+  [IPC_UTILITY_TYPES.OPEN_DIALOG]: async (data) => {
+    switch (data.type) {
+      case IPC_UTILITY_TYPES.OPEN_DIALOG:
+        return await dialog.showOpenDialog(data.payload)
+    }
+  },
   // [IPC_UTILITY_TYPES.GITHUB]: async (data) => {
   //   const releaseStore = await storeProvider.getStore('releaseStore')
   //   switch (data.request) {

DeskThingServer/src/main/services/ipc/utilityIpc.ts

@@ -316,9 +316,8 @@ export const addRepositoryUrl = async (
 
     const githubReleases = await githubStore.getAllReleases(validatedUrl)
 
-    const latestGithubRelease = githubReleases[0]
-
-    const latestJson = findJsonAsset(latestGithubRelease, appId || 'latest')
+    const latestJson = findFirstJsonAsset(githubReleases, appId || 'latest')
+    const firstZipAsset = findFirstZipAsset(githubReleases, appId || 'latest')
 
     // Handle the recovery with the file
     if (!latestJson) {
@@ -367,6 +366,10 @@ export const addRepositoryUrl = async (
       const pastReleases = collectPastReleases(githubReleases, migratedRelease.appManifest.id)
       const totalDownloads = pastReleases.reduce((sum, release) => sum + release.downloads, 0)
 
+      if (firstZipAsset) {
+        migratedRelease.downloads = firstZipAsset.download_count
+      }
+
       const appServer: AppLatestServer = {
         id: migratedRelease.appManifest.id,
         type: 'app',
@@ -390,6 +393,10 @@ export const addRepositoryUrl = async (
       const pastReleases = collectPastReleases(githubReleases, migratedRelease.clientManifest.id)
       const totalDownloads = pastReleases.reduce((sum, release) => sum + release.downloads, 0)
 
+      if (firstZipAsset) {
+        migratedRelease.downloads = firstZipAsset.download_count
+      }
+
       const clientServer: ClientLatestServer = {
         id: migratedRelease.clientManifest.id,
         type: 'client',
@@ -607,6 +614,22 @@ export const findZipAsset = (release: GithubRelease, appId: string): GithubAsset
   )
 }
 
+export const findAllZipAssets = (
+  release: GithubRelease,
+  appId: string
+): GithubAsset[] | undefined => {
+  // This ensures the latest (if there are multiple similar ones) is always chosen first
+  const sortedAssets = release.assets.sort(
+    (a, b) => new Date(b.created_at).getTime() - new Date(a.created_at).getTime()
+  )
+
+  // This may inflate apps that have multiple types (i.e. weather will have all weather assets AND all weatherwaves assets )
+  return sortedAssets.filter(
+    (asset) =>
+      asset.name.includes(appId) && (asset.name.endsWith('.zip') || asset.name.endsWith('.tar.gz'))
+  )
+}
+
 type ConversionReturnData =
   | { repos: string[]; type: 'converted-clients'; releases: ClientLatestServer[] }
   | { repos: string[]; type: 'converted-apps'; releases: AppLatestServer[] }
@@ -704,7 +727,7 @@ export const convertIdToReleaseServer = async (
   // Find first release containing the app ID
 
   const firstJsonAsset = findFirstJsonAsset(ghReleases, appId)
-
+  const firstZipAsset = findFirstZipAsset(ghReleases, appId)
   let mainRelease: AppLatestJSONLatest | ClientLatestJSONLatest | MultiReleaseJSONLatest
 
   // This will split the logic between migration logic and up-to-date logic
@@ -748,6 +771,8 @@ export const convertIdToReleaseServer = async (
   // Calculate total downloads
   const totalDownloads = pastReleases.reduce((sum, release) => sum + release.downloads, 0)
 
+  if (firstZipAsset) mainRelease.downloads = firstZipAsset.download_count
+
   // This is the way it must be done for type-safety despite the fact that it is the same as just a single return - oh well
   if (mainRelease.meta_type === 'app') {
     return {
@@ -772,21 +797,21 @@ export const convertIdToReleaseServer = async (
 
 export const collectPastReleases = (
   ghReleases: GithubRelease[],
-  appId: string
+  fileId: string
 ): PastReleaseInfo[] => {
   return ghReleases.flatMap((release) => {
-    const zipAsset = findZipAsset(release, appId)
-    if (!zipAsset) return []
+    const zipAssets = findAllZipAssets(release, fileId)
+    if (!zipAssets) return []
 
-    return [
-      {
+    return zipAssets.map((zipAsset) => {
+      return {
         tag: release.tag_name,
         downloads: zipAsset.download_count,
         size: zipAsset.size,
         name: zipAsset.name,
         download_url: zipAsset.browser_download_url,
         created_at: release.created_at
       }
-    ]
+    })
   })
 }

DeskThingServer/src/main/services/releases/releaseUtils.ts

@@ -17,7 +17,7 @@ import {
   UtilityHandlerReturnMap
 } from '@shared/types'
 import { PaginatedResponse, SupporterData, SupporterFetchOptions } from '@shared/types/supporter'
-import { ipcRenderer } from 'electron'
+import { ipcRenderer, OpenDialogOptions, OpenDialogReturnValue } from 'electron'
 
 export const utility = {
   ping: async (): Promise<string> =>
@@ -81,6 +81,13 @@ export const utility = {
       type: IPC_UTILITY_TYPES.ZIP
     }),
 
+  showOpenDialog: async (options: OpenDialogOptions): Promise<OpenDialogReturnValue> =>
+    await sendCommand({
+      kind: IPC_HANDLERS.UTILITY,
+      type: IPC_UTILITY_TYPES.OPEN_DIALOG,
+      payload: options
+    }),
+
   refreshFirewall: async (): Promise<void> =>
     await sendCommand({
       kind: IPC_HANDLERS.UTILITY,

DeskThingServer/src/preload/api/ipcUtility.ts

@@ -0,0 +1,70 @@
+import React from 'react'
+import SettingComponent from './SettingComponent'
+import { SettingsFile } from '@deskthing/types'
+import { IconFolderOpen } from '@renderer/assets/icons'
+
+interface SettingsFileProps {
+  setting: SettingsFile
+  handleSettingChange: (value: number | boolean | string | string[]) => void
+  className?: string
+}
+
+const commonClasses =
+  'px-3 py-2 text-black bg-white border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500'
+const buttonClasses = 'px-3 py-2 rounded-md mx-1'
+
+/**
+ * A React component that renders a settings file input with file selection button.
+ *
+ * @param props - The component props.
+ * @param props.setting - The settings file object, containing the value, fileTypes, and other properties.
+ * @param props.handleSettingChange - A function to handle changes to the settings file value.
+ * @param props.className - An optional CSS class name to apply to the component.
+ */
+export const SettingsFileComponent: React.FC<SettingsFileProps> = ({
+  className,
+  setting,
+  handleSettingChange
+}) => {
+  const handleFileSelect = async (): Promise<void> => {
+    try {
+      const result = await window.electron.utility.showOpenDialog({
+        properties: ['openFile'],
+        filters:
+          setting.fileTypes?.map((type) => ({
+            name: type.name,
+            extensions: type.extensions
+          })) || []
+      })
+      if (!result.canceled && result.filePaths.length > 0) {
+        handleSettingChange(result.filePaths[0])
+      }
+    } catch (error) {
+      console.error('Error selecting file:', error)
+    }
+  }
+
+  return (
+    <SettingComponent setting={setting} className={className}>
+      <div className="flex items-center">
+        {setting.type === 'file' && (
+          <>
+            <input
+              type="text"
+              value={setting.value as string}
+              readOnly
+              placeholder={setting.placeholder || 'Select a file...'}
+              className={`${commonClasses} flex-grow`}
+            />
+            <button
+              onClick={handleFileSelect}
+              className={`${buttonClasses} border border-emerald-500 text-white hover:bg-emerald-600`}
+            >
+              <IconFolderOpen />
+            </button>
+          </>
+        )}
+      </div>
+    </SettingComponent>
+  )
+}

DeskThingServer/src/renderer/src/components/ReleaseComponent.tsx

@@ -29,7 +29,7 @@ export const SettingsRangeComponent: React.FC<SettingsRangeProps> = ({
           min={setting.min}
           max={setting.max}
           step={setting.step || 1}
-          onChange={(e) => handleSettingChange(e.target.value)}
+          onChange={(e) => handleSettingChange(Number(e.target.value))}
           className="w-96 max-w-s"
         />
       )}

DeskThingServer/src/renderer/src/components/settings/SettingFile.tsx

@@ -9,6 +9,7 @@ import { SettingsRankedComponent } from './SettingsRanked'
 import { SettingsSelectComponent } from './SettingsSelect'
 import { SettingsStringComponent } from './SettingsString'
 import { SettingsColorComponent } from './SettingsColor'
+import { SettingsFileComponent } from './SettingFile'
 
 export interface SettingsProps {
   setting: SettingsType
@@ -31,7 +32,8 @@ const SETTINGS_COMPONENTS: {
   ranked: SettingsRankedComponent,
   select: SettingsSelectComponent,
   string: SettingsStringComponent,
-  color: SettingsColorComponent
+  color: SettingsColorComponent,
+  file: SettingsFileComponent
 } as const
 
 /**