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/csat/actions.spec.js

@@ -0,0 +1,64 @@
+import axios from 'axios';
+import { actions } from '../../csat';
+import types from '../../../mutation-types';
+
+const commit = vi.fn();
+global.axios = axios;
+vi.mock('axios');
+
+describe('#actions', () => {
+  describe('#get', () => {
+    it('sends correct mutations if API is success', async () => {
+      axios.get.mockResolvedValue({
+        data: [{ id: 1, rating: 1, feedback_text: 'Bad' }],
+      });
+      await actions.get({ commit }, { page: 1 });
+      expect(commit.mock.calls).toEqual([
+        [types.SET_CSAT_RESPONSE_UI_FLAG, { isFetching: true }],
+        [types.SET_CSAT_RESPONSE, [{ id: 1, rating: 1, feedback_text: 'Bad' }]],
+        [types.SET_CSAT_RESPONSE_UI_FLAG, { isFetching: false }],
+      ]);
+    });
+    it('sends correct actions if API is error', async () => {
+      axios.get.mockRejectedValue({ message: 'Incorrect header' });
+      await actions.get({ commit }, { page: 1 });
+      expect(commit.mock.calls).toEqual([
+        [types.SET_CSAT_RESPONSE_UI_FLAG, { isFetching: true }],
+        [types.SET_CSAT_RESPONSE_UI_FLAG, { isFetching: false }],
+      ]);
+    });
+  });
+
+  describe('#getMetrics', () => {
+    it('sends correct mutations if API is success', async () => {
+      axios.get.mockResolvedValue({
+        data: {
+          total_count: 29,
+          ratings_count: { 1: 10, 2: 10, 3: 3, 4: 3, 5: 3 },
+          total_sent_messages_count: 120,
+        },
+      });
+      await actions.getMetrics({ commit }, { page: 1 });
+      expect(commit.mock.calls).toEqual([
+        [types.SET_CSAT_RESPONSE_UI_FLAG, { isFetchingMetrics: true }],
+        [
+          types.SET_CSAT_RESPONSE_METRICS,
+          {
+            total_count: 29,
+            ratings_count: { 1: 10, 2: 10, 3: 3, 4: 3, 5: 3 },
+            total_sent_messages_count: 120,
+          },
+        ],
+        [types.SET_CSAT_RESPONSE_UI_FLAG, { isFetchingMetrics: false }],
+      ]);
+    });
+    it('sends correct actions if API is error', async () => {
+      axios.get.mockRejectedValue({ message: 'Incorrect header' });
+      await actions.getMetrics({ commit }, { page: 1 });
+      expect(commit.mock.calls).toEqual([
+        [types.SET_CSAT_RESPONSE_UI_FLAG, { isFetchingMetrics: true }],
+        [types.SET_CSAT_RESPONSE_UI_FLAG, { isFetchingMetrics: false }],
+      ]);
+    });
+  });
+});

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

