React-select com Unform está dando erro

Programação
, , ,
#1

Olá, estou com problemas com o unform usando junto com o react-select, basicamente eu quero inserir esse select no unform, segui o tutorial que encontrei no próprio npm do react-select porém ele me retorna o seguinte erro:

useField.ts:31 Uncaught TypeError: Cannot read properties of undefined (reading 'finais_de_semana')
    at useField.ts:31:1
    at mountMemo (react-dom.development.js:15846:1)
    at Object.useMemo (react-dom.development.js:16219:1)
    at useMemo (react.development.js:1532:1)
    at p (useField.ts:22:1)
    at SelectComponent (index.tsx:63:1)
    at renderWithHooks (react-dom.development.js:14985:1)
    at mountIndeterminateComponent (react-dom.development.js:17811:1)
    at beginWork (react-dom.development.js:19049:1)
    at HTMLUnknownElement.callCallback (react-dom.development.js:3945:1)

Esse é o meu código:

import { useRef, useEffect } from 'react'
import { useField } from '@unform/core'
import ReactSelect, { Props as SelectProps } from 'react-select'
import { Content, Label } from './styles'

interface IProps extends SelectProps {
  text?: string
  width?: string
  name?: any
  props?: any
  type?: string
  options?: any
  isMultiple?: boolean
  placeholder?: string
  widthContent?: string
  id?: string
}

function SelectComponent(props: IProps) {
  const selectRef = useRef(null)
  const { fieldName, defaultValue, registerField } = useField(props.name)

  useEffect(() => {
    console.log('aaa', selectRef.current)
    registerField({
      name: fieldName,
      ref: selectRef.current,
      getValue: (ref: any) => {
        if (props?.isMultiple) {
          if (!ref?.state?.value) {
            return []
          }
          return ref?.state?.value?.map((option: any) => option?.value)
        } else {
          if (!ref?.state?.value) {
            return ''
          }
          return ref?.state?.value?.value
        }
      },
      setValue: (selectRef: any, value: any) => {
        selectRef.select.select.setValue(value)
      }
    })
  }, [fieldName, registerField, props.isMultiple])

  return (
    <Content widthContent={props.widthContent}>
      <Label width={props.width} htmlFor={props.name}>
        {props.text}
      </Label>

      <ReactSelect
        name={fieldName}
        aria-label={fieldName}
        options={props.options}
        defaultValue={defaultValue}
        classNamePrefix={'react-select'}
        ref={selectRef}
        isMulti={props.isMultiple}
        {...props}
      />
    </Content>
  )
}

export default SelectComponent

Esse é o objeto que estou passando pra ele:

  {
    isMultiple: true,
    name: 'finais_de_semana',
    options: [
      {
        value: 'segunda', label: 'Segunda'
      },
      {
        value: 'terça', label: 'Terça'
      },
      {
        value: 'quarta', label: 'Quarta'
      },
      {
        value: 'quinta', label: 'Quinta'
      },
      {
        value: 'sexta', label: 'Sexta'
      },
      {
        value: 'sabado', label: 'Sábado'
      },
      {
        value: 'domingo', label: 'Domingo'
      }
    ]
  }

Se alguém puder me ajudar, ficarei muito agradecida <3

#2

conseguiu resolver?

#3