TT#23168 CSC Reminder module

- store mutations + api unit test coverage
- translations added

Change-Id: Idb195edd13b9b1bc75dc130b31d5a6c6e29275bf

src/api/reminder.js

@@ -0,0 +1,68 @@
+import Vue from 'vue';
+
+export function createReminder(id) {
+    return new Promise((resolve, reject) => {
+        var data = {
+            subscriber_id: id,
+            time: '00:00',
+            recur: 'never',
+            active: false
+        };
+        Vue.http.post('/api/reminders/', data).then((result) => {
+            var reminderID = result.headers.get('Location').split('/')[3];
+            resolve(reminderID);
+        }).catch((err) => {
+            reject(err);
+        });
+    });
+}
+
+export function getReminder(id) {
+    return new Promise((resolve, reject) => {
+        Vue.http.get('/api/reminders/', {
+            params: {
+                supplier_id: id
+            }
+        }).then((result) => {
+            resolve(JSON.parse(result.body));
+        }).catch((err) => {
+            reject(err);
+        });
+    });
+}
+
+export function enableReminder(id) {
+    return patchReminder(id, '/active', true);
+}
+
+export function disableReminder(id) {
+    return patchReminder(id, '/active', false);
+}
+
+export function setTime(id, time) {
+    return patchReminder(id, '/time', time);
+}
+
+export function setRecurrence(id, recurrence) {
+    return patchReminder(id, '/recur', recurrence);
+}
+
+function patchReminder(id, field, value) {
+    return new Promise((resolve, reject) => {
+        var data = [{
+            "op": "replace",
+            "path": field,
+            "value": value
+        }];
+        var patchHeaders = {
+            headers: {
+                'Content-Type': 'application/json-patch+json'
+            }
+        };
+        Vue.http.patch('/api/reminders/' + id, data, patchHeaders).then((result) => {
+            resolve();
+        }).catch((err) => {
+            reject(err);
+        });
+    });
+}

src/components/pages/Reminder.vue

@@ -1,18 +1,125 @@
 <template>
-    <page title="Reminder"></page>
+<page :title="$t('pages.reminder.title')">
+    <q-field class="reminder-field">
+        <q-toggle :label="$t('pages.reminder.title') + (active ? ' enabled':' disabled')" @input="toggleReminder()" v-model="active" />
+    </q-field>
+    <q-field class="reminder-field">
+        <q-datetime type="time" :disable="!active" no-clear=true v-model="timeConverted" :placeholder="$t('reminder.timeLabel')" @change="changeTime()" />
+    </q-field>
+    <q-field class="reminder-field">
+        <q-option-group :disable="!active" color="positive" type="radio" v-model="recurrence" @change="changeRecurrence()" :options="[
+      { label: $t('pages.reminder.recurrence.once'), value: 'never' },
+      { label: $t('pages.reminder.recurrence.weekdays'), value: 'weekdays' },
+      { label: $t('pages.reminder.recurrence.always'), value: 'always' }
+    ]" />
+    </q-field>
+</page>
 </template>
 
 <script>
+import {
+    startLoading,
+    stopLoading,
+    showGlobalError
+} from '../../helpers/ui'
 import Page from '../Page'
