@fluid-topics/ft-reader-feedback 0.3.55 → 0.3.56

package/build/ft-reader-map-feedback.d.ts

@@ -13,6 +13,7 @@ export declare class FtReaderMapFeedback extends FtReaderComponent implements Ft
     configuration?: FtReaderFeedbackConfiguration;
     ratingSummary?: FtPublicationRatingSummary;
     user?: FtUserProfile;
+    hideTitle: boolean;
     iconVariant: FtIconVariants;
     emptyStarIcon?: string;
     filledStarIcon?: string;
@@ -25,8 +26,12 @@ export declare class FtReaderMapFeedback extends FtReaderComponent implements Ft
     protected render(): typeof nothing | import("lit-html").TemplateResult<1>;
     protected updated(props: PropertyValues): void;
     connectedCallback(): void;
+    onStoreAvailable(name?: string): void;
+    private updateDebouncer;
     private updateData;
+    private sendRatingDebouncer;
     private rate;
+    private sendRating;
     private sendFeedback;
 }
 //# sourceMappingURL=ft-reader-map-feedback.d.ts.map

package/build/ft-reader-map-feedback.js

@@ -5,11 +5,10 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
 import { html, nothing } from "lit";
-import { property, query } from "lit/decorators.js";
-import { FtNotificationEvent, redux } from "@fluid-topics/ft-wc-utils";
+import { property, query, state } from "lit/decorators.js";
+import { Debouncer, FtNotificationEvent, redux } from "@fluid-topics/ft-wc-utils";
 import { FtReaderComponent } from "@fluid-topics/ft-reader-context/build/registration";
 import { FtReaderFeedback } from "./ft-reader-feedback";
-import { state } from "lit/decorators";
 import { FtIconVariants } from "@fluid-topics/ft-icon";
 import { mapLabelResolver } from "./utils/labels";
 import { FeedbackMailLinkBuilder } from "./utils/mail";