@@ -0,0 +1,104 @@
+import { getters } from '../../csat';
+
+describe('#getters', () => {
+  it('getUIFlags', () => {
+    const state = { uiFlags: { isFetching: false } };
+    expect(getters.getUIFlags(state)).toEqual({ isFetching: false });
+  });
+
+  it('getCSATResponses', () => {
+    const state = { records: [{ id: 1, raring: 1, feedback_text: 'Bad' }] };
+    expect(getters.getCSATResponses(state)).toEqual([
+      { id: 1, raring: 1, feedback_text: 'Bad' },
+    ]);
+  });
+
+  it('getMetrics', () => {
+    const state = {
+      metrics: {
+        totalResponseCount: 0,
+        ratingsCount: { 1: 0, 2: 0, 3: 0, 4: 0, 5: 0 },
+      },
+    };
+    expect(getters.getMetrics(state)).toEqual(state.metrics);
+  });
+
+  it('getRatingPercentage', () => {
+    let state = {
+      metrics: {
+        totalResponseCount: 0,
+        ratingsCount: { 1: 0, 2: 0, 3: 0, 4: 0, 5: 0 },
+      },
+    };
+    expect(getters.getRatingPercentage(state)).toEqual({
+      1: 0,
+      2: 0,
+      3: 0,
+      4: 0,
+      5: 0,
+    });
+
+    state = {
+      metrics: {
+        totalResponseCount: 50,
+        ratingsCount: { 1: 10, 2: 20, 3: 15, 4: 3, 5: 2 },
+      },
+    };
+    expect(getters.getRatingPercentage(state)).toEqual({
+      1: '20.00',
+      2: '40.00',
+      3: '30.00',
+      4: '6.00',
+      5: '4.00',
+    });
+  });
+
+  it('getResponseRate', () => {
+    expect(
+      getters.getResponseRate({
+        metrics: { totalResponseCount: 0, totalSentMessagesCount: 0 },
+      })
+    ).toEqual(0);
+
+    expect(
+      getters.getResponseRate({
+        metrics: { totalResponseCount: 20, totalSentMessagesCount: 50 },
+      })
+    ).toEqual('40.00');
+  });
+
+  it('getSatisfactionScore', () => {
+    expect(
+      getters.getSatisfactionScore({
+        metrics: {
+          totalResponseCount: 0,
+          ratingsCount: { 1: 0, 2: 0, 3: 0, 4: 0, 5: 0 },
+        },
+      })
+    ).toEqual(0);
+
+    expect(
+      getters.getSatisfactionScore({
+        metrics: {
+          totalResponseCount: 54,
+          ratingsCount: { 1: 0, 2: 0, 3: 0, 4: 12, 5: 15 },
+        },
+      })
+    ).toEqual('50.00');
+  });
+
+  it('getRatingCount', () => {
+    const state = {
+      metrics: {
+        ratingsCount: { 1: 10, 2: 20, 3: 15, 4: 3, 5: 2 },
+      },
+    };
+    expect(getters.getRatingCount(state)).toEqual({
+      1: 10,
+      2: 20,
+      3: 15,
+      4: 3,
+      5: 2,
+    });
+  });
+});

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

@@ -0,0 +1,52 @@
+import types from '../../../mutation-types';
+import { mutations } from '../../csat';
+
+describe('#mutations', () => {
+  describe('#SET_CSAT_RESPONSE_UI_FLAG', () => {
+    it('set uiFlags correctly', () => {
+      const state = { uiFlags: { isFetching: true } };
+      mutations[types.SET_CSAT_RESPONSE_UI_FLAG](state, { isFetching: false });
+      expect(state.uiFlags).toEqual({ isFetching: false });
+    });
+  });
+
+  describe('#SET_CSAT_RESPONSE', () => {
+    it('set records correctly', () => {
+      const state = { records: [] };
+      mutations[types.SET_CSAT_RESPONSE](state, [
+        { id: 1, rating: 1, feedback_text: 'Bad' },
+      ]);
+      expect(state.records).toEqual([
+        { id: 1, rating: 1, feedback_text: 'Bad' },
+      ]);
+    });
+  });
+
+  describe('#SET_CSAT_RESPONSE_METRICS', () => {
+    it('set metrics correctly', () => {
+      const state = { metrics: {} };
+      mutations[types.SET_CSAT_RESPONSE_METRICS](state, {
+        total_count: 29,
+        ratings_count: { 1: 10, 2: 10, 3: 3, 4: 3, 5: 3 },
+        total_sent_messages_count: 120,
+      });
+      expect(state.metrics).toEqual({
+        totalResponseCount: 29,
+        ratingsCount: { 1: 10, 2: 10, 3: 3, 4: 3, 5: 3 },
+        totalSentMessagesCount: 120,
+      });
+    });
+
+    it('set ratingsCount correctly', () => {
+      const state = { metrics: {} };
+      mutations[types.SET_CSAT_RESPONSE_METRICS](state, {
+        ratings_count: { 1: 5 },
+      });
+      expect(state.metrics).toEqual({
+        totalResponseCount: 0,
+        ratingsCount: { 1: 5, 2: 0, 3: 0, 4: 0, 5: 0 },
+        totalSentMessagesCount: 0,
+      });
+    });
+  });
+});