Untitled

import React from 'react';
import {
    Accordian,
    AccordianElement,
    Label,
    Button,
    Para,
} from '@d-lift/uxcomponents';
import PropTypes from 'prop-types';
import '@/Validations/customValidations';

const Questions = ({ responseData }) => {
    return (
        <div className="ux-rfi-green-border mt-4">
            <Label labelKey="Questions"></Label>

            {responseData.map((item, index) =>
                item.questionsList.map((question, qIndex) => (
                    <Accordian id={`outer-accordian-${index}-${qIndex}`} key={`${index}-${qIndex}`}>
                        <AccordianElement headerText={question.question}>
                            <Label>{question.answers.length} &nbsp; Responses:</Label>

                            <Accordian id={`inner-accordian-${index}-${qIndex}`}>
                                {question.answers.map((answer, aIndex) => (
                                    <AccordianElement
                                        key={`${index}-${qIndex}-${aIndex}`}
                                        headerText={answer.state}>
                                        <Para>{answer.answer}</Para>
                                        <Button
                                            id={`edit-btn-${index}-${qIndex}-${aIndex}`}
                                            size="small"
                                            className="ux-rfi-green-button float-right mt-4 mb-2"
                                            labelKey="edit_response"
                                            // click={() => Navigate.to('/create-rfi')}
                                        ></Button>
                                    </AccordianElement>
                                ))}
                            </Accordian>

                            <Button
                                id={`respond-btn-${index}-${qIndex}`}
                                size="small"
                                className="ux-rfi-green-button float-right mt-4 mb-2"
                                labelKey="respond_question"
                                // click={() => Navigate.to('/create-rfi')}
                            ></Button>
                        </AccordianElement>
                    </Accordian>
                ))
            )}
        </div>
    );
};

Questions.propTypes = {
    responseData: PropTypes.array.isRequired,
};

export default Questions;