awing-library 2.1.21 → 2.1.22-stage

package/lib/ACM-AXN/CampaignPlan/Detail.test.js

@@ -58,7 +58,6 @@ var jsx_runtime_1 = require("react/jsx-runtime");
  **/
 var react_1 = require("@testing-library/react");
 var Detail_1 = __importDefault(require("./Detail"));
-require("@testing-library/jest-dom");
 var mockCampaignPlan = {
     scheduleCampaignPlanModel: {
         campaignId: '5391179157958735137',
@@ -105,9 +104,9 @@ jest.mock('./Hooks', function () { return ({
 //  Mock đa ngữ
 jest.mock('react-i18next', function () { return (__assign(__assign({}, jest.requireActual('react-i18next')), { useTranslation: function () { return ({ t: jest.fn(function (key) { return key; }) }); } })); });
 // Mock Drawer
-jest.mock('../../Commons/Components/ClassicDrawer', function () { return function (props) { return ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("span", { "data-testid": "title-drawer", children: props.title }), props.children] })); }; });
+jest.mock('Commons/Components/ClassicDrawer', function () { return function (props) { return ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("span", { "data-testid": "title-drawer", children: props.title }), props.children] })); }; });
 // Mock PageManagement
-jest.mock('../../AWING', function () { return ({
+jest.mock('AWING', function () { return ({
     PageManagement: function (props) {
         props.onChangeQueryInput({
             searchString: '',

package/lib/ACM-AXN/CampaignPlan/Filter.js

@@ -47,7 +47,7 @@ function Filters(props) {
         });
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, []);
-    var reserveTypes = [
+    var reserveTypes = (0, react_1.useMemo)(function () { return [
         {
             id: 0,
             name: t('CampaignPlan.AdvanceSearchOptionAll'),
@@ -63,10 +63,17 @@ function Filters(props) {
             name: t('CampaignPlan.NoneReserved'),
             value: Utils_1.CAMPAIGN_RESERVETYPES.NONERESERVED,
         },
-    ];
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Autocomplete, { fullWidth: true, size: "small", options: campaign, id: Utils_1.FilterByType.campaignId, "data-testid": Utils_1.FilterByType.campaignId, getOptionLabel: function (option) { return (option === null || option === void 0 ? void 0 : option.name) || ''; }, onChange: function (event, campaignItem) {
+    ]; }, [t]);
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Autocomplete, { fullWidth: true, size: "small", options: campaign, id: Utils_1.FilterByType.campaignId, "data-testid": Utils_1.FilterByType.campaignId, getOptionLabel: function (option) { return (option === null || option === void 0 ? void 0 : option.name) || ''; }, renderOption: function (props, option) { return ((0, jsx_runtime_1.jsx)(material_1.Box, __assign({ component: "li" }, props, { sx: { width: '100%' }, children: (0, jsx_runtime_1.jsxs)("span", { children: [option.name, option.isNetWork && ((0, jsx_runtime_1.jsx)("span", { style: {
+                                    backgroundColor: '#c49f47',
+                                    color: '#ffffff',
+                                    fontSize: '13px',
+                                    marginLeft: '4px',
+                                    padding: '1px 4px',
+                                    borderRadius: '2px',
+                                }, children: "Network" }))] }) }))); }, onChange: function (event, campaignItem) {
                     onUpdateFilterBy(Utils_1.FilterByType.campaignId, (campaignItem === null || campaignItem === void 0 ? void 0 : campaignItem.id) || '0');
-                }, renderInput: function (params) { return ((0, jsx_runtime_1.jsx)(material_1.TextField, __assign({}, params, { label: t('CampaignPlan.CampaignName') }))); }, sx: { marginRight: function (theme) { return theme.spacing(2); } }, value: campaign.find(function (x) { return x.id === filterBy.campaignId; }) }), (0, jsx_runtime_1.jsx)(material_1.Autocomplete, { fullWidth: true, size: "small", options: reserveTypes, id: Utils_1.FilterByType.campaignReserved, "data-testid": Utils_1.FilterByType.campaignReserved, getOptionLabel: function (option) { return (option === null || option === void 0 ? void 0 : option.name) || ''; }, onChange: function (event, campaignItem) {
+                }, renderInput: function (params) { return ((0, jsx_runtime_1.jsx)(material_1.TextField, __assign({}, params, { label: t('CampaignPlan.CampaignName') }))); }, sx: { marginRight: function (theme) { return theme.spacing(2); } }, value: campaign.find(function (x) { return x.id === filterBy.campaignId; }) }), (0, jsx_runtime_1.jsx)(material_1.Autocomplete, { fullWidth: true, size: "small", sx: { maxWidth: 250 }, options: reserveTypes, id: Utils_1.FilterByType.campaignReserved, "data-testid": Utils_1.FilterByType.campaignReserved, getOptionLabel: function (option) { return (option === null || option === void 0 ? void 0 : option.name) || ''; }, onChange: function (event, campaignItem) {
                     onUpdateFilterBy(Utils_1.FilterByType.campaignReserved, (campaignItem === null || campaignItem === void 0 ? void 0 : campaignItem.value) || 0);
                 }, renderInput: function (params) { return ((0, jsx_runtime_1.jsx)(material_1.TextField, __assign({}, params, { label: t('CampaignPlan.ReserveType') }))); }, value: reserveTypes.find(function (x) { return x.value === filterBy.campaignReserved; }) })] }));
 }

package/lib/ACM-AXN/CampaignPlan/Filter.test.d.ts

@@ -3,4 +3,4 @@
  * @author dauquan1108@gmail.com on 03/12/2024.
  *
  **/
-import '@testing-library/jest-dom';
+export {};

package/lib/ACM-AXN/CampaignPlan/Filter.test.js

@@ -24,7 +24,6 @@ var jsx_runtime_1 = require("react/jsx-runtime");
 var react_1 = require("@testing-library/react");
 // import { BrowserRouter, useParams } from 'react-router-dom'
 var Filter_1 = __importDefault(require("./Filter"));
-require("@testing-library/jest-dom");
 var mockCampaign = [
     {
         id: '5391179157958735137',

package/lib/ACM-AXN/CampaignPlan/Types.d.ts

@@ -32,7 +32,7 @@ export declare enum CampaignReserved {
     IsReserved = 1,
     NotReserved = 2
 }
-export interface IScheduleCampaignPlanModel {
+export interface ScheduleCampaignPlanModel {
     campaignId?: string;
     name?: string | undefined;
     endDate?: string;
@@ -42,21 +42,7 @@ export interface IScheduleCampaignPlanModel {
     totalExpected?: number;
     total?: string;
 }
-export declare class ScheduleCampaignPlanModel implements IScheduleCampaignPlanModel {
-    campaignId?: string;
-    name?: string | undefined;
-    endDate?: string;
-    isNetworkCampaign?: boolean;
-    isContainClassB?: boolean;
-    totalRun?: number;
-    totalExpected?: number;
-    total?: string;
-    constructor(data?: IScheduleCampaignPlanModel);
-    init(_data?: any): void;
-    static fromJS(data: any): ScheduleCampaignPlanModel;
-    toJSON(data?: any): any;
-}
-export interface IPagedList_1OfScheduleCampaignPlanModel {
+export interface PagedList_1OfScheduleCampaignPlanModel {
     items?: ScheduleCampaignPlanModel[] | undefined;
     pageCount?: number;
     totalItemCount?: number;
@@ -65,29 +51,7 @@ export interface IPagedList_1OfScheduleCampaignPlanModel {
     hasPreviousPage?: boolean;
     hasNextPage?: boolean;
 }
-export declare class PagedList_1OfScheduleCampaignPlanModel implements IPagedList_1OfScheduleCampaignPlanModel {
-    items?: ScheduleCampaignPlanModel[] | undefined;
-    pageCount?: number;
-    totalItemCount?: number;
-    pageNumber?: number;
-    pageSize?: number;
-    readonly hasPreviousPage?: boolean;
-    readonly hasNextPage?: boolean;
-    constructor(data?: IPagedList_1OfScheduleCampaignPlanModel);
-    init(_data?: any): void;
-    static fromJS(data: any): PagedList_1OfScheduleCampaignPlanModel;
-    toJSON(data?: any): any;
-}
-export interface IScheduleCampaignPlanGroupModel {
-    groupId?: number;
-    name?: string | undefined;
-    totalRun?: number;
-    totalExpected?: number;
-    isReserved?: boolean;
-    total?: string;
-    priority?: number;
-}
-export declare class ScheduleCampaignPlanGroupModel implements IScheduleCampaignPlanGroupModel {
+export interface ScheduleCampaignPlanGroupModel {
     groupId?: number;
     name?: string | undefined;
     totalRun?: number;
@@ -95,54 +59,22 @@ export declare class ScheduleCampaignPlanGroupModel implements IScheduleCampaign
     isReserved?: boolean;
     total?: string;
     priority?: number;
-    constructor(data?: IScheduleCampaignPlanGroupModel);
-    init(_data?: any): void;
-    static fromJS(data: any): ScheduleCampaignPlanGroupModel;
-    toJSON(data?: any): any;
-}
-export interface IScheduleCampaignPlanDetail {
-    scheduleCampaignPlanModel?: ScheduleCampaignPlanModel;
-    scheduleCampaignPlanGroups?: ScheduleCampaignPlanGroupModel[] | undefined;
-    total?: number;
 }
-export declare class ScheduleCampaignPlanDetail implements IScheduleCampaignPlanDetail {
+export interface ScheduleCampaignPlanDetail {
     scheduleCampaignPlanModel?: ScheduleCampaignPlanModel;
     scheduleCampaignPlanGroups?: ScheduleCampaignPlanGroupModel[] | undefined;
     total?: number;
-    constructor(data?: IScheduleCampaignPlanDetail);
-    init(_data?: any): void;
-    static fromJS(data: any): ScheduleCampaignPlanDetail;
-    toJSON(data?: any): any;
 }
-export interface ITimestamp {
+export interface Timestamp {
     seconds?: string;
     nanos?: number;
 }
-export declare class Timestamp implements ITimestamp {
-    seconds?: string;
-    nanos?: number;
-    constructor(data?: ITimestamp);
-    init(_data?: any): void;
-    static fromJS(data: any): Timestamp;
-    toJSON(data?: any): any;
-}
-export interface ICampaign {
-    id?: string;
-    directoryId?: string;
-    directoryPath?: string | undefined;
-    name?: string | undefined;
-    createdDate?: Timestamp;
-}
-export declare class Campaign implements ICampaign {
+export interface Campaign {
     id?: string;
     directoryId?: string;
     directoryPath?: string | undefined;
     name?: string | undefined;
     createdDate?: Timestamp;
-    constructor(data?: ICampaign);
-    init(_data?: any): void;
-    static fromJS(data: any): Campaign;
-    toJSON(data?: any): any;
 }
 export interface Cancel {
     message: string | undefined;

package/lib/ACM-AXN/CampaignPlan/Types.js

@@ -5,262 +5,10 @@
  *
  **/
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Campaign = exports.Timestamp = exports.ScheduleCampaignPlanDetail = exports.ScheduleCampaignPlanGroupModel = exports.PagedList_1OfScheduleCampaignPlanModel = exports.ScheduleCampaignPlanModel = exports.CampaignReserved = void 0;
+exports.CampaignReserved = void 0;
 var CampaignReserved;
 (function (CampaignReserved) {
     CampaignReserved[CampaignReserved["None"] = 0] = "None";
     CampaignReserved[CampaignReserved["IsReserved"] = 1] = "IsReserved";
     CampaignReserved[CampaignReserved["NotReserved"] = 2] = "NotReserved";
 })(CampaignReserved || (exports.CampaignReserved = CampaignReserved = {}));
-var ScheduleCampaignPlanModel = /** @class */ (function () {
-    function ScheduleCampaignPlanModel(data) {
-        if (data) {
-            for (var property in data) {
-                if (data.hasOwnProperty(property))
-                    this[property] = data[property];
-            }
-        }
-    }
-    ScheduleCampaignPlanModel.prototype.init = function (_data) {
-        if (_data) {
-            this.campaignId = _data['campaignId'];
-            this.name = _data['name'];
-            this.endDate = _data['endDate'];
-            this.isNetworkCampaign = _data['isNetworkCampaign'];
-            this.isContainClassB = _data['isContainClassB'];
-            this.totalRun = _data['totalRun'];
-            this.totalExpected = _data['totalExpected'];
-            this.total = _data['total'];
-        }
-    };
-    ScheduleCampaignPlanModel.fromJS = function (data) {
-        data = typeof data === 'object' ? data : {};
-        var result = new ScheduleCampaignPlanModel();
-        result.init(data);
-        return result;
-    };
-    ScheduleCampaignPlanModel.prototype.toJSON = function (data) {
-        data = typeof data === 'object' ? data : {};
-        data['campaignId'] = this.campaignId;
-        data['name'] = this.name;
-        data['endDate'] = this.endDate;
-        data['isNetworkCampaign'] = this.isNetworkCampaign;
-        data['isContainClassB'] = this.isContainClassB;
-        data['totalRun'] = this.totalRun;
-        data['totalExpected'] = this.totalExpected;
-        data['total'] = this.total;
-        return data;
-    };
-    return ScheduleCampaignPlanModel;
-}());
-exports.ScheduleCampaignPlanModel = ScheduleCampaignPlanModel;
-var PagedList_1OfScheduleCampaignPlanModel = /** @class */ (function () {
-    function PagedList_1OfScheduleCampaignPlanModel(data) {
-        if (data) {
-            for (var property in data) {
-                if (data.hasOwnProperty(property))
-                    this[property] = data[property];
-            }
-        }
-    }
-    PagedList_1OfScheduleCampaignPlanModel.prototype.init = function (_data) {
-        if (_data) {
-            if (Array.isArray(_data['items'])) {
-                this.items = [];
-                for (var _i = 0, _a = _data['items']; _i < _a.length; _i++) {
-                    var item = _a[_i];
-                    this.items.push(ScheduleCampaignPlanModel.fromJS(item));
-                }
-            }
-            this.pageCount = _data['pageCount'];
-            this.totalItemCount = _data['totalItemCount'];
-            this.pageNumber = _data['pageNumber'];
-            this.pageSize = _data['pageSize'];
-            this.hasPreviousPage = _data['hasPreviousPage'];
-            this.hasNextPage = _data['hasNextPage'];
-        }
-    };
-    PagedList_1OfScheduleCampaignPlanModel.fromJS = function (data) {
-        data = typeof data === 'object' ? data : {};
-        var result = new PagedList_1OfScheduleCampaignPlanModel();
-        result.init(data);
-        return result;
-    };
-    PagedList_1OfScheduleCampaignPlanModel.prototype.toJSON = function (data) {
-        data = typeof data === 'object' ? data : {};
-        if (Array.isArray(this.items)) {
-            data['items'] = [];
-            for (var _i = 0, _a = this.items; _i < _a.length; _i++) {
-                var item = _a[_i];
-                data['items'].push(item.toJSON());
-            }
-        }
-        data['pageCount'] = this.pageCount;
-        data['totalItemCount'] = this.totalItemCount;
-        data['pageNumber'] = this.pageNumber;
-        data['pageSize'] = this.pageSize;
-        data['hasPreviousPage'] = this.hasPreviousPage;
-        data['hasNextPage'] = this.hasNextPage;
-        return data;
-    };
-    return PagedList_1OfScheduleCampaignPlanModel;
-}());
-exports.PagedList_1OfScheduleCampaignPlanModel = PagedList_1OfScheduleCampaignPlanModel;
-var ScheduleCampaignPlanGroupModel = /** @class */ (function () {
-    function ScheduleCampaignPlanGroupModel(data) {
-        if (data) {
-            for (var property in data) {
-                if (data.hasOwnProperty(property))
-                    this[property] = data[property];
-            }
-        }
-    }
-    ScheduleCampaignPlanGroupModel.prototype.init = function (_data) {
-        if (_data) {
-            this.groupId = _data['groupId'];
-            this.name = _data['name'];
-            this.totalRun = _data['totalRun'];
-            this.totalExpected = _data['totalExpected'];
-            this.isReserved = _data['isReserved'];
-            this.total = _data['total'];
-            this.priority = _data['priority'];
-        }
-    };
-    ScheduleCampaignPlanGroupModel.fromJS = function (data) {
-        data = typeof data === 'object' ? data : {};
-        var result = new ScheduleCampaignPlanGroupModel();
-        result.init(data);
-        return result;
-    };
-    ScheduleCampaignPlanGroupModel.prototype.toJSON = function (data) {
-        data = typeof data === 'object' ? data : {};
-        data['groupId'] = this.groupId;
-        data['name'] = this.name;
-        data['totalRun'] = this.totalRun;
-        data['totalExpected'] = this.totalExpected;
-        data['isReserved'] = this.isReserved;
-        data['total'] = this.total;
-        data['priority'] = this.priority;
-        return data;
-    };
-    return ScheduleCampaignPlanGroupModel;
-}());
-exports.ScheduleCampaignPlanGroupModel = ScheduleCampaignPlanGroupModel;
-var ScheduleCampaignPlanDetail = /** @class */ (function () {
-    function ScheduleCampaignPlanDetail(data) {
-        if (data) {
-            for (var property in data) {
-                if (data.hasOwnProperty(property))
-                    this[property] = data[property];
-            }
-        }
-    }
-    ScheduleCampaignPlanDetail.prototype.init = function (_data) {
-        if (_data) {
-            this.scheduleCampaignPlanModel = _data['scheduleCampaignPlanModel']
-                ? ScheduleCampaignPlanModel.fromJS(_data['scheduleCampaignPlanModel'])
-                : undefined;
-            if (Array.isArray(_data['scheduleCampaignPlanGroups'])) {
-                this.scheduleCampaignPlanGroups = [];
-                for (var _i = 0, _a = _data['scheduleCampaignPlanGroups']; _i < _a.length; _i++) {
-                    var item = _a[_i];
-                    this.scheduleCampaignPlanGroups.push(ScheduleCampaignPlanGroupModel.fromJS(item));
-                }
-            }
-            this.total = _data['total'];
-        }
-    };
-    ScheduleCampaignPlanDetail.fromJS = function (data) {
-        data = typeof data === 'object' ? data : {};
-        var result = new ScheduleCampaignPlanDetail();
-        result.init(data);
-        return result;
-    };
-    ScheduleCampaignPlanDetail.prototype.toJSON = function (data) {
-        data = typeof data === 'object' ? data : {};
-        data['scheduleCampaignPlanModel'] = this.scheduleCampaignPlanModel
-            ? this.scheduleCampaignPlanModel.toJSON()
-            : undefined;
-        if (Array.isArray(this.scheduleCampaignPlanGroups)) {
-            data['scheduleCampaignPlanGroups'] = [];
-            for (var _i = 0, _a = this.scheduleCampaignPlanGroups; _i < _a.length; _i++) {
-                var item = _a[_i];
-                data['scheduleCampaignPlanGroups'].push(item.toJSON());
-            }
-        }
-        data['total'] = this.total;
-        return data;
-    };
-    return ScheduleCampaignPlanDetail;
-}());
-exports.ScheduleCampaignPlanDetail = ScheduleCampaignPlanDetail;
-var Timestamp = /** @class */ (function () {
-    function Timestamp(data) {
-        if (data) {
-            for (var property in data) {
-                if (data.hasOwnProperty(property))
-                    this[property] = data[property];
-            }
-        }
-    }
-    Timestamp.prototype.init = function (_data) {
-        if (_data) {
-            this.seconds = _data['seconds'];
-            this.nanos = _data['nanos'];
-        }
-    };
-    Timestamp.fromJS = function (data) {
-        data = typeof data === 'object' ? data : {};
-        var result = new Timestamp();
-        result.init(data);
-        return result;
-    };
-    Timestamp.prototype.toJSON = function (data) {
-        data = typeof data === 'object' ? data : {};
-        data['seconds'] = this.seconds;
-        data['nanos'] = this.nanos;
-        return data;
-    };
-    return Timestamp;
-}());
-exports.Timestamp = Timestamp;
-var Campaign = /** @class */ (function () {
-    function Campaign(data) {
-        if (data) {
-            for (var property in data) {
-                if (data.hasOwnProperty(property))
-                    this[property] = data[property];
-            }
-        }
-    }
-    Campaign.prototype.init = function (_data) {
-        if (_data) {
-            this.id = _data['id'];
-            this.directoryId = _data['directoryId'];
-            this.directoryPath = _data['directoryPath'];
-            this.name = _data['name'];
-            this.createdDate = _data['createdDate']
-                ? Timestamp.fromJS(_data['createdDate'])
-                : undefined;
-        }
-    };
-    Campaign.fromJS = function (data) {
-        data = typeof data === 'object' ? data : {};
-        var result = new Campaign();
-        result.init(data);
-        return result;
-    };
-    Campaign.prototype.toJSON = function (data) {
-        data = typeof data === 'object' ? data : {};
-        data['id'] = this.id;
-        data['directoryId'] = this.directoryId;
-        data['directoryPath'] = this.directoryPath;
-        data['name'] = this.name;
-        data['createdDate'] = this.createdDate
-            ? this.createdDate.toJSON()
-            : undefined;
-        return data;
-    };
-    return Campaign;
-}());
-exports.Campaign = Campaign;

package/lib/ACM-AXN/CampaignPlan/index.js

@@ -19,8 +19,8 @@ var jsx_runtime_1 = require("react/jsx-runtime");
 var react_i18next_1 = require("react-i18next");
 var i18n_1 = __importDefault(require("../../i18n"));
 var Container_1 = __importDefault(require("./Container"));
-var Constant_1 = require("./Constant");
 var Detail_1 = __importDefault(require("./Detail"));
+var Constant_1 = require("../Common/Constant");
 var Router_1 = require("../../AWING/Router");
 var Context_1 = require("./Context");
 var CampaignPlan = function (props) {

package/lib/ACM-AXN/CampaignSchedule/Components/ControlPanel/Filter.d.ts

@@ -1,3 +1,3 @@
 import { IFiltersProps } from '../../interface';
-declare const Filters: ({ campaigns, handleFilters, loadingFlags, placeMultiSelectComponent: PlaceMultiSelect, handleExportExcel, disabledCampaignFilter, isFutureDate }: IFiltersProps) => import("react/jsx-runtime").JSX.Element;
+declare const Filters: ({ campaigns, handleFilters, loadingFlags, placeMultiSelectComponent: PlaceMultiSelect, handleExportExcel, disabledCampaignFilter, isFutureDate, }: IFiltersProps) => import("react/jsx-runtime").JSX.Element;
 export default Filters;

package/lib/ACM-AXN/CampaignSchedule/Components/ControlPanel/Filter.js

@@ -15,6 +15,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 var jsx_runtime_1 = require("react/jsx-runtime");
+var react_1 = require("react");
 var GetApp_1 = __importDefault(require("@mui/icons-material/GetApp"));
 var material_1 = require("@mui/material");
 var styles_1 = require("@mui/styles");
@@ -22,6 +23,9 @@ var AWING_1 = require("../../../../AWING");
 var lodash_1 = __importDefault(require("lodash"));
 var moment_1 = __importDefault(require("moment"));
 var react_i18next_1 = require("react-i18next");
+var Constant_1 = require("../../../../ACM-AXN/Common/Constant");
+var recoil_1 = require("recoil");
+var Atom_1 = require("../../Recoil/Atom");
 var useStyles = (0, styles_1.makeStyles)(function () { return ({
     outlinedInput: {
         '& .MuiOutlinedInput-input': {
@@ -77,16 +81,22 @@ var useStyles = (0, styles_1.makeStyles)(function () { return ({
     },
 }); });
 var Filters = function (_a) {
-    var _b, _c;
-    var campaigns = _a.campaigns, handleFilters = _a.handleFilters, loadingFlags = _a.loadingFlags, PlaceMultiSelect = _a.placeMultiSelectComponent, handleExportExcel = _a.handleExportExcel, _d = _a.disabledCampaignFilter, disabledCampaignFilter = _d === void 0 ? false : _d, isFutureDate = _a.isFutureDate;
+    var campaigns = _a.campaigns, handleFilters = _a.handleFilters, loadingFlags = _a.loadingFlags, PlaceMultiSelect = _a.placeMultiSelectComponent, handleExportExcel = _a.handleExportExcel, _b = _a.disabledCampaignFilter, disabledCampaignFilter = _b === void 0 ? false : _b, isFutureDate = _a.isFutureDate;
     var t = (0, react_i18next_1.useTranslation)().t;
-    var campaignOptions = __assign(__assign({}, campaigns), { 0: { campaignId: 0, name: t('Common.SelectAll') } });
+    var campaignOptions = __assign({ 0: { id: '-1', name: t('Common.SelectAll') } }, campaigns);
+    var options = lodash_1.default.values(campaignOptions);
+    var _c = (0, recoil_1.useRecoilState)(Atom_1.CampaignScheduleTypeViewState), typeView = _c[0], setTypeView = _c[1];
+    var _d = (0, react_1.useState)(options[0].id), campaignId = _d[0], setCampaignId = _d[1];
     var classes = useStyles();
     var handleChangeDateRange = function (value) {
         handleFilters('startDate', value.startDate);
         handleFilters('endDate', value.endDate);
     };
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Grid, { item: true, xs: disabledCampaignFilter ? 6 : 4, className: classes.dateRangePicker, children: (0, jsx_runtime_1.jsx)(AWING_1.DateRangePicker, { isShowCalendarInfo: true, isFutureDate: isFutureDate !== null && isFutureDate !== void 0 ? isFutureDate : true, label: "".concat(t('Common.StartDate'), " - ").concat(t('Common.EndDate')), callback: handleChangeDateRange, initialStartDate: (0, moment_1.default)(), initialEndDate: (0, moment_1.default)(), variant: "outlined", textFieldProps: {
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [!disabledCampaignFilter && ((0, jsx_runtime_1.jsx)(material_1.Grid, { item: true, xs: 2, children: (0, jsx_runtime_1.jsxs)(material_1.FormControl, { fullWidth: true, size: "small", children: [(0, jsx_runtime_1.jsx)(material_1.InputLabel, { id: "demo-simple-select-label", children: t('Common.TitleTypeView') }), (0, jsx_runtime_1.jsxs)(material_1.Select, { labelId: "demo-simple-select-label", id: "demo-simple-select", value: typeView.type, label: t('Common.TitleTypeView'), onChange: function (e) {
+                                setTypeView({
+                                    type: e.target.value,
+                                });
+                            }, children: [(0, jsx_runtime_1.jsx)(material_1.MenuItem, { value: Constant_1.TypeView.billingUnit, children: t('Campaign.BillingUnit.Title') }), (0, jsx_runtime_1.jsx)(material_1.MenuItem, { value: Constant_1.TypeView.impression, children: t('Common.Impression') })] })] }) })), (0, jsx_runtime_1.jsx)(material_1.Grid, { item: true, xs: disabledCampaignFilter ? 6 : 3, className: classes.dateRangePicker, children: (0, jsx_runtime_1.jsx)(AWING_1.DateRangePicker, { isShowCalendarInfo: true, isFutureDate: isFutureDate !== null && isFutureDate !== void 0 ? isFutureDate : true, label: "".concat(t('Common.StartDate'), " - ").concat(t('Common.EndDate')), callback: handleChangeDateRange, initialStartDate: (0, moment_1.default)(), initialEndDate: (0, moment_1.default)(), variant: "outlined", textFieldProps: {
                         fullWidth: true,
                         className: classes.outlinedInput,
                     }, isDayBlocked: function (day) {
@@ -99,17 +109,25 @@ var Filters = function (_a) {
                         else {
                             return false;
                         }
-                    } }) }), !disabledCampaignFilter && ((0, jsx_runtime_1.jsx)(material_1.Grid, { item: true, xs: 4, children: (0, jsx_runtime_1.jsx)(material_1.Autocomplete, { size: "small", disablePortal: true, id: "combo-box-demo", options: (_c = (_b = lodash_1.default.values(campaignOptions)) === null || _b === void 0 ? void 0 : _b.map(function (obj) { return (__assign({}, obj)); })) !== null && _c !== void 0 ? _c : [], getOptionLabel: function (option) { var _a; return (_a = option.name) !== null && _a !== void 0 ? _a : ''; }, isOptionEqualToValue: function (option, value) {
-                        return option.Id === value.Id;
-                    }, onChange: function (event, campaign) {
-                        handleFilters('campaignId', campaign === null || campaign === void 0 ? void 0 : campaign.id);
-                    }, renderInput: function (params) { return ((0, jsx_runtime_1.jsx)(material_1.TextField, __assign({}, params, { label: t('Schedule.CampaignName'), sx: { backgroundColor: 'white' }, variant: "outlined" }))); }, defaultValue: { Id: 0, name: t('Common.SelectAll') } }) })), (0, jsx_runtime_1.jsxs)(material_1.Grid, { item: true, xs: disabledCampaignFilter ? 6 : 4, className: classes.ellipsisPlaceFilter, children: [(0, jsx_runtime_1.jsx)(PlaceMultiSelect, { isDisplayTextField: true, onChange: function (placeIds) {
+                    } }) }), !disabledCampaignFilter && ((0, jsx_runtime_1.jsx)(material_1.Grid, { item: true, xs: 4, children: (0, jsx_runtime_1.jsx)(material_1.Autocomplete, { size: "small", disablePortal: true, id: "combo-box-demo", options: options !== null && options !== void 0 ? options : [], value: options.find(function (item) { return item.id === campaignId; }), getOptionLabel: function (option) { var _a; return (_a = option.name) !== null && _a !== void 0 ? _a : ''; }, onChange: function (event, campaign) {
+                        var _a;
+                        handleFilters('campaignId', (campaign === null || campaign === void 0 ? void 0 : campaign.id) === options[0].id
+                            ? undefined
+                            : campaign === null || campaign === void 0 ? void 0 : campaign.id);
+                        setCampaignId((_a = campaign === null || campaign === void 0 ? void 0 : campaign.id) !== null && _a !== void 0 ? _a : options[0].id);
+                    }, renderInput: function (params) { return ((0, jsx_runtime_1.jsx)(material_1.TextField, __assign({}, params, { label: t('Schedule.CampaignName'), sx: { backgroundColor: 'white' }, variant: "outlined" }))); } }) })), (0, jsx_runtime_1.jsxs)(material_1.Grid, { item: true, xs: disabledCampaignFilter ? 6 : 3, className: classes.ellipsisPlaceFilter, children: [(0, jsx_runtime_1.jsx)(PlaceMultiSelect, { isDisplayTextField: true, onChange: function (placeIds) {
                             return handleFilters('placeIds', placeIds);
                         } }), (0, jsx_runtime_1.jsx)(material_1.Button, { sx: {
                             height: '40px',
                             position: 'relative !important',
                             marginLeft: '1rem',
                             marginTop: '6px',
-                        }, variant: "contained", onClick: handleExportExcel, title: t('Common.Download'), disabled: loadingFlags === null || loadingFlags === void 0 ? void 0 : loadingFlags.export, color: "inherit", children: (loadingFlags === null || loadingFlags === void 0 ? void 0 : loadingFlags.export) ? ((0, jsx_runtime_1.jsx)(AWING_1.CircularProgress, {})) : ((0, jsx_runtime_1.jsx)(GetApp_1.default, {})) })] })] }));
+                        }, variant: "contained", onClick: handleExportExcel, title: t('Common.Download'), disabled: loadingFlags === null || loadingFlags === void 0 ? void 0 : loadingFlags.export, color: "inherit", children: (loadingFlags === null || loadingFlags === void 0 ? void 0 : loadingFlags.export) ? ((0, jsx_runtime_1.jsx)(AWING_1.CircularProgress, { styleWrap: {
+                                display: 'flex',
+                                justifyContent: 'center',
+                            }, styleIcon: {
+                                width: '25px !important',
+                                height: '25px !important',
+                            } })) : ((0, jsx_runtime_1.jsx)(GetApp_1.default, {})) })] })] }));
 };
 exports.default = Filters;