* storybook v2 init * Merge config into storybook vite build * Remove path * Storybook config tweaks * Added styles and settings for storybook v2, and started working on button documentation and examples. * Badges + flex wrap on mobile * Breadcrumbs+button+avatar * Checkbox * Input + moving files around * WIP table * WIP table grid * Replaced imports for new components. * Added first steps for varianttable. * Small alignment fix. * Custom Args Table - With scrollbar * Adding table to components that need it + darkmode * Add intro * Fix types * Remove V1 storybook and replace with V2 * Fix badge type error * Fixed storybook dependencies * Added cover image to storybook * Remove vita from ts config, we dont use vite. * Fixed button import. * Explained postcss pseudo plugin. * Fixed badge import. * Add Avatar Stories * ButtonGroup Stories * Fixed imports * Add checkbox stories * Add exports for differnt types of inputs * Fix form and text area input * Fix mass import errors Co-authored-by: Jeroen Reumkens <hello@jeroenreumkens.nl> Co-authored-by: Alex van Andel <me@alexvanandel.com>
49 lines
1.8 KiB
TypeScript
49 lines
1.8 KiB
TypeScript
import { useWatch } from "react-hook-form";
|
|
|
|
import { useLocale } from "@calcom/lib/hooks/useLocale";
|
|
import { trpc } from "@calcom/trpc/react";
|
|
import { Icon } from "@calcom/ui/Icon";
|
|
import { Badge } from "@calcom/ui/components/badge";
|
|
import { Button } from "@calcom/ui/components/button";
|
|
import showToast from "@calcom/ui/v2/core/notifications";
|
|
|
|
export default function WebhookTestDisclosure() {
|
|
const subscriberUrl: string = useWatch({ name: "subscriberUrl" });
|
|
const payloadTemplate = useWatch({ name: "payloadTemplate" }) || null;
|
|
const { t } = useLocale();
|
|
const mutation = trpc.useMutation("viewer.webhook.testTrigger", {
|
|
onError(err) {
|
|
showToast(err.message, "error");
|
|
},
|
|
});
|
|
|
|
return (
|
|
<div className="space-y-0 rounded-md border-0 border-neutral-200 bg-white sm:mx-0 md:border">
|
|
<div className="flex justify-between border-b p-4">
|
|
<div className="flex items-center space-x-1">
|
|
<h3 className="font-sm self-center font-medium text-black">{t("webhook_response")}</h3>
|
|
{mutation.data && (
|
|
<Badge variant={mutation.data.ok ? "green" : "red"}>
|
|
{mutation.data.ok ? t("passed") : t("failed")}
|
|
</Badge>
|
|
)}
|
|
</div>
|
|
<Button
|
|
type="button"
|
|
color="secondary"
|
|
disabled={mutation.isLoading}
|
|
StartIcon={Icon.FiActivity}
|
|
onClick={() => mutation.mutate({ url: subscriberUrl, type: "PING", payloadTemplate })}>
|
|
{t("ping_test")}
|
|
</Button>
|
|
</div>
|
|
<div className="p-4">
|
|
{!mutation.data && <em>{t("no_data_yet")}</em>}
|
|
{mutation.status === "success" && (
|
|
<div className="overflow-x-auto text-gray-900">{JSON.stringify(mutation.data, null, 4)}</div>
|
|
)}
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|