refactor: simplify plugin task handling and improve UI feedback (#26293)

web/app/components/plugins/plugin-page/plugin-tasks/hooks.ts

@@ -1,13 +1,9 @@
 import {
   useCallback,
-  useEffect,
-  useRef,
-  useState,
 } from 'react'
 import { TaskStatus } from '@/app/components/plugins/types'
 import type { PluginStatus } from '@/app/components/plugins/types'
 import {
-  useMutationClearAllTaskPlugin,
   useMutationClearTaskPlugin,
   usePluginTaskList,
 } from '@/service/use-plugins'
@@ -18,7 +14,6 @@ export const usePluginTaskStatus = () => {
     handleRefetch,
   } = usePluginTaskList()
   const { mutateAsync } = useMutationClearTaskPlugin()
-  const { mutateAsync: mutateAsyncClearAll } = useMutationClearAllTaskPlugin()
   const allPlugins = pluginTasks.map(task => task.plugins.map((plugin) => {
     return {
       ...plugin,
@@ -45,10 +40,6 @@ export const usePluginTaskStatus = () => {
     })
     handleRefetch()
   }, [mutateAsync, handleRefetch])
-  const handleClearAllErrorPlugin = useCallback(async () => {
-    await mutateAsyncClearAll()
-    handleRefetch()
-  }, [mutateAsyncClearAll, handleRefetch])
   const totalPluginsLength = allPlugins.length
   const runningPluginsLength = runningPlugins.length
   const errorPluginsLength = errorPlugins.length
@@ -60,26 +51,6 @@ export const usePluginTaskStatus = () => {
   const isSuccess = successPluginsLength === totalPluginsLength && totalPluginsLength > 0
   const isFailed = runningPluginsLength === 0 && (errorPluginsLength + successPluginsLength) === totalPluginsLength && totalPluginsLength > 0 && errorPluginsLength > 0
 
-  const [opacity, setOpacity] = useState(1)
-  const timerRef = useRef<NodeJS.Timeout | null>(null)
-
-  useEffect(() => {
-    if (isSuccess) {
-      if (timerRef.current) {
-        clearTimeout(timerRef.current)
-        timerRef.current = null
-      }
-      if (opacity > 0) {
-        timerRef.current = setTimeout(() => {
-          setOpacity(v => v - 0.1)
-        }, 200)
-      }
-    }
-
-    if (!isSuccess)
-      setOpacity(1)
-  }, [isSuccess, opacity])
-
   return {
     errorPlugins,
     successPlugins,
@@ -94,7 +65,5 @@ export const usePluginTaskStatus = () => {
     isSuccess,
     isFailed,
     handleClearErrorPlugin,
-    handleClearAllErrorPlugin,
-    opacity,
   }
 }