aswi20220x00-gitlab/webapp/contexts/AnnotationContext.tsx @ b80a6919

import React, { createContext, useEffect, useState } from 'react';
import {
    AnnotationInfo,
    ETagSentiment,
    ETagType,
    MarkAnnotationDoneRequest,
    TagInstanceInfo,
} from '../api';
import { Tag } from '../components/types/tag';
import { annotationController } from '../controllers';
import { GetSelectionInfo } from '../utils/selectionUtils';
import { ShowConfirm, ShowConfirmDelete, ShowToast } from '../utils/alerts';
import { useRouter } from 'next/router';

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

    /**
     * Submitting boolean
     */
    submitting: boolean;

    /**
     * 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;

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

    /**
     * Finishes annotation of document (marked as DONE).
     */
    finishAnnotation: () => 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;

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

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

    makeOccurrenceFinal: (occurrence: TagInstanceInfo) => void;

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

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

    selectedInstanceId: string | null;
    setSelectedInstanceId: (newId: string | null) => void;

    selectedOccurrenceId: string | null;
    setSelectedOccurrenceId: (newId: string | null) => void;

    isFinal: boolean;
}

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

    /**
     * Submitting boolean
     */
    submitting: false,

    /**
     * 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 deleteOccurrence method.
     * @param occurrence Occurrence that should be deleted.
     */
    deleteOccurrence: (occurrence: TagInstanceInfo) => {
        return;
    },

    /**
     * Finishes annotation of document (marked as DONE).
     */
    finishAnnotation: () => {
        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;
    },

    /**
     * Changes a note of an occurrence of an annotation.
     * @param occurrence Occurrence whose note should be changed.
     * @param newValue New value of the note.
     */
    changeNote: (occurrence: TagInstanceInfo, newValue: string) => {
        return;
    },

    /**
     * Changes sentiment of an annotation.
     * @param occurrence Occurrence whose sentiment should be changed.
     * @param newValue New value of the sentiment.
     */
    changeSentiment: (occurrence: TagInstanceInfo, newValue: ETagSentiment) => {
        return;
    },

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

    markSelectedText: () => {
        return;
    },

    selectedInstanceId: null,
    setSelectedInstanceId: (newId: string | null) => {
        return;
    },

    selectedOccurrenceId: null,
    setSelectedOccurrenceId: (newId: string | null) => {
        return;
    },

    isFinal: false,
    makeOccurrenceFinal: (occurrence: TagInstanceInfo) => {
        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;
    isFinal: boolean;
}) => {
    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);
    const [selectedInstanceId, setSelectedInstanceId] = useState<string | null>(null);
    const [selectedOccurrenceId, setSelectedOccurrenceId] = useState<string | null>(null);

    const [submitting, setSubmitting] = useState(false);

    const router = useRouter();

    async function markSelectedText(
        tagId: string,
        subtagId: string | null,
        instanceId: string | null
    ) {
        setSubmitting(true);
        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'
            );
            ShowToast('Není označen žádný text pro přidělení značky', 'warning');
            setSubmitting(false);
            return;
        }

        const id = subtagId ?? tagId;
        const type: ETagType = subtagId == null ? ETagType.Tag : ETagType.Subtag;
        const res = await annotationController
            .annotationAnnotationIdPost(props.annotationId, props.isFinal, {
                id: id,
                instanceId,
                type,
                position: selectionInfo.startPositionOriginalDocument,
                length: selectionInfo.selectionLengthOriginalDocument,
                selectedText: selectionInfo.selectedText,
            })
            .catch((e) =>
                ShowToast('Tato část textu je již touto značkou anotována', 'warning')
            );

        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);
    };

    /**
     * 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;
        }

        ShowConfirmDelete(() => {
            annotationController
                .annotationAnnotationIdOccurenceIdDelete(
                    props.annotationId,
                    occurrence.occurenceId ?? '',
                    props.isFinal
                )
                .then(() => refreshAnnotation());
        }, 'značku');
    };

    /**
     * Finishes annotation of document (marked as DONE).
     */
    const finishAnnotation = () => {
        const req: MarkAnnotationDoneRequest = { done: true };
        ShowConfirm(
            () =>
                annotationController
                    .annotationAnnotationIdDonePut(props.annotationId, props.isFinal, req)
                    .then(() => {
                        if (props.isFinal) {
                            router.push('/documents/admin');
                        } else {
                            router.push('/documents/annotator');
                        }

                        ShowToast('Anotování bylo úspěšně dokončeno');
                    }),
            'dokončit anotování'
        );
    };

    /**
     * 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)
    };

    /**
     * Changes a note of an occurrence of an annotation.
     * @param occurrence Occurrence whose note should be changed.
     * @param newValue New value of the note.
     */
    const changeNote = async (occurrence: TagInstanceInfo, newValue: string) => {
        if (!occurrence.occurenceId) {
            console.log('invalid occurrence');
            return;
        }

        const postRes =
            await annotationController.annotationAnnotationIdTagOccurenceIdNotePost(
                props.annotationId,
                occurrence.occurenceId,
                props.isFinal,
                { note: newValue }
            );

        occurrence.note = newValue;
    };

    /**
     * Changes sentiment of an annotation.
     * @param occurrence Occurrence whose sentiment should be changed.
     * @param newValue New value of the sentiment.
     */
    const changeSentiment = async (
        occurrence: TagInstanceInfo,
        newValue: ETagSentiment
    ) => {
        if (!occurrence.instance) {
            console.log('invalid instance');
            return;
        }

        const putRes =
            await annotationController.annotationAnnotationIdInstanceIdSentimentPut(
                props.annotationId,
                occurrence.instance,
                props.isFinal,
                { sentiment: newValue }
            );

        occurrence.sentiment = newValue;
    };

    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 ?? '',
                    occurrences: [tagInstance],
                    tagId: tagInstance.tagId ?? '',
                    instanceId: tagInstance.instance ?? '',
                    subtagId: tagInstance.subTagId ?? null,
                });
            }
        });

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

    async function makeOccurrenceFinal(occurrence: TagInstanceInfo) {
        if (!occurrence?.occurenceId) {
            return;
        }

        await annotationController.annotationAnnotationIdOccurenceIdFinalPut(
            props.annotationId,
            occurrence.occurenceId,
            { isFinal: true }
        );

        await refreshAnnotation();
    }

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

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

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

    return (
        <AnnotationContext.Provider
            value={{
                tags,
                submitting,
                setTags,
                addOccurrence,
                deleteOccurrence,
                finishAnnotation,
                changeLength,
                changePosition,
                changeNote,
                changeSentiment,
                refreshAnnotation,
                annotation,
                mappedTags,
                markSelectedText,
                selectedInstanceId,
                setSelectedInstanceId,
                selectedOccurrenceId,
                setSelectedOccurrenceId,
                isFinal: props.isFinal,
                makeOccurrenceFinal,
            }}
        >
            {props.children}
        </AnnotationContext.Provider>
    );
};

export default AnnotationProvider;