测试脚本

Bin

2025-12-17 1442f92732d7c5311a627a7ba3aaa0bb8ffc539f

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
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
import { useCallback, useEffect, useMemo, useState } from "react";
 
import { useAPI } from "../../providers/ApiProvider";
 
import { useHistory } from "react-router";
import { useProject } from "../../providers/ProjectProvider";
import WebhookDetail from "./WebhookDetail";
import WebhookList from "./WebhookList";
import { createTitleFromSegments, useUpdatePageTitle } from "@humansignal/core";
 
const Webhook = () => {
  const [activeWebhook, setActiveWebhook] = useState(null);
  const [webhooks, setWebhooks] = useState(null);
  const [webhooksInfo, setWebhooksInfo] = useState(null);
 
  const history = useHistory();
 
  const api = useAPI();
  const { project } = useProject();
 
  useUpdatePageTitle(createTitleFromSegments([project?.title, "Webhooks 设置"]));
 
  const projectId = useMemo(() => {
    if (history.location.pathname.startsWith("/projects")) {
      if (Object.keys(project).length === 0) {
        return null;
      }
      return project.id;
    }
    return undefined;
  }, [project, history]);
 
  const fetchWebhooks = useCallback(async () => {
    if (projectId === null) {
      setWebhooks(null);
      return;
    }
    const params = {};
 
    if (projectId !== undefined) {
      params.project = projectId;
    } else {
      params.project = null;
    }
    const webhooks = await api.callApi("webhooks", {
      params,
    });
 
    if (webhooks) setWebhooks(webhooks);
  }, [projectId]);
 
  const fetchWebhooksInfo = useCallback(async () => {
    if (projectId === null) {
      setWebhooksInfo(null);
      return;
    }
    const params = {};
 
    if (projectId !== undefined) {
      params["organization-only"] = false;
    }
 
    const info = await api.callApi("webhooksInfo", {
      params,
    });
 
    if (info) setWebhooksInfo(info);
  }, [projectId]);
 
  useEffect(() => {
    fetchWebhooks();
    fetchWebhooksInfo();
  }, [project, projectId]);
 
  if (webhooks === null || webhooksInfo === null || projectId === null) {
    return null;
  }
  let content = null;
 
  if (activeWebhook === "new") {
    content = (
      <WebhookDetail
        onSelectActive={setActiveWebhook}
        onBack={() => setActiveWebhook(null)}
        webhook={null}
        fetchWebhooks={fetchWebhooks}
        webhooksInfo={webhooksInfo}
      />
    );
  } else if (activeWebhook === null) {
    content = (
      <WebhookList
        onSelectActive={setActiveWebhook}
        onAddWebhook={() => {
          setActiveWebhook("new");
        }}
        fetchWebhooks={fetchWebhooks}
        webhooks={webhooks}
      />
    );
  } else {
    content = (
      <WebhookDetail
        onSelectActive={setActiveWebhook}
        onBack={() => setActiveWebhook(null)}
        webhook={webhooks[webhooks.findIndex((x) => x.id === activeWebhook)]}
        fetchWebhooks={fetchWebhooks}
        webhooksInfo={webhooksInfo}
      />
    );
  }
  return <section className="w-[42rem]">{content}</section>;
};
 
export const WebhookPage = {
  title: "Webhooks",
  path: "/webhooks",
  component: Webhook,
};