import { Form } from "@raycast/api";
import { useState } from "react";
export default function Command() {
const [nameError, setNameError] = useState<string | undefined>();
const [passwordError, setPasswordError] = useState<string | undefined>();
function dropNameErrorIfNeeded() {
if (nameError && nameError.length > 0) {
function dropPasswordErrorIfNeeded() {
if (passwordError && passwordError.length > 0) {
setPasswordError(undefined);
placeholder="Enter your name"
onChange={dropNameErrorIfNeeded}
if (event.target.value?.length == 0) {
setNameError("The field should't be empty!");
onChange={dropPasswordErrorIfNeeded}
const value = event.target.value;
if (value && value.length > 0) {
if (!validatePassword(value)) {
setPasswordError("Password should be at least 8 characters!");
dropPasswordErrorIfNeeded();
setPasswordError("The field should't be empty!");
<Form.TextArea id="bioTextArea" title="Add Bio" placeholder="Describe who you are" />
<Form.DatePicker id="birthDate" title="Date of Birth" />
function validatePassword(value: string): boolean {
return value.length >= 8;