@capillarytech/creatives-library 8.0.348 → 8.0.349

package/v2Containers/Templates/messages.js

@@ -618,4 +618,100 @@ export default defineMessages({
     id: `${scope}.templateUpdateSuccess`,
     defaultMessage: 'Template updated successfully',
   },
+  "archiveTemplates": {
+    id: `${scope}.archiveTemplates`,
+    defaultMessage: 'Archive templates',
+  },
+  "archiveTemplateContent": {
+    id: `${scope}.archiveTemplateContent`,
+    defaultMessage: 'These templates will be archived and unavailable for use. You can restore them anytime.',
+  },
+  "archiveTemplateSingleContent": {
+    id: `${scope}.archiveTemplateSingleContent`,
+    defaultMessage: 'This template will be archived and unavailable for use. You can restore it anytime.',
+  },
+  "unarchiveTemplates": {
+    id: `${scope}.unarchiveTemplates`,
+    defaultMessage: 'Unarchive templates',
+  },
+  "unarchiveTemplateContent": {
+    id: `${scope}.unarchiveTemplateContent`,
+    defaultMessage: 'These templates will be unarchived and available for use again.',
+  },
+  "unarchiveTemplateSingleContent": {
+    id: `${scope}.unarchiveTemplateSingleContent`,
+    defaultMessage: 'This template will be unarchived and available for use again.',
+  },
+  "archiveConfirmOk": {
+    id: `${scope}.archiveConfirmOk`,
+    defaultMessage: 'Confirm',
+  },
+  "archiveConfirmCancel": {
+    id: `${scope}.archiveConfirmCancel`,
+    defaultMessage: 'Cancel',
+  },
+  "archiveButton": {
+    id: `${scope}.archiveButton`,
+    defaultMessage: 'Archive',
+  },
+  "unarchiveButton": {
+    id: `${scope}.unarchiveButton`,
+    defaultMessage: 'Unarchive',
+  },
+  "archivedTag": {
+    id: `${scope}.archivedTag`,
+    defaultMessage: 'Archived',
+  },
+  "archivedTemplates": {
+    id: `${scope}.archivedTemplates`,
+    defaultMessage: 'Archived templates',
+  },
+  "searchArchivedTemplates": {
+    id: `${scope}.searchArchivedTemplates`,
+    defaultMessage: 'Search archived templates...',
+  },
+  "templatesSelected": {
+    id: `${scope}.templatesSelected`,
+    defaultMessage: '{count} {count, plural, one {template} other {templates}} selected',
+  },
+  "cannotEditArchivedTemplate": {
+    id: `${scope}.cannotEditArchivedTemplate`,
+    defaultMessage: 'Cannot edit an archived template. Please unarchive it first.',
+  },
+  "noArchivedCreatives": {
+    id: `${scope}.noArchivedCreatives`,
+    defaultMessage: 'No archived creatives',
+  },
+  "noArchivedCreativesDesc": {
+    id: `${scope}.noArchivedCreativesDesc`,
+    defaultMessage: 'Creatives you archive will appear here',
+  },
+  "templateNameLabel": {
+    id: `${scope}.templateNameLabel`,
+    defaultMessage: 'Template name ',
+  },
+  "archiveTemplateSuccess": {
+    id: `${scope}.archiveTemplateSuccess`,
+    defaultMessage: 'Template archived successfully',
+  },
+  "unarchiveTemplateSuccess": {
+    id: `${scope}.unarchiveTemplateSuccess`,
+    defaultMessage: 'Template unarchived successfully',
+  },
+  "bulkArchiveSuccess": {
+    id: `${scope}.bulkArchiveSuccess`,
+    defaultMessage: '{count} {count, plural, one {template} other {templates}} archived successfully',
+  },
+  "bulkUnarchiveSuccess": {
+    id: `${scope}.bulkUnarchiveSuccess`,
+    defaultMessage: '{count} {count, plural, one {template} other {templates}} unarchived successfully',
+  },
+  "archivalInProgress": {
+    id: `${scope}.archivalInProgress`,
+    defaultMessage: 'Archival in progress',
+  },
+  "unarchivalInProgress": {
+    id: `${scope}.unarchivalInProgress`,
+    defaultMessage: 'Unarchival in progress',
+  },
 });

