@robotical/webapp-types 3.15.18 → 3.15.20

package/dist-types/src/components/disposables/buttons/SVGImageButton/index.d.ts

@@ -9,6 +9,8 @@ type SVGImageButtonProps = {
     titleColour?: string;
     SVGColour?: string;
     disabled?: boolean;
+    ariaLabel?: string;
+    buttonType?: "button" | "submit" | "reset";
 };
-export default function SVGImageButton({ onClick, title, subtitle, SVGImage, backgroundColour, titleColour, SVGColour, disabled, }: SVGImageButtonProps): import("react/jsx-runtime").JSX.Element;
+export default function SVGImageButton({ onClick, title, subtitle, SVGImage, backgroundColour, titleColour, SVGColour, disabled, ariaLabel, buttonType, }: SVGImageButtonProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist-types/src/components/disposables/buttons/SVGImageButton/index.js

@@ -12,8 +12,8 @@ var __assign = (this && this.__assign) || function () {
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import "./styles.css";
 export default function SVGImageButton(_a) {
-    var onClick = _a.onClick, title = _a.title, subtitle = _a.subtitle, SVGImage = _a.SVGImage, backgroundColour = _a.backgroundColour, titleColour = _a.titleColour, SVGColour = _a.SVGColour, disabled = _a.disabled;
-    return (_jsxs("div", __assign({ className: subtitle
+    var onClick = _a.onClick, title = _a.title, subtitle = _a.subtitle, SVGImage = _a.SVGImage, backgroundColour = _a.backgroundColour, titleColour = _a.titleColour, SVGColour = _a.SVGColour, disabled = _a.disabled, ariaLabel = _a.ariaLabel, _b = _a.buttonType, buttonType = _b === void 0 ? "button" : _b;
+    return (_jsxs("button", __assign({ type: buttonType, className: subtitle
             ? "svg-image-button-container"
-            : "svg-image-button-container-no-sub", onClick: disabled ? function () { } : onClick, style: { backgroundColor: disabled ? "#f0f0f0" : backgroundColour, cursor: disabled ? "not-allowed" : "pointer" } }, { children: [_jsx("p", __assign({ className: subtitle ? "svg-image-button-title" : "svg-image-button-title-no-sub", style: { color: titleColour } }, { children: title })), subtitle && _jsx("p", __assign({ className: "svg-image-button-subtitle" }, { children: subtitle })), _jsx("div", __assign({ className: "svg-image-button-image-container" }, { children: _jsx(SVGImage, { fill: SVGColour }) }))] })));
+            : "svg-image-button-container-no-sub", disabled: disabled, "aria-label": ariaLabel || title, onClick: onClick, style: { backgroundColor: disabled ? "#f0f0f0" : backgroundColour, cursor: disabled ? "not-allowed" : "pointer" } }, { children: [_jsx("p", __assign({ className: subtitle ? "svg-image-button-title" : "svg-image-button-title-no-sub", style: { color: titleColour } }, { children: title })), subtitle && _jsx("p", __assign({ className: "svg-image-button-subtitle" }, { children: subtitle })), _jsx("div", __assign({ className: "svg-image-button-image-container" }, { children: _jsx(SVGImage, { fill: SVGColour }) }))] })));
 }

package/dist-types/src/components/disposables/buttons/SimpleButton/index.d.ts

@@ -9,6 +9,8 @@ type SimpleButtonProps = {
     otherStyles?: React.CSSProperties;
     borderColour?: string;
     textColour?: string;
+    ariaLabel?: string;
+    buttonType?: "button" | "submit" | "reset";
 };
-export default function SimpleButton({ onClick, title, titleSize, disabled, colour, otherStyles, borderColour, textColour }: SimpleButtonProps): import("react/jsx-runtime").JSX.Element;
+export default function SimpleButton({ onClick, title, titleSize, disabled, colour, otherStyles, borderColour, textColour, ariaLabel, buttonType, }: SimpleButtonProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist-types/src/components/disposables/buttons/SimpleButton/index.js

@@ -11,8 +11,84 @@ var __assign = (this && this.__assign) || function () {
 };
 import { jsx as _jsx } from "react/jsx-runtime";
 import "./styles.css";
+import { BLACK, WHITE } from "../../../../styles/colors";
+var NAMED_COLORS = {
+    black: [0, 0, 0],
+    white: [255, 255, 255],
+};
+var parseHexChannel = function (value) { return Number.parseInt(value, 16); };
+var parseColour = function (colour) {
+    if (!colour) {
+        return null;
+    }
+    var normalized = colour.trim().toLowerCase();
+    if (NAMED_COLORS[normalized]) {
+        return NAMED_COLORS[normalized];
+    }
+    if (normalized.startsWith("#")) {
+        var hex = normalized.slice(1);
+        if (hex.length === 3) {
+            return [
+                parseHexChannel("".concat(hex[0]).concat(hex[0])),
+                parseHexChannel("".concat(hex[1]).concat(hex[1])),
+                parseHexChannel("".concat(hex[2]).concat(hex[2])),
+            ];
+        }
+        if (hex.length === 6) {
+            return [
+                parseHexChannel(hex.slice(0, 2)),
+                parseHexChannel(hex.slice(2, 4)),
+                parseHexChannel(hex.slice(4, 6)),
+            ];
+        }
+        return null;
+    }
+    var rgbMatch = normalized.match(/rgba?\(([^)]+)\)/);
+    if (!rgbMatch) {
+        return null;
+    }
+    var channels = rgbMatch[1]
+        .split(",")
+        .slice(0, 3)
+        .map(function (channel) { return Number.parseFloat(channel.trim()); });
+    if (channels.length !== 3 || channels.some(function (channel) { return Number.isNaN(channel); })) {
+        return null;
+    }
+    return [channels[0], channels[1], channels[2]];
+};
+var getRelativeLuminance = function (_a) {
+    var red = _a[0], green = _a[1], blue = _a[2];
+    var transform = function (channel) {
+        var normalized = channel / 255;
+        return normalized <= 0.03928
+            ? normalized / 12.92
+            : Math.pow((normalized + 0.055) / 1.055, 2.4);
+    };
+    return (0.2126 * transform(red) +
+        0.7152 * transform(green) +
+        0.0722 * transform(blue));
+};
+var getContrastRatio = function (colourA, colourB) {
+    var luminanceA = getRelativeLuminance(colourA);
+    var luminanceB = getRelativeLuminance(colourB);
+    var lighter = Math.max(luminanceA, luminanceB);
+    var darker = Math.min(luminanceA, luminanceB);
+    return (lighter + 0.05) / (darker + 0.05);
+};
+var BLACK_RGB = [38, 38, 38];
+var WHITE_RGB = [245, 245, 245];
+var getAccessibleTextColour = function (backgroundColour) {
+    var parsedBackground = parseColour(backgroundColour);
+    if (!parsedBackground) {
+        return BLACK;
+    }
+    var blackContrast = getContrastRatio(parsedBackground, BLACK_RGB);
+    var whiteContrast = getContrastRatio(parsedBackground, WHITE_RGB);
+    return blackContrast >= whiteContrast ? BLACK : WHITE;
+};
 export default function SimpleButton(_a) {
-    var onClick = _a.onClick, title = _a.title, titleSize = _a.titleSize, disabled = _a.disabled, colour = _a.colour, otherStyles = _a.otherStyles, borderColour = _a.borderColour, textColour = _a.textColour;
-    return (_jsx("div", __assign({ className: "simple-button-component " +
-            (disabled ? "simple-button-component-disabled" : ""), style: __assign(__assign({}, otherStyles), { fontSize: titleSize, backgroundColor: colour, border: borderColour && "1px solid ".concat(borderColour), color: textColour }), onClick: disabled ? function () { } : onClick }, { children: title })));
+    var onClick = _a.onClick, title = _a.title, titleSize = _a.titleSize, disabled = _a.disabled, colour = _a.colour, otherStyles = _a.otherStyles, borderColour = _a.borderColour, textColour = _a.textColour, ariaLabel = _a.ariaLabel, _b = _a.buttonType, buttonType = _b === void 0 ? "button" : _b;
+    var resolvedTextColour = textColour || getAccessibleTextColour(colour);
+    return (_jsx("button", __assign({ type: buttonType, className: "simple-button-component " +
+            (disabled ? "simple-button-component-disabled" : ""), disabled: disabled, "aria-label": ariaLabel, style: __assign(__assign({}, otherStyles), { fontSize: titleSize, backgroundColor: colour, border: borderColour && "1px solid ".concat(borderColour), color: resolvedTextColour }), onClick: onClick }, { children: title })));
 }

package/dist-types/src/components/modals/ SensorsDashboardModal/index.js

@@ -54,7 +54,7 @@ function SensorsDashboardModal() {
             resizeObserver.disconnect();
         };
     }, [betaSignRef]);
