@livequery/client 1.0.92 → 2.0.0

package/build/Collection.d.ts

@@ -1,59 +1,47 @@
-import { Subject, Observable, ReplaySubject } from 'rxjs';
-import { ErrorInfo, LivequeryBaseEntity, QueryOption, Transporter, UpdatedData } from '@livequery/types';
+import { Subject, Observable, BehaviorSubject } from 'rxjs';
+import { LivequeryBaseEntity, QueryOption, Transporter, UpdatedData, Paging, Response } from '@livequery/types';
+export type LoadingIndicator = false | 'backward' | 'forward' | 'both';
 export type CollectionOption<T extends LivequeryBaseEntity = LivequeryBaseEntity> = {
     transporter: Transporter;
     sync_delay?: number;
-    filters?: Partial<QueryOption<T>>;
-    reload_interval?: number;
+    options?: Partial<QueryOption<T>>;
     realtime?: boolean;
 };
 export type SmartQueryItem<T> = T & {
+    __remove: Function;
     __removing: boolean;
+    __update: (data: Partial<T>) => any;
     __updating: boolean;
     __adding: boolean;
-    __remove: Function;
-    __update: (data: Partial<T>) => any;
-    __trigger: (name: string, payload?: any) => any;
+    __trigger: <R extends {}>(name: string, payload?: any) => Promise<Response<R>>;
     __ref: string;
 };
