Skip to content
Snippets Groups Projects
Select Git revision
  • b65c2de121242d45831548b9ee6b4ccf16a77468
  • main default protected
2 results

AnnotationText.js

  • Michael F's avatar
    Michael F authored
    b65c2de1
    History
    Code owners
    Assign users and groups as approvers for specific file changes. Learn more.
    AnnotationText.js 2.46 KiB
    import React from 'react';
    
    function AnnotationText({
        question,
        generatedSentences,
        activeChunkIdx,
        chunkIdxToSentenceIdxMap,
        setChunkIdxToSentenceIdxMap,
        sentenceIdxToChunkIdxMap,
        setSentenceIdxToChunkIdxMap
    }) {
        const handleClick = (sentenceIdx) => {
            const newChunkIdxToSentenceIdxMap = { ...chunkIdxToSentenceIdxMap };
            const newSentenceIdxToChunkIdxMap = { ...sentenceIdxToChunkIdxMap };
    
            if (!newChunkIdxToSentenceIdxMap[activeChunkIdx]) {
                newChunkIdxToSentenceIdxMap[activeChunkIdx] = [];
            }
            if (!newSentenceIdxToChunkIdxMap[sentenceIdx]) {
                console.log("fresh instance for sentence created")
                newSentenceIdxToChunkIdxMap[sentenceIdx] = [];
            }
    
            if (newChunkIdxToSentenceIdxMap[activeChunkIdx].includes(sentenceIdx)) {
                newChunkIdxToSentenceIdxMap[activeChunkIdx] = newChunkIdxToSentenceIdxMap[activeChunkIdx].filter(item => item !== sentenceIdx);
            } else {
                newChunkIdxToSentenceIdxMap[activeChunkIdx].push(sentenceIdx);
            }
    
            if (newSentenceIdxToChunkIdxMap[sentenceIdx].includes(activeChunkIdx)) {
                console.log("chunk already included in sentence")
                newSentenceIdxToChunkIdxMap[sentenceIdx] = newSentenceIdxToChunkIdxMap[sentenceIdx].filter(item => item !== activeChunkIdx);
            } else {
                console.log("chunk was not included in sentence")
                newSentenceIdxToChunkIdxMap[sentenceIdx].push(activeChunkIdx);
            }
    
            setChunkIdxToSentenceIdxMap(newChunkIdxToSentenceIdxMap);
            setSentenceIdxToChunkIdxMap(newSentenceIdxToChunkIdxMap);
        };
    
        return (
            <div style =  {{
                border: '1px solid',
                borderRadius: '0.25rem',
                padding: "10px",
                marginBottom: "10px"
            }}>
                <h4>{question}</h4>
                {generatedSentences.map((sentence, idx) => (
                    <a
                        key={idx}
                        onClick={() => handleClick(idx)}
                        style={{
                            cursor: 'pointer',
                            backgroundColor: chunkIdxToSentenceIdxMap[activeChunkIdx]?.includes(idx) ? '#00ffff' : 'transparent',
                            color: chunkIdxToSentenceIdxMap[activeChunkIdx]?.includes(idx) ? 'black' : '',
                        }}
                    >
                        {sentence + ". "}
                    </a>
                ))}
            </div>
        );
    }
    
    export default AnnotationText;