mirror of
https://git.mirrors.martin98.com/https://github.com/SigNoz/signoz
synced 2025-08-12 02:29:03 +08:00
refactor: use antd form in organization display name (#2006)
* refactor: use antd form in organization display name * chore: interface is now named interface Co-authored-by: Palash <palashgdev@gmail.com>
This commit is contained in:
parent
a4346a2d93
commit
ca77820e9d
@ -1,4 +1,4 @@
|
||||
import { Button, Input, notification, Space, Typography } from 'antd';
|
||||
import { Button, Form, Input, notification } from 'antd';
|
||||
import editOrg from 'api/user/editOrg';
|
||||
import React, { useState } from 'react';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
@ -14,14 +14,15 @@ function DisplayName({
|
||||
id: orgId,
|
||||
isAnonymous,
|
||||
}: DisplayNameProps): JSX.Element {
|
||||
const [form] = Form.useForm();
|
||||
|
||||
const { t } = useTranslation(['organizationsettings', 'common']);
|
||||
const { org } = useSelector<AppState, AppReducer>((state) => state.app);
|
||||
const { name } = (org || [])[index];
|
||||
const [orgName, setOrgName] = useState<string>(name);
|
||||
const [isLoading, setIsLoading] = useState<boolean>(false);
|
||||
const dispatch = useDispatch<Dispatch<AppActions>>();
|
||||
|
||||
const onClickHandler = async (): Promise<void> => {
|
||||
const onSubmit = async ({ name: orgName }: OnSubmitProps): Promise<void> => {
|
||||
try {
|
||||
setIsLoading(true);
|
||||
const { statusCode, error } = await editOrg({
|
||||
@ -67,26 +68,22 @@ function DisplayName({
|
||||
}
|
||||
|
||||
return (
|
||||
<Space direction="vertical">
|
||||
<Typography.Title level={3}>{t('display_name')}</Typography.Title>
|
||||
<Space direction="vertical" size="middle">
|
||||
<Input
|
||||
value={orgName}
|
||||
onChange={(e): void => setOrgName(e.target.value)}
|
||||
size="large"
|
||||
placeholder={t('signoz')}
|
||||
disabled={isLoading}
|
||||
/>
|
||||
<Button
|
||||
onClick={onClickHandler}
|
||||
disabled={isLoading || orgName === name}
|
||||
loading={isLoading}
|
||||
type="primary"
|
||||
<Form
|
||||
initialValues={{ name }}
|
||||
form={form}
|
||||
layout="vertical"
|
||||
onFinish={onSubmit}
|
||||
autoComplete="off"
|
||||
>
|
||||
Change Org Name
|
||||
<Form.Item name="name" label="Display name" rules={[{ required: true }]}>
|
||||
<Input size="large" placeholder={t('signoz')} disabled={isLoading} />
|
||||
</Form.Item>
|
||||
<Form.Item>
|
||||
<Button loading={isLoading} type="primary" htmlType="submit">
|
||||
Submit
|
||||
</Button>
|
||||
</Space>
|
||||
</Space>
|
||||
</Form.Item>
|
||||
</Form>
|
||||
);
|
||||
}
|
||||
|
||||
@ -96,4 +93,8 @@ interface DisplayNameProps {
|
||||
isAnonymous: boolean;
|
||||
}
|
||||
|
||||
interface OnSubmitProps {
|
||||
name: string;
|
||||
}
|
||||
|
||||
export default DisplayName;
|
||||
|
Loading…
x
Reference in New Issue
Block a user