chore: tweak webhook section

This commit is contained in:
Steven
2023-12-10 10:21:36 +08:00
parent 0127e08a28
commit 82009d3147
2 changed files with 75 additions and 72 deletions

View File

@ -133,7 +133,7 @@ const CreateWebhookDialog: React.FC<Props> = (props: Props) => {
/>
</div>
</div>
<div className="w-full flex flex-row justify-end items-center mt-4 space-x-2">
<div className="w-full flex flex-row justify-end items-center mt-2 space-x-2">
<Button color="neutral" variant="plain" disabled={requestState.isLoading} loading={requestState.isLoading} onClick={destroy}>
{t("common.cancel")}
</Button>

View File

@ -1,5 +1,6 @@
import { Button, IconButton } from "@mui/joy";
import { useEffect, useState } from "react";
import { Link } from "react-router-dom";
import { webhookServiceClient } from "@/grpcweb";
import useCurrentUser from "@/hooks/useCurrentUser";
import { Webhook } from "@/types/proto/api/v2/webhook_service";
@ -7,7 +8,6 @@ import { useTranslate } from "@/utils/i18n";
import showCreateWebhookDialog from "../CreateWebhookDialog";
import { showCommonDialog } from "../Dialog/CommonDialog";
import Icon from "../Icon";
import LearnMore from "../LearnMore";
const listWebhooks = async (userId: number) => {
const { webhooks } = await webhookServiceClient.listWebhooks({
@ -46,15 +46,10 @@ const WebhookSection = () => {
};
return (
<>
<div className="w-full flex flex-col justify-start items-start space-y-4">
<div className="w-full">
<div className="flex justify-between items-center">
<div className="w-full flex flex-col justify-start items-start">
<div className="w-full flex justify-between items-center">
<div className="flex-auto space-y-1">
<p className="flex flex-row justify-start items-center font-medium text-gray-700 dark:text-gray-300">
Webhooks
<LearnMore className="ml-2" url="https://usememos.com/docs/advanced-settings/webhook" />
</p>
<p className="flex flex-row justify-start items-center font-medium text-gray-700 dark:text-gray-300">Webhooks</p>
</div>
<div>
<Button
@ -68,7 +63,7 @@ const WebhookSection = () => {
</Button>
</div>
</div>
<div className="mt-2 flow-root">
<div className="w-full mt-2 flow-root">
<div className="overflow-x-auto">
<div className="inline-block min-w-full border rounded-lg align-middle">
<table className="min-w-full divide-y divide-gray-300 dark:divide-gray-400">
@ -117,9 +112,17 @@ const WebhookSection = () => {
</div>
</div>
</div>
<div className="w-full mt-2">
<Link
className="text-gray-500 text-sm inline-flex flex-row justify-start items-center hover:underline hover:text-blue-600"
to="https://usememos.com/docs/advanced-settings/webhook"
target="_blank"
>
{t("common.learn-more")}
<Icon.ExternalLink className="inline w-4 h-auto ml-1" />
</Link>
</div>
</div>
</>
);
};