@fluid-topics/ft-reader-feedback 1.2.12 → 1.2.14

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

@@ -2,8 +2,7 @@ import { nothing } from "lit";
 import { ElementDefinitionsMap } from "@fluid-topics/ft-wc-utils";
 import { FtReaderFeedbackProperties } from "./ft-reader-feedback.properties";
 import { FtTopicRatingSummary } from "@fluid-topics/ft-reader-context/build/store/model";
-import type { FtPublicationRatingSummary, FtSession } from "@fluid-topics/public-api";
-import { FtReaderFeedbackConfiguration } from "@fluid-topics/public-api";
+import { FtPublicationRatingSummary, FtRatingType, FtReaderFeedbackConfiguration, FtSession } from "@fluid-topics/public-api";
 import { FtTextArea } from "@fluid-topics/ft-text-area";
 import { FtIconVariants } from "@fluid-topics/ft-icon/build/ft-icon.properties";
 import { I18nPropertyInit } from "@fluid-topics/ft-i18n";
@@ -39,9 +38,9 @@ export declare class FtReaderFeedback extends FtReaderFeedback_base implements F
     feedbackMailLinkBuilder: (feedbackMessage: string) => string | undefined;
     constructor();
     get canAccessFeedback(): boolean | undefined;
-    get canAccessRating(): boolean | undefined;
-    get configuredRatingType(): import("@fluid-topics/public-api").FtRatingType | "STARS" | "LIKE" | "DICHOTOMOUS" | "NO_RATING";
-    get ratingType(): "STARS" | "LIKE" | "DICHOTOMOUS" | "NO_RATING";
+    get canRateThisContent(): boolean | undefined;
+    get configuredRatingType(): FtRatingType | "STARS" | "LIKE" | "DICHOTOMOUS" | "NO_RATING";
+    get ratingTypeOfDoneRatingOfThisContent(): FtRatingType.NO_RATING | "STARS" | "LIKE" | "DICHOTOMOUS" | "NO_RATING";
     get ratingValue(): number;
     get ratingDate(): Date | undefined;
     protected render(): typeof nothing | import("lit").TemplateResult<1>;

package/build/ft-reader-feedback.js

@@ -8,6 +8,7 @@ import { html, nothing } from "lit";
 import { property, query, state } from "lit/decorators.js";
 import { parseDate, redux, } from "@fluid-topics/ft-wc-utils";
 import { styles } from "./ft-reader-feedback.styles";
+import { FtRatingType } from "@fluid-topics/public-api";
 import { FtTypography } from "@fluid-topics/ft-typography";
 import { FtSwitch, FtSwitchOption } from "@fluid-topics/ft-switch";
 import { FtTextArea } from "@fluid-topics/ft-text-area";
@@ -40,17 +41,18 @@ class FtReaderFeedback extends withI18n(FtReaderComponent) {
         var _a;
         return (_a = this.service) === null || _a === void 0 ? void 0 : _a.isFeatureAccessible(FtReaderFeatures.FEEDBACK, { session: this.session });
     }
