Fix: dataset list refresh (#1216)

web/app/(commonLayout)/datasets/(datasetDetailLayout)/[datasetId]/layout.tsx

@@ -19,7 +19,7 @@ import {
 } from '@heroicons/react/24/solid'
 import Link from 'next/link'
 import s from './style.module.css'
-import { fetchDataDetail, fetchDatasetRelatedApps } from '@/service/datasets'
+import { fetchDatasetDetail, fetchDatasetRelatedApps } from '@/service/datasets'
 import type { RelatedApp } from '@/models/datasets'
 import { getLocaleOnClient } from '@/i18n/client'
 import AppSideBar from '@/app/components/app-sidebar'
@@ -30,8 +30,6 @@ import Loading from '@/app/components/base/loading'
 import DatasetDetailContext from '@/context/dataset-detail'
 import { DataSourceType } from '@/models/datasets'
 
-// import { fetchDatasetDetail } from '@/service/datasets'
-
 export type IAppDetailLayoutProps = {
   children: React.ReactNode
   params: { datasetId: string }
@@ -94,9 +92,9 @@ const DatasetDetailLayout: FC<IAppDetailLayoutProps> = (props) => {
   const hideSideBar = /documents\/create$/.test(pathname)
   const { t } = useTranslation()
   const { data: datasetRes, error, mutate: mutateDatasetRes } = useSWR({
-    action: 'fetchDataDetail',
+    url: 'fetchDatasetDetail',
     datasetId,
-  }, apiParams => fetchDataDetail(apiParams.datasetId))
+  }, apiParams => fetchDatasetDetail(apiParams.datasetId))
 
   const { data: relatedApps } = useSWR({
     action: 'fetchDatasetRelatedApps',

web/app/(commonLayout)/datasets/Datasets.tsx

@@ -17,7 +17,7 @@ const getKey = (pageIndex: number, previousPageData: DataSetListResponse) => {
 
 const Datasets = () => {
   const { isCurrentWorkspaceManager } = useAppContext()
-  const { data, isLoading, setSize, mutate } = useSWRInfinite(getKey, fetchDatasets, { revalidateFirstPage: false })
+  const { data, isLoading, setSize, mutate } = useSWRInfinite(getKey, fetchDatasets, { revalidateFirstPage: false, revalidateAll: true })
   const loadingStateRef = useRef(false)
   const pageContainerRef = useSelector(state => state.pageContainerRef)
   const anchorRef = useRef<HTMLAnchorElement>(null)

web/app/components/datasets/create/index.tsx

@@ -10,7 +10,7 @@ import StepThree from './step-three'
 import { DataSourceType } from '@/models/datasets'
 import type { DataSet, FileItem, createDocumentResponse } from '@/models/datasets'
 import { fetchDataSource } from '@/service/common'
-import { fetchDataDetail } from '@/service/datasets'
+import { fetchDatasetDetail } from '@/service/datasets'
 import type { NotionPage } from '@/models/common'
 import { useProviderContext } from '@/context/provider-context'
 
@@ -91,7 +91,7 @@ const DatasetUpdateForm = ({ datasetId }: DatasetUpdateFormProps) => {
     (async () => {
       if (datasetId) {
         try {
-          const detail = await fetchDataDetail(datasetId)
+          const detail = await fetchDatasetDetail(datasetId)
           setDetail(detail)
         }
         catch (e) {
@@ -151,4 +151,4 @@ const DatasetUpdateForm = ({ datasetId }: DatasetUpdateFormProps) => {
   )
 }
 
-export default DatasetUpdateForm
+export default DatasetUpdateForm

web/app/components/datasets/settings/form/index.tsx

@@ -1,21 +1,23 @@
 'use client'
 import { useEffect, useState } from 'react'
 import type { Dispatch } from 'react'
-import useSWR from 'swr'
 import { useContext } from 'use-context-selector'
 import { BookOpenIcon } from '@heroicons/react/24/outline'
 import { useTranslation } from 'react-i18next'
 import cn from 'classnames'
+import { useSWRConfig } from 'swr'
+import { unstable_serialize } from 'swr/infinite'
 import PermissionsRadio from '../permissions-radio'
 import IndexMethodRadio from '../index-method-radio'
 import { ToastContext } from '@/app/components/base/toast'
 import Button from '@/app/components/base/button'
-import { fetchDataDetail, updateDatasetSetting } from '@/service/datasets'
-import type { DataSet } from '@/models/datasets'
+import { updateDatasetSetting } from '@/service/datasets'
+import type { DataSet, DataSetListResponse } from '@/models/datasets'
 import ModelSelector from '@/app/components/header/account-setting/model-page/model-selector'
 import type { ProviderEnum } from '@/app/components/header/account-setting/model-page/declarations'
 import { ModelType } from '@/app/components/header/account-setting/model-page/declarations'
 import AccountSetting from '@/app/components/header/account-setting'
+import DatasetDetailContext from '@/context/dataset-detail'
 
 const rowClass = `
   flex justify-between py-4
@@ -32,16 +34,17 @@ const useInitialValue: <T>(depend: T, dispatch: Dispatch<T>) => void = (depend,
   }, [depend])
 }
 
-type Props = {
-  datasetId: string
+const getKey = (pageIndex: number, previousPageData: DataSetListResponse) => {
+  if (!pageIndex || previousPageData.has_more)
+    return { url: 'datasets', params: { page: pageIndex + 1, limit: 30 } }
+  return null
 }
 
-const Form = ({
-  datasetId,
-}: Props) => {
+const Form = () => {
   const { t } = useTranslation()
   const { notify } = useContext(ToastContext)
-  const { data: currentDataset, mutate: mutateDatasets } = useSWR(datasetId, fetchDataDetail)
+  const { mutate } = useSWRConfig()
+  const { dataset: currentDataset, mutateDatasetRes: mutateDatasets } = useContext(DatasetDetailContext)
   const [loading, setLoading] = useState(false)
   const [name, setName] = useState(currentDataset?.name ?? '')
   const [description, setDescription] = useState(currentDataset?.description ?? '')
@@ -67,7 +70,10 @@ const Form = ({
         },
       })
       notify({ type: 'success', message: t('common.actionMsg.modifiedSuccessfully') })
-      await mutateDatasets()
+      if (mutateDatasets) {
+        await mutateDatasets()
+        mutate(unstable_serialize(getKey))
+      }
     }
     catch (e) {
       notify({ type: 'error', message: t('common.actionMsg.modifiedUnsuccessfully') })

web/app/components/header/dataset-nav/index.tsx

@@ -7,7 +7,7 @@ import useSWR from 'swr'
 import useSWRInfinite from 'swr/infinite'
 import { flatten } from 'lodash-es'
 import Nav from '../nav'
-import { fetchDataDetail, fetchDatasets } from '@/service/datasets'
+import { fetchDatasetDetail, fetchDatasets } from '@/service/datasets'
 import { Database01 } from '@/app/components/base/icons/src/vender/line/development'
 import { Database02 } from '@/app/components/base/icons/src/vender/solid/development'
 import type { DataSetListResponse } from '@/models/datasets'
@@ -22,8 +22,15 @@ const DatasetNav = () => {
   const { t } = useTranslation()
   const router = useRouter()
   const { datasetId } = useParams()
-  const { data: currentDataset } = useSWR(datasetId || null, fetchDataDetail)
-  const { data: datasetsData, setSize } = useSWRInfinite(datasetId ? getKey : () => null, fetchDatasets, { revalidateFirstPage: true })
+  const { data: currentDataset } = useSWR(
+    datasetId
+      ? {
+        url: 'fetchDatasetDetail',
+        datasetId,
+      }
+      : null,
+    apiParams => fetchDatasetDetail(apiParams.datasetId))
+  const { data: datasetsData, setSize } = useSWRInfinite(datasetId ? getKey : () => null, fetchDatasets, { revalidateFirstPage: false, revalidateAll: true })
   const datasetItems = flatten(datasetsData?.map(datasetData => datasetData.data))
 
   const handleLoadmore = useCallback(() => {

web/service/datasets.ts

@@ -39,7 +39,7 @@ export type SortType = 'created_at' | 'hit_count' | '-created_at' | '-hit_count'
 
 export type MetadataType = 'all' | 'only' | 'without'
 
-export const fetchDataDetail: Fetcher<DataSet, string> = (datasetId: string) => {
+export const fetchDatasetDetail: Fetcher<DataSet, string> = (datasetId: string) => {
   return get<DataSet>(`/datasets/${datasetId}`)
 }