From a0f3337ae0acc99c6875d196879d1a2d792366c0 Mon Sep 17 00:00:00 2001
From: moonrailgun <moonrailgun@gmail.com>
Date: Thu, 16 Dec 2021 20:16:39 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20fast=20form=20=E5=A2=9E=E5=8A=A0checkbo?=
 =?UTF-8?q?x?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 web/src/components/WebFastForm/index.tsx      |  2 ++
 .../components/WebFastForm/types/Checkbox.tsx | 25 +++++++++++++++++++
 2 files changed, 27 insertions(+)
 create mode 100644 web/src/components/WebFastForm/types/Checkbox.tsx

diff --git a/web/src/components/WebFastForm/index.tsx b/web/src/components/WebFastForm/index.tsx
index 6288f5e7..25f36922 100644
--- a/web/src/components/WebFastForm/index.tsx
+++ b/web/src/components/WebFastForm/index.tsx
@@ -11,12 +11,14 @@ import { FastFormText } from './types/Text';
 import { FastFormTextArea } from './types/TextArea';
 import { FastFormPassword } from './types/Password';
 import { FastFormSelect } from './types/Select';
+import { FastFormCheckbox } from './types/Checkbox';
 import { FastFormCustom } from './types/Custom';
 
 regField('text', FastFormText);
 regField('textarea', FastFormTextArea);
 regField('password', FastFormPassword);
 regField('select', FastFormSelect);
+regField('checkbox', FastFormCheckbox);
 regField('custom', FastFormCustom);
 
 const WebFastFormContainer: FastFormContainerComponent = React.memo((props) => {
diff --git a/web/src/components/WebFastForm/types/Checkbox.tsx b/web/src/components/WebFastForm/types/Checkbox.tsx
new file mode 100644
index 00000000..6b8425c9
--- /dev/null
+++ b/web/src/components/WebFastForm/types/Checkbox.tsx
@@ -0,0 +1,25 @@
+import React from 'react';
+import { Form, Checkbox } from 'antd';
+import type { FastFormFieldComponent } from 'tailchat-shared';
+import { getValidateStatus } from '../utils';
+
+export const FastFormCheckbox: FastFormFieldComponent = React.memo((props) => {
+  const { name, label, value, onChange, error } = props;
+
+  return (
+    <Form.Item
+      label={label}
+      validateStatus={getValidateStatus(error)}
+      help={error}
+    >
+      <Checkbox
+        name={name}
+        checked={Boolean(value)}
+        onChange={(e) => onChange(e.target.checked)}
+      >
+        {label}
+      </Checkbox>
+    </Form.Item>
+  );
+});
+FastFormCheckbox.displayName = 'FastFormCheckbox';