-type CollectionStream<T extends LivequeryBaseEntity = LivequeryBaseEntity> = {
+export type CollectionStream<T extends LivequeryBaseEntity = LivequeryBaseEntity> = {
     items: SmartQueryItem<T>[];
-    error?: ErrorInfo;
-    has_more: boolean;
-    loading?: boolean;
+    paging: Partial<Paging>;
+    loading?: LoadingIndicator;
     options: Partial<QueryOption<T>>;
+    error?: boolean;
+    code?: string;
+    message?: string;
 };
 export declare class CollectionObservable<T extends LivequeryBaseEntity = LivequeryBaseEntity> extends Observable<CollectionStream<T>> {
     #private;
     private ref;
     private collection_options;
     readonly $changes: Subject<UpdatedData<T>>;
-    value: CollectionStream<T>;
-    $: ReplaySubject<CollectionStream<T>>;
+    $: BehaviorSubject<CollectionStream<T>>;
     constructor(ref: string | false | null | '' | undefined, collection_options: CollectionOption<T>);
     set_realtime(realtime: boolean): void;
     private fetch_data;
-    reload(): void;
     reset(): void;
     fetch_more(): void;
+    fetch_prev(): void;
     filter(filters: Partial<QueryOption<T>>): void;
-    add<R = {
-        data: {
-            item: T;
-        };
-    }>(payload: Partial<T>): Promise<R>;
-    update<R = {
-        data: {
-            item: T;
-        };
-    }>({ id: update_payload_id, ...payload }: Partial<T>): Promise<R | undefined>;
-    remove<R = {
-        data: {
-            item: T;
-        };
-    }>(remove_document_id?: string): Promise<void>;
-    trigger<R>(name: string, payload?: object, trigger_document_id?: string, query?: {
+    add(payload: Partial<T>): Promise<import("@livequery/types").DocumentResponse<T & LivequeryBaseEntity>>;
+    update({ id: update_payload_id, ...payload }: Partial<T>): Promise<import("@livequery/types").DocumentResponse<T & LivequeryBaseEntity> | undefined>;
+    remove(remove_document_id?: string): Promise<import("@livequery/types").DocumentResponse<LivequeryBaseEntity> | undefined>;
+    trigger<R extends {}>(name: string, payload?: object, trigger_document_id?: string, query?: {
         [key: string]: string | number | boolean;
-    }): Promise<R | undefined>;
+    }): Promise<Response<R>>;
 }
-export {};

package/build/Collection.js

@@ -1,35 +1,30 @@
-import { Subject, Observable, merge, ReplaySubject } from 'rxjs';
-import { bufferTime, filter, map } from 'rxjs/operators';
+import { Subject, Observable, merge, BehaviorSubject } from 'rxjs';
+import { bufferTime, filter, finalize, first, map, share, skip, tap, toArray } from 'rxjs/operators';
 export class CollectionObservable extends Observable {
     ref;
     collection_options;
     $changes = new Subject();
+    #pages = new Map();
     #queries = new Set();
-    #next_cursor = {};
+    #sorters = new Array;
     #IdMap = new Map();
     #refs = [];
-    value = {
-        has_more: false,
+    $ = new BehaviorSubject({
         items: [],
+        loading: false,
         options: {},
-        loading: false
-    };
-    $ = new ReplaySubject(1);
+        paging: {}
+    });
     constructor(ref, collection_options) {
         super(o => {
-            const subscription = this.$.subscribe(o);
-            const auto_reload_interval = collection_options.reload_interval && setInterval(() => this.reload(), collection_options.reload_interval);
+            const linker = this.$.subscribe(o);
             return () => {
-                subscription.unsubscribe();
+                linker.unsubscribe();
                 this.#queries.forEach(s => s.unsubscribe());
-                clearInterval(auto_reload_interval);
             };
         });
         this.ref = ref;
         this.collection_options = collection_options;
-        this.collection_options.filters = this.collection_options.filters || {};
-        if (collection_options.filters)
-            this.value.options = collection_options.filters;
         if (ref && (ref.startsWith('/') || ref.endsWith('/')))
             throw 'INVAILD_REF_FORMAT';
         this.#refs = this.#ref_parser(ref);
@@ -50,19 +45,20 @@ export class CollectionObservable extends Observable {
     set_realtime(realtime) {
         this.collection_options.realtime = realtime;
     }
-    #sync(stream, from_local = false) {
+    #sync(stream, from_local = false, direction) {
+        const state = this.$.getValue();
         const realtime = this.collection_options.realtime ?? true;
         const actions = { update: false, reindex: false };
-        for (const { data, error, ref } of stream) {
-            // Error & paging
-            if (error) {
-                this.value.error = error;
+        for (const { data, error, code, message } of stream) {
+            if (!from_local) {
+                state.loading = false;
                 actions.update = true;
             }
-            if (data?.paging?.n == 0) {
-                this.#next_cursor[ref] = data?.paging?.next_cursor;
-                this.value.has_more = Object.values(this.#next_cursor).some(v => v && v != '#');
-                this.value.loading = false;
+            // Error & paging
+            if (error) {
+                state.error = true;
+                state.code = code;
+                state.message = message;
                 actions.update = true;
             }
             // Sync 
@@ -75,38 +71,34 @@ export class CollectionObservable extends Observable {
                 if (index == -1 && type == 'added') {
                     if (
                     // Is first value from HTTP query
-                    data?.paging?.n == 0
-                        || (
-                        // Is realtime update that match filters
-                        (realtime || from_local) && Object
-                            .keys(this.value.options || {})
-                            .filter(key => !key.includes('_'))
-                            .every(key => {
-                            try {
-                                const [field, expression] = key.split(':');
-                                const a = payload[field];
-                                const b = this.value.options?.[field];
-                                if (!expression)
-                                    return a == b;
-                                if (expression == 'ne')
-                                    return a != b;
-                                if (expression == 'lt')
-                                    return typeof a == 'number' && typeof b == 'number' && a < b;
-                                if (expression == 'lte')
-                                    return typeof a == 'number' && typeof b == 'number' && a <= b;
-                                if (expression == 'gt')
-                                    return typeof a == 'number' && typeof b == 'number' && a > b;
-                                if (expression == 'gte')
-                                    return typeof a == 'number' && typeof b == 'number' && a >= b;
-                                if (expression == 'in' || expression == 'like')
-                                    return Array.isArray(a) && a?.includes(b);
-                                if (expression == 'between')
-                                    return (b[0] <= a && a <= b[1]);
-                            }
-                            catch (e) { }
-                            return false;
-                        }))) {
-                        this.value.items.push({
+                    true
+                    // || (
+                    //   // Is realtime update that match filters
+                    //   (realtime || from_local) && Object
+                    //     .keys(state.options || {})
+                    //     .filter(key => !key.includes('_'))
+                    //     .every(key => {
+                    //       try {
+                    //         const [field, expression] = key.split(':')
+                    //         const a = payload[field as keyof typeof payload] as number
+                    //         const b = state.options?.[field as keyof QueryOption<T>] as any as number
+                    //         if (!expression) return a == b
+                    //         if (expression == 'ne') return a != b
+                    //         if (expression == 'lt') return typeof a == 'number' && typeof b == 'number' && a < b
+                    //         if (expression == 'lte') return typeof a == 'number' && typeof b == 'number' && a <= b
+                    //         if (expression == 'gt') return typeof a == 'number' && typeof b == 'number' && a > b
+                    //         if (expression == 'gte') return typeof a == 'number' && typeof b == 'number' && a >= b
+                    //         if (expression == 'in' || expression == 'like') return Array.isArray(a) && a?.includes(b)
+                    //         if (expression == 'between') {
+                    //           const [x, y] = b as any as number[]
+                    //           return x <= a && a <= y
+                    //         }
+                    //       } catch (e) { }
+                    //       return false
+                    //     })
+                    // )
+                    ) {
+                        const item = {
                             ...payload,
                             __adding: false,
                             __updating: false,
@@ -115,7 +107,8 @@ export class CollectionObservable extends Observable {
                             __trigger: (name, input) => this.trigger(name, input, payload?.id),
                             __update: (input) => this.update({ ...input, id: payload?.id }),
                             __ref: change.ref
-                        });
+                        };
+                        direction == 'forward' ? state.items.push(item) : state.items.unshift(item);
                         actions.reindex = true;
                         actions.update = true;
                     }
@@ -123,11 +116,16 @@ export class CollectionObservable extends Observable {
                 if (index >= 0 && (realtime || from_local)) {
                     if (type == 'added' || type == 'modified') {
                         actions.update = true;
-                        if (Object.keys(payload).some(key => ['created_at', this.collection_options?.filters?._order_by].includes(key))) {
+                        const sort_key_value_updated = this.#sorters.some(({ key }) => {
+                            const value = payload[key];
+                            if (typeof value == 'string' || typeof value == 'number')
+                                return true;
+                        });
+                        if (sort_key_value_updated) {
                             actions.reindex = true;
                         }
-                        this.value.items[index] = {
-                            ...this.value.items[index],
+                        state.items[index] = {
+                            ...state.items[index],
                             __adding: false,
                             __updating: false,
                             __removing: false,
@@ -135,9 +133,8 @@ export class CollectionObservable extends Observable {
                         };
                     }
                     if (type == 'removed') {
-                        actions.reindex = true;
                         actions.update = true;
-                        this.value.items.splice(index, 1);
+                        state.items.splice(index, 1);
                         for (const [document_id, i] of this.#IdMap) {
                             i == index && this.#IdMap.delete(document_id);
                             i > index && this.#IdMap.set(document_id, i - 1);
@@ -147,65 +144,127 @@ export class CollectionObservable extends Observable {
             }
         }
         if (actions.reindex) {
-            const _sort = this.collection_options?.filters?._sort || 'desc';
-            const _order_by = this.collection_options?.filters?._order_by || 'created_at';
-            this.value.items = this.value.items.sort((a, b) => {
-                const ka = a[_order_by];
-                const kb = b[_order_by];
-                if (typeof ka == 'string' && typeof kb == 'string')
-                    return ka.localeCompare(ka) * (_sort == 'desc' ? -1 : 1);
-                if ((typeof ka == 'number' || typeof ka == 'number')
-                    && (typeof kb == 'number' || typeof kb == 'number'))
-                    return (ka - kb) * (_sort == 'desc' ? -1 : 1);
-                return 1;
+            state.items = state.items.sort((a, b) => {
+                for (const { key, order } of this.#sorters) {
+                    const aa = a[key];
+                    const bb = b[key];
+                    if (typeof aa == 'number' && typeof bb == 'number') {
+                        const rs = aa - bb;
+                        if (rs == 0)
+                            continue;
+                        return rs * order;
+                    }
+                    if (typeof aa == 'string' && typeof bb == 'string') {
+                        const rs = aa.localeCompare(bb);
+                        if (rs == 0)
+                            continue;
+                        return rs * order;
+                    }
+                }
+                return -1;
             });
             this.#IdMap.clear();
-            this.value.items.map((item, index) => this.#IdMap.set(item.id, index));
+            state.items.map((item, index) => this.#IdMap.set(item.id, index));
+        }
+        if (direction) {
+            // Cache paging
+            this.#pages.clear();
+            stream.forEach(s => s.data?.paging && this.#pages.set(s.ref, s.data?.paging));
+            // Caculate paging here
+            const last_page_total = state.items.length;
+            const total = stream.reduce((p, c) => p + (c.data?.paging?.count?.total || 0), 0);
+            const prev = stream.reduce((p, c) => p + (c.data?.paging?.count?.prev || 0), 0);
+            const next = stream.reduce((p, c) => p + (c.data?.paging?.count?.next || 0), 0);
+            state.paging = {
+                count: {
+                    current: state.items.length,
+                    next: next - (direction == 'backward' ? last_page_total : 0),
+                    prev: prev - (direction == 'forward' ? last_page_total : 0),
+                    total
+                },
+                has: {
+                    next: stream.some(s => s.data?.paging?.has?.next),
+                    prev: stream.some(s => s.data?.paging?.has?.prev)
+                },
+                page: {
+                    current: Math.min(...stream.map(s => s.data?.paging?.page.current || 0)),
+                    total: Math.max(...stream.map(s => s.data?.paging?.page.total || 0))
+                }
+            };
         }
-        actions.update && this.$.next(this.value);
+        actions.update && this.$.next(state);
     }
-    fetch_data(options = {}, flush = false) {
+    fetch_data(options = {}, loading, flush = false) {
         if (!this.ref)
             return;
         if (this.#refs.length == 0)
             return;
+        if (this.$.getValue().loading)
+            return;
+        this.collection_options.options = options;
+        this.#sorters = Object.keys(options).filter(k => k.endsWith(':sort')).map(k => {
+            const key = k.split(':sort')[0];
+            const order = options[k] == 1 ? 1 : -1;
+            return { key, order };
+        });
+        this.#sorters.every(a => a.key != 'id') && this.#sorters.push({ key: 'id', order: -1 });
+        const state = {
+            ...this.$.getValue(),
+            items: flush ? [] : this.$.getValue().items,
+            loading
+        };
         if (flush) {
-            this.#next_cursor = {};
+            this.#pages.clear();
             this.#queries.forEach(s => s.unsubscribe());
             this.#queries.clear();
             this.#IdMap.clear();
         }
-        const has_more_data_refs = this.#refs.filter(ref => this.#next_cursor[ref] === undefined || (this.#next_cursor[ref] && this.#next_cursor[ref] != '#'));
-        if (!flush && (has_more_data_refs.length == 0 || this.value.loading))
+        const remain_data_refs = this.#refs.filter(ref => {
+            const paging = this.#pages.get(ref);
+            if (!paging)
+                return true;
+            return loading == 'forward' ? paging.has.next : paging.has.prev;
+        });
+        const no_more_data = !flush && (remain_data_refs.length == 0 || this.$.getValue().loading);
+        if (no_more_data)
             return;
-        this.value = {
-            ...this.value,
-            items: flush ? [] : this.value.items,
-            error: undefined,
-            loading: true,
-            options
-        };
-        this.$.next(this.value);
-        const queries = has_more_data_refs.map(ref => (this
-            .collection_options
-            .transporter
-            .query(ref, { ...options, _cursor: this.#next_cursor[ref] })));
-        const reload = () => queries.map(q => q.reload());
-        const $ = merge(...queries.map((q, index) => q.pipe(map(data => ({ ...data, ref: has_more_data_refs[index] }))))).pipe(bufferTime(500), filter(list => list.length > 0), map(data => this.#sync(data)));
-        const subscription = Object.assign($.subscribe(), { reload });
+        this.$.next(state);
+        const queries = remain_data_refs.map((ref, index) => {
+            const cursor = this.#pages.get(ref)?.cursor;
+            const opts = {
+                ...options,
+                ...loading == 'backward' && cursor?.first ? { ':before': cursor?.first } : {},
+                ...loading == 'forward' && cursor?.last ? { ':after': cursor?.last } : {},
+            };
+            return this
+                .collection_options
+                .transporter
+                .query(ref, opts).pipe(map(data => ({
+                ...data,
+                ref
+            })), share());
+        });
+        const first_values = merge(...queries.map(q => q.pipe(filter(r => !!r.data?.paging || !!r.error), first()))).pipe(toArray(), tap(list => this.#sync(list, false, loading))).subscribe();
+        const subscription = merge(...queries.map(q => q.pipe(skip(1)))).pipe(bufferTime(500), filter(list => list.length > 0), map(data => this.#sync(data, false, loading)), finalize(() => first_values.unsubscribe())).subscribe();
         this.#queries.add(subscription);
     }
-    reload() {
-        this.#queries.forEach(s => s.reload());
-    }
     reset() {
-        this.fetch_data({}, true);
+        this.fetch_data({}, 'both', true);
     }
     fetch_more() {
-        this.fetch_data(this.value?.options);
+        const { options } = this.$.getValue();
+        this.fetch_data(options, 'forward');
+    }
+    fetch_prev() {
+        const { options } = this.$.getValue();
+        this.fetch_data(options, 'backward');
     }
+    // public fetch_around_cursor(cursor: string) {
+    //   const state = this.$.getValue()
+    //   this.fetch_data(state.options, 'both')
+    // }
     filter(filters) {
-        this.fetch_data(filters, true);
+        this.fetch_data(filters, 'forward', true);
     }
     #find_ref_by_id(id) {
         if (!id || !this.ref)
@@ -213,7 +272,7 @@ export class CollectionObservable extends Observable {
         const index = this.#IdMap.get(id);
         if (index == undefined)
             return {};
-        const origin_ref = this.value.items[index].__ref;
+        const origin_ref = this.$.getValue().items[index].__ref;
         if (!origin_ref)
             throw 'COLLECTION_REF_NOT_FOUND';
         const refs = origin_ref.split('/');
@@ -291,7 +350,7 @@ export class CollectionObservable extends Observable {
     async trigger(name, payload, trigger_document_id, query = {}) {
         const { ref } = this.#find_ref_by_id(trigger_document_id);
         if (!ref)
-            return;
+            throw new Error('INVAILD_REF');
         return await this.collection_options.transporter.trigger(ref, name, query, payload);
     }
 }

package/package.json

@@ -4,7 +4,7 @@
   "repository": {
     "url": "https://github.com/livequery/client"
   },
-  "version": "1.0.92",
+  "version": "2.0.0",
   "description": "",
   "main": "build/index.js",
   "types": "build/index.d.ts",
@@ -12,12 +12,12 @@
     "build/**/*"
   ],
   "dependencies": {
-    "rxjs": "^7.1.0",
-    "typescript": "^4.9.5",
     "uuid": "^8.3.2"
   },
   "devDependencies": {
-    "@livequery/types": "^1.0.79"
+    "typescript": "^4.9.5",
+    "rxjs": "^7.1.0",
+    "@livequery/types": "^2.0.0"
   },
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1",