diff options
Diffstat (limited to 'frontend/src/components/settings/pages/general')
5 files changed, 63 insertions, 46 deletions
diff --git a/frontend/src/components/settings/pages/general/BranchSelect.tsx b/frontend/src/components/settings/pages/general/BranchSelect.tsx index 27db6229..5387b655 100644 --- a/frontend/src/components/settings/pages/general/BranchSelect.tsx +++ b/frontend/src/components/settings/pages/general/BranchSelect.tsx @@ -19,7 +19,7 @@ const BranchSelect: FunctionComponent<{}> = () => { return ( // Returns numerical values from 0 to 2 (with current branch setup as of 8/28/22) // 0 being stable, 1 being pre-release and 2 being nightly - <Field label="Update Channel"> + <Field label="Decky Update Channel" childrenContainerWidth={'fixed'}> <Dropdown rgOptions={Object.values(UpdateBranch) .filter((branch) => typeof branch == 'string') diff --git a/frontend/src/components/settings/pages/general/RemoteDebugging.tsx b/frontend/src/components/settings/pages/general/RemoteDebugging.tsx index 36badf45..db604c69 100644 --- a/frontend/src/components/settings/pages/general/RemoteDebugging.tsx +++ b/frontend/src/components/settings/pages/general/RemoteDebugging.tsx @@ -1,5 +1,5 @@ import { Field, Toggle } from 'decky-frontend-lib'; -import { FaBug } from 'react-icons/fa'; +import { FaChrome } from 'react-icons/fa'; import { useSetting } from '../../../../utils/hooks/useSetting'; @@ -11,10 +11,10 @@ export default function RemoteDebuggingSettings() { label="Allow Remote CEF Debugging" description={ <span style={{ whiteSpace: 'pre-line' }}> - Allow unauthenticated access to the CEF debugger to anyone in your network + Allows unauthenticated access to the CEF debugger to anyone in your network. </span> } - icon={<FaBug style={{ display: 'block' }} />} + icon={<FaChrome style={{ display: 'block' }} />} > <Toggle value={allowRemoteDebugging || false} diff --git a/frontend/src/components/settings/pages/general/StoreSelect.tsx b/frontend/src/components/settings/pages/general/StoreSelect.tsx index c24bacb9..40e70301 100644 --- a/frontend/src/components/settings/pages/general/StoreSelect.tsx +++ b/frontend/src/components/settings/pages/general/StoreSelect.tsx @@ -16,7 +16,7 @@ const StoreSelect: FunctionComponent<{}> = () => { // 0 being Default, 1 being Testing and 2 being Custom return ( <> - <Field label="Store Channel"> + <Field label="Plugin Store Channel" childrenContainerWidth={'fixed'}> <Dropdown rgOptions={Object.values(Store) .filter((store) => typeof store == 'string') diff --git a/frontend/src/components/settings/pages/general/Updater.tsx b/frontend/src/components/settings/pages/general/Updater.tsx index f617e0ff..b38b6d01 100644 --- a/frontend/src/components/settings/pages/general/Updater.tsx +++ b/frontend/src/components/settings/pages/general/Updater.tsx @@ -11,7 +11,7 @@ import { import { useCallback } from 'react'; import { Suspense, lazy } from 'react'; import { useEffect, useState } from 'react'; -import { FaArrowDown } from 'react-icons/fa'; +import { FaExclamation } from 'react-icons/fa'; import { VerInfo, callUpdaterMethod, finishUpdate } from '../../../../updater'; import { findSP } from '../../../../utils/windows'; @@ -95,21 +95,21 @@ export default function UpdaterSettings() { <Field onOptionsActionDescription={versionInfo?.all ? 'Patch Notes' : undefined} onOptionsButton={versionInfo?.all ? showPatchNotes : undefined} - label="Updates" + label="Decky Updates" description={ - versionInfo && ( - <span style={{ whiteSpace: 'pre-line' }}>{`Current version: ${versionInfo.current}\n${ - versionInfo.updatable ? `Latest version: ${versionInfo.remote?.tag_name}` : '' - }`}</span> + checkingForUpdates || versionInfo?.remote?.tag_name != versionInfo?.current || !versionInfo?.remote ? ( + '' + ) : ( + <span>Up to date: running {versionInfo?.current}</span> ) } icon={ - !versionInfo ? ( - <Spinner style={{ width: '1em', height: 20, display: 'block' }} /> - ) : ( - <FaArrowDown style={{ display: 'block' }} /> + versionInfo?.remote && + versionInfo?.remote?.tag_name != versionInfo?.current && ( + <FaExclamation color="var(--gpColor-Yellow)" style={{ display: 'block' }} /> ) } + childrenContainerWidth={'fixed'} > {updateProgress == -1 && !isLoaderUpdating ? ( <DialogButton @@ -144,7 +144,7 @@ export default function UpdaterSettings() { /> )} </Field> - {versionInfo?.remote && ( + {versionInfo?.remote && versionInfo?.remote?.tag_name != versionInfo?.current && ( <InlinePatchNotes title={versionInfo?.remote.name} date={new Intl.RelativeTimeFormat('en-US', { diff --git a/frontend/src/components/settings/pages/general/index.tsx b/frontend/src/components/settings/pages/general/index.tsx index d661b779..e0bd9691 100644 --- a/frontend/src/components/settings/pages/general/index.tsx +++ b/frontend/src/components/settings/pages/general/index.tsx @@ -1,10 +1,17 @@ -import { DialogButton, Field, TextField, Toggle } from 'decky-frontend-lib'; +import { + DialogBody, + DialogButton, + DialogControlsSection, + DialogControlsSectionHeader, + Field, + TextField, + Toggle, +} from 'decky-frontend-lib'; import { useState } from 'react'; -import { FaShapes, FaTools } from 'react-icons/fa'; import { installFromURL } from '../../../../store'; +import { useDeckyState } from '../../../DeckyState'; import BranchSelect from './BranchSelect'; -import RemoteDebuggingSettings from './RemoteDebugging'; import StoreSelect from './StoreSelect'; import UpdaterSettings from './Updater'; @@ -16,34 +23,44 @@ export default function GeneralSettings({ setIsDeveloper: (val: boolean) => void; }) { const [pluginURL, setPluginURL] = useState(''); + const { versionInfo } = useDeckyState(); return ( - <div> - <UpdaterSettings /> - <BranchSelect /> - <StoreSelect /> - <RemoteDebuggingSettings /> - <Field - label="Developer mode" - description={<span style={{ whiteSpace: 'pre-line' }}>Enables Decky's developer settings.</span>} - icon={<FaTools style={{ display: 'block' }} />} - > - <Toggle - value={isDeveloper} - onChange={(toggleValue) => { - setIsDeveloper(toggleValue); - }} - /> - </Field> - <Field - label="Manual plugin install" - description={<TextField label={'URL'} value={pluginURL} onChange={(e) => setPluginURL(e?.target.value)} />} - icon={<FaShapes style={{ display: 'block' }} />} - > - <DialogButton disabled={pluginURL.length == 0} onClick={() => installFromURL(pluginURL)}> - Install - </DialogButton> - </Field> - </div> + <DialogBody> + <DialogControlsSection> + <DialogControlsSectionHeader>Updates</DialogControlsSectionHeader> + <UpdaterSettings /> + </DialogControlsSection> + <DialogControlsSection> + <DialogControlsSectionHeader>Beta Participation</DialogControlsSectionHeader> + <BranchSelect /> + <StoreSelect /> + </DialogControlsSection> + <DialogControlsSection> + <DialogControlsSectionHeader>Other</DialogControlsSectionHeader> + <Field label="Enable Developer Mode"> + <Toggle + value={isDeveloper} + onChange={(toggleValue) => { + setIsDeveloper(toggleValue); + }} + /> + </Field> + <Field + label="Install plugin from URL" + description={<TextField label={'URL'} value={pluginURL} onChange={(e) => setPluginURL(e?.target.value)} />} + > + <DialogButton disabled={pluginURL.length == 0} onClick={() => installFromURL(pluginURL)}> + Install + </DialogButton> + </Field> + </DialogControlsSection> + <DialogControlsSection> + <DialogControlsSectionHeader>About</DialogControlsSectionHeader> + <Field label="Decky Version" focusable={true}> + <div style={{ color: 'var(--gpSystemLighterGrey)' }}>{versionInfo?.current}</div> + </Field> + </DialogControlsSection> + </DialogBody> ); } |