Updated unit tests

front/core/components/searchbar/search-panel.js

@@ -1,4 +1,5 @@
 import Component from '../../lib/component';
+import './style.scss';
 
 export default class SearchPanel extends Component {
     set filter(value) {

front/core/components/searchbar/style.scss

@@ -1,4 +1,4 @@
-@import "variables";
+@import "./variables";
 
 vn-searchbar {
     display: block;
@@ -44,4 +44,27 @@ vn-searchbar {
     & > form {
         padding: $spacing-lg;
     }
+
+    & > form#manifold-form {
+        padding: 0;
+
+        .manifold-panel {
+            border: $border-thin-light;
+            border-radius: 5px;
+            position: relative;
+            text-align: right;
+
+            .or {
+                font-weight: bold;
+                font-size: 26px;
+                color: $color-font-secondary
+            }
+
+            vn-icon[icon="info"] {
+                position: absolute; 
+                top: 2px;
+                right: 2px
+            }
+        }
+    }
 }

modules/ticket/front/search-panel/index.html

@@ -1,5 +1,5 @@
 <div class="search-panel">
-    <form id="ticket-form" ng-submit="$ctrl.onSearch()">
+    <form id="manifold-form" ng-submit="$ctrl.onSearch()">
         <vn-horizontal class="vn-px-lg vn-pt-lg">
             <vn-textfield
                 vn-one
@@ -22,18 +22,18 @@
             </vn-textfield>
         </vn-horizontal>
         <section class="vn-px-md">
-            <vn-horizontal class="scope-days vn-pa-md">
+            <vn-horizontal class="manifold-panel vn-pa-md">
                 <vn-date-picker
                     vn-one
                     label="From"
                     ng-model="filter.from"
-                    on-change="filter.scopeDays = null">
+                    on-change="$ctrl.from = value">
                 </vn-date-picker>
                 <vn-date-picker
                     vn-one
                     label="To"
                     ng-model="filter.to"
-                    on-change="filter.scopeDays = null">
+                    on-change="$ctrl.to = value">
                 </vn-date-picker>
                 <vn-none class="or vn-px-md">O</vn-none>
                 <vn-input-number

modules/ticket/front/search-panel/index.js

@@ -1,6 +1,5 @@
 import ngModule from '../module';
 import SearchPanel from 'core/components/searchbar/search-panel';
-import './style.scss';
 
 class Controller extends SearchPanel {
     constructor($, $element) {
@@ -24,6 +23,24 @@ class Controller extends SearchPanel {
         });
     }
 
+    get from() {
+        return this._from;
+    }
+
+    set from(value) {
+        this._from = value;
+        this.filter.scopeDays = null;
+    }
+
+    get to() {
+        return this._to;
+    }
+
+    set to(value) {
+        this._to = value;
+        this.filter.scopeDays = null;
+    }
+
     get scopeDays() {
         return this._scopeDays;
     }

modules/ticket/front/search-panel/index.spec.js

@@ -34,8 +34,30 @@ describe('Ticket Component vnTicketSearchPanel', () => {
         });
     });
 
+    describe('from() setter', () => {
+        it('should clear the scope days when setting the from property', () => {
+            controller.filter.scopeDays = 1;
+
+            controller.from = new Date();
+
+            expect(controller.filter.scopeDays).toBeNull();
+            expect(controller.from).toBeDefined();
+        });
+    });
+
+    describe('to() setter', () => {
+        it('should clear the scope days when setting the to property', () => {
+            controller.filter.scopeDays = 1;
+
+            controller.to = new Date();
+
+            expect(controller.filter.scopeDays).toBeNull();
+            expect(controller.to).toBeDefined();
+        });
+    });
+
     describe('scopeDays() setter', () => {
-        it('should clear the date range', () => {
+        it('should clear the date range when setting the scopeDays property', () => {
             controller.filter.from = new Date();
             controller.filter.to = new Date();
 
@@ -43,6 +65,7 @@ describe('Ticket Component vnTicketSearchPanel', () => {
 
             expect(controller.filter.from).toBeNull();
             expect(controller.filter.to).toBeNull();
+            expect(controller.scopeDays).toBeDefined();
         });
     });
 });

modules/ticket/front/search-panel/style.scss

@@ -1,31 +0,0 @@
-@import "./effects";
-@import "./variables";
-
-
-form#ticket-form {
-    padding: 0
-}
-
-.scope-days {
-    border: $border-thin-light;
-    border-radius: 5px;
-    position: relative;
-    text-align: right;
-
-    & > p {
-        font-size: 1.2rem;
-        margin: 3px;
-    }
-
-    .or {
-        font-weight: bold;
-        font-size: 26px;
-        color: $color-font-secondary
-    }
-
-    vn-icon[icon="info"] {
-        position: absolute; 
-        top: 2px;
-        right: 2px
-    }
-}