package/v2Containers/Templates/reducer.js

@@ -26,6 +26,14 @@ export const initialState = fromJS({
     reportsSettings: {},
   },
   senderDetails: {},
+  archiveFilter: 'active',
+  isArchivedMode: false,
+  selectedTemplateIds: fromJS([]),
+  archiveInProgress: false,
+  unarchiveInProgress: false,
+  bulkArchiveInProgress: false,
+  bulkUnarchiveInProgress: false,
+  archiveListingRefreshType: null,
 });
 
 function templatesReducer(state = initialState, action) {
@@ -37,16 +45,18 @@ function templatesReducer(state = initialState, action) {
     case types.GET_ALL_TEMPLATES_SUCCESS:
       if (action.isReset) {
         return state.set('getAllTemplatesInProgress', false)
+          .set('archiveListingRefreshType', null)
           .set('templates', action.data ? action.data.templates : [])
           .set('isSearch', action.data ? action.data.search : false)
           .set('weCRMtemplates', action.weCRMTemplate ? action.weCRMTemplate : []).set('templateError', {});
       }
       return state.set('getAllTemplatesInProgress', false)
+        .set('archiveListingRefreshType', null)
         .set('templates', action.data ? state.get('templates').concat(action.data.templates) : [])
         .set('isSearch', action.data ? action.data.search : false)
         .set('weCRMtemplates', action.weCRMTemplate ? state.get('weCRMtemplates').concat(action.weCRMTemplate) : []);
     case types.GET_ALL_TEMPLATES_FAILURE:
-      return state.set('getAllTemplatesInProgress', false).set('templateError', action.error);
+      return state.set('getAllTemplatesInProgress', false).set('archiveListingRefreshType', null).set('templateError', action.error);
     case types.DELETE_TEMPLATE_REQUEST:
       return state.set('deleteTemplateInProgress', true)
         .set('deleteTemplateError', null);
@@ -231,6 +241,79 @@ function templatesReducer(state = initialState, action) {
         hostName: '',
         errors: action.payload,
       });
+    case types.SET_ARCHIVE_FILTER:
+      return state
+        .set('archiveFilter', action.filter)
+        .set('templates', [])
+        .set('selectedTemplateIds', fromJS([]));
+    case types.SET_ARCHIVED_MODE:
+      return state
+        .set('isArchivedMode', action.isArchived)
+        .set('archiveFilter', action.isArchived ? 'archived' : 'active')
+        .set('templates', [])
+        .set('selectedTemplateIds', fromJS([]));
+    case types.TOGGLE_TEMPLATE_SELECTION: {
+      const rawSelected = state.get('selectedTemplateIds');
+      // Defensive: handle undefined (stale persisted state) or plain array (pre-fromJS migration)
+      const currentSelected = rawSelected && typeof rawSelected.toJS === 'function'
+        ? rawSelected.toJS()
+        : (Array.isArray(rawSelected) ? rawSelected : []);
+      const idx = currentSelected.indexOf(action.id);
+      const newSelected = idx === -1
+        ? [...currentSelected, action.id]
+        : currentSelected.filter((id) => id !== action.id);
+      return state.set('selectedTemplateIds', fromJS(newSelected));
+    }
+    case types.SELECT_ALL_TEMPLATES:
+      return state.set('selectedTemplateIds', fromJS(action.ids));
+    case types.CLEAR_TEMPLATE_SELECTION:
+      return state.set('selectedTemplateIds', fromJS([]));
+    case types.ARCHIVE_TEMPLATE_REQUEST:
+      return state.set('archiveInProgress', true).set('archiveError', null);
+    case types.ARCHIVE_TEMPLATE_SUCCESS: {
+      const afterArchive = state.get('selectedTemplateIds');
+      const archiveSelected = afterArchive && typeof afterArchive.toJS === 'function' ? afterArchive.toJS() : [];
+      return state
+        .set('archiveInProgress', false)
+        .set('archiveError', null)
+        .set('archiveSuccessPayload', { successMessage: action.successMessage, description: action.description })
+        .set('selectedTemplateIds', fromJS(archiveSelected.filter((sid) => sid !== action.id)));
+    }
+    case types.ARCHIVE_TEMPLATE_FAILURE:
+      return state.set('archiveInProgress', false).set('archiveError', action.error);
+    case types.UNARCHIVE_TEMPLATE_REQUEST:
+      return state.set('unarchiveInProgress', true).set('unarchiveError', null);
+    case types.UNARCHIVE_TEMPLATE_SUCCESS: {
+      const afterUnarchive = state.get('selectedTemplateIds');
+      const unarchiveSelected = afterUnarchive && typeof afterUnarchive.toJS === 'function' ? afterUnarchive.toJS() : [];
+      return state
+        .set('unarchiveInProgress', false)
+        .set('unarchiveError', null)
+        .set('unarchiveSuccessPayload', { successMessage: action.successMessage, description: action.description })
+        .set('selectedTemplateIds', fromJS(unarchiveSelected.filter((sid) => sid !== action.id)));
+    }
+    case types.UNARCHIVE_TEMPLATE_FAILURE:
+      return state.set('unarchiveInProgress', false).set('unarchiveError', action.error);
+    case types.BULK_ARCHIVE_REQUEST:
+      return state.set('bulkArchiveInProgress', true).set('bulkArchiveError', null);
+    case types.BULK_ARCHIVE_SUCCESS:
+      return state
+        .set('bulkArchiveInProgress', false)
+        .set('bulkArchiveError', null)
+        .set('bulkArchiveSuccessPayload', { successMessage: action.successMessage, count: action.count })
+        .set('selectedTemplateIds', fromJS([]));
+    case types.BULK_ARCHIVE_FAILURE:
+      return state.set('bulkArchiveInProgress', false).set('bulkArchiveError', action.error);
+    case types.BULK_UNARCHIVE_REQUEST:
+      return state.set('bulkUnarchiveInProgress', true).set('bulkUnarchiveError', null);
+    case types.BULK_UNARCHIVE_SUCCESS:
+      return state
+        .set('bulkUnarchiveInProgress', false)
+        .set('bulkUnarchiveError', null)
+        .set('bulkUnarchiveSuccessPayload', { successMessage: action.successMessage, count: action.count })
+        .set('selectedTemplateIds', fromJS([]));
+    case types.BULK_UNARCHIVE_FAILURE:
+      return state.set('bulkUnarchiveInProgress', false).set('bulkUnarchiveError', action.error);
     default:
       return state;
   }

