TypeError: Cannot read vlastnosti nedefinované (reading 'c')

Dostávám tuto chybu TypeError: Cannot read vlastnosti nedefinované (reading 'c')

v ČKD souboru, kde se na čkd.otáz je. pokud jsem přidat čkd.src.otáz pak chyba přesouvá do src

vše, co je správné podle toho, ale pořád na to nemůžu přijít

žádné řešení???

Často kladené otázky, soubor

import FAQ from "./FAQ";

const FAQs = () => {
    const[faqs, setfaqs]= useState([
        {
            ques: 'question1',
            subtitle: "st1",
            answer: "answer1",
            open: true
        },
        {
            ques: 'question2',
            subtitle: "Pricing",
            answer: "answer2",
            open: false
        },
        {
            ques: 'question3',
            subtitle: "Pricing",
            answer: "question3",
            open: false
        },
    ]);
    
    const toggleFAQ = index => {
        setfaqs(faqs.map((faq, i) => {
            if(i === index) {
                faq.open = !faq.open;
            } else {
                faq.open = false;
            }
            return faq;
        }));
    }
    return (
    <>
        <div className="container">
            <div className="row">
                <div className="col-md-12">
                    <div className="faq-title">
                        <h1>FAQ</h1>
                    </div>
                </div>
            </div>
            <div className="row">
                <div className="col-md-12">
                    <div className="faq-content">
                        {faqs.map((faq, i) => {
                            <FAQ faq={faq} index={i} toggleFAQ={toggleFAQ}/>
                        })}
                    </div>
                </div>
            </div>
        </div>
    </>
    );
};
export default FAQs;

ČKD souboru

function FAQ({faq, index, toggleFAQ}) {
    return (
    <>
        <div className="panel-group" id="accordion">
            <div className="panel panel-default">
                <h4 className="panel-title">
                    <div>{faq.ques}</div>
                </h4>
                    <a data-toggle="#collapse" data-parent="#accordion" onClick={()=>toggleFAQ(index)}>+</a>
            </div>  
            <div id="collapse" className={"panel-collapse in" + (faq.open ? " collapse" : " ")}>
                <div className="panel-body">
                   <h5>{faq.subtitle}</h5>
                   <p>{faq.answer}</p>
                </div>
            </div>
        </div>
    </>
    );
};

export default FAQ;

... .

...........................................................................................................................................................................................................