-    get canAccessRating() {
-        var _a, _b;
-        return (_a = this.service) === null || _a === void 0 ? void 0 : _a.isFeatureAccessible(FtReaderFeatures.RATING, { session: this.session, ratingType: (_b = this.ratingSummary) === null || _b === void 0 ? void 0 : _b.type });
+    get canRateThisContent() {
+        var _a;
+        const canAccessRating = (_a = this.service) === null || _a === void 0 ? void 0 : _a.isFeatureAccessible(FtReaderFeatures.RATING, { session: this.session });
+        return canAccessRating && this.ratingAllowed && this.configuredRatingType != FtRatingType.NO_RATING;
     }
     get configuredRatingType() {
         var _a, _b;
-        return (_b = (this.ratingAllowed ? (_a = this.ratingSummary) === null || _a === void 0 ? void 0 : _a.type : "NO_RATING")) !== null && _b !== void 0 ? _b : "NO_RATING";
+        return (_b = (_a = this.ratingSummary) === null || _a === void 0 ? void 0 : _a.type) !== null && _b !== void 0 ? _b : FtRatingType.NO_RATING;
     }
-    get ratingType() {
+    get ratingTypeOfDoneRatingOfThisContent() {
         var _a, _b, _c;
-        return (_c = (_b = (_a = this.ratingSummary) === null || _a === void 0 ? void 0 : _a.rating) === null || _b === void 0 ? void 0 : _b.type) !== null && _c !== void 0 ? _c : "NO_RATING";
+        return (_c = (_b = (_a = this.ratingSummary) === null || _a === void 0 ? void 0 : _a.rating) === null || _b === void 0 ? void 0 : _b.type) !== null && _c !== void 0 ? _c : FtRatingType.NO_RATING;
     }
     get ratingValue() {
         var _a, _b, _c;
@@ -62,7 +64,7 @@ class FtReaderFeedback extends withI18n(FtReaderComponent) {
         return typeof date === "string" ? parseDate(date) : date;
     }
     render() {
-        if (!this.canAccessFeedback && !this.canAccessRating) {
+        if (!this.canAccessFeedback && !this.canRateThisContent) {
             return nothing;
         }
         return html `
@@ -78,11 +80,11 @@ class FtReaderFeedback extends withI18n(FtReaderComponent) {
         `;
     }
     renderRatingSection() {
-        if (this.canAccessRating) {
+        if (this.canRateThisContent) {
             return html `
                 <div class="ft-reader-feedback--rating" part="rating-container">
                     <ft-typography variant="title-dense" part="section-title" class="ft-reader-feedback--section-title">
-                        ${this.i18n(this.ratingSummary.type === "DICHOTOMOUS"
+                        ${this.i18n(this.ratingSummary.type === FtRatingType.DICHOTOMOUS
                 ? this.i18nProperties.dichotomousRatingSectionTitle
                 : this.i18nProperties.ratingSectionTitle)}
                     </ft-typography>
@@ -112,11 +114,11 @@ class FtReaderFeedback extends withI18n(FtReaderComponent) {
     }
     renderRating() {
         switch (this.configuredRatingType) {
-            case "STARS":
+            case FtRatingType.STARS:
                 return html `
                     <div class="ft-reader-feedback--stars" part="rating rating-stars">
                         ${repeat(new Array(5), (_, index) => index, (_, index) => {
-                    let active = this.ratingType === "STARS" && this.ratingValue > index;
+                    let active = this.ratingTypeOfDoneRatingOfThisContent === FtRatingType.STARS && this.ratingValue > index;
                     const ratingValue = index + 1;
                     return html `
                                         <ft-button round part="rating-stars-${ratingValue}"
@@ -131,9 +133,9 @@ class FtReaderFeedback extends withI18n(FtReaderComponent) {
                 })}
                     </div>
                 `;
-            case "LIKE":
-                const disliked = this.ratingType === "LIKE" && this.ratingValue === 0;
-                const liked = this.ratingType === "LIKE" && this.ratingValue === 1;
+            case FtRatingType.LIKE:
+                const disliked = this.ratingTypeOfDoneRatingOfThisContent === FtRatingType.LIKE && this.ratingValue === 0;
+                const liked = this.ratingTypeOfDoneRatingOfThisContent === FtRatingType.LIKE && this.ratingValue === 1;
                 return html `
                     <ft-switch unselectable
                                @change=${(e) => this.rate(e.detail)}
@@ -155,9 +157,9 @@ class FtReaderFeedback extends withI18n(FtReaderComponent) {
                         </ft-switch-option>
                     </ft-switch>
                 `;
-            case "DICHOTOMOUS":
-                const no = this.ratingType === "DICHOTOMOUS" && this.ratingValue === 0;
-                const yes = this.ratingType === "DICHOTOMOUS" && this.ratingValue === 1;
+            case FtRatingType.DICHOTOMOUS:
+                const no = this.ratingTypeOfDoneRatingOfThisContent === FtRatingType.DICHOTOMOUS && this.ratingValue === 0;
+                const yes = this.ratingTypeOfDoneRatingOfThisContent === FtRatingType.DICHOTOMOUS && this.ratingValue === 1;
                 return html `
                     <ft-switch unselectable
                                @change=${(e) => this.rate(e.detail)}
@@ -200,15 +202,17 @@ class FtReaderFeedback extends withI18n(FtReaderComponent) {
                     </a>
                 `;
             }
-            let moreOptionsButton = this.withMoreOptionsButton && (((_a = this.configuration) === null || _a === void 0 ? void 0 : _a.mailsSentByFluidTopics) || ((_b = this.configuration) === null || _b === void 0 ? void 0 : _b.mailsSentByFluidTopicsForUnauthenticatedUsers)) ? html `
-                <ft-button outlined
-                           type="button" name="more-options"
-                           class="ft-reader-feedback--more-options"
-                           @click="${this.onOpenMoreDetails}"
-                           part="more-options">
-                    ${feedback.messages.moreOptionsButton()}
-                </ft-button>
-            ` : nothing;
+            let moreOptionsButton = this.withMoreOptionsButton && (((_a = this.configuration) === null || _a === void 0 ? void 0 : _a.mailsSentByFluidTopics) || ((_b = this.configuration) === null || _b === void 0 ? void 0 : _b.mailsSentByFluidTopicsForUnauthenticatedUsers))
+                ? html `
+                    <ft-button outlined
+                               type="button" name="more-options"
+                               class="ft-reader-feedback--more-options"
+                               @click="${this.onOpenMoreDetails}"
+                               part="more-options">
+                        ${feedback.messages.moreOptionsButton()}
+                    </ft-button>
+                `
+                : nothing;
             return html `
                 <form class="ft-reader-feedback--feedback" part="feedback-container" autocomplete="on"
                       @submit="${(e) => this.onFormSubmitEvent(e, !!mailLink)}">