Ember js service and filterBy

i have a service to manage all the errors and alerts in my app. and the code looks like this

Service

import Ember from 'ember';

export default Ember.Service.extend({
messages: null,

init() {
    this._super(...arguments);
    this.set('messages', []);
},

add: function (severity, msg, messageType) {
    if (severity === 'error') {severity = 'danger';}

    var msgObject ={
        severity: severity,
        messageType: messageType,
        msg: msg,
        msgId: new Date()
    };      
    this.get('messages').pushObject(msgObject);
},

remove(msgId) {     
    this.get('messages').removeObject(msgId);
},

empty() {
    this.get('messages').clear();
}
});

Component

import Ember from 'ember';

export default Ember.Component.extend({
messageType:'global',
messageHandler: Ember.inject.service(),

messages: function(){
    return this.get('messageHandler.messages').filterBy('messageType',this.get('messageType'));
}.property('messageHandler.messages'),

actions : {
    dismissAllAlerts: function(){
        this.get('messageHandler').empty();
    },
    dismissAlert: function(msgId){
        this.get('messageHandler').remove(msgId);
    }
}    
}); 

Initializer

export function initialize(container, application) {
application.inject('component', 'messageHandler', 'service:message-handler');
}

export default {
name: 'message-handler',
initialize : initialize
};

Template

import Ember from 'ember';

export default Ember.Component.extend({
messageType:'global',
messageHandler: Ember.inject.service(),

messages: function(){
    return this.get('messageHandler.messages');
}.property('messageHandler.messages'),

actions : {
    dismissAllAlerts: function(){
        this.get('messageHandler').empty();
    },
    dismissAlert: function(msgId){
        this.get('messageHandler').remove(msgId);
    }
}    
}); 

and whenever there is an error i will add it like this

this.get('messageHandler').add('error',"Unable to get ossoi details","global");

my problem is the filterBy in the component is not working. if i remove the filterBy() it works and i can see the error in the template. am kinda new to ember so if anyone can help me figure out what am missing here or if there is a better way of doing this please let me know