Untitled

window.location.origin + "/response?rfi_id=" + {response.rfiid}

url:  /response?rfi_id=51234

update the below code in use effect to if url has rfiId, then loadResponseData is loaded through that i.e. send this rfi id in requestBody to do the service call if not load using rfi passed from search screen.


value of rfi:{
                    id: rowData.id,
                    title: rowData.title,
                    description: rowData.description,
                    state: rowData.state,
                    dueDT: rowData.dueDT,
                    programs: rowData.programs,
                    category: rowData.category,
                    offering: rowData.offering,
                },
          


import React, { useEffect } from 'react';
import { withPage, Lift, useAppState, Util, AppContext } from '@d-lift/core';
import BodySection from '@/Layout/BodySection';
import webService from '@/Services/WebService';
import Questions from './Components/Questions';
import RFIDetails from './Components/RFIDetails';
import SummarizeResponse from './Components/SummarizeResponse';
import SummarizeRFIDetails from './Components/SummarizeRFIDetails';
import { Page, Section } from '@d-lift/uxcomponents';
import './response.scss';
import Moment from 'moment';

const RFIResponse = () => {
    const [responseData, setResponseData] = useAppState('responseData', false);
    const [rfi, setRfi] = useAppState('rfi');
    const [responseStats, setResponseStats] = useAppState('responseStats', '');
    const [updatedDueDt, setUpdatedDueDt] = useAppState('updatedDueDt', '');
    const [summarizeResponse, setSummarizeResponse] = useAppState('summarizeResponse', false);

    const updateResponseData = (newResponseData) => {
        setResponseData(newResponseData);
    };
    const updateSummarizeResponse = (newState) => {
        setSummarizeResponse(newState);
    };
    useEffect(() => {
        const rfiURL= ;
        if(rfiURL){
            rfi.id = 
        }
        if (rfi) {
            loadResponseData(rfi);

            const dueDate = formatDueDate(rfi.dueDT);
            setUpdatedDueDt(dueDate);
        }
    }, [rfi]);

    useEffect(() => {
        if (responseData) {
            const stats = calculateResponseStats(responseData.questions);
            setResponseStats(stats);
        }
    }, [responseData]);

    const loadResponseData = async (rfi) => {
        try {
            Lift.spinner.show();

            const response = await webService.getFullDetails({
                requestBody: { rfiId: rfi?.id },
            });

            if (response) {
                updateResponseData(response);
                //Lift.Application.Notification.success('Response Data loaded successfully');
            }
        } catch (error) {
            console.log(error);
            //Lift.Application.Notification.error('Failed to load Response Data');
        } finally {
            Lift.spinner.hide();
        }
    };

    const formatDueDate = (dueDT) => {
        const dueDate = Moment(dueDT).format('MMM DD, yyyy');

        const parsedDueDate = new Date(dueDT);
        const today = new Date();
        const timeDifference = parsedDueDate - today;

        const daysDifference = Math.ceil(timeDifference / (1000 * 60 * 60 * 24));

        let dueDateText;
        if (daysDifference === 1) {
            dueDateText = `${dueDate} (${daysDifference} day)`;
        } else if (daysDifference > 1) {
            dueDateText = `${dueDate} (${daysDifference} days)`;
        } else if (daysDifference === 0) {
            dueDateText = `${dueDate} (today)`;
        } else if (daysDifference === -1) {
            dueDateText = `${dueDate} (${Math.abs(daysDifference)} day exceeded)`;
        } else if (daysDifference < -1) {
            dueDateText = `${dueDate} (${Math.abs(daysDifference)} days exceeded)`;
        } else {
            dueDateText = `${dueDate} (${daysDifference} days)`;
        }

        return dueDateText;
    };

    const calculateResponseStats = (data) => {
        const totalQuestions = data.length;
        const answeredQuestions = data.filter((q) => q?.answers && q?.answers.length > 0).length;
        const percentageAnswered = Math.round(
            totalQuestions > 0 ? (answeredQuestions / totalQuestions) * 100 : 0,
        );
        return `${answeredQuestions} of ${totalQuestions} (${percentageAnswered}%)`;
    };

    return (
        <Page ref-table-list="OFFERING,STATE,PROGRAM,CATEGORY">
            <BodySection>
                {rfi && !summarizeResponse && (
                    <RFIDetails
                        rfi={rfi}
                        responseStats={responseStats}
                        updatedDueDt={updatedDueDt}
                        summarizeResponse={summarizeResponse}
                        updateSummarizeResponse={updateSummarizeResponse}
                    />
                )}

                {responseData && !summarizeResponse && (
                    <Questions
                        responseData={responseData.questions}
                        updateResponseData={updateResponseData}></Questions>
                )}

                {rfi && summarizeResponse && (
                    <>
                        <SummarizeRFIDetails
                            rfi={rfi}
                            responseStats={responseStats}
                            updatedDueDt={updatedDueDt}
                            summarizeResponse={summarizeResponse}
                            updateSummarizeResponse={updateSummarizeResponse}
                        />
                        {responseData && (
                            <SummarizeResponse
                                summarizeResponse={summarizeResponse}
                                responseData={responseData.questions}
                            />
                        )}
                    </>
                )}
            </BodySection>
        </Page>
    );
};

export default withPage(
    {
        Description: 'Respond to an RFI page',
        ContentManager: true,
        LayoutStyle: 'rfi-dashboard',
    },
    RFIResponse,
);