edit form with existing data not reflected in dropdown

[dsound-zz]

We are using react-native-web and on the web side with an edit form, the existing data sets the correct dropdown just fine. The web side imports from the depreciated 'react-native'. On the native side, importing from '@react-native-picker/picker', the drop down menus don't reflect the changes. Also, the same library using checkboxes doesn't work either.

We have a reusable component:

  <AccessibleSelect
              selectedValue={grade}
              options={childMenusData?.menus?.schoolGrades.map((sg) => ({
                label: sg.title,
                value: sg?.id,
              }))}
              onValueChange={(val) => setGrade(val)}
              label={t('ChildForms.Grade')}
              defaultValue={grade}
              testID="grade"
              inputStyle={styles.selectStyles}
              tooltipText={isMobile ? 'What is a grade?' : ''}
              tooltipContent={t('ChildForms.WhatIsAGradeContent')}
              tooltipPlacement={'bottom'}
            />

The actual Picker component:

 <View style={[styles.container, additionalContainerStyles]}>
      <View style={{ flexDirection: 'row', justifyContent: 'space-between' }}>
        {label && <Text style={styles.label}>{label}</Text>}
        {tooltipText && tooltipContent && (
          <Tooltip
            text={tooltipText}
            content={tooltipContent}
            placement={tooltipPlacement}
          />
        )}
      </View>
      <Picker
        ref={refToAttachToInput}
        style={[
          Platform.OS === 'ios'
            ? styles.pickerIOS
            : [
                styles.picker,
                { borderColor, borderStyle: 'solid', borderWidth: 1 },
              ],
          inputStyle,
        ]}
        selectedValue={selectedValue}
        onValueChange={onValueChange}
        defaultValue={defaultValue && defaultValue}
        itemStyle={styles.pickerText}
        mode={isAndroid && 'dropdown'}
      >
        {/* <Picker.Item
          // label={`${selectLabel}`}
          key={label}
          value={defaultValue || label}
        /> */}
        {options.map((o) => (
          <Picker.Item label={o.label} key={o.value} value={o.value} />
        ))}
      </Picker>

      <View
        style={[
          styles.bottomContainer,
          { justifyContent: fieldError ? 'space-between' : 'flex-end' },
        ]}
      >
        {!!fieldError && (
          <Text accessibilityLiveRegion="assertive" style={styles.errorText}>
            {fieldError}
          </Text>
        )}
      </View>
    </View>
  )
}