list friends, public and inactive sessions in browse session page

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 = () => {

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

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: [],
@@ -14,7 +14,30 @@ export const fetchSessions = createAsyncThunk(
     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(
@@ -51,14 +74,62 @@ 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
       })
+      .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) {