useQueryBoard.js 3.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109
  1. import { useCallback, useEffect, useMemo, useState } from 'react'
  2. import { getLatestBoard, getLatestQueryDetail, getQueryPreview } from '../../api/workbench.js'
  3. import { isLiveRun, singletonMaps } from './model.js'
  4. const BOARD_POLL_MS = 5 * 60 * 1000
  5. export function useQueryBoard() {
  6. const [preview, setPreview] = useState(null)
  7. const [board, setBoard] = useState(null)
  8. const [loading, setLoading] = useState(true)
  9. const [error, setError] = useState('')
  10. const [lastUpdatedAt, setLastUpdatedAt] = useState(null)
  11. const refreshBoard = useCallback(({ signal } = {}) => {
  12. return getLatestBoard({ signal }).then((payload) => {
  13. setBoard(payload)
  14. setLastUpdatedAt(new Date())
  15. return payload
  16. })
  17. }, [])
  18. useEffect(() => {
  19. const controller = new AbortController()
  20. setLoading(true)
  21. setError('')
  22. Promise.all([
  23. getQueryPreview({ signal: controller.signal }),
  24. getLatestBoard({ signal: controller.signal }).catch(() => null),
  25. ])
  26. .then(([previewPayload, boardPayload]) => {
  27. setPreview(previewPayload)
  28. setBoard(boardPayload)
  29. setLastUpdatedAt(new Date())
  30. })
  31. .catch((e) => {
  32. if (e.name !== 'AbortError') setError(e.message || '读取失败')
  33. })
  34. .finally(() => setLoading(false))
  35. return () => controller.abort()
  36. }, [])
  37. useEffect(() => {
  38. if (!isLiveRun(board?.run)) return undefined
  39. let stopped = false
  40. let timer = 0
  41. let controller = null
  42. const tick = () => {
  43. controller = new AbortController()
  44. refreshBoard({ signal: controller.signal })
  45. .catch(() => {})
  46. .finally(() => {
  47. if (!stopped) timer = window.setTimeout(tick, BOARD_POLL_MS)
  48. })
  49. }
  50. timer = window.setTimeout(tick, BOARD_POLL_MS)
  51. return () => {
  52. stopped = true
  53. window.clearTimeout(timer)
  54. controller?.abort()
  55. }
  56. }, [board?.run?.status, refreshBoard])
  57. const latestByQuery = useMemo(() => singletonMaps(board), [board])
  58. return {
  59. preview,
  60. board,
  61. latestByQuery,
  62. loading,
  63. error,
  64. lastUpdatedAt,
  65. refreshBoard,
  66. isPolling: isLiveRun(board?.run),
  67. }
  68. }
  69. export function useLatestQueryDetail(selectedQuery) {
  70. const [detail, setDetail] = useState(null)
  71. const [loading, setLoading] = useState(false)
  72. const [error, setError] = useState('')
  73. const load = useCallback(({ signal, background = false } = {}) => {
  74. if (!selectedQuery?.query_id) return Promise.resolve(null)
  75. if (!background) setLoading(true)
  76. setError('')
  77. return getLatestQueryDetail(selectedQuery.query_id, { signal })
  78. .then((payload) => {
  79. setDetail(payload)
  80. return payload
  81. })
  82. .catch((e) => {
  83. if (e.name !== 'AbortError') setError(e.message || '搜索结果读取失败')
  84. return null
  85. })
  86. .finally(() => {
  87. if (!background) setLoading(false)
  88. })
  89. }, [selectedQuery?.query_id])
  90. useEffect(() => {
  91. setDetail(null)
  92. if (!selectedQuery?.query_id) return undefined
  93. const controller = new AbortController()
  94. load({ signal: controller.signal })
  95. return () => controller.abort()
  96. }, [selectedQuery?.query_id, load])
  97. return { detail, loading, error, reload: load }
  98. }