package/v2Containers/Templates/sagas.js

@@ -2,6 +2,7 @@ import {
   call, put, takeLatest, all,
 } from 'redux-saga/effects';
 import get from 'lodash/get';
+import { CapNotification } from '@capillarytech/cap-ui-library';
 // import { schema, normalize } from 'normalizr';
 import * as Api from '../../services/api';
 import * as types from './constants';
@@ -9,6 +10,7 @@ import { saveCdnConfigs, removeAllCdnLocalStorageItems } from '../../utils/cdnTr
 import { COPY_OF } from '../../constants/unified';
 import { ZALO_TEMPLATE_INFO_REQUEST } from '../Zalo/constants';
 import { getTemplateInfoById } from '../Zalo/saga';
+
 // Individual exports for testing
 export function* getAllTemplates(channel, queryParams) {
   try {
@@ -201,6 +203,64 @@ export function* getSenderDetails({
   }
 }
 
+export function* archiveTemplateSaga({ channel, id, successMessage, description }) {
+  try {
+    yield call(Api.archiveTemplate, { channel, id });
+    yield put({ type: types.ARCHIVE_TEMPLATE_SUCCESS, id, successMessage, description });
+  } catch (error) {
+    yield put({ type: types.ARCHIVE_TEMPLATE_FAILURE, error });
+    CapNotification.error({ message: error.message || 'Failed to archive template' });
+  }
+}
+
+export function* unarchiveTemplateSaga({ channel, id, successMessage, description }) {
+  try {
+    yield call(Api.unarchiveTemplate, { channel, id });
+    yield put({ type: types.UNARCHIVE_TEMPLATE_SUCCESS, id, successMessage, description });
+  } catch (error) {
+    yield put({ type: types.UNARCHIVE_TEMPLATE_FAILURE, error });
+    CapNotification.error({ message: error.message || 'Failed to unarchive template' });
+  }
+}
+
+export function* bulkArchiveTemplatesSaga({ channel, ids, successMessage }) {
+  try {
+    const result = yield call(Api.bulkArchiveTemplates, { channel, ids });
+    const count = get(result, 'response.modifiedCount', ids.length);
+    yield put({ type: types.BULK_ARCHIVE_SUCCESS, successMessage, count });
+  } catch (error) {
+    yield put({ type: types.BULK_ARCHIVE_FAILURE, error });
+    CapNotification.error({ message: error.message || 'Failed to archive templates' });
+  }
+}
+
+export function* bulkUnarchiveTemplatesSaga({ channel, ids, successMessage }) {
+  try {
+    const result = yield call(Api.bulkUnarchiveTemplates, { channel, ids });
+    const count = get(result, 'response.modifiedCount', ids.length);
+    yield put({ type: types.BULK_UNARCHIVE_SUCCESS, successMessage, count });
+  } catch (error) {
+    yield put({ type: types.BULK_UNARCHIVE_FAILURE, error });
+    CapNotification.error({ message: error.message || 'Failed to unarchive templates' });
+  }
+}
+
+export function* watchArchiveTemplate() {
+  yield takeLatest(types.ARCHIVE_TEMPLATE_REQUEST, archiveTemplateSaga);
+}
+
+export function* watchUnarchiveTemplate() {
+  yield takeLatest(types.UNARCHIVE_TEMPLATE_REQUEST, unarchiveTemplateSaga);
+}
+
+export function* watchBulkArchive() {
+  yield takeLatest(types.BULK_ARCHIVE_REQUEST, bulkArchiveTemplatesSaga);
+}
+
+export function* watchBulkUnarchive() {
+  yield takeLatest(types.BULK_UNARCHIVE_REQUEST, bulkUnarchiveTemplatesSaga);
+}
+
 export function* watchGetAllTemplates() {
   yield takeLatest(types.GET_ALL_TEMPLATES_REQUEST, getAllTemplates);
 }
@@ -283,6 +343,10 @@ export function* v2TemplateSaga() {
     watchFetchWeCrmAccounts(),
     watchGetSenderDetails(),
     watchForGetTemplateInfoById(), // Zalo preview functionality from Templates component
+    watchArchiveTemplate(),
+    watchUnarchiveTemplate(),
+    watchBulkArchive(),
+    watchBulkUnarchive(),
   ]);
 }
 

