aswi2022code-of-duty-gitlab/frontend/src/features/TrackingTool/trackingToolSlice.ts @ fe068d3a

import { createSlice } from "@reduxjs/toolkit"
import { LatLngTuple } from "leaflet"
import mapConfig from "../../config/mapConfig"
import { PathDto } from "../../swagger/data-contracts"
import buildPathVariants, { isMapPointDisplayable, MapPoint, PathVariant } from "./Map/pathUtils"
import { sendTextForProcessing } from "./trackingToolThunks"
import storage from "redux-persist/lib/storage"
import TrackingToolState from './TrackingToolState'


const defaultPathsPerPage = 5

const initialState: TrackingToolState = {
    isLoading: false,
    mapCenter: [mapConfig.defaultCoordinates[0], mapConfig.defaultCoordinates[1]],
    primaryPathIdx: 0,
    dialogApiCallSuccess: true,
    pathsPerPage: defaultPathsPerPage,
    currentPage: 0,
}

const calculateMapCenter = (pathVariant: PathVariant): LatLngTuple | undefined => {
    const displayableItems = pathVariant.filter((item) => isMapPointDisplayable(item))
    if (displayableItems.length === 0) {
        return undefined
    }

    return [
        displayableItems
            .map((item) => item.catalogItem.latitude ?? 0)
            .reduce((a, b) => a + b, 0) / displayableItems.length,
        displayableItems
            .map((item) => item.catalogItem.longitude ?? 0)
            .reduce((a, b) => a + b, 0) / displayableItems.length,
    ]
}

const persistConfig = {
    key: "auth",
    storage, // localStorage for browsers
}

export const trackingToolSlice = createSlice({
    name: "trackingTool",
    initialState,
    reducers: {
        consumeErr: (state: TrackingToolState) => ({
            ...state,
            lastErr: undefined,
        }),
        setPrimaryIdx: (state: TrackingToolState, action: any) => ({
            ...state,
            primaryPathIdx: action.payload,
        }),
        resetDialogApiCallSuccess: (state: TrackingToolState) => ({
            ...state,
            dialogApiCallSuccess: false,
        }),
        setPage: (state: TrackingToolState, action: { payload: number }) => ({
            ...state,
            currentPage: action.payload,
        }),
        // Updates map marker while ignoring its idx property
        updateMapMarkerWithId: (state: TrackingToolState, action: { payload: { id: string, item: MapPoint } }) => {
            const { item } = action.payload
            const idx = state.primaryPathIdx
            if (!state.pathVariants || state.pathVariants.length <= idx) {
                return state
            }

            const mapMarkerIdx = state.pathVariants[idx].findIndex((item) => item.id === action.payload.id)
            if (mapMarkerIdx === -1) {
                return state
            }

            const newPathVariant = [...state.pathVariants[idx]]
            newPathVariant[mapMarkerIdx] = item
            return {
                ...state,
                pathVariants: [...state.pathVariants.slice(0, idx), newPathVariant, ...state.pathVariants.slice(idx + 1)],
            }
        },
        // Updates map marker based on its idx property
        updateMapMarker: (state: TrackingToolState, action: { payload: { item: MapPoint } }) => {
            const { item } = action.payload
            const idx = state.primaryPathIdx
            if (!state.pathVariants || state.pathVariants.length <= idx) {
                return state
            }

            return {
                ...state,
                pathVariants: state.pathVariants.map((pathVariant, i) => {
                    if (i !== idx) {
                        return [...pathVariant]
                    }

                    return [
                        ...pathVariant.slice(0, item.idx),
                        item,
                        ...pathVariant.slice(item.idx + 1),
                    ]
                })
            }
        },
        swapMapMarkerIndices: (state: TrackingToolState, action: { payload: { destination: number, source: number } }) => {
            const { destination, source } = action.payload
            if (!state.pathVariants || state.pathVariants.length === 0) {
                return state
            }

            return {
                ...state,
                pathVariants: state.pathVariants.map((pathVariant, i) => {
                    if (state.primaryPathIdx !== i) {
                        return [...pathVariant]
                    }

                    if (pathVariant.length <= destination || pathVariant.length <= source) {
                        return [...pathVariant]
                    }

                    // JS dark magic splice
                    const result = [...pathVariant]
                    const [removed] = result.splice(source, 1)
                    result.splice(destination, 0, removed)
                    return result
                })
            }
        },
        clear: () => ({ ...initialState }),
        mergeWithCurrentPath: (state: TrackingToolState, action: { payload: PathVariant }) => {
            const { payload: jsonPath } = action
            if (!jsonPath) {
                return { ...state }
            }

            const pathVariants = [...state.pathVariants ?? []]
            let primaryPathIdx = state.primaryPathIdx
            let currentPage = state.currentPage

            // If there are no path append a new array to the pathVariants array and set primaryIdx to 0
            if (pathVariants.length === 0) {
                primaryPathIdx = 0
                currentPage = 0
                pathVariants.push([])
            }

            // Get the path and create a map to check whether some point with the same id already exists
            const path = pathVariants[primaryPathIdx]
            const pathMap = new Map(path.map((item) => [item.catalogItem.id as string, item]))

            // Create an array of items to be replaced and items to be added to the end
            // const itemsToReplace: MapPoint[] = []
            const itemsToAdd: MapPoint[] = []
            jsonPath.forEach((item) => {
                if (!pathMap.has(item.catalogItem.id as string)) {
                    itemsToAdd.push(item)
                    return
                }

                // const idx = pathMap.get(item.catalogItem.id as string)!.idx
                // item.idx = idx
                // itemsToReplace.push(item)
            })

            // Iterate over items to replace and replace them
            const newPath = [...path]
            // itemsToReplace.forEach((item) => {
            //     newPath[item.idx] = item
            // })

            // Add items to the end
            itemsToAdd.forEach((item) => {
                item.active = !state.pathVariants || state.pathVariants.length === 0
                item.idx = newPath.length
                newPath.push(item)
            })

            // Return the new path
            return {
                ...state,
                pathVariants: [
                    ...pathVariants.slice(0, primaryPathIdx),
                    newPath,
                    ...pathVariants.slice(primaryPathIdx + 1),
                ],
                primaryPathIdx, // in case the list is empty
                currentPage, // in case the list is empty
            }
        }
    },
    extraReducers: (builder) => {
        builder.addCase(sendTextForProcessing.fulfilled, (state, action) => {
            const pathDto: PathDto = action.payload
            const pathVariants = buildPathVariants(pathDto)

            const mapCenter = calculateMapCenter(pathVariants[state.primaryPathIdx])
            return {
                ...state,
                pathVariants,
                pathDto,
                mapCenter: mapCenter ?? state.mapCenter,
                isLoading: false,
                dialogApiCallSuccess: true,
                currentPage: 0,
            }
        })
        builder.addCase(sendTextForProcessing.rejected, (_, action) => ({
            ...initialState,
            lastError: action.error.message,
            isLoading: false,
            dialogApiCallSuccess: false,
            currentPage: 0,
        }))
        builder.addCase(sendTextForProcessing.pending, (state) => {
            return {
                ...state,
                isLoading: true,
                dialogApiCallSuccess: false,
            }
        })
    },
})

export const {
    consumeErr,
    setPrimaryIdx,
    resetDialogApiCallSuccess,
    clear,
    updateMapMarker,
    mergeWithCurrentPath,
    swapMapMarkerIndices,
    updateMapMarkerWithId
} = trackingToolSlice.actions
const trackingToolReducer = trackingToolSlice.reducer
export default trackingToolReducer