Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
20e1963
commit fa7534a
Showing
17 changed files
with
925 additions
and
46 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,151 @@ | ||
| import { Button, Form, Input, message, Popconfirm, Tabs } from 'antd'; | ||
| import React from 'react'; | ||
| import { useNavigate, useParams } from 'react-router'; | ||
| import { deleteWorkspaceWebsite } from '../../api/model/website'; | ||
| import { useRequest } from '../../hooks/useRequest'; | ||
| import { useCurrentWorkspaceId } from '../../store/user'; | ||
| import { ErrorTip } from '../ErrorTip'; | ||
| import { Loading } from '../Loading'; | ||
| import { NoWorkspaceTip } from '../NoWorkspaceTip'; | ||
| import { MonitorPicker } from '../monitor/MonitorPicker'; | ||
| import { | ||
| defaultErrorHandler, | ||
| defaultSuccessHandler, | ||
| getQueryKey, | ||
| trpc, | ||
| } from '../../api/trpc'; | ||
| import { useQueryClient } from '@tanstack/react-query'; | ||
| import { useEvent } from '../../hooks/useEvent'; | ||
| import { hostnameValidator } from '../../utils/validator'; | ||
| import { useTranslation } from '@i18next-toolkit/react'; | ||
|
|
||
| export const WebsiteConfig: React.FC<{ websiteId: string }> = React.memo( | ||
| (props) => { | ||
| const { websiteId } = props; | ||
| const { t } = useTranslation(); | ||
| const workspaceId = useCurrentWorkspaceId(); | ||
| const navigate = useNavigate(); | ||
| const queryClient = useQueryClient(); | ||
|
|
||
| const { data: website, isLoading } = trpc.website.info.useQuery({ | ||
| workspaceId, | ||
| websiteId, | ||
| }); | ||
|
|
||
| const updateMutation = trpc.website.updateInfo.useMutation({ | ||
| onSuccess: () => { | ||
| queryClient.resetQueries(getQueryKey(trpc.website.info)); | ||
| defaultSuccessHandler(); | ||
| }, | ||
| onError: defaultErrorHandler, | ||
| }); | ||
|
|
||
| const handleSave = useEvent( | ||
| async (values: { name: string; domain: string; monitorId: string }) => { | ||
| await updateMutation.mutateAsync({ | ||
| workspaceId, | ||
| websiteId, | ||
| name: values.name, | ||
| domain: values.domain, | ||
| monitorId: values.monitorId, | ||
| }); | ||
| } | ||
| ); | ||
|
|
||
| const [, handleDeleteWebsite] = useRequest(async () => { | ||
| await deleteWorkspaceWebsite(workspaceId, websiteId!); | ||
|
|
||
| message.success(t('Delete Success')); | ||
|
|
||
| navigate('/settings/websites'); | ||
| }); | ||
|
|
||
| if (!workspaceId) { | ||
| return <NoWorkspaceTip />; | ||
| } | ||
|
|
||
| if (!websiteId) { | ||
| return <ErrorTip />; | ||
| } | ||
|
|
||
| if (isLoading) { | ||
| return <Loading />; | ||
| } | ||
|
|
||
| if (!website) { | ||
| return <ErrorTip />; | ||
| } | ||
|
|
||
| return ( | ||
| <div> | ||
| <div> | ||
| <Tabs> | ||
| <Tabs.TabPane key={'detail'} tab={'Detail'}> | ||
| <Form | ||
| layout="vertical" | ||
| initialValues={{ | ||
| id: website.id, | ||
| name: website.name, | ||
| domain: website.domain, | ||
| monitorId: website.monitorId, | ||
| }} | ||
| onFinish={handleSave} | ||
| > | ||
| <Form.Item label={t('Website ID')} name="id"> | ||
| <Input size="large" disabled={true} /> | ||
| </Form.Item> | ||
| <Form.Item | ||
| label={t('Name')} | ||
| name="name" | ||
| rules={[{ required: true }]} | ||
| > | ||
| <Input size="large" /> | ||
| </Form.Item> | ||
| <Form.Item | ||
| label={t('Domain')} | ||
| name="domain" | ||
| rules={[ | ||
| { required: true }, | ||
| { | ||
| validator: hostnameValidator, | ||
| }, | ||
| ]} | ||
| > | ||
| <Input size="large" /> | ||
| </Form.Item> | ||
|
|
||
| <Form.Item | ||
| label={t('Monitor')} | ||
| name="monitorId" | ||
| tooltip={t( | ||
| 'You can bind a monitor which will display health status in website overview' | ||
| )} | ||
| > | ||
| <MonitorPicker size="large" allowClear={true} /> | ||
| </Form.Item> | ||
|
|
||
| <Form.Item> | ||
| <Button size="large" htmlType="submit"> | ||
| {t('Save')} | ||
| </Button> | ||
| </Form.Item> | ||
| </Form> | ||
| </Tabs.TabPane> | ||
|
|
||
| <Tabs.TabPane key={'data'} tab={'Data'}> | ||
| <Popconfirm | ||
| title={t('Delete Website')} | ||
| onConfirm={() => handleDeleteWebsite()} | ||
| > | ||
| <Button type="primary" danger={true}> | ||
| {t('Delete Website')} | ||
| </Button> | ||
| </Popconfirm> | ||
| </Tabs.TabPane> | ||
| </Tabs> | ||
| </div> | ||
| </div> | ||
| ); | ||
| } | ||
| ); | ||
| WebsiteConfig.displayName = 'WebsiteConfig'; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.