aswi20220x00-gitlab/webapp/contexts/AnnotationContext.tsx @ 9fdb7d55

import React, { createContext, useEffect, useState } from 'react';
import { AnnotationInfo, ETagType, SubTagInfo, TagInfo, TagInstanceInfo } from '../api';
import { Tag } from '../components/types/tag';
import { annotationController } from '../controllers';
import { GetSelectionInfo } from '../utils/selectionUtils';

/**
 * Interface of an annotation context provider.
 */
interface IAnnotationContextProvider {
    /**
     * Tags managed by the context.
     */
    tags: TagInstanceInfo[] | null;

    /**
     * Sets new tags.
     * @param newTags An array of new tags.
     */
    setTags: (newTags: TagInstanceInfo[] | null) => void;

    /**
     * Adds occurrence to an annotation.
     * @param tag Tag whose occurrence should be added.
     */
    addOccurrence: (tag: Tag) => void;

    /**
     * Changes visibility of an annotation.
     * @param tag Tag whose visibility should be changed.
     */
    changeVisibility: (tag: Tag) => void;

    /**
     * Deletes an occurrence of an annotation.
     * @param occurrence Occurrence that should be deleted.
     */
    deleteOccurrence: (occurrence: TagInstanceInfo) => void;

    /**
     * Changes a position of an occurrence of an annotation.
     * @param occurrence Occurrence whose position should be changed.
     * @param newValue New value of the position.
     */
    changePosition: (occurrence: TagInstanceInfo, newValue: number) => void;

    /**
     * Changes a length of an occurrence of an annotation.
     * @param occurrence Occurrence whose length should be changed.
     * @param newValue New value of the length.
     */
    changeLength: (occurrence: TagInstanceInfo, newValue: number) => void;

    annotation: AnnotationInfo | null;
    mappedTags: Tag[] | null;
    refreshAnnotation: () => void;

    markSelectedText: (
        tagId: string,
        subtagId: string | null,
        instanceID: string | null
    ) => void;
}

/**
 * The annotation context that manages active annotations.
 */
export const AnnotationContext = createContext<IAnnotationContextProvider>({
    /**
     * Default tags.
     */
    tags: null,

    /**
     * Default implementation of setTags method.
     * @param v Array of new tags.
     */
    setTags: (v) => {
        return;
    },

    /**
     * Default implementation of addOccurrence method.
     * @param tag The tag with new occurrence.
     */
    addOccurrence: (tag: Tag) => {
        return;
    },

    /**
     * Default implementation of changeVisibility method.
     * @param tag The tag whose visibility should be changed.
     */
    changeVisibility: (tag: Tag) => {
        return;
    },

    /**
     * Default implementation of deleteOccurrence method.
     * @param occurrence Occurrence that should be deleted.
     */
    deleteOccurrence: (occurrence: TagInstanceInfo) => {
        return;
    },

    /**
     * Default implementation of changePosition method.
     * @param occurrence Occurrence whose position should be changed.
     * @param newValue A new position.
     */
    changePosition: (occurrence: TagInstanceInfo, newValue: number) => {
        return;
    },

    /**
     * Default implementation of changeLength method.
     * @param occurrence Occurrence whose length should be changed.
     * @param newValue A new length.
     */
    changeLength: (occurrence: TagInstanceInfo, newValue: number) => {
        return;
    },

    annotation: null,
    mappedTags: null,
    refreshAnnotation: () => {
        return;
    },

    markSelectedText: () => {
        return;
    },
});

/**
 * Provider of the annotation context.
 * @param props Children that should have access to the annotation context.
 * @returns Prepared html of the provider.
 */