+import {
+    QField,
+    QToggle,
+    QDatetime,
+    QOptionGroup,
+    date,
+    Toast
+} from 'quasar-framework'
 export default {
     data() {
-            return {}
+        return {
+            active: false,
+            time: undefined,
+            recurrence: 'never'
+        }
+    },
+    mounted() {
+        this.$store.dispatch('reminder/loadReminder').then(() => {
+            this.active = this.$store.state.reminder.active;
+            this.time = this.$store.state.reminder.time;
+            this.recurrence = this.$store.state.reminder.recurrence;
+        }).catch((err) => {
+            console.log(err);
+        });
     },
     components: {
-            Page
+        Page,
+        QToggle,
+        Toast,
+        QDatetime,
+        QOptionGroup,
+        QField
+    },
+    computed: {
+        timeConverted: {
+            get: function() {
+                var computedTime;
+                if (this.time) {
+                    computedTime = date.buildDate({
+                        hours: this.time.split(':')[0],
+                        minutes: this.time.split(':')[1],
+                        seconds: '00'
+                    });
+                } else {
+                    computedTime = date.buildDate({
+                        hours: '00',
+                        minutes: '00',
+                        seconds: '00'
+                    });
+                }
+                return computedTime;
+            },
+            set: function(newValue) {
+                this.time = date.formatDate(newValue, 'HH:mm:ss');
+            }
+        }
+    },
+    methods: {
+        toggleReminder() {
+            this.$store.dispatch('reminder/toggleReminder', this.active).then(() => {
+                Toast.create({
+                    html: this.$t('pages.reminder.title') + (this.active ? ' enabled' : ' disabled'),
+                    color: 'white',
+                    bgColor: '#68A44E'
+                });
+            }).catch((err) => {
+                console.log(err);
+            });
+        },
+        changeTime() {
+            this.$store.dispatch('reminder/changeTime', this.time).then(() => {
+                Toast.create({
+                    html: this.$t('pages.reminder.timeUpdatedMsg') ,
+                    color: 'white',
+                    bgColor: '#68A44E'
+                });
+            }).catch((err) => {
+                console.log(err);
+            });
+        },
+        changeRecurrence() {
+            this.$store.dispatch('reminder/changeRecurrence', this.recurrence).then(() => {
+                Toast.create({
+                    html: this.$t('pages.reminder.recurrenceUpdatedMsg'),
+                    color: 'white',
+                    bgColor: '#68A44E'
+                });
+            }).catch((err) => {
+                console.log(err);
+            });
+        }
     }
 }
 </script>
 
 <style>
+.reminder-field {
+    margin-bottom: 40px;
+}
 </style>

src/locales/en.json

@@ -75,6 +75,17 @@
             "addedToast": "Added number {number}",
             "addInputError": "Input a valid number or subscriber name",
             "addNumberButton": "Add number"
+        },
+        "reminder": {
+            "title": "Reminder",
+            "timeLabel": "Time of the day",
+            "recurrence": {
+                "once": "Only once",
+                "weekdays": "On weekdays",
+                "always": "Always"
+            },
+            "timeUpdatedMsg": "Time updated!",
+            "recurrenceUpdatedMsg": "Recurrence updated!"
         }
     }
 }

src/store/index.js

@@ -7,6 +7,7 @@ import Vuex from 'vuex'
 import UserModule from './user'
 import PbxGroupsModule from './pbx-groups'
 import CallBlockingModule from './call-blocking'
+import ReminderModule from './reminder'
 
 var rtcEngineClient = null;
 var rtcEngineNetwork = null;
