summaryrefslogtreecommitdiff
path: root/frontend/src/components/settings
diff options
context:
space:
mode:
Diffstat (limited to 'frontend/src/components/settings')
-rw-r--r--frontend/src/components/settings/pages/general/RemoteDebugging.tsx6
-rw-r--r--frontend/src/components/settings/pages/general/index.tsx2
-rw-r--r--frontend/src/components/settings/pages/plugin_list/index.tsx72
3 files changed, 52 insertions, 28 deletions
diff --git a/frontend/src/components/settings/pages/general/RemoteDebugging.tsx b/frontend/src/components/settings/pages/general/RemoteDebugging.tsx
index 1310263f..3fea0513 100644
--- a/frontend/src/components/settings/pages/general/RemoteDebugging.tsx
+++ b/frontend/src/components/settings/pages/general/RemoteDebugging.tsx
@@ -1,4 +1,4 @@
-import { Field, ToggleField } from 'decky-frontend-lib';
+import { Field, Toggle } from 'decky-frontend-lib';
import { useEffect, useState } from 'react';
import { FaBug } from 'react-icons/fa';
@@ -21,8 +21,8 @@ export default function RemoteDebuggingSettings() {
}
icon={<FaBug style={{ display: 'block' }} />}
>
- <ToggleField
- checked={allowRemoteDebugging}
+ <Toggle
+ value={allowRemoteDebugging}
onChange={(toggleValue) => {
setAllowRemoteDebugging(toggleValue);
if (toggleValue) window.DeckyPluginLoader.callServerMethod('allow_remote_debugging');
diff --git a/frontend/src/components/settings/pages/general/index.tsx b/frontend/src/components/settings/pages/general/index.tsx
index 16add6bc..c6680026 100644
--- a/frontend/src/components/settings/pages/general/index.tsx
+++ b/frontend/src/components/settings/pages/general/index.tsx
@@ -2,7 +2,7 @@ import { DialogButton, Field, TextField } from 'decky-frontend-lib';
import { useState } from 'react';
import { FaShapes } from 'react-icons/fa';
-import { installFromURL } from '../../../store/Store';
+import { installFromURL } from '../../../../store';
import RemoteDebuggingSettings from './RemoteDebugging';
import UpdaterSettings from './Updater';
diff --git a/frontend/src/components/settings/pages/plugin_list/index.tsx b/frontend/src/components/settings/pages/plugin_list/index.tsx
index 3888a52d..4eb89615 100644
--- a/frontend/src/components/settings/pages/plugin_list/index.tsx
+++ b/frontend/src/components/settings/pages/plugin_list/index.tsx
@@ -1,10 +1,16 @@
-import { DialogButton, Menu, MenuItem, showContextMenu, staticClasses } from 'decky-frontend-lib';
-import { FaEllipsisH } from 'react-icons/fa';
+import { DialogButton, Focusable, Menu, MenuItem, showContextMenu } from 'decky-frontend-lib';
+import { useEffect } from 'react';
+import { FaDownload, FaEllipsisH } from 'react-icons/fa';
+import { requestPluginInstall } from '../../../../store';
import { useDeckyState } from '../../../DeckyState';
export default function PluginList() {
- const { plugins } = useDeckyState();
+ const { plugins, updates } = useDeckyState();
+
+ useEffect(() => {
+ window.DeckyPluginLoader.checkPluginUpdates();
+ }, []);
if (plugins.length === 0) {
return (
@@ -16,27 +22,45 @@ export default function PluginList() {
return (
<ul style={{ listStyleType: 'none' }}>
- {plugins.map(({ name }) => (
- <li style={{ display: 'flex', flexDirection: 'row', alignItems: 'center' }}>
- <span>{name}</span>
- <div className={staticClasses.Title} style={{ marginLeft: 'auto', boxShadow: 'none' }}>
- <DialogButton
- style={{ height: '40px', width: '40px', padding: '10px 12px' }}
- onClick={(e: MouseEvent) =>
- showContextMenu(
- <Menu label="Plugin Actions">
- <MenuItem onSelected={() => window.DeckyPluginLoader.importPlugin(name)}>Reload</MenuItem>
- <MenuItem onSelected={() => window.DeckyPluginLoader.uninstallPlugin(name)}>Uninstall</MenuItem>
- </Menu>,
- e.currentTarget ?? window,
- )
- }
- >
- <FaEllipsisH />
- </DialogButton>
- </div>
- </li>
- ))}
+ {plugins.map(({ name, version }) => {
+ const update = updates?.get(name);
+ return (
+ <li style={{ display: 'flex', flexDirection: 'row', alignItems: 'center', paddingBottom: '10px' }}>
+ <span>
+ {name} {version}
+ </span>
+ <Focusable style={{ marginLeft: 'auto', boxShadow: 'none', display: 'flex', justifyContent: 'right' }}>
+ {update && (
+ <DialogButton
+ style={{ height: '40px', minWidth: '60px', marginRight: '10px' }}
+ onClick={() => requestPluginInstall(name, update)}
+ >
+ <div style={{ display: 'flex', flexDirection: 'row' }}>
+ Update to {update.name}
+ <FaDownload style={{ paddingLeft: '2rem' }} />
+ </div>
+ </DialogButton>
+ )}
+ <DialogButton
+ style={{ height: '40px', width: '40px', padding: '10px 12px', minWidth: '40px' }}
+ onClick={(e: MouseEvent) =>
+ showContextMenu(
+ <Menu label="Plugin Actions">
+ <MenuItem onSelected={() => window.DeckyPluginLoader.importPlugin(name, version)}>
+ Reload
+ </MenuItem>
+ <MenuItem onSelected={() => window.DeckyPluginLoader.uninstallPlugin(name)}>Uninstall</MenuItem>
+ </Menu>,
+ e.currentTarget ?? window,
+ )
+ }
+ >
+ <FaEllipsisH />
+ </DialogButton>
+ </Focusable>
+ </li>
+ );
+ })}
</ul>
);
}