const AnnotationProvider = (props: {
    children: React.ReactNode;
    annotationId: string;
}) => {
    const [annotation, setAnnotation] = useState<AnnotationInfo | null>(null);

    /**
     * Tags managed by the context.
     */
    const [tags, setTags] = useState<TagInstanceInfo[] | null>(null);

    const [mappedTags, setMappedTags] = useState<Tag[] | null>(null);

    async function markSelectedText(
        tagId: string,
        subtagId: string | null,
        instanceId: string | null
    ) {
        if (!annotation) {
            console.log('annotation not found');
            return;
        }

        const selectionInfo = GetSelectionInfo(annotation);
        if (!selectionInfo) {
            console.log(
                'not able to continue, selection processing not completed successfully'
            );
            return;
        }

        const id = subtagId ?? tagId;
        const type: ETagType = subtagId == null ? ETagType.Tag : ETagType.Subtag;

        const res = await annotationController.annotationAnnotationIdPost(
            props.annotationId,
            {
                id: id,
                instanceId,
                type,
                position: selectionInfo.startPositionOriginalDocument,
                length: selectionInfo.selectionLengthOriginalDocument,
            }
        );

        await refreshAnnotation();
    }

    /**
     * Default implementation of addOccurrence method.
     * @param tag The tag with new occurrence.
     */
    const addOccurrence = async (tag: Tag) => {
        await markSelectedText(tag.tagId, tag.subtagId ?? null, tag.instanceId);
    };

    /**
     * Changes visibility of an annotation.
     * @param tag Tag whose visibility should be changed.
     */
    const changeVisibility = (tag: Tag) => {
        //TODO: Implement method (should use objects from server API)
    };

    /**
     * Deletes an occurrence of an annotation.
     * @param occurrence Occurrence that should be deleted.
     */
    const deleteOccurrence = async (occurrence: TagInstanceInfo) => {
        if (!occurrence.occurenceId) {
            console.log('invalid occurrence');
            return;
        }

        const deleteRes =
            await annotationController.annotationAnnotationIdOccurenceIdDelete(
                props.annotationId,
                occurrence.occurenceId
            );

        await refreshAnnotation();
    };

    /**
     * Changes a position of an occurrence of an annotation.
     * @param occurrence Occurrence whose position should be changed.
     * @param newValue New value of the position.
     */
    const changePosition = (occurrence: TagInstanceInfo, newValue: number) => {
        //TODO: Implement method (should use objects from server API)
    };

    /**
     * Changes a length of an occurrence of an annotation.
     * @param occurrence Occurrence whose length should be changed.
     * @param newValue New value of the length.
     */
    const changeLength = (occurrence: TagInstanceInfo, newValue: number) => {
        //TODO: Implement method (should use objects from server API)
    };

    const remapAnnotations = (data: AnnotationInfo) => {
        let map = new Map<string, Tag>();
        data.tagInstances?.forEach((tagInstance) => {
            if (map.has(tagInstance.instance ?? '-')) {
                let tag = map.get(tagInstance.instance ?? '-');
                tag!.occurrences = [...tag!.occurrences, tagInstance];
            } else {
                map.set(tagInstance.instance ?? '-', {
                    tagName: tagInstance.tagName ?? '',
                    subtagName: tagInstance.subTagName ?? null,
                    category: tagInstance.tagCategoryName ?? '',
                    visible: true,
                    occurrences: [tagInstance],
                    tagId: tagInstance.tagId ?? '',
                    instanceId: tagInstance.instance ?? '',
                    subtagId: tagInstance.subTagId ?? null,
                });
            }
        });

        setMappedTags(Array.from(map.values()));
    };

    async function refreshAnnotation() {
        const data = await annotationController.annotationAnnotationIdGet(
            props.annotationId
        );

        remapAnnotations(data.data);
        setAnnotation(data.data ?? null);
    }

    /**
     * Initializes the context.
     */
    useEffect(() => {
        refreshAnnotation();
    }, [props.annotationId]);

    return (
        <AnnotationContext.Provider
            value={{
                tags,
                setTags,
                addOccurrence,
                changeVisibility,
                deleteOccurrence,
                changeLength,
                changePosition,
                refreshAnnotation,
                annotation,
                mappedTags,
                markSelectedText,
            }}
        >
            {props.children}
        </AnnotationContext.Provider>
    );
};

export default AnnotationProvider;