PHPackages                             dewsign/pusher-agent - PHPackages - PHPackages  [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register)

1. [Directory](/)
2. /
3. [Utility & Helpers](/categories/utility)
4. /
5. dewsign/pusher-agent

ActiveLibrary[Utility & Helpers](/categories/utility)

dewsign/pusher-agent
====================

Vuex/Axios/Pusher store to enable SPAs to work with remote data without needing to interact with Ajax

v1.0.6(7y ago)3531GPL-3.0JavaScriptPHP >=7.1.0

Since May 23Pushed 7y ago2 watchersCompare

[ Source](https://github.com/dewsign/ajax-store)[ Packagist](https://packagist.org/packages/dewsign/pusher-agent)[ RSS](/packages/dewsign-pusher-agent/feed)WikiDiscussions master Synced 2d ago

READMEChangelogDependencies (2)Versions (4)Used By (1)

AJAX Vuex Store
===============

[](#ajax-vuex-store)

[![npm](https://camo.githubusercontent.com/e0cf2a6d3fbc58b78e08eba09e4b1130fc9340867ca1dbbfafbd7eabfff9a858/68747470733a2f2f696d672e736869656c64732e696f2f6e706d2f762f616a61782d73746f72652e7376673f7374796c653d666f722d7468652d6261646765)](https://www.npmjs.com/package/ajax-store)

Authors:

- [Marco Mark](mailto:marco.mark@dewsign.co.uk)
- [Sam Wrigley](mailto:sam.wrigley@dewsign.co.uk)

Overview
--------

[](#overview)

A namespaced Vuex store module that makes use of AJAX to get and update the store's data from the given API end-point.

Usage
-----

[](#usage)

To use the AJAX Vuex store in your application, start by extending the `AjaxStore` class from your own store class, such as below:

```
import { AjaxStore } from 'ajax-store'

class ExampleStore extends AjaxStore {
    constructor() {
        super({
            action: 'https://example.com',
            method: 'GET', // Default
        })
    }
}

export default ExampleStore
```

You can specify the AJAX request 'action' and 'method' when calling the parent class' constructor.

Import your newly created namespaced store module into your Vuex store, for example:

```
import Vue from 'vue'
import Vuex from 'vuex'

import ExampleStore from './ExampleStore'

Vue.use(Vuex)

const VuexStore = new Vuex.Store({
    modules: {
        example: new ExampleStore(),
    },
})

export default VuexStore
```

To get data from the namespaced Vuex store (or to update it) in your Vue component, you can make use of the Vuex `mapGetters` and `mapActions` helper methods. Below is an example implementation of a Vue component that checks if the namespaced Vuex store contains any items during the `created` lifecycle hook. If the store contains no items, then the `updateItems` action is dispatched to get the items from the given API end-point specified in your namespaced store module using AJAX.

```
import { mapGetters, mapActions } from 'vuex'

created() {
    if (!this.hasItems) this.updateItems()
},

computed: {
    ...mapGetters('example', [
        'items',
        'hasItems',
    ]),
},

methods: {
    ...mapActions('example', [
        'updateItems',
    ]),
},
```

PusherAgent for Laravel Echo with Pusher
----------------------------------------

[](#pusheragent-for-laravel-echo-with-pusher)

The agent will listen for any updates from the api and commit them into the current state to ensure all connected clients are in-sync and remove the need for regular ajax calls to fetch the latest data.

IMPORTANT: The agent will automatically listen to `private` pusher channels with the same name as the Vuex Store Module defined earlier. In this case `example` (`private-example`). This should also match the name of your Laravel Model class.

When creating your root Vue instance, add the PusherAgent plugin and mixin.

```
import Vue from 'vue'
import { PusherAgent } from 'ajax-store'

Vue.use(PusherAgent.plugin, {
    key: 'your pusher key',
    cluster: 'eu',
    encrypted: true,
})

new Vue({
    el: '#app',
    template: '',
    components: {
        App,
    },
    mixins: [
        PusherAgent.mixin,
    ]
})
```

Gotchas
-------

[](#gotchas)

The `BroadcastsPusherEvents` trait will set the `wasRecentlyCreated` property of a model to false after the first `saved` event hook. This means that a new model can be instanciated with `create()` which fires a `save` event and any further saves on the model will be treated as an update. This is useful when associating many-to-many relations with the model which require the model to be present in the database.

###  Health Score

28

—

LowBetter than 54% of packages

Maintenance20

Infrequent updates — may be unmaintained

Popularity12

Limited adoption so far

Community12

Small or concentrated contributor base

Maturity60

Established project with proven stability

 Bus Factor1

Top contributor holds 93.5% of commits — single point of failure

How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window.

**Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores.

**Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement.

**Maturity (30%)** — Project age, version count, PHP version support, and release stability.

###  Release Activity

Cadence

Every ~16 days

Total

3

Last Release

2880d ago

### Community

Maintainers

![](https://www.gravatar.com/avatar/767ab4e0eedaace1862603a74f2c37f2ef7f72811855d4748a3b8d02f3ad81df?d=identicon)[dewsign](/maintainers/dewsign)

---

Top Contributors

[![m2de](https://avatars.githubusercontent.com/u/17720020?v=4)](https://github.com/m2de "m2de (29 commits)")[![tristanward](https://avatars.githubusercontent.com/u/35340245?v=4)](https://github.com/tristanward "tristanward (2 commits)")

###  Code Quality

Code StylePHP\_CodeSniffer

### Embed Badge

![Health badge](/badges/dewsign-pusher-agent/health.svg)

```
[![Health](https://phpackages.com/badges/dewsign-pusher-agent/health.svg)](https://phpackages.com/packages/dewsign-pusher-agent)
```

###  Alternatives

[wireui/wireui

TallStack components

1.8k1.3M16](/packages/wireui-wireui)[livewire/volt

An elegantly crafted functional API for Laravel Livewire.

4195.3M84](/packages/livewire-volt)[ramonrietdijk/livewire-tables

Dynamic tables for models with Laravel Livewire

21147.4k](/packages/ramonrietdijk-livewire-tables)

PHPackages © 2026

[Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)