GitHub-Proxy/signoz
1
0
Fork 0
mirror of https://git.mirrors.martin98.com/https://github.com/SigNoz/signoz synced 2025-08-01 04:22:02 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat: moved apply license form to antd form (#2746)

Browse Source 
* feat: moved apply license form to antd form

Signed-off-by: GermaVinsmoke <vaibhav1180@gmail.com>

* chore: added lib fn for require error msg

Signed-off-by: GermaVinsmoke <vaibhav1180@gmail.com>

---------

Signed-off-by: GermaVinsmoke <vaibhav1180@gmail.com>
This commit is contained in:
GermaVinsmoke 2023-05-23 23:14:02 +05:30 committed by GitHub
parent b034c60897
commit fda0441686
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 32 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

42
frontend/src/container/Licenses/ApplyLicenseForm.tsx
View File

@ -9,22 +9,27 @@ import { AppState } from 'store/reducers';
import { ErrorResponse, SuccessResponse } from 'types/api';
import { PayloadProps } from 'types/api/licenses/getAll';
import AppReducer from 'types/reducer/app';
import { requireErrorMessage } from 'utils/form/requireErrorMessage';
import { ApplyForm, ApplyFormContainer, LicenseInput } from './styles';
const FormItem = Form.Item;
import {
ApplyForm,
ApplyFormContainer,
KeyPreview,
LicenseInput,
} from './styles';
function ApplyLicenseForm({
licenseRefetch,
}: ApplyLicenseFormProps): JSX.Element {
const { t } = useTranslation(['licenses']);
const [key, setKey] = useState('');
const [loading, setLoading] = useState(false);
const [form] = Form.useForm<FormValues>();
const { featureResponse } = useSelector<AppState, AppReducer>(
(state) => state.app,
);
const { notifications } = useNotifications();
const key = Form.useWatch('key', form);
const onFinish = async (values: unknown | { key: string }): Promise<void> => {
const params = values as { key: string };
@ -66,16 +71,19 @@ function ApplyLicenseForm({
return (
<ApplyFormContainer>
<ApplyForm layout="inline" onFinish={onFinish}>
<LicenseInput labelAlign="left" name="key">
<Input
onChange={(e): void => {
setKey(e.target.value as string);
}}
placeholder={t('placeholder_license_key')}
/>
<ApplyForm
form={form}
layout="inline"
onFinish={onFinish}
autoComplete="off"
>
<LicenseInput
name="key"
rules={[{ required: true, message: requireErrorMessage('License Key') }]}
>
<Input placeholder={t('placeholder_license_key')} />
</LicenseInput>
<FormItem>
<Form.Item>
<Button
loading={loading}
disabled={loading}
@ -84,9 +92,9 @@ function ApplyLicenseForm({
>
{t('button_apply')}
</Button>
</FormItem>
</Form.Item>
</ApplyForm>
{key && <div style={{ paddingLeft: '0.5em', color: '#666' }}> {key}</div>}
{key && <KeyPreview>{key}</KeyPreview>}
</ApplyFormContainer>
);
}
@ -99,4 +107,8 @@ interface ApplyLicenseFormProps {
>;
}
interface FormValues {
key: string;
}
export default ApplyLicenseForm;

5
frontend/src/container/Licenses/styles.ts
View File

@ -23,3 +23,8 @@ export const LicenseInput = styled(Form.Item)`
}
}
`;
export const KeyPreview = styled.div`
padding-left: 0.5em;
color: #666;
`;