aswi20220x00-gitlab/webapp/components/annotation/AnnotationPanel.tsx @ 162db5f6

import { Stack } from 'react-bootstrap';
import { AnnotationItem } from './AnnotationItem';
import { useContext } from 'react';
import { AnnotationContext } from '../../contexts/AnnotationContext';

/**
 * Creates a panel in the annotation screen that contains a list of annotations.
 * @returns Panel with a list of annotations.
 */
export function AnnotationPanel() {
    const { mappedTags } = useContext(AnnotationContext);

    return (
        <div>
            <Stack gap={2}>
                {mappedTags?.map((tag, index) => {
                    return <AnnotationItem key={index} tag={tag} />;
                })}
            </Stack>
        </div>
    );
}