https://github.com/charlesfries/ember-cloud-firestore-adapter-pagination

Get Cloud Firestore pagination data automatically via the DS.PromiseArray#meta object returned by store.query()
https://github.com/charlesfries/ember-cloud-firestore-adapter-pagination

cloud-firestore ember ember-addon ember-data firebase pagination

Last synced: about 1 month ago
JSON representation

Get Cloud Firestore pagination data automatically via the DS.PromiseArray#meta object returned by store.query()

• Host: GitHub
• URL: https://github.com/charlesfries/ember-cloud-firestore-adapter-pagination
• Owner: charlesfries
• License: mit
• Created: 2021-08-16T22:36:29.000Z (over 3 years ago)
• Default Branch: master
• Last Pushed: 2021-12-08T18:18:48.000Z (about 3 years ago)
• Last Synced: 2024-11-08T05:41:38.889Z (3 months ago)
• Topics: cloud-firestore, ember, ember-addon, ember-data, firebase, pagination
• Language: JavaScript
• Homepage:
• Size: 537 KB
• Stars: 0
• Watchers: 2
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • Contributing: CONTRIBUTING.md
  • License: LICENSE.md

Awesome Lists containing this project

README

        
ember-cloud-firestore-adapter-pagination

==============================================================================

This addon automatically adds cursor pagination data to the `meta` object inside the `DS.PromiseArray` object returned by `store.query`.

```typescript

interface Meta {

  canNext: boolean;

  canPrevious: boolean;

}

```

It works by checking if a `limit()` filter is included in the Cloud Firestore query. If this limit is present, the adapter fetches `LIMIT + 1` records, and depending on the presence of that extra record, `canNext` and `canPrevious` are assigned boolean values.

Compatibility

------------------------------------------------------------------------------

* Ember.js v3.20 or above

* Ember CLI v3.20 or above

* Node.js v12 or above

Installation

------------------------------------------------------------------------------

```

ember install ember-cloud-firestore-adapter-pagination

```

Usage

------------------------------------------------------------------------------

```javascript

// app/adapters/application.js

import CloudFirestoreAdapterPagination from 'ember-cloud-firestore-adapter-pagination/adapters/cloud-firestore-pagination';

export default class ApplicationAdapter extends CloudFirestoreAdapterPagination {}

```

```javascript

// app/serializers/application.js

import CloudFirestoreSerializerPagination from 'ember-cloud-firestore-adapter-pagination/serializers/cloud-firestore-pagination';

export default class ApplicationSerializer extends CloudFirestoreSerializerPagination {}

```

```javascript

// app/routes/application.js

import Route from '@ember/routing/route';

import { inject as service } from '@ember/service';

export default class ApplicationRoute extends Route {

  @service store;

  queryParams = {

    startAfter: { refreshModel: true },

    endBefore: { refreshModel: true },

  };

  model({ startAfter, endBefore }) {

    return this.store.query('post', {

      filter: (ref) => {

        const PAGE_SIZE = 10;

        ref = ref.orderBy('createdAt', 'desc');

        if (startAfter)

          ref = ref.startAfter(startAfter);

        else if (endBefore)

          ref = ref.endBefore(endBefore).limitToLast(PAGE_SIZE);

        if (!endBefore)

          ref = ref.limit(PAGE_SIZE);

        return ref;

      },

    });

  }

}

```

```hbs

{{! app/templates/application.js }}

{{#each this.model as |post|}}

  {{post.id}}

{{/each}}

  Previous

  Next

```

```javascript

// app/controllers/application.js

import Controller from '@ember/controller';

import { tracked } from '@glimmer/tracking';

import { action } from '@ember/object';

export default class ApplicationController extends Controller {

  @tracked startAfter;

  @tracked endBefore;

  @action next() {

    this.startAfter = this.model.lastObject.createdAt;

    this.endBefore = undefined;

  }

  @action previous() {

    this.startAfter = undefined;

    this.endBefore = this.model.firstObject.createdAt;

  }

}

```

Contributing

------------------------------------------------------------------------------

See the [Contributing](CONTRIBUTING.md) guide for details.

License

------------------------------------------------------------------------------

This project is licensed under the [MIT License](LICENSE.md).