Switch

<FormField
              control={form.control}
              name="receive_marketing_emails"
              render={({ field }) => (
                <FormItem className="flex flex-row items-center gap-3">
                  <FormControl>
                    <Switch
              className="mb-0"
                      checked={field.value === true}
                      onCheckedChange={(nextValue) => {
                        field.onChange(nextValue)
                        form.setValue(field.name, nextValue, {
                          shouldValidate: true,
                          shouldDirty: true,
                          shouldTouch: true
                        })
                      }}
                      
                    />
                  </FormControl>
                  <div className="space-y-0.5 text-left">
                    <FormLabel>Receive Marketing Emails</FormLabel>
                    <FormDescription>Receive emails about new products, features, and more.</FormDescription>
                  </div>
                  <FormMessage />
                </FormItem>
              )}
            />