import * as React from 'react' import { useEffect, useState } from 'react' import { getIsRemoteMode } from '../../bootstrap/state.js' import { useNotifications } from '../../context/notifications.js' import { Text } from '@anthropic/ink' import { logForDebugging } from '../../utils/debug.js' import { onPluginsAutoUpdated } from '../../utils/plugins/pluginAutoupdate.js' /** * Hook that displays a notification when plugins have been auto-updated. * The notification tells the user to run /reload-plugins to apply the updates. */ export function usePluginAutoupdateNotification(): void { const { addNotification } = useNotifications() const [updatedPlugins, setUpdatedPlugins] = useState([]) // Register for autoupdate notifications useEffect(() => { if (getIsRemoteMode()) return const unsubscribe = onPluginsAutoUpdated(plugins => { logForDebugging( `Plugin autoupdate notification: ${plugins.length} plugin(s) updated`, ) setUpdatedPlugins(plugins) }) return unsubscribe }, []) // Show notification when plugins are updated useEffect(() => { if (getIsRemoteMode()) return if (updatedPlugins.length === 0) { return } // Extract plugin names from plugin IDs (format: "name@marketplace") const pluginNames = updatedPlugins.map(id => { const atIndex = id.indexOf('@') return atIndex > 0 ? id.substring(0, atIndex) : id }) const displayNames = pluginNames.length <= 2 ? pluginNames.join(' and ') : `${pluginNames.length} plugins` addNotification({ key: 'plugin-autoupdate-restart', jsx: ( <> {pluginNames.length === 1 ? 'Plugin' : 'Plugins'} updated:{' '} {displayNames} ยท Run /reload-plugins to apply ), priority: 'low', timeoutMs: 10000, }) logForDebugging( `Showing plugin autoupdate notification for: ${pluginNames.join(', ')}`, ) }, [updatedPlugins, addNotification]) }