Profile Form

ProfileForm edits selected fields on the active Patient resource. The host app chooses which fields to show and supplies their current values. On submit, the default behavior patches only changed values through the active native Ovok client.

Configure fields from profile dataCopy Anchor Link

Show the form only after the signed-in profile has loaded. Pass the current values from that profile; ProfileForm does not fetch initial field values on its own.

import { ProfileForm } from "@ovok/native";
import * as Yup from "yup";
import { Alert } from "react-native";

const fields = [
  {
    name: "name[0].given",
    label: "First name",
    type: "text" as const,
    value: "Alex",
    validation: Yup.string().trim().required("Enter your first name"),
  },
  {
    name: "name[0].family",
    label: "Last name",
    type: "text" as const,
    value: "Morgan",
  },
  {
    name: "birthDate",
    label: "Date of birth",
    type: "date" as const,
    value: "1990-01-01",
  },
];

export function EditProfileScreen() {
  return (
    <ProfileForm
      fields={fields}
      onSuccess={() => Alert.alert("Profile saved", "Your changes are up to date.")}
    />
  );
}

Replace the example values with the loaded Patient values. name is a path on the Patient resource. Supported field types are text, date, and select; select fields also take options: { label, value }[]. Each field can include a Yup validation, disabled, and testID value.

Save behaviorCopy Anchor Link

The default submit handler compares values with the provided initial values, creates patch operations for changed fields, updates the active Patient, and refetches the profile. It then calls onSuccess with the updated Patient. onError(error) receives a failed default save or a rejected custom onSubmit; it receives the original error, including available status, code, or request-ID details. Default-save failures also show the form's generic or network submit error. onSuccess is called only after the save and profile refresh succeed. Errors thrown by onSuccess are application callback errors, not save failures, and are not sent to onError.

Pass onSubmit(values, helpers) to own persistence. A custom submitter replaces the default patch; your handler must set form errors and refresh app data as needed. The custom and default submission modes are mutually exclusive.

The form reinitializes when its fields values change. If refreshed profile data arrives while a user is editing, this resets unsaved changes. Decide when to refresh or remount the form, and only expose fields your product and backend allow users to edit.

Related guidesCopy Anchor Link

• Session management for profile and session state
• Authentication integration guide