@@ -17,7 +18,8 @@ export const store = new Vuex.Store({
     modules: {
         user: UserModule,
         pbxGroups: PbxGroupsModule,
-        callBlocking: CallBlockingModule
+        callBlocking: CallBlockingModule,
+        reminder: ReminderModule
     },
     state: {
         rtcEngineConnected: false

src/store/reminder.js

@@ -0,0 +1,100 @@
+'use strict';
+
+import _ from 'lodash';
+import {
+    getReminder,
+    createReminder,
+    enableReminder,
+    disableReminder,
+    setTime,
+    setRecurrence
+} from '../api/reminder';
+
+
+export default {
+    namespaced: true,
+    mutations: {
+        reminderLoaded(state, options) {
+            state.reminderID = options.id;
+            state.active = options.active;
+            state.time = options.time;
+            state.recurrence = options.recur;
+        },
+        enableReminder(state) {
+            state.active = true;
+        },
+        disableReminder(state) {
+            state.active = false;
+        },
+        setTime(state, newTime) {
+            state.time = newTime;
+        },
+        setRecurrence(state, recurrence) {
+            state.recurrence = recurrence;
+        },
+        reminderCreated(state, reminderID) {
+            state.reminderID = reminderID;
+        }
+    },
+    actions: {
+        loadReminder(context) {
+            return new Promise((resolve, reject) => {
+                getReminder(localStorage.getItem('subscriberId')).then((result) => {
+                    if (result.total_count > 0) {
+                        context.commit('reminderLoaded', result._embedded['ngcp:reminders'][0]); // open to suggestions on how to extract data here
+                    } else {
+                        // If no default reminder is set, then we need to create it.
+                        createReminder(localStorage.getItem('subscriberId')).then((result) => {
+                            context.commit('reminderCreated', result);
+                            resolve();
+                        }).catch((err) => {
+                            reject(err);
+                        });
+                    }
+                    resolve();
+                }).catch((err) => {
+                    reject(err);
+                });
+            });
+        },
+        toggleReminder(context, enabled) {
+            return new Promise((resolve, reject) => {
+                if (enabled === true) {
+                    enableReminder(context.state.reminderID).then((result) => {
+                        context.commit('enableReminder');
+                        resolve();
+                    }).catch((err) => {
+                        reject(err);
+                    });
+                } else {
+                    disableReminder(context.state.reminderID).then((result) => {
+                        context.commit('disableReminder');
+                        resolve();
+                    }).catch((err) => {
+                        reject(err);
+                    });
+                }
+            });
+        },
+        changeTime(context, time) {
+            return new Promise((resolve, reject) => {
+                setTime(context.state.reminderID, time).then((result) => {
+                    context.commit('setTime', time);
+                    resolve();
+                }).catch((err) => {
+                    reject(err);
+                });
+            });
+        },
+        changeRecurrence(context, recurrence) {
+            return new Promise((resolve, reject) => {
+                setRecurrence(context.state.reminderID, recurrence).then((result) => {
+                    context.commit('setRecurrence', recurrence);
+                    resolve();
+                }).catch((err) => {
+                    reject(err);
+                });
+            });
+        }
+    }
+};

t/api/reminder.js

@@ -0,0 +1,157 @@
+'use strict';
+
+import Vue from 'vue';
+import VueResource from 'vue-resource';
+import {
+    createReminder,
+    getReminder,
+    enableReminder,
+    disableReminder,
+    setTime,
+    setRecurrence
+} from '../../src/api/reminder';
+import {
+    assert
+} from 'chai';
+
+Vue.use(VueResource);
+
+
+describe('Reminder', function() {
+
+    var subscriberId = 123;
+    var reminderID = 1;
+
+    beforeEach(function() {
+        Vue.http.interceptors = [];
+    });
+
+    it('should return 201 when creating a new reminder', function(done) {
+        Vue.http.interceptors.unshift((request, next) => {
+            assert.equal(request.url, '/api/reminders/');
+            assert.equal(request.body.subscriber_id, subscriberId);
+            assert.equal(request.body.time, '00:00');
+            assert.equal(request.body.recur, 'never');
+            assert.equal(request.body.active, false);
+            next(
+                request.respondWith('', {
+                    status: 201,
+                    headers: {
+                        location: '/api/reminders/' + reminderID
+                    }
+                })
+            )
+        });
+        createReminder(subscriberId).then((result) => {
+            done();
+        }).catch((err) => {
+            done(err);
+        });
+    });
+
+    it('should get the existing reminder', function(done) {
+        Vue.http.interceptors.unshift((request, next) => {
+            assert.equal(request.url, '/api/reminders/');
+            assert.equal(request.params.supplier_id, subscriberId);
+            next(request.respondWith(JSON.stringify({
+                "_embedded": {
+                    "ngcp:reminders": [{
+                        "active": true,
+                        "id": reminderID,
+                        "recur": "always",
+                        "subscriber_id": 239,
+                        "time": "18:47:00"
+                    }]
+                },
+                "total_count": 1
+            }), {
+                status: 200
+            }));
+        });
+        getReminder(subscriberId).then((result) => {
+            var reminderData = result._embedded['ngcp:reminders'][0];
+            assert.property(reminderData, 'id');
+            assert.property(reminderData, 'active');
+            assert.property(reminderData, 'recur');
+            assert.property(reminderData, 'subscriber_id');
+            assert.property(reminderData, 'time');
+            assert.isNumber(reminderData.id);
+            assert.isTrue(reminderData.active);
+            assert.include(['always', 'once', 'weekdays'], reminderData.recur);
+            assert.isNumber(reminderData.subscriber_id);
+            assert.isString(reminderData.time)
+            done();
+        }).catch((err) => {
+            done(err);
+        });
+    });
+
+    it('should activate a reminder', function(done) {
+        Vue.http.interceptors.unshift((request, next) => {
+            assert.equal(request.url, '/api/reminders/' + reminderID);
+            assert.equal(request.body[0].op, 'replace');
+            assert.equal(request.body[0].path, '/active');
+            assert.equal(request.body[0].value, true);
+            next(request.respondWith('', {
+                status: 204
+            }));
+        });
+        enableReminder(reminderID).then(() => {
+            done();
+        }).catch((err) => {
+            done(err);
+        });
+    });
+
+    it('should deactivate a reminder', function(done) {
+        Vue.http.interceptors.unshift((request, next) => {
+            assert.equal(request.url, '/api/reminders/' + reminderID);
+            assert.equal(request.body[0].op, 'replace');
+            assert.equal(request.body[0].path, '/active');
+            assert.equal(request.body[0].value, false);
+            next(request.respondWith('', {
+                status: 204
+            }));
+        });
+        disableReminder(reminderID).then(() => {
+            done();
+        }).catch((err) => {
+            done(err);
+        });
+    });
+
+    it('should set reminder time', function(done) {
+        Vue.http.interceptors.unshift((request, next) => {
+            assert.equal(request.url, '/api/reminders/' + reminderID);
+            assert.equal(request.body[0].op, 'replace');
+            assert.equal(request.body[0].path, '/time');
+            assert.equal(request.body[0].value, '22:22:00');
+            next(request.respondWith('', {
+                status: 204
+            }));
+        });
+        setTime(reminderID, '22:22:00').then(() => {
+            done();
+        }).catch((err) => {
+            done(err);
+        });
+    });
+
+    it('should set reminder recurrence', function(done) {
+        Vue.http.interceptors.unshift((request, next) => {
+            assert.equal(request.url, '/api/reminders/' + reminderID);
+            assert.equal(request.body[0].op, 'replace');
+            assert.equal(request.body[0].path, '/recur');
+            assert.equal(request.body[0].value, 'always');
+            next(request.respondWith('', {
+                status: 204
+            }));
+        });
+        setRecurrence(reminderID, 'always').then(() => {
+            done();
+        }).catch((err) => {
+            done(err);
+        });
+    });
+    
+});

t/store/reminder.js

@@ -0,0 +1,54 @@
+'use strict';
+
+import Reminder from '../../src/store/reminder';
+import {
+    assert
+} from 'chai';
+
+describe('Reminder', () => {
+
+    it('should load reminder data', () => {
+        var state = {};
+        var data = {
+            id: '1',
+            active: true,
+            time: '23:23:00',
+            recur: 'always'
+        };
+        Reminder.mutations.reminderLoaded(state, data);
+        assert.equal(state.reminderID, data.id);
+        assert.equal(state.active, data.active);
+        assert.equal(state.time, data.time);
+        assert.equal(state.recurrence, data.recur);
+    });
+
+    it('should enable/disable the reminder', () => {
+        var state = {};
+        Reminder.mutations.enableReminder(state);
+        assert.equal(state.active, true);
+        Reminder.mutations.disableReminder(state);
+        assert.equal(state.active, false);
+    });
+
+    it('should set reminder time', () => {
+        var state = {};
+        var time = '23:23:00'
+        Reminder.mutations.setTime(state, time);
+        assert.equal(state.time, time);
+    });
+
+    it('should set reminder recurrence', () => {
+        var state = {};
+        var recurrence = 'always'
+        Reminder.mutations.setRecurrence(state, recurrence);
+        assert.equal(state.recurrence, recurrence);
+    });
+
+    it('should set reminder id', () => {
+        var state = {};
+        var reminderID = '1'
+        Reminder.mutations.reminderCreated(state, reminderID);
+        assert.equal(state.reminderID, reminderID);
+    });
+
+});