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

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

export interface TrackingToolState {
    isLoading: boolean // whether the data is being loaded
    pathDto?: PathDto // the data
    pathVariants?: PathVariant[] // undefined signals that no path variants were yet fetched from the API
    lastError?: string // consumable for errors during thunks
    mapCenter: LatLngTuple // pair of latitude and longitude
    primaryPathIdx: number // index of the primary path
    // trigger to close the dialog when API call is finished
    dialogApiCallSuccess: boolean
    pathsPerPage: number // max number of paths to show on the map at once
    currentPage: number // current page of paths - starts from 0
}

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) => item.displayable)
    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,
        }),
        updateMapMarker: (state: TrackingToolState, action: { payload: { idx: number, item: MapPoint } }) => {
            const { idx, item } = action.payload
            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),
                    ]
                })
            }
        },
        clear: () => ({ ...initialState }),
    },
    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 } =
    trackingToolSlice.actions
const trackingToolReducer = trackingToolSlice.reducer
export default trackingToolReducer