Redux toolkit how to call action from other slice on one action fullfilled

Question

1. I have a async action name editLoginIdData() in loginsIdSlice.js, which i am dispatching from certain component, which edits the data in mongoDB database, then when the action is fullfilled, i mutate the state in extraReducers editLoginIdData.fulfilled.

2. But now what i want to do that whenever the editLoginIdData action is fullfilled i want to also add the updated(which i will get from server responese -> updatedData at editLoginIdData()) data to activitiesData state, which i am handling in activitiesSlice.js

3. So basically is there a way that when editLoginIdData action is fullfilled we can dispatch somehow mutate the state in other slice.

4. One approach i have taken is to import the editLoginIdData() action in activitiesSlice.js and then creating a extraReducer with editLoginIdData.fullfilled and mutating activitiesData state.

5. I have done the above approach and seems its working correctly.

6. But there is a catch, like how show i get the response data at editLoginIdData() to passed to activitiesSlice.js because i will required that updated data.

7. if the above appraoch is not correct, then how should i do it

loginsIdSlice.js

import { createAsyncThunk, createSlice } from "@reduxjs/toolkit";
import * as api from "../../api"

const initialState = {
    loginsIdData: [],
}




export const fecthLoginIdsData = createAsyncThunk("loginIds/fetch", async ({ user_id }, { getState }) => {
    const res = await api.fetchUserLoginIds(user_id);
    console.log(res);
    const { data } = res;
    data.reverse();
    return data;
});

export const addNewLoginIdData = createAsyncThunk("loginIds/add", async ({ data, user_id }, { getState }) => {
    const res = await api.addNewLoginIdA(data, user_id)
    const { loginIdsArray } = res.data;
    return loginIdsArray[loginIdsArray.length - 1];
});

export const editLoginIdData = createAsyncThunk("loginIds/edit", async ({ updatedData, login_id }, { getState }) => {
    const res = await api.editLoginId(login_id, updatedData);
    // console.log(updatedData);
    return updatedData;
});

export const deleteLoginData = createAsyncThunk("loginIds/delete", async ({ login_id, user_id }, { getState }) => {
    const res = await api.deleteLoginId(login_id, user_id);
    // console.log(res);
    const { data } = res;
    // console.log(data);
    return data.reverse();
});



//* Slice
const loginsIdSlice = createSlice({

    name: 'loginsId',
    initialState: initialState,
   

    extraReducers: (builder) => {
        builder.
            addCase(fecthLoginIdsData.fulfilled, (state, action) => {
                return {
                    ...state,
                    loginsIdData: action.payload
                };
            }).
            addCase(addNewLoginIdData.fulfilled, (state, action) => {
                return {
                    ...state,
                    loginsIdData: [action.payload, ...state.loginsIdData]
                };
            }).
            addCase(editLoginIdData.fulfilled, (state, action) => {
                const newArray = state.loginsIdData.map((loginId) => {
                    if (loginId._id === action.payload._id) {
                        return action.payload;
                    } else {
                        return loginId;
                    }
                });
                return {
                    ...state,
                    loginsIdData: newArray,
                };
            }).
            addCase(deleteLoginData.fulfilled, (state, action) => {
                return {
                    ...state,
                    loginsIdData: action.payload
                };
            })

    }

})


export const { deleteLoginId, editLoginId } = loginsIdSlice.actions;

export default loginsIdSlice.reducer;

activitiesSlice

import { createAsyncThunk, createSlice } from "@reduxjs/toolkit";
import * as api from "../../api"

import { editLoginIdData } from "../loginsId/loginsIdSlice"

const initialState = {
    activitiesData: [],
}

const activitiesSlice = createSlice({

    name: 'activities',
    initialState: initialState,


    extraReducers: (builder) => {
        builder.
            addCase(editLoginIdData.fullfilled, (state, action) => {
                console.log("ss")
                return {
                    ...state,
                    activitiesData: []
                };
            })

    }

})

export default activitiesSlice.reducer;

Is there a way that when editLoginIdData action is fullfilled we can dispatch somehow mutate the state in other slice.