Bin
2025-12-16 9e0b2ba2c317b1a86212f24cbae3195ad1f3dbfa
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
import { useQuery } from "@tanstack/react-query";
import { useAPI } from "apps/labelstudio/src/providers/ApiProvider";
import { useCallback, useMemo } from "react";
 
function useStorages(target: "import" | "export", projectId?: number) {
  const api = useAPI();
  const storagesQueryKey = ["storages", target, projectId];
  const { data, isLoading, isSuccess, refetch } = useQuery({
    queryKey: storagesQueryKey,
    enabled: projectId !== undefined,
    async queryFn() {
      const result = await api.callApi("listStorages", {
        params: { project: projectId, target },
        errorFilter: () => true,
      });
 
      if (!result?.$meta.ok) return [];
 
      return result;
    },
  });
 
  return {
    storages: data,
    storagesLoading: isLoading,
    storagesLoaded: isSuccess,
    reloadStoragesList: () => refetch({ queryKey: storagesQueryKey }),
  };
}
 
function useStorageTypes(target: "import" | "export") {
  const api = useAPI();
  const storageTypesQueryKey = ["storage-types", target];
  const { data, isLoading, isSuccess, refetch } = useQuery({
    queryKey: storageTypesQueryKey,
    async queryFn() {
      const result = await api.callApi<{ title: string; name: string }[]>("storageTypes", {
        params: { target },
        errorFilter: () => true,
      });
 
      if (!result?.$meta.ok) return [];
 
      return result;
    },
  });
 
  return {
    storageTypes: data,
    storageTypesLoading: isLoading,
    storageTypesLoaded: isSuccess,
    reloadStorageTypes: () => refetch({ queryKey: storageTypesQueryKey }),
  };
}
 
export function useStorageCard(target: "import" | "export", projectId?: number) {
  const { reloadStoragesList, ...storages } = useStorages(target, projectId);
  const { reloadStorageTypes, ...storageTypes } = useStorageTypes(target);
 
  const fetchStorages = useCallback(async () => {
    reloadStoragesList();
    reloadStorageTypes();
  }, [reloadStoragesList, reloadStorageTypes]);
 
  const loading = useMemo(
    () => storageTypes.storageTypesLoading || storages.storagesLoading,
    [storageTypes.storageTypesLoading, storages.storagesLoading],
  );
  const loaded = useMemo(
    () => storageTypes.storageTypesLoaded || storages.storagesLoaded,
    [storageTypes.storageTypesLoaded, storages.storagesLoaded],
  );
 
  return {
    ...storages,
    ...storageTypes,
    loaded,
    loading,
    fetchStorages,
  };
}