exports.id = 1266; exports.ids = [1266]; exports.modules = { /***/ 85970: /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { "use strict"; /* harmony export */ __webpack_require__.d(__webpack_exports__, { /* harmony export */ "Z": () => (__WEBPACK_DEFAULT_EXPORT__) /* harmony export */ }); /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(16689); /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__); var _path; function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); } var SvgCaretDown = function SvgCaretDown(props) { return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("svg", _extends({ viewBox: "0 0 24 24", width: 18, height: 18, stroke: "currentColor", strokeWidth: 1.5, strokeLinecap: "round", strokeLinejoin: "round", fill: "none", shapeRendering: "geometricPrecision", style: { color: "currentcolor" } }, props), _path || (_path = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("path", { d: "m6 9 6 6 6-6" }))); }; /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (SvgCaretDown); /***/ }), /***/ 29267: /***/ ((module) => { // Exports module.exports = { "container": "Popover_container__GOha0", "trigger": "Popover_trigger__qKXNN", "content": "Popover_content__gu5L4", "tooltipContent": "Popover_tooltipContent__AMPpT" }; /***/ }), /***/ 74306: /***/ ((module, __webpack_exports__, __webpack_require__) => { "use strict"; __webpack_require__.a(module, async (__webpack_handle_async_dependencies__, __webpack_async_result__) => { try { /* harmony export */ __webpack_require__.d(__webpack_exports__, { /* harmony export */ "Z": () => (__WEBPACK_DEFAULT_EXPORT__) /* harmony export */ }); /* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(20997); /* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__); /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(16689); /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__); /* harmony import */ var _dls_Popover__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(25914); /* harmony import */ var _dls_Tooltip__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(8884); var __webpack_async_dependencies__ = __webpack_handle_async_dependencies__([_dls_Popover__WEBPACK_IMPORTED_MODULE_2__, _dls_Tooltip__WEBPACK_IMPORTED_MODULE_3__]); ([_dls_Popover__WEBPACK_IMPORTED_MODULE_2__, _dls_Tooltip__WEBPACK_IMPORTED_MODULE_3__] = __webpack_async_dependencies__.then ? (await __webpack_async_dependencies__)() : __webpack_async_dependencies__); /** * A component that combines the functionality of a Popover and a Tooltip together. * This is needed to handle the case when we want to show a Tooltip on mobile but * since Tooltip is only hoverable and there is no hovering on mobile devices, * we provide the same functionality by using a Popover which handles clicking. * * @param {Props} props * @returns {JSX.Element} */ const HoverablePopover = ({ content , children , onOpenChange , contentSide =_dls_Popover__WEBPACK_IMPORTED_MODULE_2__/* .ContentSide.TOP */ .iw.TOP , tip =true , tooltipDelay =0 , defaultStyling =true , isOpen , triggerStyles , isContainerSpan =false })=>/*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_dls_Popover__WEBPACK_IMPORTED_MODULE_2__/* ["default"] */ .ZP, { open: isOpen, triggerStyles: triggerStyles, contentSide: contentSide, useTooltipStyles: true, ...onOpenChange && { onOpenChange }, defaultStyling: defaultStyling, isContainerSpan: isContainerSpan, trigger: /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_dls_Tooltip__WEBPACK_IMPORTED_MODULE_3__/* ["default"] */ .ZP, { open: isOpen, tip: tip, text: content, contentSide: contentSide, delay: tooltipDelay, ...onOpenChange && { onOpenChange }, children: children }), tip: tip, children: content }); /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (HoverablePopover); __webpack_async_result__(); } catch(e) { __webpack_async_result__(e); } }); /***/ }), /***/ 25914: /***/ ((module, __webpack_exports__, __webpack_require__) => { "use strict"; __webpack_require__.a(module, async (__webpack_handle_async_dependencies__, __webpack_async_result__) => { try { /* harmony export */ __webpack_require__.d(__webpack_exports__, { /* harmony export */ "ZP": () => (__WEBPACK_DEFAULT_EXPORT__), /* harmony export */ "iw": () => (/* binding */ ContentSide) /* harmony export */ }); /* unused harmony export ContentAlign */ /* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(20997); /* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__); /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(16689); /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__); /* harmony import */ var _radix_ui_react_popover__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(98680); /* harmony import */ var classnames__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(59003); /* harmony import */ var classnames__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(classnames__WEBPACK_IMPORTED_MODULE_3__); /* harmony import */ var _Popover_module_scss__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(29267); /* harmony import */ var _Popover_module_scss__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_Popover_module_scss__WEBPACK_IMPORTED_MODULE_4__); var __webpack_async_dependencies__ = __webpack_handle_async_dependencies__([_radix_ui_react_popover__WEBPACK_IMPORTED_MODULE_2__]); _radix_ui_react_popover__WEBPACK_IMPORTED_MODULE_2__ = (__webpack_async_dependencies__.then ? (await __webpack_async_dependencies__)() : __webpack_async_dependencies__)[0]; var ContentSide; (function(ContentSide) { ContentSide["TOP"] = "top"; ContentSide["RIGHT"] = "right"; ContentSide["BOTTOM"] = "bottom"; ContentSide["LEFT"] = "left"; })(ContentSide || (ContentSide = {})); var ContentAlign; (function(ContentAlign) { ContentAlign["START"] = "start"; ContentAlign["CENTER"] = "center"; ContentAlign["END"] = "end"; })(ContentAlign || (ContentAlign = {})); const Popover = ({ children , trigger , onOpenChange , open , isModal =false , contentSide =ContentSide.BOTTOM , contentAlign =ContentAlign.CENTER , avoidCollisions =true , tip =false , useTooltipStyles =false , defaultStyling =true , isPortalled =true , contentSideOffset =2 , triggerStyles , contentStyles , isContainerSpan =false , })=>{ const content = /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(_radix_ui_react_popover__WEBPACK_IMPORTED_MODULE_2__.Content, { sideOffset: contentSideOffset, side: contentSide, align: contentAlign, avoidCollisions: avoidCollisions, className: classnames__WEBPACK_IMPORTED_MODULE_3___default()((_Popover_module_scss__WEBPACK_IMPORTED_MODULE_4___default().content), { [(_Popover_module_scss__WEBPACK_IMPORTED_MODULE_4___default().tooltipContent)]: useTooltipStyles, [contentStyles]: contentStyles }), children: [ children, tip && /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_radix_ui_react_popover__WEBPACK_IMPORTED_MODULE_2__.Arrow, {}) ] }); const containerChild = /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(_radix_ui_react_popover__WEBPACK_IMPORTED_MODULE_2__.Root, { modal: isModal, ...typeof open !== "undefined" && { open }, ...onOpenChange && { onOpenChange }, children: [ /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_radix_ui_react_popover__WEBPACK_IMPORTED_MODULE_2__.Trigger, { "aria-label": "Open popover", asChild: true, children: /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("span", { className: classnames__WEBPACK_IMPORTED_MODULE_3___default()((_Popover_module_scss__WEBPACK_IMPORTED_MODULE_4___default().trigger), { [triggerStyles]: triggerStyles }), children: trigger }) }), isPortalled ? /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_radix_ui_react_popover__WEBPACK_IMPORTED_MODULE_2__.Portal, { children: content }) : content ] }); if (isContainerSpan) { return /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("span", { className: classnames__WEBPACK_IMPORTED_MODULE_3___default()({ [(_Popover_module_scss__WEBPACK_IMPORTED_MODULE_4___default().container)]: defaultStyling }), children: containerChild }); } return /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("div", { className: classnames__WEBPACK_IMPORTED_MODULE_3___default()({ [(_Popover_module_scss__WEBPACK_IMPORTED_MODULE_4___default().container)]: defaultStyling }), children: containerChild }); }; /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (Popover); __webpack_async_result__(); } catch(e) { __webpack_async_result__(e); } }); /***/ }), /***/ 10191: /***/ ((module, __webpack_exports__, __webpack_require__) => { "use strict"; __webpack_require__.a(module, async (__webpack_handle_async_dependencies__, __webpack_async_result__) => { try { /* harmony export */ __webpack_require__.d(__webpack_exports__, { /* harmony export */ "Z": () => (__WEBPACK_DEFAULT_EXPORT__) /* harmony export */ }); /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(16689); /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__); /* harmony import */ var next_translate_useTranslation__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(60866); /* harmony import */ var next_translate_useTranslation__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(next_translate_useTranslation__WEBPACK_IMPORTED_MODULE_1__); /* harmony import */ var react_redux__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(6022); /* harmony import */ var react_redux__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(react_redux__WEBPACK_IMPORTED_MODULE_2__); /* harmony import */ var swr__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(15941); /* harmony import */ var _redux_slices_QuranReader_styles__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(62093); /* harmony import */ var _types_auth_Streak__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(10839); /* harmony import */ var _utils_api__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(4917); /* harmony import */ var _utils_auth_api__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(37883); /* harmony import */ var _utils_auth_apiPaths__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(13830); /* harmony import */ var _utils_auth_login__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(22197); /* harmony import */ var _utils_datetime__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(76410); /* harmony import */ var _utils_locale__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(24709); var __webpack_async_dependencies__ = __webpack_handle_async_dependencies__([swr__WEBPACK_IMPORTED_MODULE_3__, _utils_auth_login__WEBPACK_IMPORTED_MODULE_9__]); ([swr__WEBPACK_IMPORTED_MODULE_3__, _utils_auth_login__WEBPACK_IMPORTED_MODULE_9__] = __webpack_async_dependencies__.then ? (await __webpack_async_dependencies__)() : __webpack_async_dependencies__); /* eslint-disable max-lines */ /* eslint-disable react-func/max-lines-per-function */ const useGetWeekDays = ()=>{ return (0,react__WEBPACK_IMPORTED_MODULE_0__.useMemo)(()=>{ const days = []; const today = new Date(); // we want to timeline to start from Sunday const sunday = new Date(today); if (today.getDay() !== 0) { sunday.setDate(today.getDate() - today.getDay()); } for(let i = 0; i < 7; i += 1){ const day = new Date(sunday); day.setDate(sunday.getDate() + i); days.push({ current: day.getDate() === today.getDate(), date: day, dateString: (0,_utils_datetime__WEBPACK_IMPORTED_MODULE_10__/* .dateToDateString */ .Bz)(day) }); } return days; }, []); }; const useGetWeekDayNames = (week, streak, showWeekdayName = false)=>{ const { t , lang } = next_translate_useTranslation__WEBPACK_IMPORTED_MODULE_1___default()("reading-goal"); return (0,react__WEBPACK_IMPORTED_MODULE_0__.useMemo)(()=>{ const names = []; let showIncrement = streak > 1; let currentDayIndex = 0; if (!showWeekdayName && showIncrement) { week.forEach((day, index)=>{ /** * we need to make sure that the streak is bigger than * the current day's number. * * Example: * Streak: 3 * Timeline: * 1 2 3 4 (5 <- current day) 6 7 * * In this case, we don't want to show the increment and start counting days from 1 */ if (day.current) { showIncrement = streak > index + 1; currentDayIndex = index; } }); } for(let i = 0; i < 7; i += 1){ let dayName; if (showWeekdayName) { dayName = { localizedNumber: (0,_utils_locale__WEBPACK_IMPORTED_MODULE_11__/* .toLocalizedNumber */ .rQ)(i + 1, lang), title: (0,_utils_datetime__WEBPACK_IMPORTED_MODULE_10__/* .getFullDayName */ .Zu)(week[i].date, lang) }; } else { /** * If we're showing the increment, we need to subtract all days from the beginning of the week till the current day, and after that increment it based on the day's index. * * Example: * Streak: 10 * Timeline: * 1 (2 <- current day) 3 4 5 6 7 * * We need to render "1" as Day 9, and "2" as Day 10. * "1" -> i = 0; currentDayIndex = 1; streak = 10; 10 - 1 + 0 = 9 * "2" -> i = 1; currentDayIndex = 1; streak = 10; 10 - 1 + 1 = 10 * */ const localizedNumber = (0,_utils_locale__WEBPACK_IMPORTED_MODULE_11__/* .toLocalizedNumber */ .rQ)(showIncrement ? streak - currentDayIndex + i : i + 1, lang); dayName = { localizedNumber, title: t("day-x", { day: localizedNumber }) }; } names.push(dayName); } return names; }, [ lang, showWeekdayName, streak, t, week ]); }; const useGetStreakWithMetadata = ({ showDayName , disableIfNoGoalExists } = {})=>{ const week = useGetWeekDays(); const quranFont = (0,react_redux__WEBPACK_IMPORTED_MODULE_2__.useSelector)(_redux_slices_QuranReader_styles__WEBPACK_IMPORTED_MODULE_4__/* .selectQuranFont */ .Ho, react_redux__WEBPACK_IMPORTED_MODULE_2__.shallowEqual); const mushafLines = (0,react_redux__WEBPACK_IMPORTED_MODULE_2__.useSelector)(_redux_slices_QuranReader_styles__WEBPACK_IMPORTED_MODULE_4__/* .selectQuranMushafLines */ .z$, react_redux__WEBPACK_IMPORTED_MODULE_2__.shallowEqual); const { mushaf } = (0,_utils_api__WEBPACK_IMPORTED_MODULE_6__/* .getMushafId */ .$P)(quranFont, mushafLines); const { 0: disabled , 1: setDisabled } = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(null); const params = { mushafId: mushaf, from: week[0].dateString, to: week[week.length - 1].dateString, type: _types_auth_Streak__WEBPACK_IMPORTED_MODULE_5__/* .StreakType.QURAN */ .p.QURAN }; // we don't pass the params to `makeStreakUrl` in the key so that we can invalidate the cache without getting the other params const { data , isValidating , error } = (0,swr__WEBPACK_IMPORTED_MODULE_3__["default"])((0,_utils_auth_login__WEBPACK_IMPORTED_MODULE_9__/* .isLoggedIn */ .jl)() && disabled !== true ? (0,_utils_auth_apiPaths__WEBPACK_IMPORTED_MODULE_8__/* .makeStreakUrl */ .G_)() : null, ()=>(0,_utils_auth_api__WEBPACK_IMPORTED_MODULE_7__/* .getStreakWithUserMetadata */ .DG)(params), { revalidateOnFocus: false }); (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(()=>{ if (disabled !== null || !disableIfNoGoalExists || !data) { return; } /** * We don't want to re-fetch the data if the user has no goal. * This is useful for the quran reader widget when we invalidate the cache after the user has read something. */ setDisabled(!data.data.goal); }, [ disableIfNoGoalExists, disabled, data ]); const isLoading = isValidating && !data; const { activityDays , goal , streak } = data?.data || { activityDays: [], goal: undefined, streak: 0 }; const readingDaysMap = (0,react__WEBPACK_IMPORTED_MODULE_0__.useMemo)(()=>{ if (!activityDays) return {}; const result = {}; activityDays.forEach((day)=>{ result[day.date] = { ...day, hasRead: day.pagesRead > 0 || day.secondsRead > 0 || day.ranges.length > 0 || day.manuallyAddedSeconds > 0 }; }); return result; }, [ activityDays ]); const currentActivityDay = (0,react__WEBPACK_IMPORTED_MODULE_0__.useMemo)(()=>{ return readingDaysMap[week.find((d)=>d.current)?.dateString]; }, [ readingDaysMap, week ]); const weekDayNames = useGetWeekDayNames(week, streak, showDayName); const weekData = (0,react__WEBPACK_IMPORTED_MODULE_0__.useMemo)(()=>{ return { days: week.map((day, idx)=>({ ...day, info: weekDayNames[idx] })), readingDaysMap }; }, [ week, weekDayNames, readingDaysMap ]); return { isLoading, error, weekData, streak, goal, activityDays, currentActivityDay }; }; /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (useGetStreakWithMetadata); __webpack_async_result__(); } catch(e) { __webpack_async_result__(e); } }); /***/ }), /***/ 70725: /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { "use strict"; /* harmony export */ __webpack_require__.d(__webpack_exports__, { /* harmony export */ "EQ": () => (/* binding */ RangeItemPosition), /* harmony export */ "JF": () => (/* binding */ RangeItem), /* harmony export */ "Nk": () => (/* binding */ RangeItemDirection) /* harmony export */ }); var RangeItemDirection; (function(RangeItemDirection) { RangeItemDirection["From"] = "from"; RangeItemDirection["To"] = "to"; })(RangeItemDirection || (RangeItemDirection = {})); var RangeItemPosition; (function(RangeItemPosition) { RangeItemPosition["Start"] = "start"; RangeItemPosition["End"] = "end"; })(RangeItemPosition || (RangeItemPosition = {})); var RangeItem; (function(RangeItem) { RangeItem["StartingChapter"] = "starting-chapter"; RangeItem["StartingVerse"] = "starting-verse"; RangeItem["EndingChapter"] = "ending-chapter"; RangeItem["EndingVerse"] = "ending-verse"; })(RangeItem || (RangeItem = {})); /***/ }), /***/ 63196: /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { "use strict"; /* harmony export */ __webpack_require__.d(__webpack_exports__, { /* harmony export */ "c9": () => (/* binding */ GoalCategory), /* harmony export */ "lC": () => (/* binding */ GoalType), /* harmony export */ "r_": () => (/* binding */ QuranGoalPeriod) /* harmony export */ }); var GoalCategory; (function(GoalCategory) { GoalCategory["QURAN"] = "QURAN"; })(GoalCategory || (GoalCategory = {})); var GoalType; (function(GoalType) { GoalType["TIME"] = "QURAN_TIME"; GoalType["PAGES"] = "QURAN_PAGES"; GoalType["RANGE"] = "QURAN_RANGE"; })(GoalType || (GoalType = {})); var QuranGoalPeriod; (function(QuranGoalPeriod) { QuranGoalPeriod["Daily"] = "DAILY"; QuranGoalPeriod["Continuous"] = "CONTINUOUS"; })(QuranGoalPeriod || (QuranGoalPeriod = {})); /***/ }), /***/ 10839: /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { "use strict"; /* harmony export */ __webpack_require__.d(__webpack_exports__, { /* harmony export */ "p": () => (/* binding */ StreakType) /* harmony export */ }); var StreakType; (function(StreakType) { StreakType["QURAN"] = "QURAN"; })(StreakType || (StreakType = {})); /***/ }) }; ; //# sourceMappingURL=1266.js.map