Skip to content

Commit

Permalink
Ready for v0.10.0
Browse files Browse the repository at this point in the history
  • Loading branch information
@ItsRiprod
ItsRiprod committed Dec 9, 2024
1 parent ebf9fde commit cd62999
Show file tree
Hide file tree
Showing 2 changed files with 2 additions and 209 deletions.
210 changes: 2 additions & 208 deletions DeskThingServer/src/renderer/src/overlays/apps/AppSettings.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,13 +1,9 @@
import React, { useEffect, useState, useCallback, useMemo } from 'react'
import { useAppStore } from '@renderer/stores'
import { AppDataInterface, SettingOption, SettingsString, SettingsType } from '@shared/types'
import { AppDataInterface } from '@shared/types'
import { AppSettingProps } from './AppsOverlay'
import Button from '@renderer/components/Button'
import { IconLoading, IconSave, IconToggle } from '@renderer/assets/icons'
import Select from '@renderer/components/Select'
import { MultiValue, SingleValue } from 'react-select'
import RankableList from '@renderer/components/RankableList'
import TagList from '@renderer/components/TagList'
import { IconLoading, IconSave } from '@renderer/assets/icons'
import Settings from '@renderer/components/settings'

const AppSettings: React.FC<AppSettingProps> = ({ app }) => {
Expand Down Expand Up @@ -47,172 +43,6 @@ const AppSettings: React.FC<AppSettingProps> = ({ app }) => {
[]
)

const clampValue = (value: number, min?: number, max?: number): number => {
if (min !== undefined && value < min) return min
if (max !== undefined && value > max) return max
return value
}

const renderSettingInput = useCallback(
(setting: SettingsType, key: string) => {
const commonClasses =
'mt-1 block px-3 py-2 bg-zinc-900 border border-zinc-700 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm'

switch (setting.type || '') {
case 'string':
return (
<SettingComponent key={key} setting={setting}>
<div className="flex items-center w-full">
<input
type="text"
value={setting.value as string}
maxLength={(setting as SettingsString).maxLength}
onChange={(e) => handleSettingChange(key, e.target.value)}
className={commonClasses + ' w-96 max-w-s'}
/>
</div>
</SettingComponent>
)
case 'number':
return (
<SettingComponent key={key} setting={setting}>
<div>
{setting.type == 'number' && (
<input
type="number"
value={setting.value as number}
min={setting.min}
max={setting.max}
onChange={(e) => {
let inputValue = Number(e.target.value)
inputValue = clampValue(inputValue, setting.min, setting.max)
handleSettingChange(key, inputValue)
}}
className={commonClasses}
/>
)}
</div>
</SettingComponent>
)
case 'boolean':
return (
<SettingComponent key={key} setting={setting}>
<Button onClick={() => handleSettingChange(key, !setting.value)}>
<IconToggle
iconSize={48}
checked={setting.value as boolean}
className={`${setting.value ? 'text-green-500' : 'text-gray-500'} w-full h-full`}
/>
</Button>
</SettingComponent>
)
case 'range':
return (
<SettingComponent key={key} setting={setting}>
{setting.type == 'range' && (
<input
type="range"
value={setting.value}
min={setting.min}
max={setting.max}
step={setting.step || 1}
onChange={(e) => handleSettingChange(key, e.target.value)}
className="w-96 max-w-s"
/>
)}
</SettingComponent>
)
case 'select':
return (
<SettingComponent key={key} setting={setting}>
{setting.type == 'select' && (
<div className="w-96 max-w-s">
<Select
options={setting.options}
placeholder={setting.placeholder ?? ''}
value={setting.value}
onChange={(selected) => {
const selectedValue = selected as SingleValue<SettingOption>
handleSettingChange(key, selectedValue!.value)
}}
/>
</div>
)}
</SettingComponent>
)
case 'multiselect':
return (
<SettingComponent key={key} setting={setting}>
{setting.type == 'multiselect' && (
<div className="w-96 max-w-s">
<Select
options={setting.options}
value={setting.value}
isMulti={true}
placeholder={setting.placeholder ?? 'Select...'}
onChange={(selected) => {
const selectedValues = selected as MultiValue<SettingOption>
const currentValues = selectedValues.map((value) => value.value)
handleSettingChange(key, currentValues)
}}
/>
</div>
)}
</SettingComponent>
)
case 'list':
return (
<SettingComponent key={key} setting={setting}>
{setting.type == 'list' && (
<div className="w-96 max-w-s">
<TagList
value={setting.value}
onChange={(values) => handleSettingChange(key, values)}
orderable={setting.orderable}
unique={setting.unique}
maxValues={setting.maxValues}
placeholder={setting.placeholder}
/>
</div>
)}
</SettingComponent>
)
case 'ranked':
return (
<SettingComponent key={key} setting={setting}>
{setting.type == 'ranked' && (
<div className="w-96 max-w-s">
<RankableList
options={setting.options}
value={setting.value}
onChange={(rankedValues) => {
handleSettingChange(key, rankedValues)
}}
/>
</div>
)}
</SettingComponent>
)
default:
return (
<SettingComponent key={key} setting={setting}>
<div className="flex flex-col space-y-2">
{(
setting as SettingsType & { options?: Array<{ value: string; label: string }> }
).options?.map((option, index) => (
<div key={index} className="flex items-center">
<span className="text-sm text-gray-600">{option.label}: </span>
<span className="ml-2 text-sm font-medium">{option.value.toString()}</span>
</div>
))}
</div>
</SettingComponent>
)
}
},
[handleSettingChange]
)

const settingsEntries = useMemo(
() => (appData?.settings ? Object.entries(appData.settings) : []),
[appData]
Expand Down Expand Up @@ -255,39 +85,3 @@ const AppSettings: React.FC<AppSettingProps> = ({ app }) => {
)
}
export default AppSettings

interface SettingComponentProps {
setting: SettingsType
children?: React.ReactNode
className?: string
}
const SettingComponent = ({ setting, children, className }: SettingComponentProps): JSX.Element => {
return (
<div
className={`py-3 flex gap-3 items-center hover:bg-zinc-950 justify-between w-full border-t relative border-gray-900 ${className}`}
>
<div className="w-full flex-1">
<div className="text-xs text-gray-500 font-geistMono absolute -top-2 inset flex justify-between w-full">
<p>{setting.type?.toUpperCase() || 'Legacy Setting'}</p>
{setting.type === 'number' && (
<p>
MIN: {setting.min} | MAX: {setting.max}
</p>
)}
</div>
<div className="group relative flex flex-wrap w-full">
<p className="py-3 cursor-help break-words max-w-xs">{setting.label}</p>
{setting.description && (
<div className="absolute left-0 -bottom-1 translate-y-full invisible group-hover:visible bg-zinc-800 text-sm text-gray-300 px-2 py-1 rounded-md whitespace-normal max-w-xs z-10">
{setting.description}
</div>
)}
</div>
</div>
<div className="flex flex-col items-center">
{setting.type === 'range' && <div>{setting.value}</div>}
{children}
</div>
</div>
)
}
1 change: 0 additions & 1 deletion DeskThingServer/src/renderer/src/pages/Clients/Mapping/pages/TrayPage.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,6 @@ import useMappingStore from '@renderer/stores/mappingStore'
import { Key } from '@shared/types'
import { ActionIcon } from '../components/ActionIcon'
import Button from '@renderer/components/Button'
import { IconArrowDown, IconLink, IconMusic } from '@renderer/assets/icons'

const keyList: string[] = ['Tray1', 'Tray2', 'Tray3', 'Tray4', 'Tray5', 'Tray6']

Expand Down

0 comments on commit cd62999

Please sign in to comment.