Initial commit: Add logistics and order_detail message types

- Add Logistics component with progress tracking
- Add OrderDetail component for order information
- Support data-driven steps and actions
- Add blue color scale to widget SCSS
- Fix node overflow and progress bar rendering issues
- Add English translations for dashboard components

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

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

@@ -0,0 +1,85 @@
+import { actions } from '../../agent';
+import { agents } from './data';
+import { getFromCache, setCache } from 'shared/helpers/cache';
+import { getAvailableAgents } from 'widget/api/agent';
+
+let commit = vi.fn();
+vi.mock('widget/helpers/axios');
+
+vi.mock('widget/api/agent');
+vi.mock('shared/helpers/cache');
+
+describe('#actions', () => {
+  describe('#fetchAvailableAgents', () => {
+    const websiteToken = 'test-token';
+
+    beforeEach(() => {
+      commit = vi.fn();
+      vi.clearAllMocks();
+    });
+
+    it('returns cached data if available', async () => {
+      getFromCache.mockReturnValue(agents);
+      await actions.fetchAvailableAgents({ commit }, websiteToken);
+
+      expect(getFromCache).toHaveBeenCalledWith(
+        `chatwoot_available_agents_${websiteToken}`
+      );
+      expect(getAvailableAgents).not.toHaveBeenCalled();
+      expect(setCache).not.toHaveBeenCalled();
+      expect(commit).toHaveBeenCalledWith('setAgents', agents);
+      expect(commit).toHaveBeenCalledWith('setError', false);
+      expect(commit).toHaveBeenCalledWith('setHasFetched', true);
+    });
+
+    it('fetches and caches data if no cache available', async () => {
+      getFromCache.mockReturnValue(null);
+      getAvailableAgents.mockReturnValue({ data: { payload: agents } });
+
+      await actions.fetchAvailableAgents({ commit }, websiteToken);
+
+      expect(getFromCache).toHaveBeenCalledWith(
+        `chatwoot_available_agents_${websiteToken}`
+      );
+      expect(getAvailableAgents).toHaveBeenCalledWith(websiteToken);
+      expect(setCache).toHaveBeenCalledWith(
+        `chatwoot_available_agents_${websiteToken}`,
+        agents
+      );
+      expect(commit).toHaveBeenCalledWith('setAgents', agents);
+      expect(commit).toHaveBeenCalledWith('setError', false);
+      expect(commit).toHaveBeenCalledWith('setHasFetched', true);
+    });
+
+    it('sends correct actions if API is success', async () => {
+      getFromCache.mockReturnValue(null);
+
+      getAvailableAgents.mockReturnValue({ 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 () => {
+      getFromCache.mockReturnValue(null);
+
+      getAvailableAgents.mockRejectedValue({
+        message: 'Authentication required',
+      });
+      await actions.fetchAvailableAgents({ commit }, 'Hi');
+      expect(commit.mock.calls).toEqual([
+        ['setError', true],
+        ['setHasFetched', true],
+      ]);
+    });
+  });
+
+  describe('#updatePresence', () => {
+    it('commits the correct presence value', () => {
+      actions.updatePresence({ commit }, { 1: 'online' });
+      expect(commit.mock.calls).toEqual([['updatePresence', { 1: 'online' }]]);
+    });
+  });
+});

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,61 @@
+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('#setHasFetched', () => {
+    it('set fetched flag', () => {
+      const state = { records: [], uiFlags: {} };
+      mutations.setHasFetched(state, true);
+      expect(state.uiFlags.hasFetched).toEqual(true);
+    });
+  });
+
+  describe('#updatePresence', () => {
+    it('updates agent presence', () => {
+      const state = { records: agents };
+      mutations.updatePresence(state, { 1: 'busy', 2: 'online' });
+      expect(state.records).toEqual([
+        {
+          id: 1,
+          name: 'John',
+          avatar_url: '',
+          availability_status: 'busy',
+        },
+        {
+          id: 2,
+          name: 'Xavier',
+          avatar_url: '',
+          availability_status: 'online',
+        },
+        {
+          id: 3,
+          name: 'Pranav',
+          avatar_url: '',
+          availability_status: 'offline',
+        },
+        {
+          id: 4,
+          name: 'Nithin',
+          avatar_url: '',
+          availability_status: 'offline',
+        },
+      ]);
+    });
+  });
+});