@@ -17,6 +16,7 @@ export class FtReaderMapFeedback extends FtReaderComponent {
     constructor() {
         super(...arguments);
         this.editorMode = false;
+        this.hideTitle = false;
         this.iconVariant = FtIconVariants.fluid_topics;
         this.emptyStarIcon = "STAR";
         this.filledStarIcon = "STAR_PLAIN";
@@ -25,6 +25,8 @@ export class FtReaderMapFeedback extends FtReaderComponent {
         this.emptyDislikeIcon = "THUMBS_DOWN";
         this.filledDislikeIcon = "THUMBS_DOWN_PLAIN";
         this.feedbackLinkBuilder = new FeedbackMailLinkBuilder(mapLabelResolver.resolve("mailDisclaimer"));
+        this.updateDebouncer = new Debouncer(100);
+        this.sendRatingDebouncer = new Debouncer(500);
     }
     render() {
         if (this.map == null) {
@@ -33,7 +35,8 @@ export class FtReaderMapFeedback extends FtReaderComponent {
         return html `
             <ft-reader-feedback
                     ratingAllowed
-                    .editorMode=${true}
+                    .editorMode=${this.editorMode}
+                    ?hideTitle=${this.hideTitle}
                     .labelResolver=${mapLabelResolver}
                     .ratingSummary=${this.ratingSummary}
                     .user=${this.user}
@@ -53,7 +56,7 @@ export class FtReaderMapFeedback extends FtReaderComponent {
     updated(props) {
         var _a, _b, _c;
         super.updated(props);
-        if (props.has("map")) {
+        if (props.has("map") && this.map) {
             this.updateData();
         }
         if (["map", "configuration", "user"].some(p => props.has(p)) && this.map && this.configuration) {
@@ -64,31 +67,41 @@ export class FtReaderMapFeedback extends FtReaderComponent {
         super.connectedCallback();
         this.updateData();
     }
-    async updateData() {
-        var _a, _b;
-        this.user = await ((_a = this.service) === null || _a === void 0 ? void 0 : _a.getSession().then(s => s.profile));
-        if (this.map) {
-            this.ratingSummary = await ((_b = this.service) === null || _b === void 0 ? void 0 : _b.getMapRating());
+    onStoreAvailable(name) {
+        super.onStoreAvailable(name);
+        this.updateData();
+    }
+    updateData() {
+        this.updateDebouncer.run(async () => {
+            var _a, _b;
+            this.user = await ((_a = this.service) === null || _a === void 0 ? void 0 : _a.getSession().then(s => s.profile));
+            if (this.map) {
+                this.ratingSummary = await ((_b = this.service) === null || _b === void 0 ? void 0 : _b.getMapRating());
+            }
+        });
+    }
+    rate(ratingEvent) {
+        if (this.ratingSummary) {
+            this.ratingSummary = {
+                ...this.ratingSummary,
+                rating: ratingEvent.detail == null ? undefined : {
+                    type: this.ratingSummary.type,
+                    value: ratingEvent.detail,
+                    date: new Date()
+                }
+            };
+            this.sendRatingDebouncer.run(() => this.sendRating(ratingEvent.detail));
         }
     }
-    async rate(ratingEvent) {
+    async sendRating(value) {
         var _a, _b, _c;
-        if (this.ratingSummary) {
+        if (!this.editorMode && this.ratingSummary) {
             try {
-                if (ratingEvent.detail == null) {
-                    this.ratingSummary = { ...this.ratingSummary, rating: undefined };
+                if (value == null) {
                     await ((_a = this.service) === null || _a === void 0 ? void 0 : _a.unrateMap());
                 }
                 else {
-                    this.ratingSummary = {
-                        ...this.ratingSummary,
-                        rating: {
-                            type: this.ratingSummary.type,
-                            value: ratingEvent.detail,
-                            date: new Date()
-                        }
-                    };
-                    await ((_b = this.service) === null || _b === void 0 ? void 0 : _b.rateMap((_c = this.ratingSummary) === null || _c === void 0 ? void 0 : _c.type, ratingEvent.detail));
+                    await ((_b = this.service) === null || _b === void 0 ? void 0 : _b.rateMap((_c = this.ratingSummary) === null || _c === void 0 ? void 0 : _c.type, value));
                 }
             }
             catch {
@@ -97,17 +110,31 @@ export class FtReaderMapFeedback extends FtReaderComponent {
                     message: mapLabelResolver.resolve("ratingFailure")
                 }));
             }
+            this.updateData();
+        }
+        else if (this.editorMode) {
+            this.dispatchEvent(new FtNotificationEvent({
+                type: "info",
+                message: mapLabelResolver.resolve("feedbackAndRatingDisabledInEditor")
+            }));
         }
-        this.updateData();
     }
     async sendFeedback(ratingEvent) {
         var _a;
         try {
-            await ((_a = this.service) === null || _a === void 0 ? void 0 : _a.sendMapFeedback(ratingEvent.detail));
-            this.dispatchEvent(new FtNotificationEvent({
-                type: "info",
-                message: mapLabelResolver.resolve("feedbackSuccess")
-            }));
+            if (!this.editorMode) {
+                await ((_a = this.service) === null || _a === void 0 ? void 0 : _a.sendMapFeedback(ratingEvent.detail));
+                this.dispatchEvent(new FtNotificationEvent({
+                    type: "info",
+                    message: mapLabelResolver.resolve("feedbackSuccess")
+                }));
+            }
+            else {
+                this.dispatchEvent(new FtNotificationEvent({
+                    type: "info",
+                    message: mapLabelResolver.resolve("feedbackAndRatingDisabledInEditor")
+                }));
+            }
             this.readerFeedback.clearFeedbackInput();
         }
         catch {
@@ -137,25 +164,28 @@ __decorate([
     state()
 ], FtReaderMapFeedback.prototype, "user", void 0);
 __decorate([
-    property({ type: String })
+    property({ type: Boolean })
+], FtReaderMapFeedback.prototype, "hideTitle", void 0);
+__decorate([
+    property()
 ], FtReaderMapFeedback.prototype, "iconVariant", void 0);
 __decorate([
-    property({ type: String })
+    property()
 ], FtReaderMapFeedback.prototype, "emptyStarIcon", void 0);
 __decorate([
-    property({ type: String })
+    property()
 ], FtReaderMapFeedback.prototype, "filledStarIcon", void 0);
 __decorate([
-    property({ type: String })
+    property()
 ], FtReaderMapFeedback.prototype, "emptyLikeIcon", void 0);
 __decorate([
-    property({ type: String })
+    property()
 ], FtReaderMapFeedback.prototype, "filledLikeIcon", void 0);
 __decorate([
-    property({ type: String })
+    property()
 ], FtReaderMapFeedback.prototype, "emptyDislikeIcon", void 0);
 __decorate([
-    property({ type: String })
+    property()
 ], FtReaderMapFeedback.prototype, "filledDislikeIcon", void 0);
 __decorate([
     query("ft-reader-feedback")

package/build/ft-reader-topic-feedback.d.ts

@@ -15,6 +15,7 @@ export declare class FtReaderTopicFeedback extends FtReaderTopicComponent implem
     configuration?: FtReaderFeedbackConfiguration;
     ratingSummary?: FtTopicRatingSummary;
     user?: FtUserProfile;
+    hideTitle: boolean;
     iconVariant: FtIconVariants;
     emptyStarIcon?: string;
     filledStarIcon?: string;
@@ -28,7 +29,9 @@ export declare class FtReaderTopicFeedback extends FtReaderTopicComponent implem
     protected updated(props: PropertyValues): void;
     connectedCallback(): void;
     private updateData;
+    private sendRatingDebouncer;
     private rate;
+    private sendRating;
     private sendFeedback;
 }
 //# sourceMappingURL=ft-reader-topic-feedback.d.ts.map

package/build/ft-reader-topic-feedback.js

@@ -6,7 +6,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 };
 import { html, nothing } from "lit";
 import { property, query, state } from "lit/decorators.js";
-import { FtNotificationEvent, redux } from "@fluid-topics/ft-wc-utils";
+import { Debouncer, FtNotificationEvent, redux } from "@fluid-topics/ft-wc-utils";
 import { FtReaderFeedback } from "./ft-reader-feedback";
 import { FtReaderTopicComponent } from "@fluid-topics/ft-reader-topic-context/build/registration";
 import { FtIconVariants } from "@fluid-topics/ft-icon";
@@ -16,6 +16,7 @@ export class FtReaderTopicFeedback extends FtReaderTopicComponent {
     constructor() {
         super(...arguments);
         this.editorMode = false;
+        this.hideTitle = false;
         this.iconVariant = FtIconVariants.fluid_topics;
         this.emptyStarIcon = "STAR";
         this.filledStarIcon = "STAR_PLAIN";
@@ -24,6 +25,7 @@ export class FtReaderTopicFeedback extends FtReaderTopicComponent {
         this.emptyDislikeIcon = "THUMBS_DOWN";
         this.filledDislikeIcon = "THUMBS_DOWN_PLAIN";
         this.feedbackLinkBuilder = new FeedbackMailLinkBuilder(topicLabelResolver.resolve("mailDisclaimer"));
+        this.sendRatingDebouncer = new Debouncer(500);
     }
     render() {
         if (this.map == null || this.tocNode == null) {
@@ -33,6 +35,7 @@ export class FtReaderTopicFeedback extends FtReaderTopicComponent {
             <ft-reader-feedback
                     ?ratingAllowed=${this.tocNode.hasRating}
                     .editorMode=${this.editorMode}
+                    ?hideTitle=${this.hideTitle}
                     .labelResolver=${topicLabelResolver}
                     .ratingSummary=${this.ratingSummary}
                     .user=${this.user}
@@ -70,25 +73,29 @@ export class FtReaderTopicFeedback extends FtReaderTopicComponent {
             this.ratingSummary = await ((_b = this.service) === null || _b === void 0 ? void 0 : _b.getTopicRating(this.tocNode.tocId));
         }
     }
-    async rate(ratingEvent) {
-        var _a, _b, _c;
+    rate(ratingEvent) {
         if (this.ratingSummary && this.tocNode) {
+            this.ratingSummary = {
+                ...this.ratingSummary,
+                rating: ratingEvent.detail == null ? undefined : {
+                    tocId: this.tocNode.tocId,
+                    type: this.ratingSummary.type,
+                    value: ratingEvent.detail,
+                    date: new Date()
+                }
+            };
+            this.sendRatingDebouncer.run(() => this.sendRating(ratingEvent.detail));
+        }
+    }
+    async sendRating(value) {
+        var _a, _b, _c;
+        if (!this.editorMode && this.ratingSummary && this.tocNode) {
             try {
-                if (ratingEvent.detail == null) {
-                    this.ratingSummary = { ...this.ratingSummary, rating: undefined };
+                if (value == null) {
                     await ((_a = this.service) === null || _a === void 0 ? void 0 : _a.unrateTopic(this.tocNode.tocId));
                 }
                 else {
-                    this.ratingSummary = {
-                        ...this.ratingSummary,
-                        rating: {
-                            tocId: this.tocNode.tocId,
-                            type: this.ratingSummary.type,
-                            value: ratingEvent.detail,
-                            date: new Date()
-                        }
-                    };
-                    await ((_b = this.service) === null || _b === void 0 ? void 0 : _b.rateTopic(this.tocNode.tocId, (_c = this.ratingSummary) === null || _c === void 0 ? void 0 : _c.type, ratingEvent.detail));
+                    await ((_b = this.service) === null || _b === void 0 ? void 0 : _b.rateTopic(this.tocNode.tocId, (_c = this.ratingSummary) === null || _c === void 0 ? void 0 : _c.type, value));
                 }
             }
             catch {
@@ -97,13 +104,19 @@ export class FtReaderTopicFeedback extends FtReaderTopicComponent {
                     message: topicLabelResolver.resolve("ratingFailure")
                 }));
             }
+            this.updateData();
+        }
+        else if (this.editorMode) {
+            this.dispatchEvent(new FtNotificationEvent({
+                type: "info",
+                message: topicLabelResolver.resolve("feedbackAndRatingDisabledInEditor")
+            }));
         }
-        this.updateData();
     }
     async sendFeedback(ratingEvent) {
         var _a;
         try {
-            if (this.tocNode) {
+            if (!this.editorMode && this.tocNode) {
                 await ((_a = this.service) === null || _a === void 0 ? void 0 : _a.sendTopicFeedback(this.tocNode.tocId, ratingEvent.detail));
                 this.dispatchEvent(new FtNotificationEvent({
                     type: "info",
@@ -111,6 +124,12 @@ export class FtReaderTopicFeedback extends FtReaderTopicComponent {
                 }));
                 this.readerFeedback.clearFeedbackInput();
             }
+            else if (this.editorMode) {
+                this.dispatchEvent(new FtNotificationEvent({
+                    type: "info",
+                    message: topicLabelResolver.resolve("feedbackAndRatingDisabledInEditor")
+                }));
+            }
         }
         catch {
             this.dispatchEvent(new FtNotificationEvent({
@@ -138,6 +157,9 @@ __decorate([
 __decorate([
     state()
 ], FtReaderTopicFeedback.prototype, "user", void 0);
+__decorate([
+    property({ type: Boolean })
+], FtReaderTopicFeedback.prototype, "hideTitle", void 0);
 __decorate([
     property()
 ], FtReaderTopicFeedback.prototype, "iconVariant", void 0);

package/build/utils/labels.d.ts

@@ -23,6 +23,7 @@ export interface FtReaderFeedbackLabels extends ParametrizedLabels {
     feedbackFailure?: string;
     ratingSuccess?: string;
     ratingFailure?: string;
+    feedbackAndRatingDisabledInEditor?: string;
 }
 export declare const topicLabelResolver: ParametrizedLabelResolver<FtReaderFeedbackLabels>;
 export declare const mapLabelResolver: ParametrizedLabelResolver<FtReaderFeedbackLabels>;

package/build/utils/labels.js

@@ -25,6 +25,7 @@ const DEFAULT_MAP_LABELS = {
     dichotomousRatingSectionTitle: "Did it solve your problem?",
     feedbackSectionTitle: "Write your review",
     mailSubject: "Feedback about “{0}”",
+    feedbackAndRatingDisabledInEditor: "Feedback & rating disabled in the reader designer",
 };
 const DEFAULT_TOPIC_LABELS = {
     ...DEFAULT_LABELS,
@@ -33,6 +34,7 @@ const DEFAULT_TOPIC_LABELS = {
     dichotomousRatingSectionTitle: "Did this content solve your problem?",
     feedbackSectionTitle: "Write your review",
     mailSubject: "Feedback about “{0}” in “{1}”",
+    feedbackAndRatingDisabledInEditor: "Feedback & rating disabled in the topic template designer",
 };
 export const topicLabelResolver = new ParametrizedLabelResolver(DEFAULT_TOPIC_LABELS, {});
 export const mapLabelResolver = new ParametrizedLabelResolver(DEFAULT_MAP_LABELS, {});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fluid-topics/ft-reader-feedback",
-  "version": "0.3.55",
+  "version": "0.3.56",
   "description": "Feedback forms for a map and its topics in an integrated reader",
   "keywords": [
     "Lit"
@@ -19,8 +19,8 @@
     "url": "ssh://git@scm.mrs.antidot.net:2222/fluidtopics/ft-web-components.git"
   },
   "dependencies": {
-    "@fluid-topics/ft-wc-utils": "0.3.55",
+    "@fluid-topics/ft-wc-utils": "0.3.56",
     "lit": "2.2.8"
   },
-  "gitHead": "4106f01e238edeb1c85fba22d6d50a18757e0b3e"
+  "gitHead": "e86edee2b2660d806320bacca5c5156bb94ca2d6"
 }