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/dashboard/store/modules/specs/webhooks/actions.spec.js

@@ -0,0 +1,100 @@
+import axios from 'axios';
+import { actions } from '../../webhooks';
+import * as types from '../../../mutation-types';
+import webhooks from './fixtures';
+
+const commit = vi.fn();
+global.axios = axios;
+vi.mock('axios');
+
+describe('#actions', () => {
+  describe('#get', () => {
+    it('sends correct actions if API is success', async () => {
+      axios.get.mockResolvedValue({ data: { payload: { webhooks } } });
+      await actions.get({ commit });
+      expect(commit.mock.calls).toEqual([
+        [types.default.SET_WEBHOOK_UI_FLAG, { fetchingList: true }],
+        [types.default.SET_WEBHOOK, webhooks],
+        [types.default.SET_WEBHOOK_UI_FLAG, { fetchingList: false }],
+      ]);
+    });
+    it('sends correct actions if API is error', async () => {
+      axios.get.mockRejectedValue({ message: 'Incorrect header' });
+      await actions.get({ commit });
+      expect(commit.mock.calls).toEqual([
+        [types.default.SET_WEBHOOK_UI_FLAG, { fetchingList: true }],
+        [types.default.SET_WEBHOOK_UI_FLAG, { fetchingList: false }],
+      ]);
+    });
+  });
+
+  describe('#create', () => {
+    it('sends correct actions if API is success', async () => {
+      axios.post.mockResolvedValue({
+        data: { payload: { webhook: webhooks[0] } },
+      });
+      await actions.create({ commit }, webhooks[0]);
+      expect(commit.mock.calls).toEqual([
+        [types.default.SET_WEBHOOK_UI_FLAG, { creatingItem: true }],
+        [types.default.ADD_WEBHOOK, webhooks[0]],
+        [types.default.SET_WEBHOOK_UI_FLAG, { creatingItem: false }],
+      ]);
+    });
+    it('sends correct actions if API is error', async () => {
+      axios.post.mockRejectedValue({ message: 'Incorrect header' });
+      await expect(actions.create({ commit }, webhooks[0].id)).rejects.toEqual({
+        message: 'Incorrect header',
+      });
+      expect(commit.mock.calls).toEqual([
+        [types.default.SET_WEBHOOK_UI_FLAG, { creatingItem: true }],
+        [types.default.SET_WEBHOOK_UI_FLAG, { creatingItem: false }],
+      ]);
+    });
+  });
+
+  describe('#update', () => {
+    it('sends correct actions if API is success', async () => {
+      axios.patch.mockResolvedValue({
+        data: { payload: { webhook: webhooks[1] } },
+      });
+      await actions.update({ commit }, webhooks[1]);
+      expect(commit.mock.calls).toEqual([
+        [types.default.SET_WEBHOOK_UI_FLAG, { updatingItem: true }],
+        [types.default.UPDATE_WEBHOOK, webhooks[1]],
+        [types.default.SET_WEBHOOK_UI_FLAG, { updatingItem: false }],
+      ]);
+    });
+    it('sends correct actions if API is error', async () => {
+      axios.put.mockRejectedValue({ message: 'Incorrect header' });
+      await expect(actions.update({ commit }, webhooks[0])).rejects.toThrow(
+        Error
+      );
+      expect(commit.mock.calls).toEqual([
+        [types.default.SET_WEBHOOK_UI_FLAG, { updatingItem: true }],
+        [types.default.SET_WEBHOOK_UI_FLAG, { updatingItem: false }],
+      ]);
+    });
+  });
+
+  describe('#delete', () => {
+    it('sends correct actions if API is success', async () => {
+      axios.delete.mockResolvedValue({ data: webhooks[0] });
+      await actions.delete({ commit }, webhooks[0].id);
+      expect(commit.mock.calls).toEqual([
+        [types.default.SET_WEBHOOK_UI_FLAG, { deletingItem: true }],
+        [types.default.DELETE_WEBHOOK, webhooks[0].id],
+        [types.default.SET_WEBHOOK_UI_FLAG, { deletingItem: false }],
+      ]);
+    });
+    it('sends correct actions if API is error', async () => {
+      axios.delete.mockRejectedValue({ message: 'Incorrect header' });
+      await expect(actions.delete({ commit }, webhooks[0].id)).rejects.toEqual({
+        message: 'Incorrect header',
+      });
+      expect(commit.mock.calls).toEqual([
+        [types.default.SET_WEBHOOK_UI_FLAG, { deletingItem: true }],
+        [types.default.SET_WEBHOOK_UI_FLAG, { deletingItem: false }],
+      ]);
+    });
+  });
+});

app/javascript/dashboard/store/modules/specs/webhooks/fixtures.js

@@ -0,0 +1,17 @@
+export default [
+  {
+    id: 4,
+    url: 'https://1.chatwoot.com',
+    account_id: 1,
+  },
+  {
+    id: 5,
+    url: 'https://2.chatwoot.com',
+    account_id: 1,
+  },
+  {
+    id: 6,
+    url: 'https://3.chatwoot.com',
+    account_id: 1,
+  },
+];

app/javascript/dashboard/store/modules/specs/webhooks/getters.spec.js

@@ -0,0 +1,30 @@
+import { getters } from '../../webhooks';
+import webhooks from './fixtures';
+
+describe('#getters', () => {
+  it('getInboxes', () => {
+    const state = {
+      records: webhooks,
+    };
+    expect(getters.getWebhooks(state)).toEqual(webhooks);
+  });
+
+  it('getUIFlags', () => {
+    const state = {
+      uiFlags: {
+        fetchingList: false,
+        fetchingItem: false,
+        creatingItem: false,
+        updatingItem: false,
+        deletingItem: false,
+      },
+    };
+    expect(getters.getUIFlags(state)).toEqual({
+      fetchingList: false,
+      fetchingItem: false,
+      creatingItem: false,
+      updatingItem: false,
+      deletingItem: false,
+    });
+  });
+});

app/javascript/dashboard/store/modules/specs/webhooks/mutations.spec.js

@@ -0,0 +1,43 @@
+import * as types from '../../../mutation-types';
+import { mutations } from '../../webhooks';
+import webhooks from './fixtures';
+
+describe('#mutations', () => {
+  describe('#SET_WEBHOOK', () => {
+    it('set webhook records', () => {
+      const state = { records: [] };
+      mutations[types.default.SET_WEBHOOK](state, webhooks);
+      expect(state.records).toEqual(webhooks);
+    });
+  });
+
+  describe('#ADD_WEBHOOK', () => {
+    it('push newly created webhook data to the store', () => {
+      const state = {
+        records: [],
+      };
+      mutations[types.default.ADD_WEBHOOK](state, webhooks[0]);
+      expect(state.records).toEqual([webhooks[0]]);
+    });
+  });
+
+  describe('#DELETE_WEBHOOK', () => {
+    it('delete webhook record', () => {
+      const state = {
+        records: [webhooks[0]],
+      };
+      mutations[types.default.DELETE_WEBHOOK](state, webhooks[0].id);
+      expect(state.records).toEqual([]);
+    });
+  });
+
+  describe('#UPDATE_WEBHOOK', () => {
+    it('update webhook ', () => {
+      const state = {
+        records: [webhooks[0]],
+      };
+      mutations[types.default.UPDATE_WEBHOOK](state, webhooks[0]);
+      expect(state.records[0].url).toEqual('https://1.chatwoot.com');
+    });
+  });
+});