Untitled

i have a function as below:
 //Evaluate language text values from wcmKeys file
    const evalLangText = (key, text) => {
        if (key === undefined || key === null || _.isEmpty(key)) return text ? text : '';

        const storageLookupKey = `lift-wcm-${AppContext.pagedetails.getRootContext()}-${AppContext.pagedetails.getPageName()}-${Util.getLocale()}`;
        const langTextData = JSON.parse(Util.getSessionData(storageLookupKey));
        if (langTextData) {
            return langTextData.hasOwnProperty(key.toLowerCase())
                ? langTextData[key.toLowerCase()]
                : langTextData.hasOwnProperty(key)
                ? langTextData[key]
                : text
                ? text
                : key;
        }
        return text ? text : key;
    };


update the below code for placeholderKey and arialabelKey as that is not working.

import React from 'react';
import { useForm } from 'react-hook-form';
import { InputText } from 'primereact/inputtext';
import PrimeWrapper from '../primeWrapper/primeWrapper';
import PropTypes from 'prop-types';
import classNames from 'classnames';
import { useAppState } from '@d-lift/core';
import { v4 as uuidv4 } from 'uuid';

const PrimeInputText = (props) => {
    const [modelValue, setModelValue] = useAppState(props.model, props.value ? props.value : null);
    const {
        register,
        formState: { errors },
    } = useForm({
        mode: 'all',
    });
    const { id, value, model, validations, children, onBlur, onChange, ...rest } = props;

    const handleInputChange = (event) => {
        // If autoCapitalize is true, convert input to uppercase
        setModelValue(props.autoCapitalize ? event.target.value.toUpperCase() : event.target.value);
    };

    return (
        (props.showIf !== undefined ? props.showIf : true) && (
            <span className="prime-input-text-wrapper">
                <div>
                    <label className={props.labelClassName}>
                        {props.evalLangText(props.labelKey, props.label)}
                    </label>
                </div>
                <span className="prime-input-text-container">
                    {props.prefixLabel ||
                        (props.prefixLabelKey && (
                            <span
                                className={classNames(
                                    'prime-input-text-prefix',
                                    props.prefixLabelClass,
                                )}>
                                <span>
                                    {props.evalLangText(props.prefixLabelKey, props.prefixLabel)}
                                </span>
                            </span>
                        ))}
                    <InputText
                        id={id ? id : uuidv4() + '_inputText'}
                        {...rest}
                        value={modelValue}
                        ariaLabel={props.evalLangText(props.ariaLabelKey, props.ariaLabel)}
                        placeholder={props.evalLangText(props.placeholderKey, props.placeholder)}
                        {...register(model, {
                            validate: validations,
                            onChange: (e) => {
                                handleInputChange(e);
                                if (onChange) {
                                    onChange(e);
                                }
                            },
                            onBlur: (e) => {
                                if (onBlur) {
                                    onBlur(e);
                                }
                            },
                        })}>
                        {children}
                    </InputText>
                    {props.suffixLabel ||
                        (props.suffixLabelKey && (
                            <span
                                className={classNames(
                                    'prime-input-text-suffix',
                                    props.suffixLabelClass,
                                )}>
                                <span>
                                    {props.evalLangText(props.suffixLabelKey, props.suffixLabel)}
                                </span>
                            </span>
                        ))}

                    {props.helperTextShowIf &&
                        (props.helperTextLabelKey || props.helperTextLabel) && (
                            <div>
                                <small
                                    className={classNames(
                                        'ux-input-helper-text',
                                        props.helperTextClassName,
                                    )}
                                    // aria-live={helperTextAriaLive}
                                    // id={`${id}_helptext`}
                                >
                                    {props.evalLangText(
                                        props.helperTextLabelKey,
                                        props.helperTextLabel,
                                    )}
                                </small>
                            </div>
                        )}
                    {errors[model]?.message && (
                        <div
                            id={`errorMessageSpanForElementWithId_${props.id}`}
                            className="p-error"
                            // role="alert"
                            //is-error="true"
                        >
                            {errors[model]?.message}
                        </div>
                    )}
                </span>
            </span>
        )
    );
};

PrimeInputText.propTypes = {
    /** Define/Generate a unique id for the component */
    id: PropTypes.string,
    /** Determines if the component is hidden or shown */
    showIf: PropTypes.bool,
    /** Accepts a Content Manager key and assigns the value to the label of the input */
    label: PropTypes.string,
    labelKey: PropTypes.string,
    /** List of CSS classnames to apply on label element  */
    labelClassName: PropTypes.string,
    /**aria label key*/
    ariaLabelKey: PropTypes.string,
    /**placeholder key*/
    placeholderKey: PropTypes.string,
    /** Text to prepend as a prefix label inside the input */
    prefixLabelKey: PropTypes.string,
    /** Text to prepend from a dynamic source, such as a Content Manager */
    prefixLabel: PropTypes.string,
    /** List of CSS classnames to apply on prefix text  */
    prefixLabelClass: PropTypes.string,
    /** Appends the value of a Suffix Label Text to the label */
    suffixLabel: PropTypes.string,
    /** Appends the value of a key from the Content Manager to the label */
    suffixLabelKey: PropTypes.string,
    /** List of CSS classnames to apply on suffix text  */
    suffixLabelClass: PropTypes.string,
    /** Prop that automatically capitalizes entered text */
    autoCapitalize: PropTypes.bool,
    /** Assistive component that conveys additional guidance about the field, such as how it will be used and what types in values should be provided. */
    helperTextLabel: PropTypes.string,
    /** Helper Text via Label Key for locale compatability */
    helperTextLabelKey: PropTypes.string,
    /** Helper text class name */
    helperTextClassName: PropTypes.string,
    /** Determines if helper text is hidden or shown */
    helperTextShowIf: PropTypes.bool,
    /** Determines if an input is required for Form validation */
    required: PropTypes.oneOfType([PropTypes.bool, PropTypes.string]),
};

PrimeInputText.defaultProps = {
    model: '',
};

export default PrimeWrapper(PrimeInputText);