-    return (_jsxs(_Fragment, { children: [_jsx("div", __assign({ style: { visibility: showBetaSign ? "visible" : "hidden" }, className: styles.betaSign, onClick: function () {
+    return (_jsxs(_Fragment, { children: [_jsx("button", __assign({ type: "button", style: { visibility: showBetaSign ? "visible" : "hidden" }, className: styles.betaSign, onClick: function () {
                     return modalState.setModal(createElement(DetailedFeedbackModal), "Anonymous Bug Report");
                 }, ref: betaSignRef }, { children: _jsx(BetaSignSVG, {}) })), _jsx(SensorsDashboard, { isInModal: true })] }));
 }

package/dist-types/src/components/modals/DetailedFeedbackModal/index.d.ts

@@ -1,5 +1,7 @@
+import { FeedbackRating } from "../../../utils/feedback/submitFeedback";
 type Props = {
-    otherInfoObject?: object;
+    otherInfoObject?: Record<string, unknown>;
+    rating?: FeedbackRating;
 };
-export default function DetailedFeedbackModal({ otherInfoObject }: Props): import("react/jsx-runtime").JSX.Element;
+export default function DetailedFeedbackModal({ otherInfoObject, rating, }: Props): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist-types/src/components/modals/DetailedFeedbackModal/index.js

@@ -9,31 +9,165 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (g && (g = 0, op[0] && (_ = 0)), _) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { useState } from "react";
+import { useRef, useState } from "react";
 import { useTranslation } from "react-i18next";
 import modalState from "../../../state-observables/modal/ModalState";
+import { submitFeedback, } from "../../../utils/feedback/submitFeedback";
+import { getFeedbackPromptPageFromContext, markFeedbackPromptSubmitted, } from "../../../utils/feedback/feedbackPromptPolicy";
 import styles from "./styles.module.css";
 import SimpleButton from "../../disposables/buttons/SimpleButton";
 export default function DetailedFeedbackModal(_a) {
-    var otherInfoObject = _a.otherInfoObject;
+    var _this = this;
+    var otherInfoObject = _a.otherInfoObject, rating = _a.rating;
     var t = useTranslation().t;
     var _b = useState(""), report = _b[0], setReport = _b[1];
     var _c = useState(""), email = _c[0], setEmail = _c[1];
     var _d = useState(false), reportSent = _d[0], setReportSent = _d[1];
-    var onReport = function () {
-        if (!report)
-            return;
-        if (!email) {
-            var confirm_1 = window.confirm(t("detailed_feedback_modal.no_email_confirm") || "");
-            if (!confirm_1)
-                return;
-        }
-        var reportWithContact = { text: "".concat(email ? email : t('detailed_feedback_modal.anonymous', 'Anonymous'), ": ").concat(report) };
-        // window.applicationManager.analyticsManager.logEvent("textfeedback", { ...reportWithContact, ...otherInfoObject });
-        setReportSent(true);
-        modalState.updateModalProps({ modalTitle: "🚀" });
-        setTimeout(function () { return modalState.closeModal(); }, 1500);
-    };
-    return (_jsx("div", __assign({ className: styles.bugReportModalContainer }, { children: reportSent ? (t("detailed_feedback_modal.thank_you", "Thank you for your feedback!")) : (_jsxs(_Fragment, { children: [_jsxs("div", __assign({ className: styles.bugReportModalInfo }, { children: [t("detailed_feedback_modal.info", "Please help us improve! Please let us know if you spot any irregularities/bugs. "), _jsx("strong", __assign({ className: styles.bugReportModalInfoStrong }, { children: t("detailed_feedback_modal.info_strong", "You can optionally leave your contact details so we can reach out and help you") })), ". ", t("detailed_feedback_modal.thank_you", "Thank you!")] })), _jsxs("div", __assign({ className: styles.bugReportModalForm }, { children: [_jsx("textarea", { className: styles.bugReportModalTextInput, placeholder: t("detailed_feedback_modal.report_placeholder", "Your report...") || "Your report...", onChange: function (e) { return setReport(e.target.value); }, value: report }), _jsx("label", __assign({ className: styles.bugReportModalEmailLabel }, { children: t("detailed_feedback_modal.email_label", "Provide your email if you want us to get back to you with a solution!") })), _jsx("input", { type: "email", className: styles.bugReportModalEmailInput, placeholder: t("detailed_feedback_modal.email_placeholder", "Email (optional)") || "Email (optional)", onChange: function (e) { return setEmail(e.target.value); }, value: email })] })), _jsxs("div", __assign({ className: styles.bugReportModalButtons }, { children: [_jsx(SimpleButton, { onClick: function () { return modalState.closeModal(); }, title: t("detailed_feedback_modal.cancel", "Cancel") }), _jsx(SimpleButton, { onClick: onReport, title: t("detailed_feedback_modal.report", "Report") })] }))] })) })));
+    var _e = useState(false), isSubmitting = _e[0], setIsSubmitting = _e[1];
+    var hasSubmittedFeedback = useRef(false);
+    var submitRatingOnlyOnClose = function () { return __awaiter(_this, void 0, void 0, function () {
+        var page, error_1;
+        var _a, _b;
+        return __generator(this, function (_c) {
+            switch (_c.label) {
+                case 0:
+                    if (!rating || hasSubmittedFeedback.current) {
+                        return [2 /*return*/, true];
+                    }
+                    _c.label = 1;
+                case 1:
+                    _c.trys.push([1, 3, , 4]);
+                    return [4 /*yield*/, submitFeedback({
+                            rating: rating,
+                            context: otherInfoObject,
+                            source: "emoji-modal",
+                        })];
+                case 2:
+                    _c.sent();
+                    page = getFeedbackPromptPageFromContext(otherInfoObject);
+                    if (page) {
+                        markFeedbackPromptSubmitted(page);
+                    }
+                    hasSubmittedFeedback.current = true;
+                    return [2 /*return*/, true];
+                case 3:
+                    error_1 = _c.sent();
+                    (_b = (_a = window.applicationManager) === null || _a === void 0 ? void 0 : _a.toaster) === null || _b === void 0 ? void 0 : _b.error("There was an error sending your feedback. Please try again later.");
+                    return [2 /*return*/, false];
+                case 4: return [2 /*return*/];
+            }
+        });
+    }); };
+    var onClose = function () { return __awaiter(_this, void 0, void 0, function () {
+        var wasSubmitted;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    if (isSubmitting) {
+                        return [2 /*return*/];
+                    }
+                    if (!rating || hasSubmittedFeedback.current) {
+                        modalState.closeModal();
+                        return [2 /*return*/];
+                    }
+                    setIsSubmitting(true);
+                    return [4 /*yield*/, submitRatingOnlyOnClose()];
+                case 1:
+                    wasSubmitted = _a.sent();
+                    setIsSubmitting(false);
+                    if (wasSubmitted) {
+                        modalState.closeModal();
+                    }
+                    return [2 /*return*/];
+            }
+        });
+    }); };
+    var onReport = function () { return __awaiter(_this, void 0, void 0, function () {
+        var confirm_1, page, error_2;
+        var _a, _b;
+        return __generator(this, function (_c) {
+            switch (_c.label) {
+                case 0:
+                    if (!report || isSubmitting)
+                        return [2 /*return*/];
+                    if (!email) {
+                        confirm_1 = window.confirm(t("detailed_feedback_modal.no_email_confirm") || "");
+                        if (!confirm_1)
+                            return [2 /*return*/];
+                    }
+                    setIsSubmitting(true);
+                    _c.label = 1;
+                case 1:
+                    _c.trys.push([1, 3, 4, 5]);
+                    return [4 /*yield*/, submitFeedback({
+                            rating: rating,
+                            message: report,
+                            email: email,
+                            context: otherInfoObject,
+                            source: "detailed-feedback",
+                        })];
+                case 2:
+                    _c.sent();
+                    page = getFeedbackPromptPageFromContext(otherInfoObject);
+                    if (page) {
+                        markFeedbackPromptSubmitted(page);
+                    }
+                    hasSubmittedFeedback.current = true;
+                    setReportSent(true);
+                    modalState.updateModalProps({ modalTitle: "🚀" });
+                    setTimeout(function () { return modalState.closeModal(); }, 1500);
+                    return [3 /*break*/, 5];
+                case 3:
+                    error_2 = _c.sent();
+                    (_b = (_a = window.applicationManager) === null || _a === void 0 ? void 0 : _a.toaster) === null || _b === void 0 ? void 0 : _b.error("There was an error sending your feedback. Please try again later.");
+                    return [3 /*break*/, 5];
+                case 4:
+                    setIsSubmitting(false);
+                    return [7 /*endfinally*/];
+                case 5: return [2 /*return*/];
+            }
+        });
+    }); };
+    return (_jsx("div", __assign({ className: styles.bugReportModalContainer }, { children: reportSent ? (t("detailed_feedback_modal.thank_you", "Thank you for your feedback!")) : (_jsxs(_Fragment, { children: [_jsxs("div", __assign({ className: styles.bugReportModalInfo }, { children: [t("detailed_feedback_modal.info", "Please help us improve! Please let us know if you spot any irregularities/bugs. "), _jsx("strong", __assign({ className: styles.bugReportModalInfoStrong }, { children: t("detailed_feedback_modal.info_strong", "You can optionally leave your contact details so we can reach out and help you") })), ". ", t("detailed_feedback_modal.thank_you", "Thank you!")] })), _jsxs("div", __assign({ className: styles.bugReportModalForm }, { children: [_jsx("textarea", { className: styles.bugReportModalTextInput, placeholder: t("detailed_feedback_modal.report_placeholder", "Your report...") || "Your report...", onChange: function (e) { return setReport(e.target.value); }, value: report }), _jsx("label", __assign({ className: styles.bugReportModalEmailLabel }, { children: t("detailed_feedback_modal.email_label", "Provide your email if you want us to get back to you with a solution!") })), _jsx("input", { type: "email", className: styles.bugReportModalEmailInput, placeholder: t("detailed_feedback_modal.email_placeholder", "Email (optional)") || "Email (optional)", onChange: function (e) { return setEmail(e.target.value); }, value: email })] })), _jsxs("div", __assign({ className: styles.bugReportModalButtons }, { children: [_jsx(SimpleButton, { onClick: function () {
+                                void onClose();
+                            }, title: t("detailed_feedback_modal.cancel", "Cancel"), disabled: isSubmitting }), _jsx(SimpleButton, { onClick: function () {
+                                void onReport();
+                            }, title: t("detailed_feedback_modal.report", "Report"), disabled: isSubmitting })] }))] })) })));
 }

package/dist-types/src/components/modals/LEDLightsOrQRVerificationModal/index.js

@@ -110,9 +110,9 @@ export default function LEDLightsOrQRVerificationModal(_a) {
     }); };
     return (_jsxs("div", __assign({ className: styles.container }, { children: [_jsxs("div", __assign({ className: styles.robotContext }, { children: [_jsx("p", __assign({ className: styles.robotContextEyebrow }, { children: t("connection.connecting_to", "Connecting to") })), _jsx("h3", __assign({ className: styles.robotContextTitle }, { children: targetRaftType })), allowSwitchToMarty && (_jsx("button", __assign({ type: "button", className: styles.switchRobotButton, onClick: function () { return modalState.closeModal({ action: "switch-to-marty" }); } }, { children: t("connection.connect_marty_instead", "Connect Marty instead") })))] })), _jsxs("div", __assign({ className: styles.bluetoothNotice }, { children: [_jsx(BluetoothSVG, { className: styles.bluetoothIcon, fill: MAIN_BLUE, "aria-hidden": "true", focusable: "false" }), _jsx("span", __assign({ className: styles.bluetoothText }, { children: t("configuration_screen.bluetooth") }))] })), _jsxs("div", { children: [_jsx("p", __assign({ className: styles.robotContextSubtitle }, { children: t("connection.cog_verification_prompt", "Choose how you want to verify your Cog connection.") })), !isButtonToConnectVisible ? _jsx("div", __assign({ className: styles.cards }, { children: options.map(function (_a) {
                             var id = _a.id, title = _a.title, subtitle = _a.subtitle, icon = _a.icon;
-                            return (_jsxs("div", __assign({ className: qrSelected && id === 'qr' ? [styles.card, styles.qrselected].join(" ") : styles.card, onClick: function () { return handleSelect(id); } }, { children: [_jsx("div", __assign({ className: styles.icon }, { children: icon })), _jsx("h3", __assign({ className: styles.title }, { children: title })), _jsx("p", __assign({ className: styles.subtitle }, { children: subtitle }))] }), id));
+                            return (_jsxs("button", __assign({ type: "button", className: qrSelected && id === 'qr' ? [styles.card, styles.qrselected].join(" ") : styles.card, onClick: function () { return handleSelect(id); }, "aria-label": title, "aria-pressed": id === "qr" ? qrSelected : false }, { children: [_jsx("div", __assign({ className: styles.icon }, { children: icon })), _jsx("h3", __assign({ className: styles.title }, { children: title })), _jsx("p", __assign({ className: styles.subtitle }, { children: subtitle }))] }), id));
                         }) })) :
-                        _jsx("div", __assign({ className: styles.cogNote }, { children: _jsxs("strong", { children: ["Don't forget to ", _jsx("span", __assign({ className: styles.cogNoteHighlight }, { children: "turn on" })), " your Cog!"] }) }))] }), qrSelected && _jsx(QRContent, { setSerialNo: setSerialNoFromQR }), _jsxs("div", __assign({ className: styles.buttonsContainer }, { children: [isButtonToConnectVisible && _jsx("button", __assign({ className: styles.connectButton, onClick: handleConnect }, { children: t('connection.qr_connect_button') })), _jsx("button", __assign({ className: styles.cancelButton, onClick: function () { return modalState.closeModal({ action: "cancel" }); } }, { children: t('connection.cancel') }))] }))] })));
+                        _jsx("div", __assign({ className: styles.cogNote }, { children: _jsxs("strong", { children: ["Don't forget to ", _jsx("span", __assign({ className: styles.cogNoteHighlight }, { children: "turn on" })), " your Cog!"] }) }))] }), qrSelected && _jsx(QRContent, { setSerialNo: setSerialNoFromQR }), _jsxs("div", __assign({ className: styles.buttonsContainer }, { children: [isButtonToConnectVisible && _jsx("button", __assign({ type: "button", className: styles.connectButton, onClick: handleConnect }, { children: t('connection.qr_connect_button') })), _jsx("button", __assign({ type: "button", className: styles.cancelButton, onClick: function () { return modalState.closeModal({ action: "cancel" }); } }, { children: t('connection.cancel') }))] }))] })));
 }
 function QRContent(_a) {
     var _this = this;

package/dist-types/src/components/modals/VerificationModalPhoneApp/index.js

@@ -219,7 +219,7 @@ function VerificationModalPhoneApp(_a) {
     }
     else {
         contentJSX = _jsxs("div", __assign({ className: "verification-modal-container" }, { children: [_jsxs("div", __assign({ className: "verification-modal-martys-container" }, { children: [isScanning && _jsxs("div", __assign({ style: { margin: "auto", width: "50px", height: "50px" } }, { children: [" ", _jsx(LoadingSpinner, {}), " "] })), foundRICsState.map(function (raftObj, raftIdx) {
-                            return _jsxs(Fragment, { children: [_jsxs("div", __assign({ className: "verification-modal-marty-name-row-container", onClick: function () { return onSelectRaft(raftIdx); } }, { children: [_jsx("p", __assign({ className: "verification-modal-marty-name" }, { children: raftObj._localName })), _jsx("div", __assign({ className: "verification-modal-marty-signal-container" }, { children: _jsx(RICSignal, { signalStrength: raftObj._rssi }) })), _jsx(BluetoothSVG, { fill: MAIN_BLUE })] })), selectedRICIdx === raftIdx && _jsxs("div", { children: [_jsx("p", __assign({ className: "verification-modal-martys-back-hint" }, { children: isLoading ? t("verification_modal_phone.loading", "Loading...") : t("verification_modal_phone.look_on_back", { raftType: connectedRaft === null || connectedRaft === void 0 ? void 0 : connectedRaft.type }) })), _jsxs("div", __assign({ className: "verification-modal-led-row-container" }, { children: [_jsx(LEDs, { coloursArr: randomColours, connectedRaft: connectedRaft }), !isLoading && _jsx(SimpleButton, { onClick: onCancel, title: t("verification_modal_phone.no", "No"), borderColour: "red", colour: "white", textColour: "red" }), !isLoading && _jsx(SimpleButton, { onClick: onYes, title: t("connection.yes") })] }))] })] }, raftIdx);
+                            return _jsxs(Fragment, { children: [_jsxs("button", __assign({ type: "button", className: "verification-modal-marty-name-row-container", onClick: function () { return onSelectRaft(raftIdx); }, "aria-label": "".concat(t("verification_modal_phone.select_robot", "Select robot"), " ").concat(raftObj._localName) }, { children: [_jsx("p", __assign({ className: "verification-modal-marty-name" }, { children: raftObj._localName })), _jsx("div", __assign({ className: "verification-modal-marty-signal-container" }, { children: _jsx(RICSignal, { signalStrength: raftObj._rssi }) })), _jsx(BluetoothSVG, { fill: MAIN_BLUE, "aria-hidden": "true" })] })), selectedRICIdx === raftIdx && _jsxs("div", { children: [_jsx("p", __assign({ className: "verification-modal-martys-back-hint" }, { children: isLoading ? t("verification_modal_phone.loading", "Loading...") : t("verification_modal_phone.look_on_back", { raftType: connectedRaft === null || connectedRaft === void 0 ? void 0 : connectedRaft.type }) })), _jsxs("div", __assign({ className: "verification-modal-led-row-container" }, { children: [_jsx(LEDs, { coloursArr: randomColours, connectedRaft: connectedRaft }), !isLoading && _jsx(SimpleButton, { onClick: onCancel, title: t("verification_modal_phone.no", "No"), borderColour: "red", colour: "white", textColour: "red" }), !isLoading && _jsx(SimpleButton, { onClick: onYes, title: t("connection.yes") })] }))] })] }, raftIdx);
                         })] })), _jsxs("div", __assign({ className: "verification-modal-bottom-btns-container" }, { children: [_jsx(SVGImageButton, { onClick: onScanAgain, title: t("connection.scan_again"), SVGImage: RefreshSVG, backgroundColour: MAIN_BLUE, titleColour: WHITE, SVGColour: WHITE, disabled: isScanning }), _jsx("div", { className: "dummy-gap" }), _jsx(SimpleButton, { onClick: onCancel, title: t("connection.cancel") })] }))] }));
     }
     return contentJSX;

package/dist-types/src/utils/feedback/feedbackPromptPolicy.d.ts

@@ -0,0 +1,39 @@
+export type FeedbackPromptPage = string;
+export type FeedbackPromptDecisionReason = "invalid-page" | "not-ready" | "insufficient-engagement" | "shown-this-session" | "recently-submitted" | "global-cooldown" | "page-cooldown";
+export type FeedbackPromptDecision = {
+    canShow: boolean;
+    reason?: FeedbackPromptDecisionReason;
+    engagementMs: number;
+};
+export type FeedbackPromptPageState = {
+    lastShownAt?: number;
+    lastSubmittedAt?: number;
+    lastDismissedAt?: number;
+};
+export type FeedbackPromptState = {
+    version: typeof FEEDBACK_PROMPT_POLICY_VERSION;
+    lastShownAt?: number;
+    lastSubmittedAt?: number;
+    lastDismissedAt?: number;
+    pages: Record<FeedbackPromptPage, FeedbackPromptPageState>;
+};
+export type CanShowFeedbackPromptInput = {
+    page: FeedbackPromptPage;
+    isReady?: boolean;
+    readyAt?: number | null;
+    now?: number;
+};
+export declare const FEEDBACK_PROMPT_POLICY_VERSION = "v1";
+export declare const FEEDBACK_PROMPT_STORAGE_KEY: string;
+export declare const FEEDBACK_PROMPT_SESSION_STORAGE_KEY: string;
+export declare const FEEDBACK_PROMPT_MIN_READY_ENGAGEMENT_MS: number;
+export declare const FEEDBACK_PROMPT_GLOBAL_COOLDOWN_MS: number;
+export declare const FEEDBACK_PROMPT_PAGE_COOLDOWN_MS: number;
+export declare const FEEDBACK_PROMPT_SUBMITTED_COOLDOWN_MS: number;
+export declare function readFeedbackPromptState(): FeedbackPromptState;
+export declare function writeFeedbackPromptState(state: FeedbackPromptState): void;
+export declare function canShowFeedbackPrompt({ page, isReady, readyAt, now, }: CanShowFeedbackPromptInput): FeedbackPromptDecision;
+export declare function markFeedbackPromptShown(page: FeedbackPromptPage, now?: number): void;
+export declare function markFeedbackPromptSubmitted(page: FeedbackPromptPage, now?: number): void;
+export declare function markFeedbackPromptDismissed(page: FeedbackPromptPage, now?: number): void;
+export declare function getFeedbackPromptPageFromContext(context?: Record<string, unknown> | null): string | null;

package/dist-types/src/utils/feedback/feedbackPromptPolicy.js

@@ -0,0 +1,183 @@
+export var FEEDBACK_PROMPT_POLICY_VERSION = "v1";
+export var FEEDBACK_PROMPT_STORAGE_KEY = "marty-web-app.feedbackPromptPolicy.".concat(FEEDBACK_PROMPT_POLICY_VERSION);
+export var FEEDBACK_PROMPT_SESSION_STORAGE_KEY = "marty-web-app.feedbackPromptPolicy.".concat(FEEDBACK_PROMPT_POLICY_VERSION, ".shownThisSession");
+export var FEEDBACK_PROMPT_MIN_READY_ENGAGEMENT_MS = 90 * 1000;
+export var FEEDBACK_PROMPT_GLOBAL_COOLDOWN_MS = 14 * 24 * 60 * 60 * 1000;
+export var FEEDBACK_PROMPT_PAGE_COOLDOWN_MS = 45 * 24 * 60 * 60 * 1000;
+export var FEEDBACK_PROMPT_SUBMITTED_COOLDOWN_MS = 90 * 24 * 60 * 60 * 1000;
+function createEmptyState() {
+    return {
+        version: FEEDBACK_PROMPT_POLICY_VERSION,
+        pages: {},
+    };
+}
+function normalizePage(page) {
+    return page.trim();
+}
+function isRecord(value) {
+    return typeof value === "object" && value !== null && !Array.isArray(value);
+}
+function getTimestamp(value) {
+    return typeof value === "number" && Number.isFinite(value) ? value : undefined;
+}
+function normalizeState(rawState) {
+    if (!isRecord(rawState)) {
+        return createEmptyState();
+    }
+    var pages = {};
+    var rawPages = isRecord(rawState.pages) ? rawState.pages : {};
+    Object.entries(rawPages).forEach(function (_a) {
+        var page = _a[0], rawPageState = _a[1];
+        if (!isRecord(rawPageState)) {
+            return;
+        }
+        pages[page] = {
+            lastShownAt: getTimestamp(rawPageState.lastShownAt),
+            lastSubmittedAt: getTimestamp(rawPageState.lastSubmittedAt),
+            lastDismissedAt: getTimestamp(rawPageState.lastDismissedAt),
+        };
+    });
+    return {
+        version: FEEDBACK_PROMPT_POLICY_VERSION,
+        lastShownAt: getTimestamp(rawState.lastShownAt),
+        lastSubmittedAt: getTimestamp(rawState.lastSubmittedAt),
+        lastDismissedAt: getTimestamp(rawState.lastDismissedAt),
+        pages: pages,
+    };
+}
+function getLocalStorage() {
+    return typeof window !== "undefined" ? window.localStorage : null;
+}
+function getSessionStorage() {
+    return typeof window !== "undefined" ? window.sessionStorage : null;
+}
+export function readFeedbackPromptState() {
+    var storage = getLocalStorage();
+    if (!storage) {
+        return createEmptyState();
+    }
+    var rawValue = null;
+    try {
+        rawValue = storage.getItem(FEEDBACK_PROMPT_STORAGE_KEY);
+    }
+    catch (error) {
+        return createEmptyState();
+    }
+    if (!rawValue) {
+        return createEmptyState();
+    }
+    try {
+        return normalizeState(JSON.parse(rawValue));
+    }
+    catch (error) {
+        try {
+            storage.removeItem(FEEDBACK_PROMPT_STORAGE_KEY);
+        }
+        catch (removeError) {
+            // Ignore cleanup failures; falling back to an empty state is sufficient.
+        }
+        return createEmptyState();
+    }
+}
+export function writeFeedbackPromptState(state) {
+    var storage = getLocalStorage();
+    if (!storage) {
+        return;
+    }
+    try {
+        storage.setItem(FEEDBACK_PROMPT_STORAGE_KEY, JSON.stringify(normalizeState(state)));
+    }
+    catch (error) {
+        // Storage failures should never block the user from leaving an activity.
+    }
+}
+function hasShownThisSession() {
+    var _a;
+    try {
+        return ((_a = getSessionStorage()) === null || _a === void 0 ? void 0 : _a.getItem(FEEDBACK_PROMPT_SESSION_STORAGE_KEY)) === "true";
+    }
+    catch (error) {
+        return false;
+    }
+}
+function markShownThisSession() {
+    var _a;
+    try {
+        (_a = getSessionStorage()) === null || _a === void 0 ? void 0 : _a.setItem(FEEDBACK_PROMPT_SESSION_STORAGE_KEY, "true");
+    }
+    catch (error) {
+        // Storage may be unavailable in private browsing or embedded contexts.
+    }
+}
+function updateFeedbackPromptState(page, updater, now) {
+    if (now === void 0) { now = Date.now(); }
+    var normalizedPage = normalizePage(page);
+    if (!normalizedPage) {
+        return;
+    }
+    var state = readFeedbackPromptState();
+    var pageState = state.pages[normalizedPage] || {};
+    updater(state, pageState, now);
+    state.pages[normalizedPage] = pageState;
+    writeFeedbackPromptState(state);
+}
+export function canShowFeedbackPrompt(_a) {
+    var page = _a.page, _b = _a.isReady, isReady = _b === void 0 ? true : _b, readyAt = _a.readyAt, _c = _a.now, now = _c === void 0 ? Date.now() : _c;
+    var normalizedPage = normalizePage(page);
+    var hasReadyAt = readyAt !== null && readyAt !== undefined;
+    var engagementMs = hasReadyAt ? Math.max(0, now - readyAt) : 0;
+    if (!normalizedPage) {
+        return { canShow: false, reason: "invalid-page", engagementMs: engagementMs };
+    }
+    if (!isReady || !hasReadyAt) {
+        return { canShow: false, reason: "not-ready", engagementMs: engagementMs };
+    }
+    if (engagementMs < FEEDBACK_PROMPT_MIN_READY_ENGAGEMENT_MS) {
+        return { canShow: false, reason: "insufficient-engagement", engagementMs: engagementMs };
+    }
+    if (hasShownThisSession()) {
+        return { canShow: false, reason: "shown-this-session", engagementMs: engagementMs };
+    }
+    var state = readFeedbackPromptState();
+    var pageState = state.pages[normalizedPage];
+    if (state.lastSubmittedAt &&
+        now - state.lastSubmittedAt < FEEDBACK_PROMPT_SUBMITTED_COOLDOWN_MS) {
+        return { canShow: false, reason: "recently-submitted", engagementMs: engagementMs };
+    }
+    if (state.lastShownAt &&
+        now - state.lastShownAt < FEEDBACK_PROMPT_GLOBAL_COOLDOWN_MS) {
+        return { canShow: false, reason: "global-cooldown", engagementMs: engagementMs };
+    }
+    if ((pageState === null || pageState === void 0 ? void 0 : pageState.lastShownAt) &&
+        now - pageState.lastShownAt < FEEDBACK_PROMPT_PAGE_COOLDOWN_MS) {
+        return { canShow: false, reason: "page-cooldown", engagementMs: engagementMs };
+    }
+    return { canShow: true, engagementMs: engagementMs };
+}
+export function markFeedbackPromptShown(page, now) {
+    if (now === void 0) { now = Date.now(); }
+    updateFeedbackPromptState(page, function (state, pageState) {
+        state.lastShownAt = now;
+        pageState.lastShownAt = now;
+    }, now);
+    markShownThisSession();
+}
+export function markFeedbackPromptSubmitted(page, now) {
+    if (now === void 0) { now = Date.now(); }
+    updateFeedbackPromptState(page, function (state, pageState) {
+        state.lastSubmittedAt = now;
+        pageState.lastSubmittedAt = now;
+    }, now);
+    markShownThisSession();
+}
+export function markFeedbackPromptDismissed(page, now) {
+    if (now === void 0) { now = Date.now(); }
+    updateFeedbackPromptState(page, function (state, pageState) {
+        state.lastDismissedAt = now;
+        pageState.lastDismissedAt = now;
+    }, now);
+}
+export function getFeedbackPromptPageFromContext(context) {
+    var page = context === null || context === void 0 ? void 0 : context.page;
+    return typeof page === "string" && page.trim() ? page.trim() : null;
+}

package/dist-types/src/utils/feedback/submitFeedback.d.ts

@@ -0,0 +1,25 @@
+export type FeedbackRating = 1 | 2 | 3 | 4 | 5;
+export type FeedbackSource = "emoji-modal" | "detailed-feedback" | "help-bug-report";
+export type SubmitFeedbackInput = {
+    rating?: FeedbackRating;
+    message?: string;
+    email?: string;
+    context?: Record<string, unknown> | null;
+    source: FeedbackSource;
+};
+export type FeedbackRecord = {
+    rating: FeedbackRating | null;
+    message: string | null;
+    email: string | null;
+    source: FeedbackSource;
+    context: Record<string, unknown> | null;
+    timestamp: string;
+    text: string;
+};
+export type SubmitFeedbackResult = {
+    record: FeedbackRecord;
+    slackDelivered: boolean;
+};
+export declare function buildFeedbackText(record: FeedbackRecord): string;
+export declare function createFeedbackRecord(input: SubmitFeedbackInput): FeedbackRecord;
+export declare function submitFeedback(input: SubmitFeedbackInput): Promise<SubmitFeedbackResult>;

package/dist-types/src/utils/feedback/submitFeedback.js

@@ -0,0 +1,145 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (g && (g = 0, op[0] && (_ = 0)), _) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+import Logger from "../../services/logger/Logger";
+import randomHashGenerator from "../helpers/randomHashGenerator";
+var SHOW_LOGS = true;
+var TAG = "submitFeedback";
+var WEB_APP_FEEDBACK_DB_URL = "https://web-app-bug-reports-default-rtdb.europe-west1.firebasedatabase.app/";
+var WEB_APP_FEEDBACK_SLACK_WEBHOOK_URL = "https://hooks.slack.com/services/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";
+function normalizeOptionalString(value) {
+    var trimmedValue = value === null || value === void 0 ? void 0 : value.trim();
+    return trimmedValue ? trimmedValue : null;
+}
+export function buildFeedbackText(record) {
+    var lines = ["Source: ".concat(record.source)];
+    var page = record.context && typeof record.context.page === "string"
+        ? record.context.page
+        : null;
+    if (page) {
+        lines.push("Page: ".concat(page));
+    }
+    if (record.context) {
+        var contextWithoutPage = Object.fromEntries(Object.entries(record.context).filter(function (_a) {
+            var key = _a[0];
+            return key !== "page";
+        }));
+        if (Object.keys(contextWithoutPage).length > 0) {
+            lines.push("Context: ".concat(JSON.stringify(contextWithoutPage)));
+        }
+    }
+    if (record.rating) {
+        lines.push("Rating: ".concat(record.rating, "/5"));
+    }
+    lines.push("Email: ".concat(record.email || "Anonymous"));
+    if (record.message) {
+        lines.push("Message: ".concat(record.message));
+    }
+    return lines.join("\n");
+}
+export function createFeedbackRecord(input) {
+    var _a;
+    var normalizedMessage = normalizeOptionalString(input.message);
+    var normalizedEmail = normalizeOptionalString(input.email);
+    var timestamp = new Date().toISOString();
+    var record = {
+        rating: (_a = input.rating) !== null && _a !== void 0 ? _a : null,
+        message: normalizedMessage,
+        email: normalizedEmail,
+        source: input.source,
+        context: input.context || null,
+        timestamp: timestamp,
+        text: "",
+    };
+    record.text = buildFeedbackText(record);
+    return record;
+}
+export function submitFeedback(input) {
+    return __awaiter(this, void 0, void 0, function () {
+        var record, firebaseResponse, errorText, slackDelivered, slackResponse, errorText, error_1;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    record = createFeedbackRecord(input);
+                    return [4 /*yield*/, fetch("".concat(WEB_APP_FEEDBACK_DB_URL).concat(randomHashGenerator(), ".json"), {
+                            method: "PATCH",
+                            headers: {
+                                Application: "application/json",
+                                "Content-Type": "application/json",
+                            },
+                            body: JSON.stringify(record),
+                        })];
+                case 1:
+                    firebaseResponse = _a.sent();
+                    if (!!firebaseResponse.ok) return [3 /*break*/, 3];
+                    return [4 /*yield*/, firebaseResponse.text()];
+                case 2:
+                    errorText = _a.sent();
+                    Logger.error(SHOW_LOGS, TAG, "Failed to submit feedback to Firebase: ".concat(firebaseResponse.status, " ").concat(errorText));
+                    throw new Error("Failed to submit feedback");
+                case 3:
+                    slackDelivered = true;
+                    _a.label = 4;
+                case 4:
+                    _a.trys.push([4, 8, , 9]);
+                    return [4 /*yield*/, fetch(WEB_APP_FEEDBACK_SLACK_WEBHOOK_URL, {
+                            method: "POST",
+                            headers: {
+                                "Content-Type": "application/json",
+                            },
+                            body: JSON.stringify({ text: record.text }),
+                        })];
+                case 5:
+                    slackResponse = _a.sent();
+                    if (!!slackResponse.ok) return [3 /*break*/, 7];
+                    return [4 /*yield*/, slackResponse.text()];
+                case 6:
+                    errorText = _a.sent();
+                    throw new Error("Failed Slack response: ".concat(slackResponse.status, " ").concat(errorText));
+                case 7: return [3 /*break*/, 9];
+                case 8:
+                    error_1 = _a.sent();
+                    slackDelivered = false;
+                    Logger.error(SHOW_LOGS, TAG, "Failed to submit feedback to Slack", error_1);
+                    return [3 /*break*/, 9];
+                case 9: return [2 /*return*/, {
+                        record: record,
+                        slackDelivered: slackDelivered,
+                    }];
+            }
+        });
+    });
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@robotical/webapp-types",
-  "version": "3.15.18",
+  "version": "3.15.20",
   "description": "Type definitions for the Application Manager",
   "main": "dist/application-manager.d.ts",
   "types": "dist/application-manager.d.ts",