package/v2Containers/Templates/selectors.js

@@ -72,6 +72,16 @@ const selectBEEEditor = () => createSelector(makeSelectTemplates(), (templates)
   return BEETemplate || null;
 });
 
+const selectArchiveFilter = () => createSelector(
+  makeSelectTemplates(),
+  (substate) => substate.archiveFilter || 'active',
+);
+
+const selectSelectedTemplateIds = () => createSelector(
+  makeSelectTemplates(),
+  (substate) => substate.selectedTemplateIds || [],
+);
+
 export {
   uploadSelector,
   templateUserList,
@@ -83,4 +93,6 @@ export {
   selectEdmEditor,
   selectBEEEditor,
   selectCmsTemplatesLoader,
+  selectArchiveFilter,
+  selectSelectedTemplateIds,
 };

package/v2Containers/Templates/tests/ChannelTypeIllustration.test.js

@@ -320,4 +320,16 @@ describe('ChannelTypeIllustration', () => {
       }).not.toThrow();
     });
   });
+
+  describe('isArchivedMode', () => {
+    it('should render CapIllustration when isArchivedMode is true', () => {
+      const wrapper = renderComponent({ isArchivedMode: true });
+      expect(wrapper.find('CapIllustration').exists()).toBe(true);
+    });
+
+    it('should render CapIllustration when isArchivedMode is false', () => {
+      const wrapper = renderComponent({ isArchivedMode: false, currentChannel: SMS });
+      expect(wrapper.find('CapIllustration').exists()).toBe(true);
+    });
+  });
 });