Failing on trying to use a function as a command in Cypress

I’m starting to work with Cypress and programming in general. I’m working on a very simple personal project executing TCs in a webpage.

I have this piece of code in ‘registrationPage.js’

/// <reference types="cypress" />
import registrationData from '../fixtures/registrationData.json'
import AccountInfoPage from './accountInfoPage'

class RegistrationPage{

    //Fill out Registration form with valid credentials
    fillRegistrationForm(){
        
        const validUser = registrationData.validData.user1

        const firstname = Cypress.env('firstname') || 'DefaultFirstName'
        const lastname = Cypress.env('lastname') || 'DefaultLastName'
        const email = Cypress.env('email') || '[email protected]'
        const password = Cypress.env('password') || 'DefaultPassword123'
        const passConfirm = Cypress.env('passConfirm') || 'DefaultPassword123'

        cy.get('[title="First Name"]').type(firstname)
        cy.get('#lastname').type(lastname)
        cy.get('[autocomplete="email"]').type(email)
        cy.get('#password').type(password)
        cy.get('#password-confirmation').type(passConfirm)
        
    }

Since this is a logic that I wan to re-use (only the part of getting the data, not typing it) I thought it would be a good option to have it in ‘commands.js’ file as a Command.

I have a data set located in registrationData.json but I also wanted to use environment variables in case I want to quickly override what the data set has (I would also like to hear if there is better options to handle this)

I put the logic into commands.js:

import registrationData from '../fixtures/registrationData.json'
import loginData from '../fixtures/loginData.json'

Cypress.Commands.add('getRegistrationData', function(){
    const getUserData = () => {
        const validUser = registrationData.validData.user1
    
        return {
            firstname: Cypress.env('firstname') || validUser.firstname,
            lastname: Cypress.env('lastname') || validUser.lastname,
            email: Cypress.env('email') || validUser.email,
            password: Cypress.env('password') || validUser.password,
            passConfirm: Cypress.env('passConfirm') || validUser.passConfirm
        }
    }
})

But when I try to make use of it in registration.spec.js in this way:

import RegistrationPage from "../page-objects/registrationPage"
import LoginPage from "../page-objects/loginPage"

describe('Registration page scenario mapping', () => {

    it.only('Executes a sucessfull registration in the form', () => {

        const registrationPage = new RegistrationPage()
        cy.visit('customer/account/create')

        registrationPage.fillRegistrationForm()
        registrationPage.submitRegistrationForm()
        registrationPage.verifyRegistration()
        
    })

    it('login', function(){
        const loginPage = new LoginPage()

        cy.visit('/')
        cy.contains('a', 'Sign In').should('be.visible').click()
        cy.contains('h1', 'Customer Login').should('be.visible')
        loginPage.fillLoginForm()
    })

})

It gives me an error in registrationPage.js saying that the values withing the .type() are undefined.
I tried with validUser.firstname instead but same error and if I use just ‘validUser’ as value it says that is an object and you can’t type that. I don’t understand why if I put validUser.firstname doesn’t recognize the value.

Sorry if I made the question in the wrongway or something, I hope someone can help me out. Thanks