reducers.dataTag

package.json

@@ -88,7 +88,7 @@
     "react-dropzone": "^14.2.3",
     "react-error-boundary": "^4.0.13",
     "react-force-graph-2d": "^1.25.5",
-    "@chhsiao1981/use-thunk": "^9.0.3",
+    "@chhsiao1981/use-thunk": "^10.0.4",
     "react-redux": "^9.1.2",
     "react-resizable-panels": "^2.1.4",
     "react-responsive": "^10.0.0",

src/api/serverApi/dataTag.ts

@@ -0,0 +1,29 @@
+import api from "../api";
+import type { DataTag } from "../types";
+
+export const getDataTags = (username = "", name = "") => {
+  const query: any = {};
+  if (username) {
+    query.owner_username = username;
+  }
+  if (name) {
+    query.name = name;
+  }
+
+  return api<DataTag[]>({
+    endpoint: `/tags/search/`,
+    method: "get",
+    query,
+  });
+};
+
+export const createDataTag = (username: string, name: string, color = "gray") =>
+  api<DataTag[]>({
+    endpoint: `/tags/`,
+    method: "post",
+    json: {
+      name,
+      owner_username: username,
+      color,
+    },
+  });

src/api/serverApi/index.ts

@@ -4,6 +4,7 @@ import {
   updateDataName,
   updateDataPublic,
 } from "./data";
+import { createDataTag, getDataTags } from "./dataTag";
 import { createDownloadToken, getLinkMap } from "./misc";
 import {
   getPACSSeriesListBySeriesUID,
@@ -42,4 +43,6 @@ export {
   queryPFDCMSeries,
   queryPFDCMStudies,
   retrievePFDCMPACS,
+  getDataTags,
+  createDataTag,
 };

src/api/types/dataTags.ts

@@ -0,0 +1,8 @@
+import type { ID } from "./id";
+
+export interface DataTag {
+  id: ID;
+  name: string;
+  color: string;
+  owner_username: string;
+}

src/api/types/index.ts

@@ -1,4 +1,5 @@
 import type { Data } from "./data";
+import type { DataTag } from "./dataTags";
 import type { Datetime } from "./datetime";
 import type { ID } from "./id";
 import type { List } from "./list";
@@ -13,7 +14,7 @@ import type {
   PYPXResult,
   PYPXSeriesData,
 } from "./pacs";
-import type { UploadPipeline } from "./pipeline";
+import type { Pipeline, UploadPipeline } from "./pipeline";
 import type { Pkg } from "./pkg";
 import { type PkgInstance, PkgInstanceStatus } from "./pkgInstance";
 import type {
@@ -41,13 +42,15 @@ export type {
   UploadPkgNodeInfo,
   PkgInstance,
   Pkg,
+  Pipeline,
   UploadPipeline,
   Data,
   DownloadToken,
   Link,
   ID,
   Datetime,
   List,
+  DataTag,
 };
 
 export { PkgInstanceStatus };

src/components/ComputePage/index.tsx

@@ -1,41 +1,16 @@
-import type { ThunkModuleToFunc, UseThunk } from "@chhsiao1981/use-thunk";
 import { PageSection } from "@patternfly/react-core";
 import { useEffect } from "react";
-import type * as DoDrawer from "../../reducers/drawer";
-import type * as DoFeed from "../../reducers/feed";
-import type * as DoUI from "../../reducers/ui";
-import type * as DoUser from "../../reducers/user";
 import Wrapper from "../Wrapper";
 import ComputeCatalog from "./ComputeCatalog";
 import Title from "./Title";
 
-type TDoUI = ThunkModuleToFunc<typeof DoUI>;
-type TDoUser = ThunkModuleToFunc<typeof DoUser>;
-type TDoDrawer = ThunkModuleToFunc<typeof DoDrawer>;
-type TDoFeed = ThunkModuleToFunc<typeof DoFeed>;
-
-type Props = {
-  useUI: UseThunk<DoUI.State, TDoUI>;
-  useUser: UseThunk<DoUser.State, TDoUser>;
-  useDrawer: UseThunk<DoDrawer.State, TDoDrawer>;
-  useFeed: UseThunk<DoFeed.State, TDoFeed>;
-};
-
-export default (props: Props) => {
-  const { useUI, useUser, useDrawer, useFeed } = props;
-
+export default () => {
   useEffect(() => {
     document.title = "Compute Catalog";
   }, []);
 
   return (
-    <Wrapper
-      useUI={useUI}
-      useUser={useUser}
-      useDrawer={useDrawer}
-      useFeed={useFeed}
-      title={Title}
-    >
+    <Wrapper title={Title}>
       <PageSection>
         <ComputeCatalog />
       </PageSection>