@sprucelabs/spruce-feed-view-controllers 0.0.4 → 0.0.7

package/build/esm/{types.d.ts → feed.types.d.ts}

@@ -2,3 +2,5 @@ import { SpruceSchemas } from '@sprucelabs/spruce-core-schemas';
 export declare type FeedPredicate = SpruceSchemas.Mercury.v2020_12_25.FeedPredicate;
 export declare type FeedItem = SpruceSchemas.Spruce.v2020_07_22.FeedItem;
 export declare type Feed = SpruceSchemas.Spruce.v2020_07_22.Feed;
+export declare type CardSection = SpruceSchemas.HeartwoodViewControllers.v2021_02_11.CardSection;
+export declare type Card = SpruceSchemas.HeartwoodViewControllers.v2021_02_11.Card;

package/build/esm/viewControllers/FeedCard.vc.d.ts

@@ -1,19 +1,48 @@
-import { AbstractViewController, CardViewController, SpruceSchemas, ViewControllerOptions } from '@sprucelabs/heartwood-view-controllers';
-import { FeedPredicate } from '../types';
-declare type Card = SpruceSchemas.HeartwoodViewControllers.v2021_02_11.Card;
-export declare type FeedCardViewControllerOptions = ViewControllerOptions & {
-    id?: string;
-};
+import { AbstractViewController, Authenticator, CardViewController, FormViewController, ViewControllerOptions } from '@sprucelabs/heartwood-view-controllers';
+import { Card, FeedPredicate } from '../feed.types';
 export default class FeedCardViewController extends AbstractViewController<Card> {
     static id: string;
     private isLoaded;
     protected cardVc: CardViewController;
     private predicates;
-    constructor(options: FeedCardViewControllerOptions);
+    protected formVc: FormViewController<MessageFormSchema>;
+    private shouldEnableChat;
+    private auth;
+    private sentMessageCount;
+    private pendingAddedMessages;
+    constructor(options: ViewControllerOptions & FeedCardViewControllerOptions);
+    private CardVc;
+    private FormVc;
+    private handleChangeForm;
+    private handleSubmitForm;
+    private setMessage;
+    private handleDidUpdateFeed;
+    private sendMessage;
+    private removeItem;
+    private pushItem;
+    private addSentMessage;
+    private getFeed;
     getIsLoaded(): boolean;
-    load(predicates: FeedPredicate[]): Promise<void>;
+    load(options: {
+        predicates: FeedPredicate[];
+        authenticator: Authenticator;
+    }): Promise<void>;
     private refresh;
+    getShouldEnableChat(): boolean;
     private handleTryAgain;
-    render(): SpruceSchemas.HeartwoodViewControllers.v2021_02_11.Card;
+    render(): import("@sprucelabs/heartwood-view-controllers").SpruceSchemas.HeartwoodViewControllers.v2021_02_11.Card;
 }
+export declare type FeedCardViewControllerOptions = {
+    id?: string;
+    shouldEnableChat?: boolean;
+};
+declare const messageFormSchema: {
+    id: string;
+    fields: {
+        message: {
+            type: "text";
+        };
+    };
+};
+declare type MessageFormSchema = typeof messageFormSchema;
 export {};

package/build/esm/viewControllers/FeedCard.vc.js

@@ -7,34 +7,166 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
         step((generator = generator.apply(thisArg, _arguments || [])).next());
     });
 };
