lesson 2 finished

src/components/ui/controlled/controlled-checkbox/controlled-checkbox.tsx

@@ -0,0 +1,36 @@
+import { FieldValues, useController, UseControllerProps } from 'react-hook-form'
+
+import { Checkbox, CheckboxProps } from '../../'
+
+export type ControlledCheckboxProps<TFieldValues extends FieldValues> =
+  UseControllerProps<TFieldValues> & Omit<CheckboxProps, 'onChange' | 'value' | 'id'>
+
+export const ControlledCheckbox = <TFieldValues extends FieldValues>({
+  name,
+  rules,
+  shouldUnregister,
+  control,
+  defaultValue,
+  ...checkboxProps
+}: ControlledCheckboxProps<TFieldValues>) => {
+  const {
+    field: { onChange, value },
+  } = useController({
+    name,
+    rules,
+    shouldUnregister,
+    control,
+    defaultValue,
+  })
+
+  return (
+    <Checkbox
+      {...{
+        onChange,
+        checked: value,
+        id: name,
+        ...checkboxProps,
+      }}
+    />
+  )
+}