Feature: As an end-user, I should be able to see the list of agents in the widget. (#461)

Co-authored-by: Pranav Raj S <pranavrajs@gmail.com>

app/javascript/widget/store/modules/specs/agent/actions.spec.js

@@ -0,0 +1,28 @@
+import { API } from 'widget/helpers/axios';
+import { actions } from '../../agent';
+import { agents } from './data';
+
+const commit = jest.fn();
+jest.mock('widget/helpers/axios');
+
+describe('#actions', () => {
+  describe('#fetchAvailableAgents', () => {
+    it('sends correct actions if API is success', async () => {
+      API.get.mockResolvedValue({ data: { payload: agents } });
+      await actions.fetchAvailableAgents({ commit }, 'Hi');
+      expect(commit.mock.calls).toEqual([
+        ['setAgents', agents],
+        ['setError', false],
+        ['setHasFetched', true],
+      ]);
+    });
+    it('sends correct actions if API is error', async () => {
+      API.get.mockRejectedValue({ message: 'Authentication required' });
+      await actions.fetchAvailableAgents({ commit }, 'Hi');
+      expect(commit.mock.calls).toEqual([
+        ['setError', true],
+        ['setHasFetched', true],
+      ]);
+    });
+  });
+});

app/javascript/widget/store/modules/specs/agent/data.js

@@ -0,0 +1,26 @@
+export const agents = [
+  {
+    id: 1,
+    name: 'John',
+    avatar_url: '',
+    availability_status: 'online',
+  },
+  {
+    id: 2,
+    name: 'Xavier',
+    avatar_url: '',
+    availability_status: 'offline',
+  },
+  {
+    id: 3,
+    name: 'Pranav',
+    avatar_url: '',
+    availability_status: 'online',
+  },
+  {
+    id: 4,
+    name: 'Nithin',
+    avatar_url: '',
+    availability_status: 'online',
+  },
+];

app/javascript/widget/store/modules/specs/agent/getters.spec.js

@@ -0,0 +1,30 @@
+import { getters } from '../../agent';
+import { agents } from './data';
+
+describe('#getters', () => {
+  it('availableAgents', () => {
+    const state = {
+      records: agents,
+    };
+    expect(getters.availableAgents(state)).toEqual([
+      {
+        id: 1,
+        name: 'John',
+        avatar_url: '',
+        availability_status: 'online',
+      },
+      {
+        id: 3,
+        name: 'Pranav',
+        avatar_url: '',
+        availability_status: 'online',
+      },
+      {
+        id: 4,
+        name: 'Nithin',
+        avatar_url: '',
+        availability_status: 'online',
+      },
+    ]);
+  });
+});

app/javascript/widget/store/modules/specs/agent/mutations.spec.js

@@ -0,0 +1,28 @@
+import { mutations } from '../../agent';
+import agents from './data';
+
+describe('#mutations', () => {
+  describe('#setAgents', () => {
+    it('set agent records', () => {
+      const state = { records: [] };
+      mutations.setAgents(state, agents);
+      expect(state.records).toEqual(agents);
+    });
+  });
+
+  describe('#setError', () => {
+    it('set error flag', () => {
+      const state = { records: [], uiFlags: {} };
+      mutations.setError(state, true);
+      expect(state.uiFlags.isError).toEqual(true);
+    });
+  });
+
+  describe('#setError', () => {
+    it('set fetched flag', () => {
+      const state = { records: [], uiFlags: {} };
+      mutations.setHasFetched(state, true);
+      expect(state.uiFlags.hasFetched).toEqual(true);
+    });
+  });
+});