aljaz/goose
1
0
Fork 0
mirror of https://github.com/aljazceru/goose.git synced 2025-12-19 23:24:23 +01:00
Code Issues Packages Projects Releases Wiki Activity

feat: Adjust UX of extension installs in V2 settings (#1836)

Browse Source
This commit is contained in:
Alex Hancock
2025-03-24 16:32:33 -04:00
committed by GitHub
parent 7d4a11b0c8
commit dcec85f98a
2 changed files with 28 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
ui/desktop/src/App.tsx
View File

@@ -58,7 +58,6 @@ export default function App() {
const [modalVisible, setModalVisible] = useState(false); const [modalVisible, setModalVisible] = useState(false);
const [pendingLink, setPendingLink] = useState<string | null>(null); const [pendingLink, setPendingLink] = useState<string | null>(null);
const [modalMessage, setModalMessage] = useState<string>(''); const [modalMessage, setModalMessage] = useState<string>('');
const [isInstalling, setIsInstalling] = useState(false);
const [{ view, viewOptions }, setInternalView] = useState<ViewConfig>({ const [{ view, viewOptions }, setInternalView] = useState<ViewConfig>({
view: 'welcome', view: 'welcome',
viewOptions: {}, viewOptions: {},
@@ -277,24 +276,21 @@ export default function App() {
// TODO: modify // TODO: modify
const handleConfirm = async () => { const handleConfirm = async () => {
if (pendingLink && !isInstalling) { if (pendingLink) {
console.log(`Confirming installation of extension from: ${pendingLink}`); console.log(`Confirming installation of extension from: ${pendingLink}`);
setIsInstalling(true); setModalVisible(false); // Dismiss modal immediately
try { try {
if (process.env.ALPHA) { if (process.env.ALPHA) {
await addExtensionFromDeepLinkV2(pendingLink, addExtension, setView); await addExtensionFromDeepLinkV2(pendingLink, addExtension, setView);
} else { } else {
await addExtensionFromDeepLink(pendingLink, setView); await addExtensionFromDeepLink(pendingLink, setView);
} }
console.log('Extension installation successful'); console.log('Extension installation successful');
} catch (error) { } catch (error) {
console.error('Failed to add extension:', error); console.error('Failed to add extension:', error);
// Consider showing a user-visible error notification here // Consider showing a user-visible error notification here
} finally { } finally {
setModalVisible(false);
setPendingLink(null); setPendingLink(null);
setIsInstalling(false);
} }
} }
}; };
@@ -418,7 +414,6 @@ export default function App() {
message={modalMessage} message={modalMessage}
onConfirm={handleConfirm} onConfirm={handleConfirm}
onCancel={handleCancel} onCancel={handleCancel}
isSubmitting={isInstalling}
/> />
)} )}
<div className="relative w-screen h-screen overflow-hidden bg-bgApp flex flex-col"> <div className="relative w-screen h-screen overflow-hidden bg-bgApp flex flex-col">

32
ui/desktop/src/components/settings_v2/extensions/index.ts
View File

@@ -1,8 +1,9 @@
import type { ExtensionConfig } from '../../../api/types.gen'; import type { ExtensionConfig } from '../../../api/types.gen';
import builtInExtensionsData from './built-in-extensions.json'; import builtInExtensionsData from './built-in-extensions.json';
import { FixedExtensionEntry } from '../../ConfigContext'; import { FixedExtensionEntry } from '../../ConfigContext';
import { toast } from 'react-toastify';
import { getApiUrl, getSecretKey } from '../../../config'; import { getApiUrl, getSecretKey } from '../../../config';
import { toast } from 'react-toastify';
import { ToastError, ToastLoading, ToastSuccess } from '../../settings/models/toasts';
// Default extension timeout in seconds // Default extension timeout in seconds
export const DEFAULT_EXTENSION_TIMEOUT = 300; export const DEFAULT_EXTENSION_TIMEOUT = 300;
@@ -29,7 +30,11 @@ function nameToKey(name: string): string {
} }
function handleError(message: string, shouldThrow = false): void { function handleError(message: string, shouldThrow = false): void {
toast.error(message, { autoClose: false }); ToastError({
title: 'Error',
msg: message,
errorMessage: message,
});
console.error(message); console.error(message);
if (shouldThrow) { if (shouldThrow) {
throw new Error(message); throw new Error(message);
@@ -64,7 +69,11 @@ export async function activateExtension(
config: ExtensionConfig, config: ExtensionConfig,
addExtensionFn: (name: string, config: ExtensionConfig, enabled: boolean) => Promise<void> addExtensionFn: (name: string, config: ExtensionConfig, enabled: boolean) => Promise<void>
): Promise<void> { ): Promise<void> {
let toastId;
try { try {
// Show loading toast
toastId = ToastLoading({ title: name, msg: 'Adding extension...' });
// First add to the config system // First add to the config system
await addExtensionFn(nameToKey(name), config, true); await addExtensionFn(nameToKey(name), config, true);
@@ -88,16 +97,27 @@ export async function activateExtension(
const data = await response.json(); const data = await response.json();
if (!data.error) { if (!data.error) {
toast.success(`Extension "${name}" has been successfully enabled`); if (toastId) toast.dismiss(toastId);
ToastSuccess({ title: name, msg: 'Successfully enabled extension' });
} else { } else {
const errorMessage = `Error adding ${name} extension${data.message ? `. ${data.message}` : ''}`; const errorMessage = `Error adding extension`;
console.error(errorMessage); console.error(errorMessage);
toast.error(errorMessage, { autoClose: false }); if (toastId) toast.dismiss(toastId);
ToastError({
title: name,
msg: errorMessage,
errorMessage: data.message,
});
} }
} catch (error) { } catch (error) {
const errorMessage = `Failed to add ${name} extension: ${error instanceof Error ? error.message : 'Unknown error'}`; const errorMessage = `Failed to add ${name} extension: ${error instanceof Error ? error.message : 'Unknown error'}`;
console.error(errorMessage); console.error(errorMessage);
toast.error(errorMessage, { autoClose: false }); if (toastId) toast.dismiss(toastId);
ToastError({
title: name,
msg: 'Failed to add extension',
errorMessage: error.message,
});
throw error; throw error;
} }
} }