-import { AbstractViewController, } from '@sprucelabs/heartwood-view-controllers';
-import { assertOptions } from '@sprucelabs/schema';
+import { AbstractViewController, buildForm, } from '@sprucelabs/heartwood-view-controllers';
+import { assertOptions, buildSchema } from '@sprucelabs/schema';
 export default class FeedCardViewController extends AbstractViewController {
     constructor(options) {
         super(options);
         this.isLoaded = false;
         this.predicates = [];
-        this.cardVc = this.Controller('card', {
-            id: options.id,
+        this.sentMessageCount = 0;
+        this.pendingAddedMessages = [];
+        const { shouldEnableChat } = options;
+        this.shouldEnableChat = !!shouldEnableChat;
+        this.formVc = this.FormVc();
+        this.cardVc = this.CardVc(options);
+    }
+    CardVc(options) {
+        const { id, shouldEnableChat } = options;
+        const sections = [
+            {
+                id: 'feed',
+                feed: {
+                    items: [],
+                },
+            },
+        ];
+        if (shouldEnableChat) {
+            sections.push({
+                form: this.formVc.render(),
+            });
+        }
+        return this.Controller('card', {
+            id,
             body: {
                 isBusy: true,
-                sections: [
-                    {
-                        feed: {
-                            items: [],
+                sections,
+            },
+        });
+    }
+    FormVc() {
+        return this.Controller('form', buildForm({
+            id: 'message',
+            schema: messageFormSchema,
+            isEnabled: false,
+            onChange: this.handleChangeForm.bind(this),
+            onSubmit: this.handleSubmitForm.bind(this),
+            sections: [
+                {
+                    fields: [
+                        {
+                            name: 'message',
+                            renderAs: 'textarea',
+                        },
+                    ],
+                },
+            ],
+            shouldShowCancelButton: false,
+        }));
+    }
+    handleChangeForm() {
+        var _a;
+        return __awaiter(this, void 0, void 0, function* () {
+            const message = (_a = this.formVc.getValue('message')) !== null && _a !== void 0 ? _a : '';
+            if (message.length > 0) {
+                this.formVc.enable();
+            }
+            else {
+                this.formVc.disable();
+            }
+        });
+    }
+    handleSubmitForm() {
+        return __awaiter(this, void 0, void 0, function* () {
+            const message = this.formVc.getValue('message');
+            yield this.setMessage(null);
+            yield this.sendMessage(message);
+        });
+    }
+    setMessage(value) {
+        return __awaiter(this, void 0, void 0, function* () {
+            yield this.formVc.setValue('message', value);
+        });
+    }
+    handleDidUpdateFeed(item) {
+        const idx = this.pendingAddedMessages.indexOf(item.message);
+        if (idx === -1) {
+            this.pushItem(item);
+        }
+        else {
+            this.pendingAddedMessages.splice(idx, 1);
+        }
+    }
+    sendMessage(message) {
+        var _a;
+        return __awaiter(this, void 0, void 0, function* () {
+            const added = this.addSentMessage(message);
+            const client = yield this.connectToApi();
+            try {
+                yield client.emitAndFlattenResponses('send-message::v2020_12_25', {
+                    payload: {
+                        message: {
+                            body: message,
+                            classification: 'transactional',
                         },
                     },
-                ],
-            },
+                });
+                this.pendingAddedMessages.push(message);
+            }
+            catch (err) {
+                this.removeItem(added.id);
+                yield this.setMessage(added.message);
+                yield this.alert({
+                    title: 'Failed to send message!',
+                    message: err.message,
+                });
+                console.error((_a = err.stack) !== null && _a !== void 0 ? _a : err.message);
+            }
         });
     }
+    removeItem(id) {
+        const feed = this.getFeed();
+        feed.items = feed.items.filter((i) => i.id !== id);
+        this.cardVc.updateSection('feed', { feed });
+    }
+    pushItem(item) {
+        const { items } = this.getFeed();
+        items.push(item);
+        this.cardVc.triggerRender();
+    }
+    addSentMessage(message) {
+        const person = this.auth.getPerson();
+        const item = {
+            id: `${new Date().getTime()}-${this.sentMessageCount++}`,
+            isMe: true,
+            message: message,
+            fromCasualName: person.casualName,
+            dateCreated: new Date().getTime(),
+            avatar: person.avatar,
+            source: {
+                personId: person.id,
+            },
+        };
+        this.pushItem(item);
+        return item;
+    }
+    getFeed() {
+        const { feed } = this.cardVc.getSection('feed');
+        return feed;
+    }
     getIsLoaded() {
         return this.isLoaded;
     }
-    load(predicates) {
+    load(options) {
         return __awaiter(this, void 0, void 0, function* () {
-            assertOptions({ predicates }, ['predicates'], `You have to pass the search predicates to load the feed. They are in the form of { source: {...}, target: {...} }[]. If you wanna find anything to AND from a person, you gotta pass personId to both source AND target.`);
+            const { predicates, authenticator } = assertOptions(options, ['predicates', 'authenticator'], `You have to pass the search predicates and the authenticator to load the feed. They are in the form of { source: {...}, target: {...} }[]. If you wanna find anything to AND from a person, you gotta pass personId to both source AND target.`);
             this.predicates = predicates;
+            this.auth = authenticator;
+            const client = yield this.connectToApi();
+            yield client.on('did-update-feed::v2020_12_25', ({ payload }) => {
+                const { item } = payload;
+                this.handleDidUpdateFeed(item);
+            });
             yield this.refresh();
         });
     }
@@ -47,7 +179,7 @@ export default class FeedCardViewController extends AbstractViewController {
                         predicates: this.predicates,
                     },
                 });
-                this.cardVc.setSection(0, {
+                this.cardVc.setSection('feed', {
                     feed: Object.assign(Object.assign({}, feed), { shouldEnableChat: true }),
                 });
             }
@@ -68,6 +200,9 @@ export default class FeedCardViewController extends AbstractViewController {
             this.cardVc.setIsBusy(false);
         });
     }
+    getShouldEnableChat() {
+        return this.shouldEnableChat;
+    }
     handleTryAgain() {
         return __awaiter(this, void 0, void 0, function* () {
             this.cardVc.clearCriticalError();
@@ -79,3 +214,11 @@ export default class FeedCardViewController extends AbstractViewController {
     }
 }
 FeedCardViewController.id = 'feed-card';
+const messageFormSchema = buildSchema({
+    id: 'message',
+    fields: {
+        message: {
+            type: 'text',
+        },
+    },
+});

package/build/{types.d.ts → feed.types.d.ts}

@@ -2,3 +2,5 @@ import { SpruceSchemas } from '@sprucelabs/spruce-core-schemas';
 export declare type FeedPredicate = SpruceSchemas.Mercury.v2020_12_25.FeedPredicate;
 export declare type FeedItem = SpruceSchemas.Spruce.v2020_07_22.FeedItem;
 export declare type Feed = SpruceSchemas.Spruce.v2020_07_22.Feed;
+export declare type CardSection = SpruceSchemas.HeartwoodViewControllers.v2021_02_11.CardSection;
+export declare type Card = SpruceSchemas.HeartwoodViewControllers.v2021_02_11.Card;

package/build/viewControllers/FeedCard.vc.d.ts

@@ -1,19 +1,48 @@
-import { AbstractViewController, CardViewController, SpruceSchemas, ViewControllerOptions } from '@sprucelabs/heartwood-view-controllers';
-import { FeedPredicate } from '../types';
-declare type Card = SpruceSchemas.HeartwoodViewControllers.v2021_02_11.Card;
-export declare type FeedCardViewControllerOptions = ViewControllerOptions & {
-    id?: string;
-};
+import { AbstractViewController, Authenticator, CardViewController, FormViewController, ViewControllerOptions } from '@sprucelabs/heartwood-view-controllers';
+import { Card, FeedPredicate } from '../feed.types';
 export default class FeedCardViewController extends AbstractViewController<Card> {
     static id: string;
     private isLoaded;
     protected cardVc: CardViewController;
     private predicates;
-    constructor(options: FeedCardViewControllerOptions);
+    protected formVc: FormViewController<MessageFormSchema>;
+    private shouldEnableChat;
+    private auth;
+    private sentMessageCount;
+    private pendingAddedMessages;
+    constructor(options: ViewControllerOptions & FeedCardViewControllerOptions);
+    private CardVc;
+    private FormVc;
+    private handleChangeForm;
+    private handleSubmitForm;
+    private setMessage;
+    private handleDidUpdateFeed;
+    private sendMessage;
+    private removeItem;
+    private pushItem;
+    private addSentMessage;
+    private getFeed;
     getIsLoaded(): boolean;
-    load(predicates: FeedPredicate[]): Promise<void>;
+    load(options: {
+        predicates: FeedPredicate[];
+        authenticator: Authenticator;
+    }): Promise<void>;
     private refresh;
+    getShouldEnableChat(): boolean;
     private handleTryAgain;
-    render(): SpruceSchemas.HeartwoodViewControllers.v2021_02_11.Card;
+    render(): import("@sprucelabs/heartwood-view-controllers").SpruceSchemas.HeartwoodViewControllers.v2021_02_11.Card;
 }
+export declare type FeedCardViewControllerOptions = {
+    id?: string;
+    shouldEnableChat?: boolean;
+};
+declare const messageFormSchema: {
+    id: string;
+    fields: {
+        message: {
+            type: "text";
+        };
+    };
+};
+declare type MessageFormSchema = typeof messageFormSchema;
 export {};

package/build/viewControllers/FeedCard.vc.js

@@ -7,26 +7,150 @@ class FeedCardViewController extends heartwood_view_controllers_1.AbstractViewCo
         super(options);
         this.isLoaded = false;
         this.predicates = [];
-        this.cardVc = this.Controller('card', {
-            id: options.id,
+        this.sentMessageCount = 0;
+        this.pendingAddedMessages = [];
+        const { shouldEnableChat } = options;
+        this.shouldEnableChat = !!shouldEnableChat;
+        this.formVc = this.FormVc();
+        this.cardVc = this.CardVc(options);
+    }
+    CardVc(options) {
+        const { id, shouldEnableChat } = options;
+        const sections = [
+            {
+                id: 'feed',
+                feed: {
+                    items: [],
+                },
+            },
+        ];
+        if (shouldEnableChat) {
+            sections.push({
+                form: this.formVc.render(),
+            });
+        }
+        return this.Controller('card', {
+            id,
             body: {
                 isBusy: true,
-                sections: [
-                    {
-                        feed: {
-                            items: [],
+                sections,
+            },
+        });
+    }
+    FormVc() {
+        return this.Controller('form', (0, heartwood_view_controllers_1.buildForm)({
+            id: 'message',
+            schema: messageFormSchema,
+            isEnabled: false,
+            onChange: this.handleChangeForm.bind(this),
+            onSubmit: this.handleSubmitForm.bind(this),
+            sections: [
+                {
+                    fields: [
+                        {
+                            name: 'message',
+                            renderAs: 'textarea',
                         },
+                    ],
+                },
+            ],
+            shouldShowCancelButton: false,
+        }));
+    }
+    async handleChangeForm() {
+        var _a;
+        const message = (_a = this.formVc.getValue('message')) !== null && _a !== void 0 ? _a : '';
+        if (message.length > 0) {
+            this.formVc.enable();
+        }
+        else {
+            this.formVc.disable();
+        }
+    }
+    async handleSubmitForm() {
+        const message = this.formVc.getValue('message');
+        await this.setMessage(null);
+        await this.sendMessage(message);
+    }
+    async setMessage(value) {
+        await this.formVc.setValue('message', value);
+    }
+    handleDidUpdateFeed(item) {
+        const idx = this.pendingAddedMessages.indexOf(item.message);
+        if (idx === -1) {
+            this.pushItem(item);
+        }
+        else {
+            this.pendingAddedMessages.splice(idx, 1);
+        }
+    }
+    async sendMessage(message) {
+        var _a;
+        const added = this.addSentMessage(message);
+        const client = await this.connectToApi();
+        try {
+            await client.emitAndFlattenResponses('send-message::v2020_12_25', {
+                payload: {
+                    message: {
+                        body: message,
+                        classification: 'transactional',
                     },
-                ],
+                },
+            });
+            this.pendingAddedMessages.push(message);
+        }
+        catch (err) {
+            this.removeItem(added.id);
+            await this.setMessage(added.message);
+            await this.alert({
+                title: 'Failed to send message!',
+                message: err.message,
+            });
+            console.error((_a = err.stack) !== null && _a !== void 0 ? _a : err.message);
+        }
+    }
+    removeItem(id) {
+        const feed = this.getFeed();
+        feed.items = feed.items.filter((i) => i.id !== id);
+        this.cardVc.updateSection('feed', { feed });
+    }
+    pushItem(item) {
+        const { items } = this.getFeed();
+        items.push(item);
+        this.cardVc.triggerRender();
+    }
+    addSentMessage(message) {
+        const person = this.auth.getPerson();
+        const item = {
+            id: `${new Date().getTime()}-${this.sentMessageCount++}`,
+            isMe: true,
+            message: message,
+            fromCasualName: person.casualName,
+            dateCreated: new Date().getTime(),
+            avatar: person.avatar,
+            source: {
+                personId: person.id,
             },
-        });
+        };
+        this.pushItem(item);
+        return item;
+    }
+    getFeed() {
+        const { feed } = this.cardVc.getSection('feed');
+        return feed;
     }
     getIsLoaded() {
         return this.isLoaded;
     }
-    async load(predicates) {
-        (0, schema_1.assertOptions)({ predicates }, ['predicates'], `You have to pass the search predicates to load the feed. They are in the form of { source: {...}, target: {...} }[]. If you wanna find anything to AND from a person, you gotta pass personId to both source AND target.`);
+    async load(options) {
+        const { predicates, authenticator } = (0, schema_1.assertOptions)(options, ['predicates', 'authenticator'], `You have to pass the search predicates and the authenticator to load the feed. They are in the form of { source: {...}, target: {...} }[]. If you wanna find anything to AND from a person, you gotta pass personId to both source AND target.`);
         this.predicates = predicates;
+        this.auth = authenticator;
+        const client = await this.connectToApi();
+        await client.on('did-update-feed::v2020_12_25', ({ payload }) => {
+            const { item } = payload;
+            this.handleDidUpdateFeed(item);
+        });
         await this.refresh();
     }
     async refresh() {
@@ -37,7 +161,7 @@ class FeedCardViewController extends heartwood_view_controllers_1.AbstractViewCo
                     predicates: this.predicates,
                 },
             });
-            this.cardVc.setSection(0, {
+            this.cardVc.setSection('feed', {
                 feed: Object.assign(Object.assign({}, feed), { shouldEnableChat: true }),
             });
         }
@@ -57,6 +181,9 @@ class FeedCardViewController extends heartwood_view_controllers_1.AbstractViewCo
         this.isLoaded = true;
         this.cardVc.setIsBusy(false);
     }
+    getShouldEnableChat() {
+        return this.shouldEnableChat;
+    }
     async handleTryAgain() {
         this.cardVc.clearCriticalError();
         await this.refresh();
@@ -67,3 +194,11 @@ class FeedCardViewController extends heartwood_view_controllers_1.AbstractViewCo
 }
 exports.default = FeedCardViewController;
 FeedCardViewController.id = 'feed-card';
+const messageFormSchema = (0, schema_1.buildSchema)({
+    id: 'message',
+    fields: {
+        message: {
+            type: 'text',
+        },
+    },
+});

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@sprucelabs/spruce-feed-view-controllers",
   "description": "Spruce feed view controllers",
-  "version": "0.0.4",
+  "version": "0.0.7",
   "skill": {
     "namespace": "feed"
   },
@@ -26,10 +26,10 @@
     "build/types-module.d.ts",
     "build/esm/types-module.js",
     "build/esm/types-module.d.ts",
-    "build/types.js",
-    "build/types.d.ts",
-    "build/esm/types.js",
-    "build/esm/types.d.ts"
+    "build/feed.types.js",
+    "build/feed.types.d.ts",
+    "build/esm/feed.types.js",
+    "build/esm/feed.types.d.ts"
   ],
   "keywords": [],
   "scripts": {