diff --git a/jam-ui/src/components/page/JKMusicSessions.js b/jam-ui/src/components/page/JKMusicSessions.js index d2d6772b8..3982e349c 100644 --- a/jam-ui/src/components/page/JKMusicSessions.js +++ b/jam-ui/src/components/page/JKMusicSessions.js @@ -4,7 +4,7 @@ import { Link } from 'react-router-dom'; import FalconCardHeader from '../common/FalconCardHeader'; import { useTranslation } from 'react-i18next'; import { useDispatch, useSelector } from 'react-redux'; -import { fetchSessions } from '../../store/features/sessionsSlice'; +import { fetchSessions, fetchFriendsSessions, fetchPublicSessions, fetchInactiveSessions } from '../../store/features/sessionsSlice'; import { isIterableArray } from '../../helpers/utils'; import { useResponsive } from '@farfetch/react-context-responsive'; import JKModalDialog from '../common/JKModalDialog'; @@ -23,7 +23,10 @@ function JKMusicSessions() { const { nativeAppUnavailable, setNativeAppUnavailable } = useNativeApp(); useEffect(() => { - dispatch(fetchSessions()); + //dispatch(fetchSessions()); + dispatch(fetchFriendsSessions()); + dispatch(fetchPublicSessions()); + dispatch(fetchInactiveSessions()); }, []); const toggleAppUnavilableModel = () => { diff --git a/jam-ui/src/helpers/rest.js b/jam-ui/src/helpers/rest.js index 13c1673f4..b5fab9ec7 100644 --- a/jam-ui/src/helpers/rest.js +++ b/jam-ui/src/helpers/rest.js @@ -213,6 +213,30 @@ export const getSessions = () => { }); }; +export const getFriendsSessions = () => { + return new Promise((resolve, reject) => { + apiFetch(`/sessions/friends`) + .then(response => resolve(response)) + .catch(error => reject(error)); + }); +}; + +export const getPublicSessions = () => { + return new Promise((resolve, reject) => { + apiFetch(`/sessions/public`) + .then(response => resolve(response)) + .catch(error => reject(error)); + }); +}; + +export const getInactiveSessions = () => { + return new Promise((resolve, reject) => { + apiFetch(`/sessions/inactive`) + .then(response => resolve(response)) + .catch(error => reject(error)); + }); +}; + export const getSessionsHistory = (options = {}) => { return new Promise((resolve, reject) => { apiFetch(`/sessions/history?${new URLSearchParams(options)}`) diff --git a/jam-ui/src/store/features/sessionsSlice.js b/jam-ui/src/store/features/sessionsSlice.js index e6b62209a..3ced285e8 100644 --- a/jam-ui/src/store/features/sessionsSlice.js +++ b/jam-ui/src/store/features/sessionsSlice.js @@ -1,5 +1,5 @@ import { createSlice, createAsyncThunk } from "@reduxjs/toolkit"; -import { getSessions, getPersonById } from '../../helpers/rest' +import { getSessions, getFriendsSessions, getPublicSessions, getInactiveSessions, getPersonById } from '../../helpers/rest' const initialState = { sessions: [], @@ -9,27 +9,50 @@ const initialState = { } export const fetchSessions = createAsyncThunk( - "session/fetchSessions", + "session/fetchSessions", async (options, thunkAPI) => { const response = await getSessions(); return response.json(); } +) +export const fetchFriendsSessions = createAsyncThunk( + "session/fetchFriendsSessions", + async (options, thunkAPI) => { + const response = await getFriendsSessions(options); + return response.json(); + } +) + +export const fetchPublicSessions = createAsyncThunk( + "session/fetchPublicSessions", + async (options, thunkAPI) => { + const response = await getPublicSessions(options); + return response.json(); + } +) + +export const fetchInactiveSessions = createAsyncThunk( + "session/fetchInactiveSessions", + async (options, thunkAPI) => { + const response = await getInactiveSessions(options); + return response.json(); + } ) export const fetchPerson = createAsyncThunk( - 'session/fetchPerson', + 'session/fetchPerson', async (options, thunkAPI) => { - const {userId} = options + const { userId } = options const response = await getPersonById(userId) return response.json() } - ,{ - condition: (options, {getState, extra}) => { - const {session} = getState() - const {userId} = options + , { + condition: (options, { getState, extra }) => { + const { session } = getState() + const { userId } = options const person = session.people.find(person => person.id === userId) - if(person && person.website){ + if (person && person.website) { //only proceed if full data set for user has not been fetched. person.website is not included in the initial data fetching (i.e: in friends listing ). return false; } @@ -41,9 +64,9 @@ export const SessionSlice = createSlice({ name: "session", initialState, reducers: { - addSession: (state) => {}, - updateSession: (state) => {}, - deleteSession: (state) => {}, + addSession: (state) => { }, + updateSession: (state) => { }, + deleteSession: (state) => { }, }, extraReducers: (builder) => { builder @@ -51,28 +74,76 @@ export const SessionSlice = createSlice({ state.status = "loading"; }) .addCase(fetchSessions.fulfilled, (state, action) => { - console.log(action.payload); + // add unique sessions to the array + const records = new Set([...state.sessions, ...action.payload]); + const unique = []; + records.forEach((item) => { + unique.push(item); + }); + state.sessions = unique; + state.error = null; state.status = "succeeded"; - state.sessions = action.payload; }) .addCase(fetchSessions.rejected, (state, action) => { state.status = 'failed' - state.error = action.error.message + state.error = action.error.message + }) + .addCase(fetchFriendsSessions.pending, (state, action) => { + state.status = "loading"; + }) + .addCase(fetchFriendsSessions.fulfilled, (state, action) => { + // add unique sessions to the array + const records = new Set([...state.sessions, ...action.payload.sessions]); + const unique = []; + records.forEach((item) => { + unique.push(item); + }); + state.sessions = unique; + state.error = null; + state.status = "succeeded"; + }) + .addCase(fetchPublicSessions.pending, (state, action) => { + state.status = "loading"; + }) + .addCase(fetchPublicSessions.fulfilled, (state, action) => { + // add unique sessions to the array + const records = new Set([...state.sessions, ...action.payload.sessions]); + const unique = []; + records.forEach((item) => { + unique.push(item); + }); + state.sessions = unique; + state.error = null; + state.status = "succeeded"; + }) + .addCase(fetchInactiveSessions.pending, (state, action) => { + state.status = "loading"; + }) + .addCase(fetchInactiveSessions.fulfilled, (state, action) => { + // add unique sessions to the array + const records = new Set([...state.sessions, ...action.payload.sessions]); + const unique = []; + records.forEach((item) => { + unique.push(item); + }); + state.sessions = unique; + state.error = null; + state.status = "succeeded"; }) .addCase(fetchPerson.fulfilled, (state, action) => { const person = state.people.find(person => person.id === action.payload.id) - if(person){ + if (person) { const updated = { - ...person, + ...person, ...action.payload } const objIndex = state.people.findIndex((p => p.id === updated.id)); state.people[objIndex] = updated - }else{ + } else { state.people.push(action.payload) } }) - } + } }) export default SessionSlice.reducer; \ No newline at end of file