\r\n
\r\n );\r\n};\r\n\r\nexport default AddNewAccountLoaderTemplate;\r\n\r\nconst LoaderHeader = ({ loaderHeight, loaderWidth, props }) => {\r\n return (\r\n \r\n \r\n
\r\n \r\n \r\n
\r\n );\r\n};\r\n\r\nexport default ProducerBalanceInfoLoaderTemplate;\r\n","import React from \"react\";\r\nimport { PropTypes } from \"prop-types\";\r\nimport { MrbEditFormLayout, MrbFieldTextArea } from \"mrb/components\";\r\nimport { CurrencyInputField } from \"common/components\";\r\nimport { currencyFormatter } from \"mrb/common/formatting\";\r\nimport { observer } from \"mobx-react\";\r\n\r\nfunction AdminProducerAccountBalanceEditTemplate({ adminProducerAccountBalanceEditViewStore, t }) {\r\n const { form, currentAccountBalance, newAccountBalance } = adminProducerAccountBalanceEditViewStore;\r\n const diff = newAccountBalance - currentAccountBalance;\r\n const sign = Math.sign(diff);\r\n let newBalanceClassName;\r\n if (sign > 0) {\r\n newBalanceClassName = \"u-type--color--success\";\r\n } else if (sign < 0) {\r\n newBalanceClassName = \"u-type--color--warning\";\r\n }\r\n return (\r\n \r\n
\r\n\r\n \r\n
\r\n\r\n \r\n
\r\n \r\n {t(\"ADMINISTRATION.PRODUCER.ACCOUNT.EDIT.FIELDS.CURRENT_ACCOUNT_BALANCE_LABEL\")}\r\n
\r\n\r\n {currencyFormatter.format(currentAccountBalance, {\r\n currency: \"USD\",\r\n })}\r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n {t(\"ADMINISTRATION.PRODUCER.ACCOUNT.EDIT.FIELDS.NEW_ACCOUNT_BALANCE_LABEL\")}\r\n
\r\n\r\n {currencyFormatter.format(newAccountBalance, {\r\n currency: \"USD\",\r\n })}\r\n
\r\n \r\n
\r\n );\r\n}\r\n\r\nAdminProducerAccountEditTemplate.propTypes = {\r\n adminProducerAccountEditViewStore: PropTypes.object.isRequired,\r\n t: PropTypes.func,\r\n};\r\n\r\nfunction UserOption(props) {\r\n const { item } = props.data;\r\n\r\n return (\r\n \r\n
\r\n\r\n \r\n\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n );\r\n});\r\n\r\nexport default observer(AdminProducerAccountEditTemplate);\r\n","import React from \"react\";\r\nimport { PropTypes } from \"prop-types\";\r\nimport { currencyFormatter } from \"mrb/common/formatting\";\r\nimport { MrbRouterLink } from \"mrb/core/infrastructure/router\";\r\nimport { StripeAccountLink } from \"common/components/stripe\";\r\nimport { map } from \"lodash\";\r\nimport { defaultTemplate } from \"common/hoc\";\r\nimport { MrbContentLoader } from \"mrb/components/loader\";\r\nimport { ProducerAccountListLoader } from \"administration/producer/components\";\r\n\r\nfunction AdminProducerAccountsListTemplate({ adminProducerAccountsListViewStore, t }) {\r\n const { accounts, producerId, selectAccount, loaderStore } = adminProducerAccountsListViewStore;\r\n\r\n return (\r\n \r\n
\r\n \r\n
\r\n \r\n {t(\"ADMINISTRATION.PRODUCER.ACCOUNT.EDIT.FIELDS.ACCOUNT_BALANCE_LABEL\")}\r\n
\r\n\r\n {currencyFormatter.format(currentAccountBalance, {\r\n currency: \"USD\",\r\n })}\r\n
\r\n \r\n \r\n \r\n )}\r\n \r\n
\r\n );\r\n}\r\n\r\nAdminProducerAccountsListTemplate.propTypes = {\r\n adminProducerAccountsListViewStore: PropTypes.object.isRequired,\r\n t: PropTypes.func,\r\n};\r\n\r\nfunction NoDataEmptyState({ producerId, t }) {\r\n return (\r\n \r\n \r\n {t(\"ADMINISTRATION.PRODUCER.PAYMENT.PREVIEW.ACCOUNTS.TITLE\")}\r\n \r\n \r\n
\r\n \r\n \r\n \r\n
\r\n
\r\n | \r\n {t(\"ADMINISTRATION.PRODUCER.PAYMENT.PREVIEW.ACCOUNTS.COLUMNS.USER\")}\r\n | \r\n\r\n {t(\r\n \"ADMINISTRATION.PRODUCER.PAYMENT.PREVIEW.ACCOUNTS.COLUMNS.STRIPE_CONNECT\"\r\n )}\r\n | \r\n\r\n {t(\r\n \"ADMINISTRATION.PRODUCER.PAYMENT.PREVIEW.ACCOUNTS.COLUMNS.REVENUE_PERCENTAGE\"\r\n )}\r\n | \r\n\r\n {t(\r\n \"ADMINISTRATION.PRODUCER.PAYMENT.PREVIEW.ACCOUNTS.COLUMNS.ACCOUNT_BALANCE\"\r\n )}\r\n | \r\n
|---|---|---|---|
| \r\n | \r\n \r\n {account.firstName} {account.lastName} ({account.email})\r\n | \r\n\r\n {account.stripeAccountId && (\r\n | \r\n \r\n {account.revenuePercentage} %\r\n | \r\n\r\n {currencyFormatter.format(account.accountBalance, {\r\n currency: \"USD\",\r\n })}\r\n | \r\n \r\n ))\r\n )}\r\n
\r\n
\r\n );\r\n}\r\n\r\nexport default defaultTemplate(AdminProducerAccountsListTemplate);\r\n","import React from \"react\";\r\nimport { PropTypes } from \"prop-types\";\r\nimport { MrbInfiniteScrollGrid } from \"mrb/components/infinite-scroll-grid\";\r\nimport { AnalyticsPremiumListLoader } from \"administration/analytics/components\";\r\nimport { numberFormatter } from \"common/utils\";\r\nimport { currencyFormatter } from \"mrb/common/formatting\";\r\nimport { MrbRouterLink } from \"mrb/core/infrastructure/router\";\r\nimport { observer } from \"mobx-react\";\r\nimport { mergeCss } from \"mrb/common/utils\";\r\nimport { StatsWidgetEmptyState } from \"common/components/empty-state\";\r\n\r\nfunction ProducerPaymentReportTemplate({ producerPaymentReportPreviewViewStore, scrollParent, t, listClassName }) {\r\n const { gridStore } = producerPaymentReportPreviewViewStore;\r\n return (\r\n \r\n \r\n Add New\r\n \r\n
\r\n \r\n
\r\n {t(\"Add new account\")}
\r\n{t(\"In order to add a new account, please click the button below.\")}
\r\n\r\n User\r\n \r\n # of Browse Playbacks\r\n \r\n \r\n Total # of Premium Browse Playbacks\r\n \r\n \r\n Browse Payment Share\r\n \r\n \r\n Producer's Browse Payment\r\n \r\n \r\n # of Shuffle Playbacks\r\n \r\n \r\n Total # of Premium Shuffle Playbacks\r\n \r\n \r\n Browse Shuffle Share\r\n \r\n \r\n Producer's Shuffle Payment\r\n \r\n Total Payment\r\n
\r\n \r\n
\r\n \r\n
\r\n );\r\n}\r\n\r\nexport default observer(ProducerPaymentReportTemplate);\r\n","import React from \"react\";\r\nimport { PropTypes } from \"prop-types\";\r\nimport { numberFormatter, producerPlaybackTimeConverter } from \"common/utils\";\r\nimport { dateFormatter, currencyFormatter } from \"mrb/common/formatting\";\r\nimport { applicationDefaults } from \"common/constants\";\r\nimport { MrbContentLoader } from \"mrb/components/loader\";\r\nimport { isProducerReportComplete } from \"common/utils\";\r\nimport { ProducerLabel, ProducerSummaryLoader } from \"common/components/producer\";\r\nimport { observer } from \"mobx-react\";\r\nimport { isNil } from \"lodash\";\r\n\r\nfunction ProducerPaymentReportSummaryTemplate({ producerPaymentReportPreviewViewStore, t }) {\r\n const { summaryData, loaderStore } = producerPaymentReportPreviewViewStore;\r\n\r\n return (\r\n \r\n \r\n {item.firstName} {item.lastName}\r\n \r\n
\r\n {numberFormatter.format(item.browsePlaybacks)}
\r\n \r\n {numberFormatter.format(item.totalBrowsePlaybacks)}\r\n
\r\n \r\n {currencyFormatter.format(item.browsePaymentShare, { currency: \"USD\" })}\r\n
\r\n \r\n {currencyFormatter.format(item.browseProducerPayment, { currency: \"USD\" })}\r\n
\r\n {numberFormatter.format(item.shufflePlaybacks)}
\r\n \r\n {numberFormatter.format(item.totalShufflePlaybacks)}\r\n
\r\n \r\n {currencyFormatter.format(item.shufflePaymentShare, { currency: \"USD\" })}\r\n
\r\n \r\n {currencyFormatter.format(item.shuffleProducerPayment, { currency: \"USD\" })}\r\n
\r\n \r\n {currencyFormatter.format(item.totalProducerPayment, { currency: \"USD\" })}\r\n
\r\n Summary
\r\n\r\n \r\n {summaryData && (\r\n \r\n \r\n )}\r\n \r\n )}\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n {summaryData.currentMonthTotalProducerPlaybacks !== null &&\r\n summaryData.currentMonthTotalProducerPlaybacks !== undefined && (\r\n Producer
\r\n\r\n
\r\n
\r\n )}\r\n Period
\r\n\r\n
\r\n
\r\n\r\n \r\n
\r\n
\r\n \r\n {currencyFormatter.format(\r\n summaryData.currentMonthTotalProducerPayment,\r\n {\r\n currency: \"USD\",\r\n }\r\n )}\r\n
\r\n\r\n
\r\n Total Playback Points
\r\n\r\n {numberFormatter.format(summaryData.currentMonthTotalProducerPlaybacks)}\r\n
\r\n\r\n
\r\n );\r\n }\r\n\r\n return null;\r\n}\r\n\r\nfunction MonthOfReportLabel({ summaryData }) {\r\n const monthLabel = dateFormatter.format(summaryData.filteredBy.date, {\r\n format: applicationDefaults.formats.monthFull,\r\n });\r\n return monthLabel;\r\n}\r\n\r\nfunction ReportPeriodRange({ summaryData }) {\r\n const startDate = dateFormatter.format(summaryData.currentMonthPeriodStartDate, {\r\n format: applicationDefaults.formats.date,\r\n timeZone: applicationDefaults.defaultProductReportTimeZone,\r\n });\r\n const endDate = dateFormatter.format(summaryData.currentMonthPeriodEndDate, {\r\n format: applicationDefaults.formats.date,\r\n timeZone: applicationDefaults.defaultProductReportTimeZone,\r\n });\r\n const isComplete = isProducerReportComplete(summaryData.filteredBy.date, summaryData.currentMonthPeriodEndDate);\r\n return (\r\n Total Playback Time
\r\n{totalPlaybackTime}
\r\n\r\n
\r\n );\r\n}\r\n\r\nProducerPreviewSummaryTemplate.propTypes = {\r\n producerPreviewViewStore: PropTypes.object.isRequired,\r\n t: PropTypes.func,\r\n};\r\n\r\nfunction ProducerPositionIndicator({ topPaidProducerStatus }) {\r\n if (!topPaidProducerStatus || topPaidProducerStatus.totalPayment === 0) {\r\n return null;\r\n }\r\n\r\n return (\r\n Summary
\r\n\r\n \r\n \r\n )}\r\n \r\n
\r\n \r\n {summaryData && (\r\n \r\n \r\n )}\r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n Producer
\r\n\r\n
\r\n
\r\n \r\n
\r\n\r\n {summaryData.lastProducerReport && (\r\n \r\n
\r\n Total Revenue
\r\n\r\n
\r\n \r\n {currencyFormatter.format(\r\n summaryData.topPaidProducerStatus\r\n ? summaryData.topPaidProducerStatus.totalPayment\r\n : 0,\r\n {\r\n currency: \"USD\",\r\n }\r\n )}\r\n
\r\n\r\n
\r\n )}\r\n \r\n Last Revenue (\r\n {dateFormatter.format(\r\n summaryData.lastProducerReport.monthOfYear,\r\n {\r\n format: applicationDefaults.formats.monthShort,\r\n timeZone: \"utc\",\r\n }\r\n )}\r\n )\r\n
\r\n\r\n {currencyFormatter.format(\r\n summaryData.lastProducerReport.totalProducerPayment,\r\n {\r\n currency: \"USD\",\r\n }\r\n )}\r\n
\r\n\r\n {getNumberWithOrdinal(topPaidProducerStatus.position)}\r\n
\r\n );\r\n}\r\n\r\nfunction getNumberWithOrdinal(n) {\r\n const s = [\"th\", \"st\", \"nd\", \"rd\"];\r\n const v = n % 100;\r\n return n + (s[(v - 20) % 10] || s[v] || s[0]);\r\n}\r\n\r\nexport default observer(ProducerPreviewSummaryTemplate);\r\n","import React from \"react\";\r\nimport { PropTypes } from \"prop-types\";\r\nimport { TopTrendingListLoader } from \"administration/analytics/components\";\r\nimport { MrbContentLoader } from \"mrb/components/loader\";\r\nimport { numberFormatter } from \"common/utils\";\r\nimport { MrbRouterLink } from \"mrb/core/infrastructure/router\";\r\nimport { map } from \"lodash\";\r\nimport { observer } from \"mobx-react\";\r\n\r\nfunction ProducerPreviewMostPopularContentTemplate({ producerPreviewViewStore }) {\r\n const { loaderStore, mostPopularContent } = producerPreviewViewStore;\r\n return (\r\n most paid producer
\r\n \r\n
\r\n );\r\n}\r\n\r\nProducerPreviewMostPopularContentTemplate.propTypes = {\r\n producerPreviewViewStore: PropTypes.object.isRequired,\r\n};\r\n\r\nfunction PlaybackItem({ index, item }) {\r\n let title, route, isPremium, params;\r\n if (item.station) {\r\n title = item.station.title;\r\n isPremium = item.station.isPremium;\r\n route = \"master.administration.analytics.station-activity\";\r\n params = { id: item.station.id };\r\n } else if (item.podcast) {\r\n title = item.podcast.title;\r\n isPremium = item.podcast.isPremium;\r\n route = \"master.administration.analytics.podcast-activity\";\r\n params = { id: item.podcast.id };\r\n }\r\n return (\r\n Most Popular Content
\r\n\r\n
\r\n \r\n {mostPopularContent && mostPopularContent.length > 0 ? (\r\n
\r\n )}\r\n \r\n \r\n {map(mostPopularContent, (item, index) => (\r\n
\r\n ) : (\r\n \r\n
\r\n );\r\n}\r\n\r\nfunction EmptyState() {\r\n return (\r\n \r\n {index + 1}.\r\n \r\n {title}\r\n {isPremium && }\r\n \r\n
\r\n {numberFormatter.format(item.playbacks)}\r\n \r\n \r\n
\r\n );\r\n}\r\n\r\nexport default observer(ProducerPreviewMostPopularContentTemplate);\r\n","import React from \"react\";\r\nimport { PropTypes } from \"prop-types\";\r\nimport { MrbContentLoader } from \"mrb/components/loader\";\r\nimport { currencyFormatter } from \"mrb/common/formatting\";\r\nimport { observer } from \"mobx-react\";\r\nimport { AdminProducerSummaryLoader } from \"administration/producer/components\";\r\nimport { isNil } from \"lodash\";\r\nimport { StripeAccountLink } from \"common/components/stripe\";\r\n\r\nfunction AdminProducerAccountSummaryPreviewTemplate({ adminProducerAccountPreviewViewStore, t }) {\r\n const { summaryData, loaderStore } = adminProducerAccountPreviewViewStore;\r\n\r\n return (\r\n No activity data
\r\nThere are no detected playbacks.
\r\n\r\n
\r\n );\r\n}\r\n\r\nAdminProducerAccountSummaryPreviewTemplate.propTypes = {\r\n adminProducerAccountPreviewViewStore: PropTypes.object.isRequired,\r\n t: PropTypes.func,\r\n};\r\n\r\nexport default observer(AdminProducerAccountSummaryPreviewTemplate);\r\n","import React from \"react\";\r\nimport { PropTypes } from \"prop-types\";\r\nimport { MrbEditFormLayout } from \"mrb/components\";\r\nimport { observer } from \"mobx-react\";\r\nimport { StripeAccountFieldSelect } from \"common/components/stripe\";\r\n\r\nfunction AdminProducerAccountStripeAccountEditTemplate({ adminProducerAccountStripeAccountEditViewStore, t }) {\r\n const { form, stripeAccountSelectStore } = adminProducerAccountStripeAccountEditViewStore;\r\n\r\n return (\r\n Summary
\r\n\r\n \r\n \r\n )}\r\n \r\n
\r\n \r\n {summaryData && (\r\n \r\n \r\n )}\r\n
\r\n \r\n
\r\n \r\n
\r\n\r\n {!isNil(summaryData.stripeAccountId) && (\r\n \r\n
\r\n User Email
\r\n\r\n {summaryData.email}\r\n
\r\n\r\n
\r\n )}\r\n \r\n
\r\n \r\n Stripe Account\r\n
\r\n\r\n
\r\n
\r\n \r\n
\r\n Account Balance
\r\n\r\n
\r\n \r\n {currencyFormatter.format(\r\n summaryData.accountBalance\r\n ? summaryData.accountBalance\r\n : 0,\r\n {\r\n currency: \"USD\",\r\n }\r\n )}\r\n
\r\n\r\n \r\n
\r\n );\r\n}\r\n\r\nAdminProducerListSummaryPreviewTemplate.propTypes = {\r\n adminProducerListViewStore: PropTypes.object.isRequired,\r\n t: PropTypes.func,\r\n};\r\n\r\nexport default observer(AdminProducerListSummaryPreviewTemplate);\r\n","import React from \"react\";\r\nimport { PropTypes } from \"prop-types\";\r\nimport { MrbContentLoader } from \"mrb/components/loader\";\r\nimport { observer } from \"mobx-react\";\r\nimport { AdminProducerSummaryLoader } from \"administration/producer/components\";\r\nimport { map } from \"lodash\";\r\nimport { MrbRouterLink } from \"mrb/core/infrastructure/router\";\r\n\r\nfunction AdminProducerAccountAssignedProducersPreviewTemplate({ adminProducerAccountPreviewViewStore, t }) {\r\n const { assignedProducers, loaderStore } = adminProducerAccountPreviewViewStore;\r\n\r\n return (\r\n \r\n {producersSummary && (\r\n
\r\n )}\r\n \r\n
\r\n )}\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n Total balance on all accounts\r\n
\r\n\r\n\r\n
\r\n \r\n {currencyFormatter.format(\r\n producersSummary.totalBalance\r\n ? producersSummary.totalBalance\r\n : 0,\r\n {\r\n currency: \"USD\",\r\n }\r\n )}\r\n
\r\n\r\n
\r\n \r\n Top users by balance\r\n
\r\n {map(producersSummary.producerAccountSummaries, (summary, index) => (\r\n\r\n \r\n {`${summary.firstName} ${summary.lastName} `}\r\n \r\n\r\n
\r\n ))}\r\n \r\n {currencyFormatter.format(\r\n summary.accountBalance ? summary.accountBalance : 0,\r\n {\r\n currency: \"USD\",\r\n }\r\n )}\r\n
\r\n \r\n Today's payouts to bank accounts\r\n
\r\n\r\n
\r\n \r\n {currencyFormatter.format(\r\n producersSummary.payoutAmount ? producersSummary.payoutAmount : 0,\r\n {\r\n currency: \"USD\",\r\n }\r\n )}\r\n
\r\n\r\n {assignedProducers && (\r\n
\r\n \r\n {assignedProducers.length > 1 ? \"Producers\" : \"Producer\"}\r\n
\r\n )}\r\n\r\n \r\n
\r\n \r\n {assignedProducers &&\r\n map(assignedProducers, (item) => (\r\n
\r\n )}\r\n \r\n
\r\n ))}\r\n \r\n
\r\n \r\n
\r\n Producer
\r\n\r\n
\r\n
\r\n Revenue Share
\r\n\r\n
\r\n {item.revenuePercentage}%
\r\n\r\n {t(title)}\r\n
\r\n \r\n \r\n {children}\r\n \r\n )}\r\n
\r\n \r\n );\r\n}\r\n\r\nMrbCollapsiblePanel.propTypes = {\r\n title: PropTypes.string,\r\n isCollapsed: PropTypes.bool.isRequired,\r\n headerRender: PropTypes.func,\r\n headerClassNameExtend: PropTypes.string,\r\n headerClassNameOverride: PropTypes.string,\r\n bodyClassNameExtend: PropTypes.string,\r\n bodyClassNameOverride: PropTypes.string,\r\n containerClassNameExtend: PropTypes.string,\r\n containerClassNameOverride: PropTypes.string,\r\n children: PropTypes.any,\r\n onChangeCollapse: PropTypes.func.isRequired,\r\n innerRef: PropTypes.func,\r\n};\r\n\r\nexport default observer(MrbCollapsiblePanel);\r\n","const applicationDefaults = {\r\n rpp: 20,\r\n formats: {\r\n dateTime: \"MM/DD/YYYY HH:mm A\",\r\n dateTimeSeconds: \"MM/DD/YYYY HH:mm:ss A\",\r\n date: \"MM/DD/YYYY\",\r\n longDate: \"MMMM DD, YYYY\",\r\n month: \"MMM YYYY\",\r\n monthFull: \"MMMM, YYYY\",\r\n monthShort: \"MM/YYYY\",\r\n isoDate: \"YYYY-MM-DD\",\r\n },\r\n maximumNumberOfDevices: 5,\r\n trialPeriodDays: 7,\r\n defaultProductReportTimeZone: \"America/New_York\",\r\n};\r\n\r\nexport default applicationDefaults;\r\n","const applicationErrorCodes = {\r\n device: {\r\n notExists: 51002,\r\n alreadyRegistered: 51003,\r\n },\r\n payment: {\r\n existingActiveSubscription: 53001,\r\n paymentFailedAuthenticationRequired: 53003,\r\n paymentFailedExpiredCreditCard: 53005,\r\n paymentFailedInvalidCreditCard: 53004,\r\n paymentFailedUnknownReason: 53006,\r\n },\r\n rssSync: {\r\n rssSyncFailed: 55001,\r\n },\r\n producer: {\r\n administratorConflict: 58001,\r\n producerNameEmpty: 58002,\r\n userNotFound: 58003,\r\n emailAlreadyExists: 58005,\r\n insufficientAccountBalance: 59006,\r\n stripeConnectAccountNotExists: 59005,\r\n producerUserAccountNotExists: 59004,\r\n stripeConnectAccountNotEnabled: 59007,\r\n userIsAdministrator: 59008,\r\n duplicateUsersSelected: 59002,\r\n },\r\n};\r\n\r\nexport default applicationErrorCodes;\r\n","const deviceMenuTypes = {\r\n station: \"station\",\r\n podcast: \"podcast\",\r\n shuffle: \"shuffle\",\r\n search: \"search\",\r\n separator: \"separator\",\r\n directory: \"directory\",\r\n nakiNigunArtist: \"naki-nigun-artist\",\r\n nakiNigunAlbum: \"naki-nigun-album\",\r\n nakiTalesCollection: \"naki-tales-collection\",\r\n nakiTalesTitle: \"naki-tales-title\",\r\n torahAnytime: \"torahanytime\",\r\n myRecentlyUpdated: \"recently-updated-my\",\r\n allRecentlyUpdated: \"recently-updated-all\",\r\n playlists: \"playlists\",\r\n};\r\n\r\nexport default deviceMenuTypes;\r\n","import { baasicSystemRoles } from \"mrb/baasic\";\r\n\r\nconst nakiRadioRoles = {\r\n accountOwnerRoleName: baasicSystemRoles.accountOwnerRoleName,\r\n administratorRoleName: baasicSystemRoles.administratorRoleName,\r\n producerRoleName: \"Producers\",\r\n userRoleName: baasicSystemRoles.userRoleName,\r\n guestRoleName: \"Guests\",\r\n anonymousRoleName: baasicSystemRoles.anonymousRoleName,\r\n};\r\n\r\nexport default nakiRadioRoles;\r\n","const nakiRadioSystemTypes = {\r\n venice: \"venice\",\r\n mobile: \"mobile\",\r\n mobile_embedded: \"mobile-embedded\",\r\n};\r\n\r\nexport default nakiRadioSystemTypes;\r\n","const podcastContentType = {\r\n default: 1,\r\n torahAnytime: 2,\r\n};\r\n\r\nexport default podcastContentType;\r\n","const podcastType = {\r\n podcast: 1,\r\n podcastGroup: 2,\r\n};\r\n\r\nexport default podcastType;\r\n","const reportVersions = {\r\n \"1_0\": \"1.0\",\r\n \"2_0\": \"2.0\",\r\n};\r\n\r\nexport default reportVersions;\r\n","const shuffleType = {\r\n station: \"station\",\r\n podcast: \"podcast\",\r\n nakiNigun: \"naki-nigun-album\",\r\n};\r\n\r\nexport default shuffleType;\r\n","const subscriptionPlans = {\r\n nakiTales: \"naki-tales-premium\",\r\n nakiNigun: \"naki-nigun-premium\",\r\n nakiRadioPremium: \"naki-radio-premium\",\r\n nakiRadioFree: \"naki-radio-free\",\r\n subscriptionBundleDuo: \"subscription-bundle-duo\",\r\n subscriptionBundleSolo: \"subscription-bundle-solo\",\r\n subscriptionBundleNaki23Black: \"subscription-bundle-naki-23-black\",\r\n};\r\n\r\nexport default subscriptionPlans;\r\n","const subscriptionStatuses = {\r\n canceled: \"Cancelled\",\r\n pending: \"Pending\",\r\n pastDue: \"PastDue\",\r\n active: \"Active\",\r\n unrecognized: \"Unrecognized\",\r\n expired: \"Expired\",\r\n trial: \"Trial\",\r\n};\r\n\r\nexport default subscriptionStatuses;\r\n","const nakiRadioProductCategoryAbbreviations = {\r\n radioDevice: \"radio-device\",\r\n subscription: \"subscription\",\r\n subscriptionBundle: \"subscription-bundle\",\r\n};\r\n\r\nexport default nakiRadioProductCategoryAbbreviations;\r\n","const producerTypes = {\r\n artistSlug: \"artist\",\r\n podcasterSlug: \"podcaster\",\r\n};\r\n\r\nexport default producerTypes;\r\n","import { isObject, join, extend, each, map, zipWith, pickBy, isNil, isEmpty } from \"lodash\";\r\n\r\nfunction FindParams(options) {\r\n if (isObject(options)) {\r\n extend(\r\n this,\r\n pickBy(options, (value) => !isNil(value) && ((isObject(value) && !isEmpty(value)) || !isObject(value)))\r\n );\r\n if (\r\n (options.hasOwnProperty(\"orderBy\") && options.hasOwnProperty(\"orderDirection\")) ||\r\n options.hasOwnProperty(\"sort\")\r\n ) {\r\n if (options.hasOwnProperty(\"sort\")) {\r\n this.sort = options.sort;\r\n } else if (options.orderBy && options.orderDirection) {\r\n const orderByParts = map(options.orderBy.split(\",\"), (i) => i.trim());\r\n const orderDirectionParts = map(options.orderDirection.split(\",\"), (i) => i.trim());\r\n if (orderByParts.length !== orderDirectionParts.length) {\r\n throw new Error(\"Invalid sorting parameters.\");\r\n }\r\n if (orderByParts.length > 0 && orderDirectionParts.length > 0) {\r\n this.sort = join(\r\n zipWith(\r\n orderByParts,\r\n orderDirectionParts,\r\n (orderBy, orderDirection) => `${orderBy}|${orderDirection}`\r\n ),\r\n \",\"\r\n );\r\n }\r\n }\r\n }\r\n if (options.search) {\r\n this.searchQuery = options.search;\r\n }\r\n if (options.hasOwnProperty(\"pageNumber\")) {\r\n this.page = options.pageNumber;\r\n }\r\n if (options.hasOwnProperty(\"pageSize\")) {\r\n this.rpp = options.pageSize;\r\n }\r\n } else {\r\n this.searchQuery = options;\r\n }\r\n}\r\n\r\nfunction KeyParams(id, options, propName) {\r\n if (isObject(id)) {\r\n extend(this, id);\r\n } else {\r\n if (propName !== undefined) {\r\n this[propName] = id;\r\n } else {\r\n this[\"id\"] = id;\r\n }\r\n }\r\n\r\n if (options !== undefined && isObject(options)) {\r\n extend(this, options);\r\n }\r\n}\r\n\r\nfunction findParams(options) {\r\n return new FindParams(options);\r\n}\r\n\r\nfunction getParams(id, options, propName) {\r\n return new KeyParams(id, options, propName);\r\n}\r\n\r\nfunction batchDeleteParams(data, idPropertyName = \"id\") {\r\n let items = [];\r\n each(data, (item) => {\r\n if (isObject(item)) {\r\n items.push(item[idPropertyName]);\r\n }\r\n });\r\n\r\n return items;\r\n}\r\n\r\nexport { findParams, getParams, batchDeleteParams };\r\n","import { each, find, orderBy, isArray, isString } from \"lodash\";\r\n\r\nfunction buildAuthorizedMenu(menuItems, routes, permissionFunc) {\r\n let menuTree = [];\r\n each(menuItems, function (moduleItems) {\r\n each(moduleItems, (moduleItem) => {\r\n if (hasPermission(moduleItem, permissionFunc)) {\r\n let root = find(menuTree, (t) => t.title === moduleItem.title);\r\n if (!root) {\r\n root = {\r\n title: moduleItem.title,\r\n subMenu: [],\r\n };\r\n menuTree.push(root);\r\n }\r\n if (!root.icon && moduleItem.icon) {\r\n root.icon = moduleItem.icon;\r\n }\r\n if (!root.route && moduleItem.route) {\r\n root.route = moduleItem.route;\r\n }\r\n if (!root.order && moduleItem.order) {\r\n root.order = moduleItem.order;\r\n }\r\n each(moduleItem.subMenu, function (secondaryMenuItem, idx) {\r\n // eslint-disable-line\r\n var route = getRouteByMenu(secondaryMenuItem, routes);\r\n if (hasPermission(route, permissionFunc)) {\r\n let subRoot = find(\r\n root.subMenu,\r\n (t) => t.title === secondaryMenuItem.title\r\n );\r\n if (secondaryMenuItem.subMenu) {\r\n evaluateSubMenuItems(\r\n secondaryMenuItem,\r\n routes,\r\n permissionFunc\r\n );\r\n }\r\n if (!subRoot) {\r\n root.subMenu = [...root.subMenu, secondaryMenuItem];\r\n } else {\r\n each(\r\n secondaryMenuItem.subMenu,\r\n function (terniaryMenuItem, idx) {\r\n // eslint-disable-line\r\n var route = getRouteByMenu(\r\n terniaryMenuItem,\r\n routes\r\n );\r\n if (hasPermission(route, permissionFunc)) {\r\n subRoot.subMenu = [\r\n ...subRoot.subMenu,\r\n terniaryMenuItem,\r\n ];\r\n }\r\n }\r\n );\r\n subRoot.subMenu = orderBy(\r\n subRoot.subMenu,\r\n \"order\",\r\n \"asc\"\r\n );\r\n }\r\n }\r\n });\r\n root.subMenu = orderBy(root.subMenu, \"order\", \"asc\");\r\n }\r\n });\r\n });\r\n\r\n return menuTree;\r\n}\r\nfunction evaluateSubMenuItems(menuItem, routes, permissionFunc) {\r\n var keys = [];\r\n each(menuItem.subMenu, function (subMenuItem, key) {\r\n var childRoute = getRouteByMenu(subMenuItem, routes);\r\n if (!hasPermission(childRoute, permissionFunc)) {\r\n keys.push(key);\r\n } else {\r\n if (subMenuItem.subMenu) {\r\n evaluateSubMenuItems(subMenuItem);\r\n }\r\n }\r\n });\r\n each(keys.reverse(), function (key) {\r\n if (isArray(menuItem.subMenu)) {\r\n menuItem.subMenu.splice(key, 1);\r\n } else {\r\n delete menuItem.subMenu[key];\r\n }\r\n });\r\n\r\n menuItem.subMenu = orderBy(menuItem.subMenu, \"order\", \"asc\");\r\n}\r\n\r\nfunction getRouteByMenu(menuItem, routes) {\r\n var route = \"\";\r\n if (menuItem.route === \"function\") {\r\n const menuRoute = menuItem.route();\r\n if (menuRoute === null) return null;\r\n\r\n route = menuRoute.routeName;\r\n } else {\r\n route = menuItem.route;\r\n }\r\n\r\n return find(routes, (r) => r.name === route);\r\n}\r\n\r\nfunction hasPermission(item, permissionFunc) {\r\n let authorized = true;\r\n if (item && item.authorization) {\r\n if (isString(item.authorization) || isArray(item.authorization)) {\r\n authorized = permissionFunc(item.authorization);\r\n } else {\r\n authorized = item.authorization();\r\n }\r\n }\r\n return authorized;\r\n}\r\n\r\nexport default buildAuthorizedMenu;\r\n","export default function flattenArray(arr) {\r\n return arr.reduce(function (flat, toFlatten) {\r\n return flat.concat(\r\n Array.isArray(toFlatten) ? flattenArray(toFlatten) : toFlatten\r\n );\r\n }, []);\r\n}\r\n","import React from \"react\";\r\nimport { mergeOrOverrideCss } from \"baasic-react-bootstrap/src/common\";\r\n\r\nconst EmptyState = ({ title, description, classNameOverride, classNameExtend }) => {\r\n return (\r\n \r\n \r\n
\r\n );\r\n};\r\n\r\nexport default EmptyState;\r\n","import React from \"react\";\r\nimport { mergeCss } from \"mrb/common/utils\";\r\n\r\nconst StatsWidgetEmptyState = (props) => {\r\n const { period, classNameExtend } = props;\r\n\r\n return (\r\n {title ? title : \"No results found\"}
\r\n{description ? description : \"Try adjusting your search to find what you are looking for.\"}
\r\n\r\n \r\n
\r\n );\r\n};\r\n\r\nexport default StatsWidgetEmptyState;\r\n","export * from \"./constants\";\r\nexport * from \"./formatting\";\r\nexport * from \"./models\";\r\nexport * from \"./storage\";\r\nexport * from \"./utils\";\r\n","import { action, observable, makeObservable } from \"mobx\";\r\nimport { MrbBaseViewStore } from \"../../core/stores\";\r\nimport { extend, isFunction } from \"lodash\";\r\n\r\nclass MrbTabViewStore extends MrbBaseViewStore {\r\n @observable activeTabIndex = 0;\r\n\r\n config = {\r\n actions: {\r\n onTabChange: null,\r\n },\r\n };\r\n\r\n constructor(rootStore, config) {\r\n super(rootStore);\r\n makeObservable(this);\r\n this.config = extend({}, this.config, config);\r\n }\r\n\r\n @action.bound\r\n handleTabClick(tabIndex) {\r\n this.setActiveTabIndex(tabIndex);\r\n if (isFunction(this.config.actions.onTabChange)) {\r\n this.config.actions.onTabChange(tabIndex);\r\n }\r\n }\r\n\r\n @action.bound\r\n setActiveTabIndex(tabIndex) {\r\n this.activeTabIndex = tabIndex;\r\n }\r\n}\r\n\r\nexport default MrbTabViewStore;\r\n","import React from \"react\";\r\nimport { PropTypes } from \"prop-types\";\r\nimport { observer } from \"mobx-react\";\r\nimport { mergeCss } from \"../../common/utils\";\r\n\r\nfunction MrbTabHeader({ onClick, label, isActive, icon, t = (i) => i }) {\r\n return (\r\n {`No statistic available for the current ${period ? period : \"period\"}`}
\r\n\r\n \r\n {tabElements}\r\n \r\n {renderActiveTab(activeTabIndex, tabElements)}\r\n
\r\n );\r\n}\r\n\r\nfunction renderActiveTab(activeTabIndex, children) {\r\n const tabs = React.Children.toArray(children);\r\n const tab = tabs[activeTabIndex];\r\n return tab;\r\n}\r\n\r\nMrbTabLayout.propTypes = {\r\n store: PropTypes.object.isRequired,\r\n headersRenderer: PropTypes.func,\r\n children: PropTypes.node.isRequired,\r\n t: PropTypes.func,\r\n};\r\n\r\nexport default observer(MrbTabLayout);\r\n","var map = {\n\t\"./ar\": 750,\n\t\"./ar.js\": 750,\n\t\"./az\": 751,\n\t\"./az.js\": 751,\n\t\"./be\": 752,\n\t\"./be.js\": 752,\n\t\"./bg\": 753,\n\t\"./bg.js\": 753,\n\t\"./bs\": 754,\n\t\"./bs.js\": 754,\n\t\"./ca\": 755,\n\t\"./ca.js\": 755,\n\t\"./cs\": 756,\n\t\"./cs.js\": 756,\n\t\"./cy\": 757,\n\t\"./cy.js\": 757,\n\t\"./da\": 758,\n\t\"./da.js\": 758,\n\t\"./de\": 759,\n\t\"./de.js\": 759,\n\t\"./el\": 760,\n\t\"./el.js\": 760,\n\t\"./en\": 586,\n\t\"./en.js\": 586,\n\t\"./es\": 761,\n\t\"./es.js\": 761,\n\t\"./et\": 762,\n\t\"./et.js\": 762,\n\t\"./eu\": 763,\n\t\"./eu.js\": 763,\n\t\"./fa\": 764,\n\t\"./fa.js\": 764,\n\t\"./fi\": 765,\n\t\"./fi.js\": 765,\n\t\"./fr\": 766,\n\t\"./fr.js\": 766,\n\t\"./hr\": 767,\n\t\"./hr.js\": 767,\n\t\"./hu\": 768,\n\t\"./hu.js\": 768,\n\t\"./id\": 769,\n\t\"./id.js\": 769,\n\t\"./it\": 770,\n\t\"./it.js\": 770,\n\t\"./ja\": 771,\n\t\"./ja.js\": 771,\n\t\"./ka\": 772,\n\t\"./ka.js\": 772,\n\t\"./ko\": 773,\n\t\"./ko.js\": 773,\n\t\"./lt\": 774,\n\t\"./lt.js\": 774,\n\t\"./lv\": 775,\n\t\"./lv.js\": 775,\n\t\"./mk\": 776,\n\t\"./mk.js\": 776,\n\t\"./mn\": 777,\n\t\"./mn.js\": 777,\n\t\"./ms\": 778,\n\t\"./ms.js\": 778,\n\t\"./nb_NO\": 779,\n\t\"./nb_NO.js\": 779,\n\t\"./nl\": 780,\n\t\"./nl.js\": 780,\n\t\"./pl\": 781,\n\t\"./pl.js\": 781,\n\t\"./pt\": 782,\n\t\"./pt.js\": 782,\n\t\"./pt_BR\": 783,\n\t\"./pt_BR.js\": 783,\n\t\"./ro\": 784,\n\t\"./ro.js\": 784,\n\t\"./ru\": 785,\n\t\"./ru.js\": 785,\n\t\"./se\": 786,\n\t\"./se.js\": 786,\n\t\"./sl\": 787,\n\t\"./sl.js\": 787,\n\t\"./sq\": 788,\n\t\"./sq.js\": 788,\n\t\"./sr\": 789,\n\t\"./sr.js\": 789,\n\t\"./sv\": 790,\n\t\"./sv.js\": 790,\n\t\"./tr\": 791,\n\t\"./tr.js\": 791,\n\t\"./ua\": 792,\n\t\"./ua.js\": 792,\n\t\"./uk\": 793,\n\t\"./uk.js\": 793,\n\t\"./vi\": 794,\n\t\"./vi.js\": 794,\n\t\"./zh\": 795,\n\t\"./zh.js\": 795,\n\t\"./zh_TW\": 796,\n\t\"./zh_TW.js\": 796\n};\n\n\nfunction webpackContext(req) {\n\tvar id = webpackContextResolve(req);\n\treturn __webpack_require__(id);\n}\nfunction webpackContextResolve(req) {\n\tif(!__webpack_require__.o(map, req)) {\n\t\tvar e = new Error(\"Cannot find module '\" + req + \"'\");\n\t\te.code = 'MODULE_NOT_FOUND';\n\t\tthrow e;\n\t}\n\treturn map[req];\n}\nwebpackContext.keys = function webpackContextKeys() {\n\treturn Object.keys(map);\n};\nwebpackContext.resolve = webpackContextResolve;\nmodule.exports = webpackContext;\nwebpackContext.id = 1182;","import { observable, makeObservable } from \"mobx\";\r\nimport { MrbFilterParameters } from \"mrb/core/filter\";\r\n\r\nclass HomeContentFilter extends MrbFilterParameters {\r\n @observable contentType;\r\n @observable isEnabled;\r\n @observable isPremium;\r\n\r\n constructor() {\r\n super();\r\n makeObservable(this);\r\n this.reset();\r\n }\r\n\r\n reset() {\r\n super.reset();\r\n this.contentType = 0;\r\n this.isEnabled = null;\r\n this.isPremium = null;\r\n }\r\n}\r\n\r\nexport default HomeContentFilter;\r\n","import { observable, makeObservable } from \"mobx\";\r\nimport { MrbFilterParameters } from \"mrb/core/filter\";\r\n\r\nclass HomeGenericSearchFilter extends MrbFilterParameters {\r\n @observable genreId;\r\n\r\n constructor() {\r\n super();\r\n makeObservable(this);\r\n this.reset();\r\n }\r\n\r\n reset() {\r\n super.reset();\r\n this.genreId = null;\r\n }\r\n}\r\n\r\nexport default HomeGenericSearchFilter;\r\n","import { action, makeObservable, observable, runInAction } from \"mobx\";\r\nimport { MrbBaseListViewStore } from \"mrb/core\";\r\nimport { httpStatusCodes } from \"mrb/core/constants\";\r\nimport { MrbGridViewStore } from \"mrb/components/grid\";\r\nimport { MrbSimpleSelectStore, MrbQuerySelectStore } from \"mrb/components/select\";\r\nimport { HomeGenericSearchFilter } from \"application/home/filters\";\r\nimport { sideScroll } from \"common/utils\";\r\nimport { podcastType, podcastContentType } from \"common/constants\";\r\nimport { find, filter, map, isNil, uniqBy } from \"lodash\";\r\n\r\nclass HomeGenericSearchViewStore extends MrbBaseListViewStore {\r\n @observable showSearchView = false;\r\n @observable.ref podcastGroups = [];\r\n @observable isAppearsInScrollable = false;\r\n @observable.ref appearsInContainerRef = null;\r\n _isInitialLoad = true;\r\n\r\n _abortController = null;\r\n\r\n orderOptions = [\r\n {\r\n label: \"APPLICATION.HOME.LIST.GENERIC_SEARCH.ORDER.RELEVANCE_OPTION\",\r\n value: \"-1\",\r\n },\r\n {\r\n label: \"APPLICATION.HOME.LIST.GENERIC_SEARCH.ORDER.RECENTLY_ADDED_OPTION\",\r\n value: \"dateCreated\",\r\n },\r\n {\r\n label: \"APPLICATION.HOME.LIST.GENERIC_SEARCH.ORDER.ALPHABETICALY_OPTION\",\r\n value: \"title\",\r\n },\r\n ];\r\n\r\n constructor(rootStore, homeViewStore) {\r\n super(rootStore, {\r\n queryConfig: {\r\n filter: new HomeGenericSearchFilter(),\r\n disableUpdateQueryParams: true,\r\n pageSize: 30,\r\n },\r\n });\r\n makeObservable(this);\r\n this.homeViewStore = homeViewStore;\r\n this.routeStore = this.homeViewStore.routeStore;\r\n\r\n this.setGridStore(\r\n new MrbGridViewStore(this.rootStore, this.queryUtility, {\r\n onCellClick: (item) => this.onClickCellItem(item),\r\n generateKey: (item) => item.stationId || item.podcastId,\r\n mapper: (item) => {\r\n return {\r\n ...item,\r\n coverImageUrl: this.createCoverImageUrl(item),\r\n };\r\n },\r\n })\r\n );\r\n\r\n this.orderBySelectStore = new MrbSimpleSelectStore(\r\n {\r\n textKey: \"label\",\r\n valueKey: \"value\",\r\n actions: {\r\n onChange: (selectedOrder) => {\r\n if (this.queryUtility.filter.orderBy !== selectedOrder.value) {\r\n if (selectedOrder.value === \"-1\") {\r\n this.queryUtility.filter.orderBy = null;\r\n this.queryUtility.filter.orderDirection = null;\r\n } else {\r\n this.queryUtility.filter.orderBy = selectedOrder.value;\r\n if (selectedOrder.value === \"title\") {\r\n this.queryUtility.filter.orderDirection = \"asc\";\r\n } else {\r\n this.queryUtility.filter.orderDirection = \"desc\";\r\n }\r\n }\r\n this.queryUtility.fetch();\r\n }\r\n },\r\n },\r\n },\r\n this.orderOptions\r\n );\r\n\r\n this.genreSelectStore = new MrbQuerySelectStore(\r\n {\r\n isSearchable: true,\r\n textKey: \"name\",\r\n valueKey: \"id\",\r\n initFetch: false,\r\n actions: {\r\n find: (searchTerm) => {\r\n return this.routeStore.findGenres(searchTerm);\r\n },\r\n },\r\n },\r\n this.queryUtility,\r\n \"genreId\"\r\n );\r\n\r\n this.initializeSortingDefault();\r\n\r\n this.reaction(\r\n () => (this.queryUtility.filter.search || \"\").trim(),\r\n (searchPhrase) => {\r\n if (searchPhrase) {\r\n this.queryUtility.fetch();\r\n } else {\r\n this.reset();\r\n }\r\n },\r\n {\r\n delay: 300,\r\n }\r\n );\r\n\r\n this.reaction(\r\n () => ({\r\n groups: this.podcastGroups,\r\n container: this.appearsInContainerRef,\r\n }),\r\n (context) => {\r\n if (context.container) {\r\n setTimeout(() => {\r\n runInAction(() => {\r\n this.isAppearsInScrollable = context.container.scrollWidth > context.container.clientWidth;\r\n });\r\n });\r\n }\r\n }\r\n );\r\n }\r\n\r\n async fetchResources(filter) {\r\n if (filter.search) {\r\n this.abortExistingRequest();\r\n this.setShowSearchView(true);\r\n let delay = null;\r\n if (this._isInitialLoad) {\r\n delay = 0;\r\n }\r\n this.gridStore.suspend(delay);\r\n filter.contentType = this.homeViewStore.queryUtility.filter.contentType;\r\n try {\r\n const response = await this.find(filter);\r\n runInAction(() => {\r\n this.gridStore.setData(response);\r\n this.setPodcastGroups(response);\r\n this.gridStore.resume();\r\n });\r\n } catch (err) {\r\n runInAction(() => {\r\n this.gridStore.resume();\r\n });\r\n this.onFetchError(err);\r\n } finally {\r\n this._isInitialLoad = false;\r\n }\r\n } else {\r\n this.reset();\r\n }\r\n }\r\n\r\n @action.bound\r\n setPodcastGroups(response) {\r\n const data = response.item ? response.item : response;\r\n const podcastGroups = map(\r\n uniqBy(\r\n filter(data, (item) => !isNil(item.parentPodcastId)),\r\n \"parentPodcastId\"\r\n ),\r\n (item) => {\r\n return {\r\n podcastId: item.parentPodcastId,\r\n title: item.parentPodcastTitle,\r\n isParentPodcastPremium: item.isParentPodcastPremium,\r\n coverImageUrl: this.createPodcastGroupCoverImageUrl(item.parentPodcastCoverImageId),\r\n };\r\n }\r\n );\r\n this.podcastGroups = podcastGroups;\r\n }\r\n\r\n initializeSortingDefault() {\r\n if (this.queryUtility.filter.orderBy) {\r\n this.orderBySelectStore.setSelectedItem(\r\n find(this.orderOptions, (orderOption) => orderOption.value === this.queryUtility.filter.orderBy)\r\n );\r\n } else {\r\n this.orderBySelectStore.setSelectedItem(this.orderOptions[0]);\r\n }\r\n }\r\n\r\n find(params) {\r\n this._abortController = new AbortController();\r\n return this.routeStore.genericSearch(params, this._abortController);\r\n }\r\n\r\n onClickCellItem = (item) => {\r\n if (item.stationId) {\r\n this.rootStore.routerStore.goTo(\"master.application.home.station\", {\r\n id: item.stationId,\r\n });\r\n } else if (item.podcastId) {\r\n if (item.podcastType === podcastType.podcast) {\r\n if (item.podcastContentType === podcastContentType.torahAnytime) {\r\n this.rootStore.routerStore.goTo(\"master.application.home.torah-anytime\", { id: item.podcastId });\r\n } else if (!isNil(item.parentPodcastId)) {\r\n this.rootStore.routerStore.goTo(\r\n \"master.application.home.podcast-group\",\r\n {\r\n id: item.parentPodcastId,\r\n },\r\n { subPodcastId: item.podcastId }\r\n );\r\n } else {\r\n this.rootStore.routerStore.goTo(\"master.application.home.podcast\", {\r\n id: item.podcastId,\r\n });\r\n }\r\n } else {\r\n this.rootStore.routerStore.goTo(\"master.application.home.podcast-group\", {\r\n id: item.podcastId,\r\n });\r\n }\r\n }\r\n };\r\n\r\n createPodcastGroupCoverImageUrl(coverImageId) {\r\n if (coverImageId) {\r\n return this.routeStore.createPodcastCoverImageUrl(coverImageId, 200, 200);\r\n }\r\n return null;\r\n }\r\n\r\n createCoverImageUrl(item) {\r\n if (item.coverImageId) {\r\n if (item.stationId) {\r\n return this.routeStore.createStationCoverImageUrl(item.coverImageId, 200, 200);\r\n } else if (item.podcastId) {\r\n return this.routeStore.createPodcastCoverImageUrl(item.coverImageId, 200, 200);\r\n }\r\n }\r\n return null;\r\n }\r\n\r\n onFetchError(error) {\r\n if (error && error.statusCode === httpStatusCodes.CanceledRequest) {\r\n return;\r\n }\r\n this.rootStore.notificationStore.error(\r\n \"Unexpected error occurred while trying to load content. Please contact the support team.\",\r\n error\r\n );\r\n }\r\n\r\n @action.bound\r\n setShowSearchView(value) {\r\n this.showSearchView = value;\r\n }\r\n\r\n @action.bound\r\n reset() {\r\n this.setShowSearchView(false);\r\n this.abortExistingRequest();\r\n this.genreSelectStore.setValue(null);\r\n this.gridStore.setData([]);\r\n this.setPodcastGroups([]);\r\n this._isInitialLoad = true;\r\n }\r\n\r\n @action.bound\r\n scrollFeaturedLeft() {\r\n sideScroll(this.appearsInContainerRef, \"left\", 20, 400, 20);\r\n }\r\n\r\n @action.bound\r\n scrollFeaturedRight() {\r\n sideScroll(this.appearsInContainerRef, \"right\", 20, 400, 20);\r\n }\r\n\r\n abortExistingRequest() {\r\n if (this._abortController) {\r\n this._abortController.abort();\r\n }\r\n }\r\n\r\n onDestroy() {\r\n this.abortExistingRequest();\r\n }\r\n\r\n onClickPodcastGroup = (podcastGroup) => {\r\n this.rootStore.routerStore.goTo(\"master.application.home.podcast-group\", {\r\n id: podcastGroup.podcastId,\r\n });\r\n };\r\n\r\n @action.bound\r\n setAppearsInContainerRef(ref) {\r\n this.appearsInContainerRef = ref;\r\n }\r\n}\r\n\r\nexport default HomeGenericSearchViewStore;\r\n","import { action, computed, makeObservable, observable } from \"mobx\";\r\nimport { forEach } from \"lodash\";\r\n\r\nclass HomeGridItemDecorator {\r\n @observable _isTurnedOn = null;\r\n\r\n constructor(obj) {\r\n makeObservable(this);\r\n forEach(obj, (value, key) => {\r\n if (key === \"isTurnedOn\") {\r\n this.setIsTurnedOn(value);\r\n } else {\r\n this[key] = value;\r\n }\r\n });\r\n }\r\n\r\n @computed get isTurnedOn() {\r\n return this._isTurnedOn;\r\n }\r\n\r\n set isTurnedOn(value) {\r\n this.setIsTurnedOn(value);\r\n }\r\n\r\n @action.bound\r\n setIsTurnedOn(isTurnedOn) {\r\n this._isTurnedOn = isTurnedOn;\r\n }\r\n}\r\n\r\nexport default HomeGridItemDecorator;\r\n","import { action, computed, observable, makeObservable, runInAction } from \"mobx\";\r\nimport { MrbBaseViewStore } from \"mrb/core/stores\";\r\nimport { sideScroll } from \"common/utils\";\r\nimport { podcastType, podcastContentType } from \"common/constants\";\r\nimport { map, find } from \"lodash\";\r\nimport { HomeGridItemDecorator } from \"application/home/models\";\r\nimport { UpdatePodcastStatusOptions, UpdateStationStatusOptions } from \"application/common/models\";\r\n\r\nclass HomeFeaturedContentViewStore extends MrbBaseViewStore {\r\n @observable.ref items = [];\r\n @observable isFeaturedScrollable = false;\r\n @observable.ref featuredContainerRef = null;\r\n\r\n @computed get selectedDevice() {\r\n return this.rootStore.userDeviceStore.selectedDevice;\r\n }\r\n\r\n constructor(rootStore, homeViewStore) {\r\n super(rootStore);\r\n makeObservable(this);\r\n this.homeViewStore = homeViewStore;\r\n this.routeStore = homeViewStore.routeStore;\r\n\r\n this.reaction(\r\n () => ({\r\n groups: this.items,\r\n container: this.featuredContainerRef,\r\n }),\r\n (context) => {\r\n if (context.container) {\r\n setTimeout(() => {\r\n runInAction(() => {\r\n this.isFeaturedScrollable = context.container.scrollWidth > context.container.clientWidth;\r\n });\r\n });\r\n }\r\n }\r\n );\r\n\r\n this.reaction(\r\n () => ({\r\n deviceId: this.selectedDevice && this.selectedDevice.id,\r\n contentType: this.homeViewStore.queryUtility.filter.contentType,\r\n }),\r\n (context) => {\r\n this.fetchResources(context);\r\n }\r\n );\r\n }\r\n\r\n onInit() {\r\n let deviceId;\r\n if (this.selectedDevice) {\r\n deviceId = this.selectedDevice.id;\r\n }\r\n return this.fetchResources({ deviceId: deviceId });\r\n }\r\n\r\n async fetchResources({ deviceId, contentType }) {\r\n this.loaderStore.suspend();\r\n try {\r\n const items = await this.routeStore.getFeaturedContent(deviceId, contentType);\r\n this.setItems(items);\r\n } catch (err) {\r\n this.rootStore.notificationStore.error(\r\n \"Unexpected error occurred while trying to load featured content. Please contact the support team.\",\r\n err\r\n );\r\n } finally {\r\n this.loaderStore.resume();\r\n }\r\n }\r\n\r\n onClickFeaturedItem = async (item) => {\r\n if (item.podcastId && item.podcastType === podcastType.podcastGroup) {\r\n this.rootStore.routerStore.goTo(\"master.application.home.podcast-group\", {\r\n id: item.podcastId,\r\n });\r\n } else if (item.podcastId && item.podcastContentType === podcastContentType.torahAnytime) {\r\n this.rootStore.routerStore.goTo(\"master.application.home.torah-anytime\", { id: item.podcastId });\r\n } else {\r\n if (item.stationId) {\r\n const contentAccessResult = this.rootStore.contentAccessValidator.canAccessStation({\r\n isPremium: item.isPremium,\r\n isLegacySubscriptionValid: item.validLegacySubscription,\r\n unavailableInMobileApp: item.isVisibleInApp === false,\r\n unavailableInNakiTouch: item.isVisibleInEmbeddedApp === false,\r\n });\r\n if (contentAccessResult.canAccess) {\r\n await this.changeDeviceStationStatus(item);\r\n }\r\n } else if (item.podcastId) {\r\n const contentAccessResult = this.rootStore.contentAccessValidator.canAccessPodcast({\r\n isPremium: item.isPremium,\r\n isLegacySubscriptionValid: item.validLegacySubscription,\r\n unavailableInMobileApp: item.isVisibleInApp === false,\r\n unavailableInNakiTouch: item.isVisibleInEmbeddedApp === false,\r\n });\r\n if (contentAccessResult.canAccess) {\r\n await this.changeDevicePodcastStatus(item);\r\n }\r\n }\r\n }\r\n };\r\n\r\n goTo = (item) => {\r\n if (item.stationId) {\r\n this.rootStore.routerStore.goTo(\"master.application.home.station\", {\r\n id: item.stationId,\r\n });\r\n } else if (item.podcastId) {\r\n if (item.podcastType === podcastType.podcast) {\r\n if (item.podcastContentType === podcastContentType.torahAnytime) {\r\n this.rootStore.routerStore.goTo(\"master.application.home.torah-anytime\", { id: item.podcastId });\r\n } else {\r\n this.rootStore.routerStore.goTo(\"master.application.home.podcast\", {\r\n id: item.podcastId,\r\n });\r\n }\r\n } else {\r\n this.rootStore.routerStore.goTo(\"master.application.home.podcast-group\", {\r\n id: item.podcastId,\r\n });\r\n }\r\n }\r\n };\r\n\r\n async changeDeviceStationStatus(item) {\r\n if (!item.isUpdating) {\r\n try {\r\n item.isUpdating = true;\r\n this.rootStore.mainLoaderStore.suspend();\r\n const newValue = !item.isTurnedOn;\r\n const options = new UpdateStationStatusOptions(\r\n item.stationId,\r\n item.title,\r\n item.isPremium,\r\n item.isVisibleInApp === false,\r\n item.isVisibleInEmbeddedApp === false\r\n );\r\n await this.rootStore.userContentManagerStore.updateStationStatus(options, newValue);\r\n runInAction(() => {\r\n item.isTurnedOn = newValue;\r\n // Since there is a possibility of having the same item twice in the featured list and main list, we need to sync turned on status\r\n this.updateMainViewStationStatus(item.stationId, newValue);\r\n this.resetItems();\r\n });\r\n } catch (err) {\r\n this.rootStore.notificationStore.error(\r\n \"Unexpected error occurred. Please contact the support team.\",\r\n err\r\n );\r\n } finally {\r\n delete item.isUpdating;\r\n this.rootStore.mainLoaderStore.resume();\r\n }\r\n }\r\n }\r\n\r\n async changeDevicePodcastStatus(item) {\r\n if (!item.isUpdating) {\r\n try {\r\n item.isUpdating = true;\r\n this.rootStore.mainLoaderStore.suspend();\r\n const newValue = !item.isTurnedOn;\r\n const options = new UpdatePodcastStatusOptions(\r\n item.podcastId,\r\n item.title,\r\n item.isPremium,\r\n item.isVisibleInApp === false,\r\n item.isVisibleInEmbeddedApp === false\r\n );\r\n await this.rootStore.userContentManagerStore.updatePodcastStatus(options, newValue);\r\n runInAction(() => {\r\n item.isTurnedOn = newValue;\r\n // Since there is a possibility of having the same item twice in the featured list and main list, we need to sync turned on status\r\n this.updateMainViewPodcastStatus(item.podcastId, newValue);\r\n this.resetItems();\r\n });\r\n } catch (err) {\r\n this.rootStore.notificationStore.error(\r\n \"Unexpected error occurred. Please contact the support team.\",\r\n err\r\n );\r\n } finally {\r\n delete item.isUpdating;\r\n this.rootStore.mainLoaderStore.resume();\r\n }\r\n }\r\n }\r\n\r\n @action.bound\r\n updateMainViewStationStatus(stationId, isTurnedOn) {\r\n const item = find(this.homeViewStore.gridStore.data, (x) => x.stationId === stationId);\r\n if (item) {\r\n item.isTurnedOn = isTurnedOn;\r\n }\r\n }\r\n\r\n @action.bound\r\n updateMainViewPodcastStatus(podcastId, isTurnedOn) {\r\n const item = find(this.homeViewStore.gridStore.data, (x) => x.podcastId === podcastId);\r\n if (item) {\r\n item.isTurnedOn = isTurnedOn;\r\n }\r\n }\r\n\r\n @action.bound\r\n resetItems() {\r\n this.items = [...this.items];\r\n }\r\n\r\n createCoverImageUrl(item) {\r\n if (item.coverImageId) {\r\n if (item.stationId) {\r\n return this.routeStore.createStationCoverImageUrl(item.coverImageId, 200, 200);\r\n } else if (item.podcastId) {\r\n return this.routeStore.createPodcastCoverImageUrl(item.coverImageId, 200, 200);\r\n }\r\n }\r\n return null;\r\n }\r\n\r\n @action.bound\r\n setItems(items) {\r\n this.items = map(items, (item) => {\r\n return new HomeGridItemDecorator({\r\n ...item,\r\n coverImageUrl: this.createCoverImageUrl(item),\r\n });\r\n });\r\n }\r\n\r\n @action.bound\r\n setFeaturedContainerRef(ref) {\r\n this.featuredContainerRef = ref;\r\n }\r\n\r\n @action.bound\r\n scrollFeaturedLeft() {\r\n sideScroll(this.featuredContainerRef, \"left\", 20, 400, 20);\r\n }\r\n\r\n @action.bound\r\n scrollFeaturedRight() {\r\n sideScroll(this.featuredContainerRef, \"right\", 20, 400, 20);\r\n }\r\n}\r\n\r\nexport default HomeFeaturedContentViewStore;\r\n","import { MrbBaseRouteStore } from \"mrb/core\";\r\nimport {\r\n UserContentService,\r\n StationFileStreamService,\r\n PodcastFileStreamService,\r\n GenreLookupService,\r\n} from \"common/services\";\r\nimport { createBaasicAuthenticatedMediaVaultUrl } from \"mrb/baasic\";\r\n\r\nclass HomeRouteStore extends MrbBaseRouteStore {\r\n constructor(rootStore) {\r\n super(rootStore);\r\n\r\n this.service = this.rootStore.createApplicationService(UserContentService);\r\n this.podcastFileStreamService = this.rootStore.createApplicationService(PodcastFileStreamService);\r\n this.stationFileStreamService = this.rootStore.createApplicationService(StationFileStreamService);\r\n this.genreLookupService = this.rootStore.createApplicationService(GenreLookupService);\r\n }\r\n\r\n async getFeaturedContent(deviceId, contentType) {\r\n const response = await this.service.getFeaturedContent(deviceId, contentType);\r\n return response.data;\r\n }\r\n\r\n async genericSearch(params, abortController) {\r\n const response = await this.service.genericSearch(params, abortController);\r\n return response.data;\r\n }\r\n\r\n async findUserContent(params) {\r\n const response = await this.service.find(params);\r\n return response.data;\r\n }\r\n\r\n async findGenres(searchPhrase) {\r\n const response = await this.genreLookupService.find(searchPhrase);\r\n return response.data;\r\n }\r\n\r\n createStationCoverImageUrl(coverImageId, width = null, height = null) {\r\n return createBaasicAuthenticatedMediaVaultUrl(\r\n this.rootStore,\r\n this.stationFileStreamService.routeService.get(coverImageId),\r\n {\r\n width: width,\r\n height: height,\r\n }\r\n );\r\n }\r\n\r\n createPodcastCoverImageUrl(coverImageId, width = null, height = null) {\r\n return createBaasicAuthenticatedMediaVaultUrl(\r\n this.rootStore,\r\n this.podcastFileStreamService.routeService.get(coverImageId),\r\n {\r\n width: width,\r\n height: height,\r\n }\r\n );\r\n }\r\n}\r\n\r\nexport default HomeRouteStore;\r\n","import { action, computed, makeObservable, runInAction } from \"mobx\";\r\nimport { MrbBaseListViewStore } from \"mrb/core\";\r\nimport { MrbInfiniteScrollGridViewStore } from \"mrb/components/infinite-scroll-grid\";\r\nimport { MrbSimpleSelectStore, MrbQuerySimpleSelectStore } from \"mrb/components/select\";\r\nimport { MrbModalParams } from \"mrb/common/models\";\r\nimport { HomeContentFilter } from \"application/home/filters\";\r\nimport {\r\n HomeGenericSearchViewStore,\r\n HomeFeaturedContentViewStore,\r\n HomeManageSelectedItemsViewStore,\r\n} from \"application/home/stores\";\r\nimport { UpdatePodcastStatusOptions, UpdateStationStatusOptions } from \"application/common/models\";\r\nimport { HomeGridItemDecorator } from \"application/home/models\";\r\nimport { podcastType, podcastContentType } from \"common/constants\";\r\nimport { calculateNumberOfColumns, calculateNumberOfRows } from \"common/utils\";\r\nimport { find, isNil, intersectionWith } from \"lodash\";\r\n\r\nclass HomeViewStore extends MrbBaseListViewStore {\r\n @computed get selectedDevice() {\r\n return this.rootStore.userDeviceStore.selectedDevice;\r\n }\r\n\r\n @computed get inSearchMode() {\r\n return this.homeGenericSearchViewStore.showSearchView;\r\n }\r\n\r\n @computed get anyDevice() {\r\n return this.rootStore.userDeviceStore.devices.length > 0;\r\n }\r\n\r\n @computed get selectedPremiumDisabledOption() {\r\n if (!isNil(this.queryUtility.filter.isEnabled)) {\r\n return this.queryUtility.filter.isEnabled ? 2 : 3;\r\n } else if (!isNil(this.queryUtility.filter.isPremium)) {\r\n return 1;\r\n }\r\n return 0;\r\n }\r\n\r\n contentTypeOptions = [\r\n {\r\n label: \"APPLICATION.HOME.LIST.FILTER.ALL\",\r\n value: 0,\r\n },\r\n {\r\n label: \"APPLICATION.HOME.LIST.FILTER.STATIONS\",\r\n value: 1,\r\n },\r\n {\r\n label: \"APPLICATION.HOME.LIST.FILTER.PODCASTS\",\r\n value: 2,\r\n },\r\n ];\r\n\r\n premiumDisabledOptions = [\r\n {\r\n label: \"APPLICATION.HOME.LIST.FILTER.ALL\",\r\n value: 0,\r\n },\r\n {\r\n label: \"APPLICATION.HOME.LIST.FILTER.PREMIUM\",\r\n value: 1,\r\n },\r\n {\r\n label: \"APPLICATION.HOME.LIST.FILTER.ENABLED\",\r\n value: 2,\r\n },\r\n {\r\n label: \"APPLICATION.HOME.LIST.FILTER.DISABLED\",\r\n value: 3,\r\n },\r\n ];\r\n\r\n orderOptions = [\r\n {\r\n label: \"APPLICATION.HOME.LIST.ORDER.ALPHABETICALY_OPTION\",\r\n value: \"title\",\r\n },\r\n {\r\n label: \"APPLICATION.HOME.LIST.ORDER.RECENTLY_ADDED_OPTION\",\r\n value: \"dateCreated\",\r\n },\r\n ];\r\n\r\n constructor(rootStore, { routeStore }) {\r\n const pageSize = calculateNumberOfColumns(window.innerWidth) * calculateNumberOfRows(window.innerWidth);\r\n super(rootStore, {\r\n queryConfig: {\r\n filter: new HomeContentFilter(),\r\n orderBy: \"title\",\r\n orderDirection: \"asc\",\r\n pageSize: pageSize,\r\n queryParamMap: {\r\n page: {\r\n toQuery: () => 1,\r\n },\r\n },\r\n },\r\n });\r\n\r\n makeObservable(this);\r\n this.routeStore = routeStore;\r\n this.homeGenericSearchViewStore = new HomeGenericSearchViewStore(this.rootStore, this);\r\n this.homeFeaturedContentViewStore = new HomeFeaturedContentViewStore(this.rootStore, this);\r\n this.homeManageSelectedItemsViewStore = new HomeManageSelectedItemsViewStore(this.rootStore, this);\r\n this.connectDeviceModal = new MrbModalParams(\r\n {\r\n onClose: () => this.rootStore.userStore.disableConnectDeviceMessage(),\r\n },\r\n {\r\n goToConnectDevice: this.goToConnectDevice,\r\n }\r\n );\r\n\r\n this.setGridStore(\r\n new MrbInfiniteScrollGridViewStore(this.rootStore, this.queryUtility, {\r\n onCellClick: (item) => this.onClickCellItem(item),\r\n generateKey: (item) => item.stationId || item.podcastId,\r\n mapper: (item) => {\r\n return new HomeGridItemDecorator({\r\n ...item,\r\n coverImageUrl: this.createCoverImageUrl(item),\r\n });\r\n },\r\n })\r\n );\r\n\r\n this.deviceSelectStore = new MrbSimpleSelectStore(\r\n {\r\n textKey: \"deviceName\",\r\n valueKey: \"id\",\r\n actions: {\r\n onChange: (option) => {\r\n this.rootStore.userDeviceStore.setSelectedDevice(option.item);\r\n },\r\n },\r\n },\r\n this.rootStore.userDeviceStore.devices\r\n );\r\n this.deviceSelectStore.setSelectedItem(this.selectedDevice);\r\n\r\n this.orderBySelectStore = new MrbQuerySimpleSelectStore(\r\n {\r\n textKey: \"label\",\r\n valueKey: \"value\",\r\n actions: {\r\n onChange: (selectedOrder) => {\r\n if (selectedOrder.value === \"title\") {\r\n this.queryUtility.filter.orderDirection = \"asc\";\r\n } else {\r\n this.queryUtility.filter.orderDirection = \"desc\";\r\n }\r\n },\r\n },\r\n },\r\n this.queryUtility,\r\n \"orderBy\",\r\n this.orderOptions\r\n );\r\n\r\n this.reaction(\r\n () => this.selectedDevice,\r\n () => {\r\n if (!this.inSearchMode) {\r\n this.queryUtility.fetch();\r\n }\r\n }\r\n );\r\n\r\n this.reaction(\r\n () => this.inSearchMode,\r\n (inSearchMode) => {\r\n if (!inSearchMode) {\r\n this.queryUtility.fetch();\r\n }\r\n }\r\n );\r\n\r\n this.changeDeviceStationStatus = this.changeDeviceStationStatus.bind(this);\r\n this.changeDevicePodcastStatus = this.changeDevicePodcastStatus.bind(this);\r\n }\r\n\r\n onClickCellItem = async (item) => {\r\n if (item.podcastId && item.podcastType === podcastType.podcastGroup) {\r\n this.rootStore.routerStore.goTo(\"master.application.home.podcast-group\", {\r\n id: item.podcastId,\r\n });\r\n } else if (item.podcastId && item.podcastContentType === podcastContentType.torahAnytime) {\r\n this.rootStore.routerStore.goTo(\"master.application.home.torah-anytime\", { id: item.podcastId });\r\n } else {\r\n if (item.stationId) {\r\n const contentAccessResult = this.rootStore.contentAccessValidator.canAccessStation({\r\n isPremium: item.isPremium,\r\n isLegacySubscriptionValid: item.validLegacySubscription,\r\n unavailableInMobileApp: item.isVisibleInApp === false,\r\n unavailableInNakiTouch: item.isVisibleInEmbeddedApp === false,\r\n });\r\n if (contentAccessResult.canAccess) {\r\n await this.changeDeviceStationStatus(item);\r\n }\r\n } else if (item.podcastId) {\r\n const contentAccessResult = this.rootStore.contentAccessValidator.canAccessPodcast({\r\n isPremium: item.isPremium,\r\n isLegacySubscriptionValid: item.validLegacySubscription,\r\n unavailableInMobileApp: item.isVisibleInApp === false,\r\n unavailableInNakiTouch: item.isVisibleInEmbeddedApp === false,\r\n });\r\n if (contentAccessResult.canAccess) {\r\n await this.changeDevicePodcastStatus(item);\r\n }\r\n }\r\n }\r\n };\r\n\r\n async changeDeviceStationStatus(item) {\r\n if (!item.isUpdating) {\r\n try {\r\n item.isUpdating = true;\r\n this.rootStore.mainLoaderStore.suspend();\r\n const newValue = !item.isTurnedOn;\r\n const options = new UpdateStationStatusOptions(\r\n item.stationId,\r\n item.title,\r\n item.isPremium,\r\n item.isVisibleInApp === false\r\n );\r\n await this.rootStore.userContentManagerStore.updateStationStatus(options, newValue);\r\n runInAction(() => {\r\n item.isTurnedOn = newValue;\r\n this.updateFeaturedListStationStatus(item.stationId, newValue);\r\n });\r\n } catch (err) {\r\n this.rootStore.notificationStore.error(\r\n \"Unexpected error occurred. Please contact the support team.\",\r\n err\r\n );\r\n } finally {\r\n delete item.isUpdating;\r\n this.rootStore.mainLoaderStore.resume();\r\n }\r\n }\r\n }\r\n\r\n async changeDevicePodcastStatus(item) {\r\n if (!item.isUpdating) {\r\n try {\r\n item.isUpdating = true;\r\n this.rootStore.mainLoaderStore.suspend();\r\n const newValue = !item.isTurnedOn;\r\n const options = new UpdatePodcastStatusOptions(\r\n item.podcastId,\r\n item.title,\r\n item.isPremium,\r\n item.isVisibleInApp === false\r\n );\r\n await this.rootStore.userContentManagerStore.updatePodcastStatus(options, newValue);\r\n runInAction(() => {\r\n item.isTurnedOn = newValue;\r\n this.updateFeaturedListPodcastStatus(item.podcastId, newValue);\r\n });\r\n } catch (err) {\r\n this.rootStore.notificationStore.error(\r\n \"Unexpected error occurred. Please contact the support team.\",\r\n err\r\n );\r\n } finally {\r\n delete item.isUpdating;\r\n this.rootStore.mainLoaderStore.resume();\r\n }\r\n }\r\n }\r\n\r\n @action.bound\r\n changeDeviceSelectedItemsStatus(selectedItems, value) {\r\n let items = intersectionWith(this.gridStore.data, selectedItems, (item, selectedItem) => {\r\n return item.stationId === selectedItem.stationId && item.podcastId === selectedItem.podcastId;\r\n });\r\n items.forEach((item) => {\r\n item.isTurnedOn = value;\r\n });\r\n let featuredItems = intersectionWith(\r\n this.homeFeaturedContentViewStore.items,\r\n selectedItems,\r\n (item, selectedItem) => {\r\n return item.stationId === selectedItem.stationId && item.podcastId === selectedItem.podcastId;\r\n }\r\n );\r\n featuredItems.forEach((item) => {\r\n item.isTurnedOn = value;\r\n });\r\n }\r\n\r\n goToConnectDevice = () => {\r\n this.rootStore.routerStore.goTo(\"master.application.device.create\");\r\n };\r\n\r\n goTo = (item) => {\r\n if (item.stationId) {\r\n this.rootStore.routerStore.goTo(\"master.application.home.station\", {\r\n id: item.stationId,\r\n });\r\n } else if (item.podcastId) {\r\n if (item.podcastType === podcastType.podcast) {\r\n if (item.podcastContentType === podcastContentType.torahAnytime) {\r\n this.rootStore.routerStore.goTo(\"master.application.home.torah-anytime\", { id: item.podcastId });\r\n } else {\r\n this.rootStore.routerStore.goTo(\"master.application.home.podcast\", {\r\n id: item.podcastId,\r\n });\r\n }\r\n } else {\r\n this.rootStore.routerStore.goTo(\"master.application.home.podcast-group\", {\r\n id: item.podcastId,\r\n });\r\n }\r\n }\r\n };\r\n\r\n onInit() {\r\n if (!this.anyDevice && this.rootStore.userStore.isConnectDeviceMessageVisible) {\r\n this.connectDeviceModal.open();\r\n }\r\n return Promise.all([this.homeFeaturedContentViewStore.onInit(), this.queryUtility.initialize()]);\r\n }\r\n\r\n find(params) {\r\n if (this.selectedDevice) {\r\n params.deviceId = this.selectedDevice.id;\r\n }\r\n return this.routeStore.findUserContent(params);\r\n }\r\n\r\n async fetchResources(filter) {\r\n // Display grid (Skeleton loader) only during the first page load, and in other cases, during loading more data on scroll event,\r\n // display only top bar loader (mainLoaderStore)\r\n const isFirstPageLoad = filter.pageNumber === 1;\r\n if (isFirstPageLoad) {\r\n this.gridStore.suspend();\r\n } else {\r\n this.rootStore.mainLoaderStore.suspend();\r\n }\r\n try {\r\n const response = await this.find(filter);\r\n runInAction(() => {\r\n this.gridStore.setData(response);\r\n if (isFirstPageLoad) {\r\n this.gridStore.resume();\r\n } else {\r\n this.rootStore.mainLoaderStore.resume();\r\n }\r\n });\r\n } catch (err) {\r\n if (isFirstPageLoad) {\r\n this.gridStore.resume();\r\n } else {\r\n this.rootStore.mainLoaderStore.resume();\r\n }\r\n this.onFetchError(err);\r\n }\r\n }\r\n\r\n onFetchError(error) {\r\n this.rootStore.notificationStore.error(\r\n \"Unexpected error occurred while trying to load content. Please contact the support team.\",\r\n error\r\n );\r\n }\r\n\r\n createCoverImageUrl(item) {\r\n if (item.coverImageId) {\r\n if (item.stationId) {\r\n return this.routeStore.createStationCoverImageUrl(item.coverImageId, 200, 200);\r\n } else if (item.podcastId) {\r\n return this.routeStore.createPodcastCoverImageUrl(item.coverImageId, 200, 200);\r\n }\r\n }\r\n return null;\r\n }\r\n\r\n @action.bound\r\n changeContentTypeFilter(value) {\r\n this.queryUtility.filter.set(\"contentType\", value);\r\n if (this.inSearchMode) {\r\n this.homeGenericSearchViewStore.queryUtility.fetch();\r\n } else {\r\n this.queryUtility.fetch();\r\n }\r\n }\r\n\r\n @action.bound\r\n changePremiumDisabledFilter(value) {\r\n if (value === 0) {\r\n this.queryUtility.filter.set(\"isEnabled\", null);\r\n this.queryUtility.filter.set(\"isPremium\", null);\r\n } else if (value === 1) {\r\n this.queryUtility.filter.set(\"isEnabled\", null);\r\n this.queryUtility.filter.set(\"isPremium\", true);\r\n } else if (value === 2) {\r\n this.queryUtility.filter.set(\"isEnabled\", true);\r\n this.queryUtility.filter.set(\"isPremium\", null);\r\n } else if (value === 3) {\r\n this.queryUtility.filter.set(\"isEnabled\", false);\r\n this.queryUtility.filter.set(\"isPremium\", null);\r\n }\r\n this.queryUtility.fetch();\r\n }\r\n\r\n @action.bound\r\n updateFeaturedListStationStatus(stationId, isTurnedOn) {\r\n const item = find(this.homeFeaturedContentViewStore.items, (x) => x.stationId === stationId);\r\n if (item) {\r\n item.isTurnedOn = isTurnedOn;\r\n }\r\n }\r\n\r\n @action.bound\r\n updateFeaturedListPodcastStatus(podcastId, isTurnedOn) {\r\n const item = find(this.homeFeaturedContentViewStore.items, (x) => x.podcastId === podcastId);\r\n if (item) {\r\n item.isTurnedOn = isTurnedOn;\r\n }\r\n }\r\n\r\n onDestroy() {\r\n this.homeGenericSearchViewStore.destroy();\r\n this.homeFeaturedContentViewStore.destroy();\r\n this.homeManageSelectedItemsViewStore.destroy();\r\n }\r\n}\r\n\r\nexport default HomeViewStore;\r\n","import { action, computed, observable, makeObservable } from \"mobx\";\r\nimport { MrbBasePreviewViewStore } from \"mrb/core\";\r\nimport { MrbSimpleSelectStore } from \"mrb/components/select\";\r\nimport { MrbLoaderStore } from \"mrb/components/loader\";\r\nimport { nakiRadioSystemTypes } from \"common/constants\";\r\nimport { isNil } from \"lodash\";\r\n\r\nclass BaseHomePreviewViewStore extends MrbBasePreviewViewStore {\r\n @observable.ref statusItem = null;\r\n @observable updatingStatus = false;\r\n\r\n @computed get contentAccessResult() {\r\n return this.evaluateContentAccess(this.item);\r\n }\r\n\r\n @computed get isTurnedOn() {\r\n if (!isNil(this.statusItem)) {\r\n return this.statusItem.isTurnedOn;\r\n } else if (!isNil(this.item)) {\r\n const selectedDevice = this.rootStore.userDeviceStore.selectedDevice;\r\n if (selectedDevice && selectedDevice.device && selectedDevice.device.systemType) {\r\n switch (selectedDevice.device.systemType.abrv) {\r\n case nakiRadioSystemTypes.venice:\r\n return this.item.isTurnedOnByDefault;\r\n case nakiRadioSystemTypes.mobile:\r\n return this.item.isTurnedOnByDefaultInApp;\r\n default:\r\n break;\r\n }\r\n }\r\n }\r\n return false;\r\n }\r\n\r\n constructor(rootStore, params) {\r\n super(rootStore, params);\r\n makeObservable(this);\r\n\r\n this.statusToggleLoader = new MrbLoaderStore();\r\n\r\n this.deviceSelectStore = new MrbSimpleSelectStore(\r\n {\r\n textKey: \"deviceName\",\r\n valueKey: \"id\",\r\n actions: {\r\n onChange: (option) => {\r\n this.rootStore.userDeviceStore.setSelectedDevice(option.item);\r\n },\r\n },\r\n },\r\n this.rootStore.userDeviceStore.devices\r\n );\r\n this.deviceSelectStore.setSelectedItem(this.rootStore.userDeviceStore.selectedDevice);\r\n\r\n this.reaction(\r\n () => this.rootStore.userDeviceStore.selectedDevice,\r\n (device) => {\r\n this.getStatusItemResource(device.id, this.id);\r\n }\r\n );\r\n }\r\n\r\n async getStatusItemResource(deviceId, stationId) {\r\n try {\r\n this.statusToggleLoader.suspend();\r\n this.rootStore.mainLoaderStore.suspend();\r\n const statusItem = await this.getStatusItem(deviceId, stationId);\r\n this.setStatusItem(statusItem);\r\n } catch (err) {\r\n } finally {\r\n this.statusToggleLoader.resume();\r\n this.rootStore.mainLoaderStore.resume();\r\n }\r\n }\r\n\r\n getStatusItem(deviceId, resourceId) {\r\n throw new Error(\"Method not implemented.\");\r\n }\r\n\r\n @action.bound\r\n setStatusItem(statusItem) {\r\n this.statusItem = statusItem;\r\n }\r\n\r\n @action.bound\r\n setUpdatingStatus(value) {\r\n this.updatingStatus = value;\r\n }\r\n\r\n goBack = () => {\r\n this.rootStore.routerStore.goBack();\r\n };\r\n\r\n evaluateContentAccess(item) {\r\n throw new Error(\"Method not implemented.\");\r\n }\r\n}\r\n\r\nexport default BaseHomePreviewViewStore;\r\n","import { MrbBaseRouteStore } from \"mrb/core\";\r\nimport { StationFileStreamService, UserContentService } from \"common/services\";\r\nimport { createBaasicAuthenticatedMediaVaultUrl } from \"mrb/baasic\";\r\n\r\nclass HomeStationRouteStore extends MrbBaseRouteStore {\r\n constructor(rootStore) {\r\n super(rootStore);\r\n\r\n this.stationFileStreamService = this.rootStore.createApplicationService(StationFileStreamService);\r\n this.userContentService = this.rootStore.createApplicationService(UserContentService);\r\n }\r\n\r\n async getStationWthDeviceSettings(stationId, deviceId) {\r\n const response = await this.userContentService.getStationWthDeviceSettings(stationId, deviceId, {\r\n embed: \"location,language\",\r\n });\r\n return response.data;\r\n }\r\n\r\n async getStation(stationId) {\r\n const response = await this.userContentService.getStation(stationId, {\r\n embed: \"location,language\",\r\n });\r\n return response.data;\r\n }\r\n\r\n createStationCoverImageUrl(coverImageId, width = null, height = null) {\r\n return createBaasicAuthenticatedMediaVaultUrl(\r\n this.rootStore,\r\n this.stationFileStreamService.routeService.get(coverImageId),\r\n {\r\n width: width,\r\n height: height,\r\n }\r\n );\r\n }\r\n\r\n async getUserDeviceStation(deviceId, stationId) {\r\n const response = await this.userContentService.getUserDeviceStation(deviceId, stationId);\r\n return response.data;\r\n }\r\n}\r\n\r\nexport default HomeStationRouteStore;\r\n","import { action, computed, makeObservable } from \"mobx\";\r\nimport { BaseHomePreviewViewStore } from \"application/home/stores\";\r\nimport { UpdateStationStatusOptions } from \"application/common/models\";\r\nimport { isNil } from \"lodash\";\r\n\r\nclass HomeStationViewStore extends BaseHomePreviewViewStore {\r\n @computed get coverImageUrl() {\r\n if (this.item && this.item.coverImageId) {\r\n return this.routeStore.createStationCoverImageUrl(this.item.coverImageId, 200, 200);\r\n }\r\n\r\n return null;\r\n }\r\n\r\n constructor(rootStore, { routeStore }) {\r\n const id = rootStore.routerStore.routerState.params.id;\r\n super(rootStore, {\r\n id: id,\r\n navigateBack: \"master.application.home.list\",\r\n });\r\n makeObservable(this);\r\n this.routeStore = routeStore;\r\n }\r\n\r\n async get(id) {\r\n if (this.rootStore.userDeviceStore.selectedDevice) {\r\n return this.routeStore.getStationWthDeviceSettings(id, this.rootStore.userDeviceStore.selectedDevice.id);\r\n } else {\r\n return this.routeStore.getStation(id);\r\n }\r\n }\r\n\r\n setItem(item) {\r\n super.setItem(item);\r\n this.setStatusItem(item.userDeviceStation);\r\n }\r\n\r\n @action.bound\r\n async updateTurnedOnStatus(isTurnedOn) {\r\n try {\r\n this.setUpdatingStatus(true);\r\n const options = new UpdateStationStatusOptions(\r\n this.item.id,\r\n this.item.title,\r\n this.item.isPremium,\r\n this.item.isVisibleInApp === false,\r\n this.item.isVisibleInEmbeddedApp === false\r\n );\r\n await this.rootStore.userContentManagerStore.updateStationStatus(options, isTurnedOn);\r\n this.setStatusItem({ isTurnedOn: isTurnedOn });\r\n } catch (err) {\r\n this.rootStore.notificationStore.error(\"Unexpected error occurred. Please contact the support team.\", err);\r\n } finally {\r\n this.setUpdatingStatus(false);\r\n }\r\n }\r\n\r\n getStatusItem(deviceId, resourceId) {\r\n return this.routeStore.getUserDeviceStation(deviceId, resourceId);\r\n }\r\n\r\n evaluateContentAccess(item) {\r\n if (isNil(item)) {\r\n return false;\r\n }\r\n return this.rootStore.contentAccessValidator.canAccessStation({\r\n isPremium: item.isPremium,\r\n isLegacySubscriptionValid: item.validLegacySubscription,\r\n unavailableInMobileApp: item.isVisibleInApp === false,\r\n unavailableInNakiTouch: item.isVisibleInEmbeddedApp === false,\r\n });\r\n }\r\n}\r\n\r\nexport default HomeStationViewStore;\r\n","import { MrbBaseRouteStore } from \"mrb/core\";\r\nimport { PodcastFileStreamService, UserContentService } from \"common/services\";\r\nimport { createBaasicAuthenticatedMediaVaultUrl } from \"mrb/baasic\";\r\n\r\nclass BaseHomePodcastRouteStore extends MrbBaseRouteStore {\r\n constructor(rootStore) {\r\n super(rootStore);\r\n\r\n this.podcastFileStreamService = this.rootStore.createApplicationService(PodcastFileStreamService);\r\n this.userContentService = this.rootStore.createApplicationService(UserContentService);\r\n }\r\n\r\n createPodcastCoverImageUrl(coverImageId, width = null, height = null) {\r\n return createBaasicAuthenticatedMediaVaultUrl(\r\n this.rootStore,\r\n this.podcastFileStreamService.routeService.get(coverImageId),\r\n {\r\n width: width,\r\n height: height,\r\n }\r\n );\r\n }\r\n\r\n async getUserDevicePodcast(deviceId, podcastId) {\r\n const response = await this.userContentService.getUserDevicePodcast(deviceId, podcastId);\r\n return response.data;\r\n }\r\n\r\n async getPodcastGroupUserDevicePodcast(deviceId, podcastId) {\r\n const response = await this.userContentService.getPodcastGroupUserDevicePodcast(deviceId, podcastId);\r\n return response.data;\r\n }\r\n}\r\n\r\nexport default BaseHomePodcastRouteStore;\r\n","import { BaseHomePodcastRouteStore } from \"application/home/stores\";\r\n\r\nclass HomePodcastRouteStore extends BaseHomePodcastRouteStore {\r\n constructor(rootStore) {\r\n super(rootStore);\r\n }\r\n\r\n async getPodcastWthDeviceSettings(podcastId, deviceId) {\r\n const response = await this.userContentService.getPodcastWthDeviceSettings(podcastId, deviceId, {\r\n embed: \"location,language\",\r\n });\r\n return response.data;\r\n }\r\n\r\n async getPodcast(podcastId) {\r\n const response = await this.userContentService.getPodcast(podcastId, {\r\n embed: \"location,language\",\r\n });\r\n return response.data;\r\n }\r\n}\r\n\r\nexport default HomePodcastRouteStore;\r\n","import { BaseHomePodcastRouteStore } from \"application/home/stores\";\r\n\r\nclass HomePodcastGroupRouteStore extends BaseHomePodcastRouteStore {\r\n constructor(rootStore) {\r\n super(rootStore);\r\n }\r\n\r\n async getPodcastGroupWthDeviceSettings(podcastId, deviceId) {\r\n const response = await this.userContentService.getPodcastGroupWthDeviceSettings(podcastId, deviceId, {\r\n embed: \"subPodcasts.location,subPodcasts.language\",\r\n });\r\n return response.data;\r\n }\r\n\r\n async getPodcastGroup(podcastId) {\r\n const response = await this.userContentService.getPodcastGroup(podcastId, {\r\n embed: \"subPodcasts.location,subPodcasts.language\",\r\n });\r\n return response.data;\r\n }\r\n}\r\n\r\nexport default HomePodcastGroupRouteStore;\r\n","import { action, computed, makeObservable } from \"mobx\";\r\nimport { BaseHomePreviewViewStore } from \"application/home/stores\";\r\nimport { UpdatePodcastStatusOptions } from \"application/common/models\";\r\nimport { isNil } from \"lodash\";\r\n\r\nclass BaseHomePodcastViewStore extends BaseHomePreviewViewStore {\r\n @computed get coverImageUrl() {\r\n if (this.item && this.item.coverImageId) {\r\n return this.routeStore.createPodcastCoverImageUrl(this.item.coverImageId, 200, 200);\r\n }\r\n\r\n return null;\r\n }\r\n\r\n constructor(rootStore, { routeStore }) {\r\n const id = rootStore.routerStore.routerState.params.id;\r\n super(rootStore, {\r\n id: id,\r\n navigateBack: \"master.application.home.list\",\r\n });\r\n makeObservable(this);\r\n this.routeStore = routeStore;\r\n }\r\n\r\n async get(id) {\r\n return this.routeStore.getPodcast(id, this.rootStore.userDeviceStore.selectedDevice.id);\r\n }\r\n\r\n setItem(item) {\r\n super.setItem(item);\r\n this.statusItem = item.userDevicePodcast;\r\n }\r\n\r\n @action.bound\r\n async updateTurnedOnStatus(isTurnedOn) {\r\n try {\r\n this.setUpdatingStatus(true);\r\n const options = new UpdatePodcastStatusOptions(\r\n this.item.id,\r\n this.item.title,\r\n this.item.isPremium,\r\n this.item.isVisibleInApp === false,\r\n this.item.isVisibleInEmbeddedApp === false\r\n );\r\n await this.rootStore.userContentManagerStore.updatePodcastStatus(options, isTurnedOn);\r\n this.setStatusItem({ isTurnedOn: isTurnedOn });\r\n } catch (err) {\r\n this.rootStore.notificationStore.error(\"Unexpected error occurred. Please contact the support team.\", err);\r\n } finally {\r\n this.setUpdatingStatus(false);\r\n }\r\n }\r\n\r\n getStatusItem(deviceId, resourceId) {\r\n throw new Error(\"Method not implemented.\");\r\n }\r\n\r\n setStatusItem(statusItem) {\r\n throw new Error(\"Method not implemented.\");\r\n }\r\n\r\n evaluateContentAccess(item) {\r\n if (isNil(item)) {\r\n return false;\r\n }\r\n return this.rootStore.contentAccessValidator.canAccessPodcast({\r\n isPremium: item.isPremium,\r\n isLegacySubscriptionValid: item.validLegacySubscription,\r\n unavailableInMobileApp: item.isVisibleInApp === false,\r\n unavailableInNakiTouch: item.isVisibleInEmbeddedApp === false,\r\n });\r\n }\r\n}\r\n\r\nexport default BaseHomePodcastViewStore;\r\n","import { BaseHomePodcastViewStore } from \"application/home/stores\";\r\n\r\nclass HomePodcastViewStore extends BaseHomePodcastViewStore {\r\n async get(id) {\r\n if (this.rootStore.userDeviceStore.selectedDevice) {\r\n return this.routeStore.getPodcastWthDeviceSettings(id, this.rootStore.userDeviceStore.selectedDevice.id);\r\n }\r\n return this.routeStore.getPodcast(id);\r\n }\r\n\r\n getStatusItem(deviceId, resourceId) {\r\n return this.routeStore.getUserDevicePodcast(deviceId, resourceId);\r\n }\r\n\r\n setStatusItem(statusItem) {\r\n this.statusItem = statusItem;\r\n }\r\n}\r\n\r\nexport default HomePodcastViewStore;\r\n","import { action, override, runInAction } from \"mobx\";\r\nimport { BaseHomePodcastViewStore } from \"application/home/stores\";\r\nimport { UpdatePodcastStatusOptions } from \"application/common/models\";\r\nimport { forEach, find, findIndex } from \"lodash\";\r\n\r\nclass HomePodcastGroupViewStore extends BaseHomePodcastViewStore {\r\n async get(id) {\r\n if (this.rootStore.userDeviceStore.selectedDevice) {\r\n return this.routeStore.getPodcastGroupWthDeviceSettings(\r\n id,\r\n this.rootStore.userDeviceStore.selectedDevice.id\r\n );\r\n }\r\n return this.routeStore.getPodcastGroup(id);\r\n }\r\n\r\n @action.bound\r\n async updateSubPodcastTurnedOnStatus(subPodcast, isTurnedOn) {\r\n try {\r\n this.statusToggleLoader.suspend();\r\n const options = new UpdatePodcastStatusOptions(\r\n subPodcast.id,\r\n subPodcast.title,\r\n subPodcast.isPremium,\r\n subPodcast.isVisibleInApp === false,\r\n subPodcast.isVisibleInEmbeddedApp === false\r\n );\r\n await this.rootStore.userContentManagerStore.updatePodcastStatus(options, isTurnedOn);\r\n runInAction(() => {\r\n const subPodcastIndex = findIndex(this.item.subPodcasts, (item) => item.id === subPodcast.id);\r\n this.item.subPodcasts[subPodcastIndex].userDevicePodcast = { isTurnedOn: isTurnedOn };\r\n });\r\n } catch (err) {\r\n this.rootStore.notificationStore.error(\"Unexpected error occurred. Please contact the support team.\", err);\r\n } finally {\r\n this.statusToggleLoader.resume();\r\n }\r\n }\r\n\r\n getStatusItem(deviceId, resourceId) {\r\n return this.routeStore.getPodcastGroupUserDevicePodcast(deviceId, resourceId);\r\n }\r\n\r\n @override\r\n setStatusItem(statusItem) {\r\n this.statusItem = statusItem.podcastGroup;\r\n forEach(this.item.subPodcasts, (subPodcast) => {\r\n if (statusItem.subPodcasts && statusItem.subPodcasts.length > 0) {\r\n subPodcast.userDevicePodcast = find(statusItem.subPodcasts, (item) => item.podcastId === subPodcast.id);\r\n } else {\r\n subPodcast.userDevicePodcast = null;\r\n }\r\n });\r\n }\r\n}\r\n\r\nexport default HomePodcastGroupViewStore;\r\n","import React from \"react\";\r\nimport { computed, observable, makeObservable, action, runInAction } from \"mobx\";\r\nimport { MrbBaseViewStore } from \"mrb/core\";\r\nimport { nakiRadioSystemTypes } from \"common/constants\";\r\nimport { find, isNil } from \"lodash\";\r\n\r\nclass HomeSubPodcastViewStore extends MrbBaseViewStore {\r\n @observable isCollapsed = false;\r\n @observable isUpdating = false;\r\n\r\n panelRef = React.createRef();\r\n subPodcastId = null;\r\n\r\n @computed get coverImageUrl() {\r\n if (this.subPodcast && this.subPodcast.coverImageId) {\r\n return this.homePodcastViewStore.routeStore.createPodcastCoverImageUrl(\r\n this.subPodcast.coverImageId,\r\n 50,\r\n 50\r\n );\r\n }\r\n\r\n return null;\r\n }\r\n\r\n @computed get isDisabled() {\r\n return this.homePodcastViewStore.updatingStatus || this.isUpdating;\r\n }\r\n\r\n @computed get subPodcast() {\r\n if (this.homePodcastViewStore.item && this.homePodcastViewStore.item.subPodcasts) {\r\n return find(\r\n this.homePodcastViewStore.item.subPodcasts,\r\n (subPodcast) => subPodcast.id === this.subPodcastId\r\n );\r\n }\r\n return null;\r\n }\r\n\r\n @computed get contentAccessResult() {\r\n return this.evaluateContentAccess(this.subPodcast);\r\n }\r\n\r\n @computed get subPodcastStatusItem() {\r\n if (this.subPodcast) {\r\n return this.subPodcast.userDevicePodcast;\r\n }\r\n return null;\r\n }\r\n\r\n @computed get isTurnedOn() {\r\n if (!isNil(this.subPodcastStatusItem)) {\r\n return this.subPodcastStatusItem.isTurnedOn;\r\n } else if (this.subPodcast) {\r\n const selectedDevice = this.rootStore.userDeviceStore.selectedDevice;\r\n if (selectedDevice && selectedDevice.device && selectedDevice.device.systemType) {\r\n switch (selectedDevice.device.systemType.abrv) {\r\n case nakiRadioSystemTypes.venice:\r\n return this.subPodcast.isTurnedOnByDefault;\r\n case nakiRadioSystemTypes.mobile:\r\n return this.subPodcast.isTurnedOnByDefaultInApp;\r\n case nakiRadioSystemTypes.mobile_embedded:\r\n return this.subPodcast.isTurnedOnByDefaultInEmbeddedApp;\r\n default:\r\n break;\r\n }\r\n }\r\n }\r\n return false;\r\n }\r\n\r\n constructor(rootStore, { subPodcastId, homePodcastViewStore }) {\r\n super(rootStore);\r\n makeObservable(this);\r\n this.subPodcastId = subPodcastId;\r\n this.homePodcastViewStore = homePodcastViewStore;\r\n\r\n this.reaction(\r\n () => this.isCollapsed,\r\n (isCollapsed) => {\r\n if (isCollapsed && this.panelRef) {\r\n // We need to execute scroll function asynchronously in order to take effect.\r\n setTimeout(() => {\r\n this.panelRef.scrollIntoView({\r\n behavior: \"smooth\",\r\n block: \"center\",\r\n });\r\n });\r\n }\r\n }\r\n );\r\n }\r\n\r\n initialize() {\r\n const subPodcastId = this.rootStore.routerStore.routerState.queryParams.subPodcastId;\r\n if (subPodcastId && this.subPodcast.id === subPodcastId) {\r\n runInAction(() => {\r\n this.isCollapsed = true;\r\n });\r\n }\r\n return Promise.resolve();\r\n }\r\n\r\n @action.bound\r\n async toggleSubPodcastStatus(isTurnedOn) {\r\n this.isCollapsed = !this.isCollapsed;\r\n\r\n this.setIsUpdating(true);\r\n await this.homePodcastViewStore.updateSubPodcastTurnedOnStatus(this.subPodcast, isTurnedOn);\r\n this.setIsUpdating(false);\r\n }\r\n\r\n @action.bound\r\n setIsUpdating(isUpdating) {\r\n this.isUpdating = isUpdating;\r\n }\r\n\r\n @action.bound\r\n toggleCollapse() {\r\n this.isCollapsed = !this.isCollapsed;\r\n }\r\n\r\n setPanelRef = (ref) => {\r\n this.panelRef = ref;\r\n };\r\n\r\n evaluateContentAccess(item) {\r\n if (isNil(item)) {\r\n return false;\r\n }\r\n return this.rootStore.contentAccessValidator.canAccessPodcast({\r\n isPremium: item.isPremium,\r\n legacySubscriptionExpirationDate: item.legacySubscriptionExpirationDate,\r\n unavailableInMobileApp: item.isVisibleInApp === false,\r\n unavailableInNakiTouch: item.isVisibleInEmbeddedApp === false,\r\n });\r\n }\r\n}\r\n\r\nexport default HomeSubPodcastViewStore;\r\n","import { MrbBaseViewStore } from \"mrb/core\";\r\nimport { observable, makeObservable, action, computed } from \"mobx\";\r\nimport { UpdatePodcastStatusOptions, UpdateStationStatusOptions } from \"application/common/models\";\r\nimport { some, findIndex, pullAt, forEach, isNil } from \"lodash\";\r\nimport { podcastType } from \"common/constants\";\r\n\r\nclass HomeManageSelectedItemsViewStore extends MrbBaseViewStore {\r\n @observable isBulk = false;\r\n @observable isUpdating = false;\r\n @observable selectedItems = [];\r\n\r\n @computed get isSelectedItemsAny() {\r\n return this.selectedItems.length > 0;\r\n }\r\n\r\n constructor(rootStore, homeViewStore) {\r\n super(rootStore);\r\n makeObservable(this);\r\n this.homeViewStore = homeViewStore;\r\n this.routeStore = homeViewStore.routeStore;\r\n this.selectedItems = [];\r\n }\r\n\r\n @action.bound\r\n changeIsBulk() {\r\n if (this.isUpdating) {\r\n return;\r\n }\r\n this.isBulk = !this.isBulk;\r\n if (!this.isBulk) {\r\n this.selectedItems = [];\r\n }\r\n }\r\n\r\n @action.bound\r\n selectItem(item) {\r\n if (this.isUpdating) {\r\n return;\r\n }\r\n let selectedItem = {\r\n stationId: item.stationId,\r\n podcastId: item.podcastId,\r\n title: item.title,\r\n isPremium: item.isPremium,\r\n isVisibleInApp: item.isVisibleInApp,\r\n isVisibleInEmbeddedApp: item.isVisibleInEmbeddedApp,\r\n };\r\n if (!some(this.selectedItems, selectedItem)) {\r\n let contentAccessResult = null;\r\n if (!isNil(item.stationId)) {\r\n contentAccessResult = this.rootStore.contentAccessValidator.canAccessStation({\r\n isPremium: item.isPremium,\r\n isLegacySubscriptionValid: item.validLegacySubscription,\r\n unavailableInMobileApp: item.isVisibleInApp === false,\r\n unavailableInNakiTouch: item.isVisibleInEmbeddedApp === false,\r\n });\r\n } else {\r\n contentAccessResult = this.rootStore.contentAccessValidator.canAccessPodcast({\r\n isPremium: item.isPremium,\r\n isLegacySubscriptionValid: item.validLegacySubscription,\r\n unavailableInMobileApp: item.isVisibleInApp === false,\r\n unavailableInNakiTouch: item.isVisibleInEmbeddedApp === false,\r\n });\r\n }\r\n if (contentAccessResult.canAccess) {\r\n if (item.podcastType !== podcastType.podcastGroup) {\r\n this.selectedItems.push(selectedItem);\r\n }\r\n }\r\n } else {\r\n let indexOfElement = findIndex(\r\n this.selectedItems,\r\n function (o) {\r\n return o.stationId === item.stationId && o.podcastId === item.podcastId;\r\n },\r\n 0\r\n );\r\n pullAt(this.selectedItems, indexOfElement);\r\n }\r\n }\r\n\r\n @action.bound\r\n async changeTurnOn(value) {\r\n const stationOptions = [];\r\n const podcastOptions = [];\r\n forEach(this.selectedItems, function (item) {\r\n if (item.stationId) {\r\n stationOptions.push(\r\n new UpdateStationStatusOptions(\r\n item.stationId,\r\n item.title,\r\n item.isPremium,\r\n item.isVisibleInApp === false,\r\n item.isVisibleInEmbeddedApp === false\r\n )\r\n );\r\n }\r\n if (item.podcastId) {\r\n podcastOptions.push(\r\n new UpdatePodcastStatusOptions(\r\n item.podcastId,\r\n item.title,\r\n item.isPremium,\r\n item.isVisibleInApp === false,\r\n item.isVisibleInEmbeddedApp === false\r\n )\r\n );\r\n }\r\n });\r\n if (!this.isUpdating) {\r\n if (this.selectedItems.length > 0) {\r\n this.setIsUpdating(true);\r\n try {\r\n this.rootStore.mainLoaderStore.suspend();\r\n await this.rootStore.userContentManagerStore.updateStationsAndPodcastsStatus(\r\n stationOptions,\r\n podcastOptions,\r\n value\r\n );\r\n this.homeViewStore.changeDeviceSelectedItemsStatus(this.selectedItems, value);\r\n } catch (err) {\r\n this.rootStore.notificationStore.error(\r\n \"Unexpected error occurred. Please contact the support team.\",\r\n err\r\n );\r\n } finally {\r\n this.setIsUpdating(false);\r\n this.changeIsBulk();\r\n this.rootStore.mainLoaderStore.resume();\r\n }\r\n }\r\n }\r\n }\r\n\r\n @action\r\n setIsUpdating(isUpdating) {\r\n this.isUpdating = isUpdating;\r\n }\r\n}\r\n\r\nexport default HomeManageSelectedItemsViewStore;\r\n","import React, { useState } from \"react\";\r\nimport { PropTypes } from \"prop-types\";\r\nimport { observer } from \"mobx-react\";\r\nimport { isFunction } from \"lodash\";\r\n\r\nfunction MrbFieldLabel({ field, infoRenderer, infoLabelRenderer, t = (i) => i }) {\r\n const [isInfoOpen, setIsInfoOpen] = useState(false);\r\n\r\n const requiredMark =\r\n field.rules && field.rules.indexOf(\"required\") !== -1 ? (\r\n *\r\n ) : null;\r\n\r\n const info = field.extra && field.extra.info;\r\n const infoLabel = field.extra && field.extra.infoLabel;\r\n\r\n return (\r\n \r\n );\r\n}\r\n\r\nMrbFieldLabel.propTypes = {\r\n field: PropTypes.object.isRequired,\r\n infoRenderer: PropTypes.func,\r\n t: PropTypes.func,\r\n};\r\n\r\nexport default observer(MrbFieldLabel);\r\n","import React from \"react\";\r\nimport { PropTypes } from \"prop-types\";\r\n\r\nfunction MrbFieldValidation({ field }) {\r\n return (\r\n \r\n {\" \"}\r\n \r\n {field.errorMessage}\r\n
\r\n );\r\n}\r\n\r\nMrbFieldValidation.propTypes = {\r\n field: PropTypes.object.isRequired,\r\n};\r\n\r\nexport default MrbFieldValidation;\r\n","import React from \"react\";\r\nimport { PropTypes } from \"prop-types\";\r\nimport { MrbFieldLabel, MrbFieldValidation } from \"./\";\r\nimport { isSome, renderIf, mergeOrOverrideCss } from \"../../../../common/utils\";\r\nimport { observer } from \"mobx-react\";\r\n\r\nfunction MrbFieldLayout({\r\n field,\r\n t = (i) => i,\r\n labelRender,\r\n validationRender,\r\n infoRenderer,\r\n infoLabelRenderer,\r\n showLabel = true,\r\n children,\r\n classNameOverride,\r\n classNameExtend,\r\n}) {\r\n return (\r\n\r\n {showLabel && (\r\n \r\n {labelRender ? (\r\n labelRender(field, t)\r\n ) : (\r\n \r\n )}\r\n {renderIf(isSome(field.errorMessage))(\r\n \r\n {validationRender ? validationRender(field) : \r\n )}\r\n {children}\r\n
\r\n );\r\n}\r\n\r\nMrbFieldLayout.propTypes = {\r\n field: PropTypes.object.isRequired,\r\n t: PropTypes.func,\r\n labelRender: PropTypes.func,\r\n validationRender: PropTypes.func,\r\n infoRenderer: PropTypes.func,\r\n infoLabelRenderer: PropTypes.func,\r\n showLabel: PropTypes.bool,\r\n children: PropTypes.any,\r\n classNameOverride: PropTypes.string,\r\n};\r\n\r\nexport default observer(MrbFieldLayout);\r\n","import React from \"react\";\r\nimport { PropTypes } from \"prop-types\";\r\nimport { MrbModal } from \"mrb/components/modal\";\r\nimport { MrbButton } from \"mrb/components/button\";\r\n\r\nfunction ContentPolicyModalTemplate({ modalParams, t }) {\r\n const description =\r\n \"While all items available on the NakiRadio Portal have been determined by our guidance to have a place within appropriate public discourse, some shows may not be intended for all ages or conform to all ideological inclinations. In its default state, only items whose intended audience includes children are available on the NakiRadio. We encourage the user to use discretion when installing additional items on the NakiRadio, along with visiting their respective websites for details on content, programming, and intended audience. For more information on a given show, please click the show’s title in the Portal.\";\r\n return (\r\n \r\n
\r\n \r\n
\r\n Content Policy
\r\n\r\n
\r\n {description}
\r\n\r\n
\r\n \r\n
\r\n \r\n \r\n Content Policy\r\n
\r\n\r\n
\r\n \r\n
\r\n \r\n
\r\n Content Availability Information
\r\n\r\n
\r\n \r\n {generateContentName(\r\n contentUnavailableModal.data.stations,\r\n contentUnavailableModal.data.podcasts,\r\n contentUnavailableModal.data.nakiNigunArtists,\r\n contentUnavailableModal.data.nakiNigunAlbums\r\n )}{\" \"}\r\n {pluralize(\r\n contentUnavailableModal.data.stations,\r\n contentUnavailableModal.data.podcasts,\r\n contentUnavailableModal.data.nakiNigunArtists,\r\n contentUnavailableModal.data.nakiNigunAlbums,\r\n \"is\",\r\n \"are\"\r\n )}{\" \"}\r\n not yet available in Naki Mobile application, and it won't sync to{\" \"}\r\n {generateDevicesLabel(contentUnavailableModal.data.devices)}{\" \"}\r\n {contentUnavailableModal.data.devices\r\n ? contentUnavailableModal.data.devices.length > 0\r\n ? \"devices\"\r\n : \"device\"\r\n : null}\r\n .\r\n
\r\n\r\n
\r\n \r\n
\r\n This album is not available in mobile application
\r\n );\r\n}\r\n\r\nexport default NakiNigunAlbumUnavailableInAppTemplate;\r\n","import React from \"react\";\r\n\r\nfunction NakiNigunArtistUnavailableInAppTemplate() {\r\n return (\r\nThis artist is not available in mobile application
\r\n );\r\n}\r\n\r\nexport default NakiNigunArtistUnavailableInAppTemplate;\r\n","import React from \"react\";\r\n\r\nfunction PodcastUnavailableInAppTemplate() {\r\n return (\r\nThis podcast is not available in mobile application
\r\n );\r\n}\r\n\r\nexport default PodcastUnavailableInAppTemplate;\r\n","import React from \"react\";\r\n\r\nfunction StationUnavailableInAppTemplate() {\r\n return (\r\nThis station is not available in mobile application
\r\n );\r\n}\r\n\r\nexport default StationUnavailableInAppTemplate;\r\n","import React from \"react\";\r\nimport { ContentPolicyModalTemplate } from \"themes/application/common/components\";\r\n\r\nfunction ContentPolicyModal(props) {\r\n return\r\n {recordCount > 0 && (\r\n \r\n \r\n )}\r\n
\r\n \r\n {!hideControls && (\r\n
\r\n \r\n \r\n
\r\n )}\r\n \r\n {!hideControls && !hideItemsPerPage && (\r\n \r\n \r\n )}\r\n
\r\n \r\n {t(itemsPerPageLabel)}\r\n
\r\n \r\n {t(totalRecordsLabel)}:{\" \"}\r\n \r\n {recordCount}\r\n \r\n
\r\n\r\n \r\n
\r\n )}\r\n {children}
\r\n );\r\n}\r\n\r\nMrbPageContentHeader.propTypes = {\r\n children: PropTypes.any,\r\n classNameExtend: PropTypes.string,\r\n classNameOverride: PropTypes.string,\r\n};\r\n\r\nexport default MrbPageContentHeader;\r\n","import React from \"react\";\r\nimport { PropTypes } from \"prop-types\";\r\nimport { mergeOrOverrideCss } from \"../../../common/utils\";\r\nimport { observer } from \"mobx-react\";\r\n\r\nfunction MrbPageContentSidebar({\r\n children,\r\n classNameOverride,\r\n classNameExtend,\r\n}) {\r\n return (\r\n {children}
\r\n \r\n );\r\n}\r\n\r\nMrbPageFooter.propTypes = {\r\n children: PropTypes.any,\r\n classNameOverride: PropTypes.string,\r\n classNameExtend: PropTypes.string,\r\n};\r\n\r\nexport default observer(MrbPageFooter);\r\n","import React from \"react\";\r\nimport { PropTypes } from \"prop-types\";\r\nimport { mergeOrOverrideCss } from \"../../../common/utils\";\r\n\r\nfunction MrbPageHeader({ children, classNameOverride, classNameExtend }) {\r\n return (\r\n {content.children}
\r\n\r\n {content.sidebar ? content.sidebar : null}\r\n\r\n {content.footer ? content.footer : null}\r\n \r\n );\r\n}\r\n\r\nMrbPageContent.propTypes = {\r\n isEmpty: PropTypes.bool,\r\n emptyRenderer: PropTypes.any,\r\n content: PropTypes.any,\r\n classNameExtend: PropTypes.string,\r\n classNameOverride: PropTypes.string,\r\n};\r\n\r\nexport default MrbPageContent;\r\n","import React from \"react\";\r\nimport { PropTypes } from \"prop-types\";\r\nimport { MrbPageContent } from \"./\";\r\nimport { getPageObject } from \"../utils\";\r\n\r\nfunction MrbPage({\r\n children,\r\n contentClassNameExtend,\r\n contentClassNameOverride,\r\n t,\r\n}) {\r\n const { header, footer, content } = getPageObject(children);\r\n return (\r\n \r\n {navigateBack ? (\r\n \r\n \r\n \r\n \r\n {t(navigateBack.title)}\r\n \r\n ) : (\r\n
\r\n {navigationOptions && (\r\n {t(title)}
\r\n )}\r\n \r\n
\r\n \r\n
\r\n )}\r\n \r\n 0\r\n ? \"c-header__actions--end\"\r\n : \"\"\r\n }`}\r\n >\r\n {renderActions(layoutActions, t)}\r\n
\r\n \r\n {t(title)}
\r\n \r\n
\r\n \r\n {navigateBack ? (\r\n \r\n \r\n \r\n \r\n {t(navigateBack.title)}\r\n \r\n ) : (\r\n \r\n {renderActions(layoutActions, t)}\r\n
\r\n \r\n {navigationOptions && (\r\n {t(title)}
\r\n )}\r\n \r\n
\r\n )}\r\n \r\n
\r\n );\r\n}\r\n\r\nMrbEmptyState.propTypes = {\r\n title: PropTypes.string,\r\n message: PropTypes.string,\r\n children: PropTypes.any,\r\n};\r\n\r\nMrbEmptyState.defaultProps = {\r\n title: \"EMPTY_STATE.NO_DATA\",\r\n message: \"\",\r\n};\r\n\r\nexport default MrbEmptyState;\r\n","import React from \"react\";\r\nimport PropTypes from \"prop-types\";\r\nimport md5 from \"md5\";\r\n\r\nconst baseUrl = \"https://www.gravatar.com/avatar/\";\r\n\r\nfunction MrbGravatar({ email, size, className }) {\r\n const hash = md5(email, { encoding: \"binary\" });\r\n const src = `${baseUrl}${hash}`;\r\n\r\n return (\r\n \r\n \r\n
\r\n {t(title)}
\r\n\r\n {children ? children :
\r\n {t(message)}
}\r\n\r\n setCaptchaRef(ref)}\r\n onChange={onChange}\r\n onExpired={onExpired}\r\n onErrored={onError}\r\n />\r\n
\r\n );\r\n}\r\n\r\nMrbRecaptcha.propTypes = {\r\n store: PropTypes.object.isRequired,\r\n className: PropTypes.string,\r\n onResolved: PropTypes.func,\r\n tabindex: PropTypes.number,\r\n};\r\n\r\nexport default MrbRecaptcha;\r\n","import { MrbBaseViewStore } from \"../../core/stores\";\r\nimport { merge, isFunction } from \"lodash\";\r\n\r\nconst DefaultConfig = {\r\n siteKey: null,\r\n secureToken: null,\r\n type: \"invisible\",\r\n badgePosition: \"bottomright\",\r\n actions: {\r\n onError: () => {},\r\n onExpired: () => {},\r\n onChange: () => {},\r\n },\r\n};\r\n\r\nclass MrbRecaptchaViewStore extends MrbBaseViewStore {\r\n initialUpdate = false;\r\n captchaRef = null;\r\n siteKey = null;\r\n\r\n constructor(rootStore, config) {\r\n super(rootStore);\r\n this.config = merge({}, DefaultConfig, config);\r\n\r\n if (!this.config.siteKey) {\r\n throw new Error(\"Public site key must be provided.\");\r\n }\r\n }\r\n\r\n setCaptchaRef = (ref) => {\r\n this.captchaRef = ref;\r\n };\r\n\r\n execute = () => {\r\n const existingToken = this.getVerificationResult();\r\n if (existingToken) {\r\n this.reset();\r\n }\r\n return this.captchaRef.executeAsync();\r\n };\r\n\r\n onChange = (response) => {\r\n if (\r\n this.config.actions.onChange &&\r\n isFunction(this.config.actions.onChange)\r\n ) {\r\n this.config.actions.onChange(response);\r\n }\r\n };\r\n\r\n onError = (response) => {\r\n if (\r\n this.config.actions.onError &&\r\n isFunction(this.config.actions.onError)\r\n ) {\r\n this.config.actions.onError(response);\r\n }\r\n };\r\n\r\n onExpired = (response) => {\r\n if (\r\n this.config.actions.onExpired &&\r\n isFunction(this.config.actions.onExpired)\r\n ) {\r\n this.config.actions.onExpired(response);\r\n }\r\n };\r\n\r\n reset = () => {\r\n return this.captchaRef.reset();\r\n };\r\n\r\n getVerificationResult = () => {\r\n return this.captchaRef.getValue();\r\n };\r\n}\r\n\r\nexport default MrbRecaptchaViewStore;\r\n","import React from \"react\";\r\nimport PropTypes from \"prop-types\";\r\n\r\nfunction MrbRecaptchaPrivacyPolicy({ className = null }) {\r\n return (\r\n \r\n This page is protected by reCAPTCHA and the Google{\" \"}\r\n \r\n Privacy Policy\r\n {\" \"}\r\n and{\" \"}\r\n \r\n Terms of Service\r\n {\" \"}\r\n apply.\r\n
\r\n );\r\n}\r\n\r\nMrbRecaptchaPrivacyPolicy.propTypes = {\r\n className: PropTypes.string,\r\n};\r\n\r\nexport default MrbRecaptchaPrivacyPolicy;\r\n","import { action, observable, makeObservable, runInAction } from \"mobx\";\r\nimport { merge, isFunction } from \"lodash\";\r\nimport { MrbContentLoaderStore } from \"mrb/components/loader\";\r\n\r\nconst DefaultConfig = {\r\n label: \"Chart\",\r\n fill: true,\r\n actions: {\r\n find: () => { },\r\n },\r\n options: {\r\n responsive: true,\r\n maintainAspectRatio: false,\r\n animation: {\r\n easing: \"easeInOutQuad\",\r\n duration: 520,\r\n },\r\n scales: {\r\n y: {\r\n suggestedMax: 10,\r\n grid: {\r\n color: \"rgba(190,190,190,0.4)\",\r\n },\r\n ticks: {\r\n color: \"rgba(200,200,200,0.7)\",\r\n precision: 0,\r\n },\r\n },\r\n x: {\r\n grid: {\r\n color: \"rgba(200,200,200,0.4)\",\r\n },\r\n ticks: {\r\n color: \"rgba(200,200,200,0.7)\",\r\n },\r\n },\r\n },\r\n },\r\n};\r\n\r\nclass LineChartStore {\r\n @observable.ref data = [];\r\n @observable.ref labels = [];\r\n\r\n config = {};\r\n\r\n constructor(rootStore, config) {\r\n makeObservable(this);\r\n this.rootStore = rootStore;\r\n this.loaderStore = new MrbContentLoaderStore();\r\n\r\n this.config = merge(this.config, DefaultConfig, config);\r\n\r\n this.suspend = this.suspend.bind(this);\r\n this.resume = this.resume.bind(this);\r\n }\r\n\r\n suspend() {\r\n this.loaderStore.suspend();\r\n }\r\n\r\n resume() {\r\n this.loaderStore.resume();\r\n }\r\n\r\n generate(params, abortController = null) {\r\n return this.getResources(params, abortController);\r\n }\r\n\r\n async getResources(params, abortController = null) {\r\n try {\r\n this.suspend();\r\n let data = await this.config.actions.find(params, abortController);\r\n if (isFunction(this.config.actions.preprocessData)) {\r\n data = this.config.actions.preprocessData(data);\r\n }\r\n const dataset = this.config.actions.mapDataset(data);\r\n const labels = this.config.actions.mapLabels(data);\r\n runInAction(() => {\r\n this.setLabels(labels);\r\n this.setData(dataset);\r\n this.resume();\r\n });\r\n } catch (err) {\r\n this.resume();\r\n if (isFunction(this.config.actions.onError)) {\r\n this.config.actions.onError(err);\r\n } else {\r\n throw err;\r\n }\r\n }\r\n }\r\n\r\n @action.bound\r\n setData(data) {\r\n this.data = data;\r\n }\r\n\r\n @action.bound\r\n setLabels(labels) {\r\n this.labels = labels;\r\n }\r\n}\r\n\r\nexport default LineChartStore;\r\n","import React from \"react\";\r\nimport { LineChartTemplate } from \"themes/common/components\";\r\n\r\nfunction LineChart(props) {\r\n return{this.props.children}
;\r\n }\r\n}\r\n\r\nMrbNotifyOutsideClick.propTypes = {\r\n children: PropTypes.node.isRequired,\r\n ignoreElements: PropTypes.any,\r\n action: PropTypes.func,\r\n};\r\n\r\nexport default MrbNotifyOutsideClick;\r\n","export default __webpack_public_path__ + \"static/media/placeholder-template.0f3bd0e8.svg\";","export default __webpack_public_path__ + \"static/media/logo-spa.9a11b108.svg\";","import React from \"react\";\r\n\r\nfunction MrbHeader() {\r\n return header
;\r\n}\r\n\r\nexport default MrbHeader;\r\n","import React from \"react\";\r\nimport PropTypes from \"prop-types\";\r\nimport {\r\n MrbEditFormContent,\r\n MrbEditFormFooter,\r\n MrbEditFormValidation,\r\n} from \"./content\";\r\nimport { observer } from \"mobx-react\";\r\n\r\nfunction MrbEditFormLayout({\r\n form,\r\n children,\r\n t,\r\n layoutFooterVisible,\r\n footer,\r\n onClickCancel,\r\n onSubmit,\r\n submitLabel,\r\n cancelLabel,\r\n hideCancel = false,\r\n submitDisabled = false,\r\n}) {\r\n return (\r\n \r\n
\r\n );\r\n}\r\n\r\nContentSyncWidgetTemplate.propTypes = {\r\n contentEncoderSyncStore: PropTypes.object.isRequired,\r\n t: PropTypes.func.isRequired,\r\n};\r\n\r\nexport default observer(ContentSyncWidgetTemplate);\r\n","import React from \"react\";\r\nimport { observer } from \"mobx-react\";\r\n\r\nfunction ContentSyncModalTemplate() {\r\n return ;\r\n}\r\n\r\nexport default observer(ContentSyncModalTemplate);\r\n","import React, { useState } from \"react\";\r\nimport { PropTypes } from \"prop-types\";\r\nimport { Image } from \"common/components\";\r\nimport { convertSecondsToHMS } from \"common/utils\";\r\nimport { MrbModal } from \"mrb/components/modal\";\r\nimport { MrbToggle } from \"mrb/components/checkbox\";\r\nimport { MrbButton } from \"mrb/components/button\";\r\nimport { observer } from \"mobx-react\";\r\n\r\nconst GenerateAudioFilesModalTemplate = observer(function GenerateAudioFilesModalTemplate({ modalParams, t }) {\r\n return (\r\n \r\n \r\n {t(\"ADMINISTRATION.CONTENT_GENERATE.WIDGET.TITLE\")}\r\n
\r\n\r\n {contentEncoderSyncStore.numberOfActiveTasks === 1 ? (\r\n
\r\n {t(\"ADMINISTRATION.CONTENT_GENERATE.WIDGET.GENERATING_SINGLE\")}
\r\n ) : (\r\n\r\n {t(\"ADMINISTRATION.CONTENT_GENERATE.WIDGET.GENERATING_PLURAL\", {\r\n number: contentEncoderSyncStore.numberOfActiveTasks,\r\n })}\r\n
\r\n )}\r\n\r\n
\r\n );\r\n});\r\n\r\nGenerateAudioFiles.propTypes = {\r\n artworkUrl: PropTypes.string,\r\n hlsStreamUrl: PropTypes.string,\r\n title: PropTypes.string.isRequired,\r\n subtitle: PropTypes.string,\r\n duration: PropTypes.number,\r\n cancel: PropTypes.func,\r\n};\r\n\r\nexport default GenerateAudioFilesModalTemplate;\r\n","import React from \"react\";\r\nimport { ContentSyncWidgetTemplate } from \"themes/administration/content-sync/components\";\r\n\r\nfunction ContentSyncWidget(props) {\r\n return \r\n
\r\n\r\n \r\n\r\n \r\n
\r\n {title}
\r\n {subtitle &&{subtitle}
}\r\n {duration &&{convertSecondsToHMS(duration)}
}\r\n\r\n setGenerateHls(event.target.checked)}\r\n />\r\n {generateHls && hlsStreamUrl && (\r\n setGenerateMp3(event.target.checked)}\r\n />\r\n {generateMp3 && audioStreamUrl && (\r\n
\r\n\r\n \r\n Existing HLS files will be overwritten.\r\n
\r\n )}\r\n \r\n Existing mp3 audio file will be overwritten.\r\n
\r\n )}\r\n \r\n processHlsEncodingForSingleEntity(id, generateHls, generateMp3)\r\n : () => processHlsEncodingForAllEntities(generateHls, generateMp3)\r\n }\r\n />\r\n
\r\n {children[index]}
;\r\n }}\r\n \r\n );\r\n }\r\n}\r\n\r\nexport default observer(MrbSelectVirtualizedList);\r\n","import {\r\n action,\r\n computed,\r\n observable,\r\n makeObservable,\r\n runInAction,\r\n} from \"mobx\";\r\n\r\nclass DropdownItemsResult {\r\n @observable.ref items = [];\r\n @observable pageNumber = 1;\r\n totalRecords = 0;\r\n searchPhrase = null;\r\n pageSize = 15;\r\n\r\n @computed get isEmpty() {\r\n return this.items.length === 0;\r\n }\r\n\r\n @computed get totalPages() {\r\n return Math.ceil(this.totalRecords / this.pageSize);\r\n }\r\n\r\n constructor(\r\n items,\r\n pageNumber,\r\n pageSize,\r\n totalRecords,\r\n searchPhrase = null\r\n ) {\r\n makeObservable(this);\r\n runInAction(() => {\r\n this.items = items;\r\n this.pageNumber = pageNumber;\r\n this.pageSize = pageSize;\r\n this.totalRecords = totalRecords;\r\n this.searchPhrase = searchPhrase;\r\n });\r\n }\r\n\r\n @action.bound\r\n appendNextPage(items, pageNumber) {\r\n this.items = [...this.items, ...items];\r\n this.pageNumber = pageNumber;\r\n }\r\n}\r\n\r\nexport default DropdownItemsResult;\r\n","import { action, computed, observable, makeObservable, reaction, runInAction } from \"mobx\";\r\nimport { MrbLoaderStore } from \"../../loader\";\r\nimport { DropdownItemsResult } from \"../models\";\r\nimport { extend, isNil, isString, map, isObject, isFunction, find, filter, isArray, head } from \"lodash\";\r\n\r\nclass MrbBaseSelectStore {\r\n @observable.ref selectedOption = null;\r\n @observable.ref _value = null;\r\n @observable.ref originalItems = null;\r\n @observable.ref filteredItems = null;\r\n @observable isInitialized = false;\r\n @observable searchTerm = \"\";\r\n loaderStore = null;\r\n\r\n @computed get value() {\r\n return this._value;\r\n }\r\n\r\n @computed get selectedItem() {\r\n if (this.selectedOption) {\r\n if (this.config.isMulti && isArray(this.selectedOption)) {\r\n return map(this.selectedOption, (option) => option.item);\r\n } else if (!this.config.isMulti) {\r\n return this.selectedOption.item;\r\n }\r\n }\r\n\r\n return null;\r\n }\r\n\r\n @computed get options() {\r\n if (this.filteredItems) {\r\n return this.mapDropdownItems(this.filteredItems.items);\r\n } else if (this.originalItems) {\r\n return this.mapDropdownItems(this.originalItems.items);\r\n }\r\n return [];\r\n }\r\n\r\n config = {\r\n placeholder: \"Search\",\r\n isSearchable: false,\r\n isClearable: true,\r\n isMulti: false,\r\n textKey: \"name\",\r\n valueKey: \"id\",\r\n isDisabledKey: \"isDisabled\",\r\n filterDebounce: 500,\r\n initFetch: true,\r\n pageable: true,\r\n pageSize: 15,\r\n preselectFirstItemAsDefault: false,\r\n };\r\n\r\n actions = {\r\n find: null,\r\n mapItem: null,\r\n onOpen: () => {},\r\n onClose: () => {},\r\n onChange: (selected) => selected,\r\n fetchOriginalItem: null,\r\n };\r\n\r\n constructor({ actions, ...config }, initialItems = null) {\r\n makeObservable(this);\r\n\r\n this.config = extend({}, this.config, config);\r\n this.actions = extend({}, this.actions, actions);\r\n\r\n this.loaderStore = new MrbLoaderStore();\r\n\r\n if (initialItems) {\r\n this.originalItems = new DropdownItemsResult(initialItems, 1, initialItems.length, initialItems.length);\r\n }\r\n\r\n reaction(\r\n () => this.searchTerm,\r\n (searchTerm) => {\r\n runInAction(() => {\r\n if (!searchTerm) {\r\n this.filteredItems = null;\r\n return;\r\n }\r\n this.filter(searchTerm);\r\n });\r\n },\r\n {\r\n delay: this.config.filterDebounce,\r\n }\r\n );\r\n\r\n this.initialize();\r\n }\r\n\r\n async initialize() {\r\n const tasks = [];\r\n if (this.config.initFetch) {\r\n tasks.push(this.initializeOriginalItems());\r\n }\r\n tasks.push(this.fetchOriginalItem());\r\n await Promise.all(tasks);\r\n }\r\n\r\n async initializeOriginalItems() {\r\n if (!this.isInitialized) {\r\n await this.filter();\r\n runInAction(() => {\r\n this.onPostInitializeOriginalItems();\r\n this.setIsInitialized(true);\r\n });\r\n }\r\n }\r\n\r\n @action.bound\r\n onPostInitializeOriginalItems() {\r\n if (this.value) {\r\n const selectedOption = find(this.options, (option) => option.value === this.value);\r\n if (selectedOption) {\r\n this.setSelectedOption(selectedOption);\r\n }\r\n } else if (this.config.preselectFirstItemAsDefault) {\r\n this.setSelectedOption(head(this.options));\r\n }\r\n }\r\n\r\n @action.bound\r\n async fetchOriginalItem() {\r\n if (isFunction(this.actions.fetchOriginalItem)) {\r\n this.loaderStore.suspend();\r\n const item = await this.actions.fetchOriginalItem();\r\n runInAction(() => {\r\n if (item) {\r\n const option = this.mapDropdownItem(item);\r\n this.setValue(option.value);\r\n }\r\n this.loaderStore.resume();\r\n });\r\n }\r\n }\r\n\r\n @action.bound\r\n setPageNumber(pageNumber) {\r\n this.pageNumber = pageNumber;\r\n }\r\n\r\n mapDropdownItems(items) {\r\n if (items && items.length > 0) {\r\n return map(items, (item) => this.mapDropdownItem(item));\r\n }\r\n\r\n return [];\r\n }\r\n\r\n mapDropdownItem(item) {\r\n if (isFunction(this.actions.mapItem)) {\r\n return this.actions.mapItem(item);\r\n }\r\n if (isString(item)) {\r\n return {\r\n label: item,\r\n value: item,\r\n isDisabled: false,\r\n item: item,\r\n };\r\n } else if (isObject(item)) {\r\n return {\r\n label: item[this.config.textKey],\r\n value: item[this.config.valueKey],\r\n isDisabled: item[this.config.isDisabledKey],\r\n item: item,\r\n };\r\n }\r\n\r\n return item;\r\n }\r\n\r\n @action.bound\r\n setValue(value) {\r\n this._value = value;\r\n }\r\n\r\n addSelectedItem(item) {\r\n if (isArray(item) && this.config.isMulti) {\r\n const options = this.mapDropdownItems(item);\r\n if (this.selectedOption && isArray(this.selectedOption)) {\r\n this.setSelectedOption([...this.selectedOption, ...options]);\r\n } else {\r\n this.setSelectedOption(options);\r\n }\r\n } else {\r\n const option = this.mapDropdownItem(item);\r\n if (this.config.isMulti) {\r\n if (this.selectedOption && isArray(this.selectedOption)) {\r\n this.setSelectedOption([...this.selectedOption, option]);\r\n } else {\r\n this.setSelectedOption([option]);\r\n }\r\n } else {\r\n this.setSelectedOption(option);\r\n }\r\n }\r\n }\r\n\r\n setSelectedItem(item) {\r\n if (isArray(item)) {\r\n this.setSelectedOption(this.mapDropdownItems(item));\r\n } else {\r\n this.setSelectedOption(this.mapDropdownItem(item));\r\n }\r\n }\r\n\r\n @action.bound\r\n setSelectedOption(option) {\r\n this.selectedOption = option;\r\n let value = null;\r\n if (this.config.isMulti) {\r\n value = map(this.selectedOption, (option) => option.value);\r\n } else {\r\n value = !isNil(this.selectedOption) ? this.selectedOption.value : null;\r\n }\r\n this.setValue(value);\r\n }\r\n\r\n @action.bound\r\n setSearchTerm(searchTerm) {\r\n this.searchTerm = searchTerm;\r\n }\r\n\r\n @action.bound\r\n onOpen(event) {\r\n this.actions.onOpen(event);\r\n if (!this.initFetch) {\r\n this.initializeOriginalItems();\r\n }\r\n }\r\n\r\n @action.bound\r\n onClose(event) {\r\n this.actions.onClose(event);\r\n }\r\n\r\n @action.bound\r\n async filter(searchTerm) {\r\n if (isFunction(this.actions.find)) {\r\n await this.filterDataSource(searchTerm);\r\n } else {\r\n await this.filterInMemory(searchTerm);\r\n }\r\n }\r\n\r\n @action.bound\r\n async loadNextPage() {\r\n if (this.loaderStore.loading) {\r\n return;\r\n }\r\n const dropdownItemsResult = this.filteredItems || this.originalItems;\r\n let searchPhrase = dropdownItemsResult.searchPhrase;\r\n if (dropdownItemsResult.pageNumber < dropdownItemsResult.totalPages) {\r\n if (searchPhrase === \"\") {\r\n searchPhrase = undefined;\r\n }\r\n this.loaderStore.suspend();\r\n\r\n const data = await this.actions.find(\r\n searchPhrase,\r\n dropdownItemsResult.pageNumber + 1,\r\n this.config.pageSize\r\n );\r\n runInAction(() => {\r\n dropdownItemsResult.appendNextPage(data.item, data.page);\r\n this.loaderStore.resume();\r\n });\r\n }\r\n }\r\n\r\n @action.bound\r\n async filterDataSource(searchTerm) {\r\n if (searchTerm === \"\") {\r\n searchTerm = undefined;\r\n }\r\n this.loaderStore.suspend();\r\n\r\n const data = await this.actions.find(searchTerm, 1, this.config.pageSize);\r\n runInAction(() => {\r\n if (searchTerm) {\r\n if (data.item && data.page && data.recordsPerPage && data.totalRecords) {\r\n this.filteredItems = new DropdownItemsResult(\r\n data.item,\r\n data.page,\r\n data.recordsPerPage,\r\n data.totalRecords,\r\n searchTerm\r\n );\r\n } else {\r\n this.filteredItems = new DropdownItemsResult(data, 1, data.length, data.length, searchTerm);\r\n }\r\n } else {\r\n if (data.item && data.page && data.recordsPerPage && data.totalRecords) {\r\n this.originalItems = new DropdownItemsResult(\r\n data.item,\r\n data.page,\r\n data.recordsPerPage,\r\n data.totalRecords\r\n );\r\n } else {\r\n this.originalItems = new DropdownItemsResult(data, 1, data.length, data.length, searchTerm);\r\n }\r\n }\r\n this.loaderStore.resume();\r\n });\r\n }\r\n\r\n filterInMemory(searchTerm) {\r\n let items = [];\r\n if (!searchTerm) {\r\n items = this.originalItems.items;\r\n } else {\r\n items = filter(this.originalItems.items, (item) => {\r\n return item[this.config.textKey].toLowerCase().indexOf(searchTerm.toLowerCase()) !== -1;\r\n });\r\n }\r\n runInAction(() => {\r\n this.filteredItems = new DropdownItemsResult(items, 1, items.length, items.length, searchTerm);\r\n });\r\n }\r\n\r\n @action.bound\r\n onChange(selectedOption) {\r\n if (selectedOption?.isDisabled) {\r\n return;\r\n }\r\n\r\n this.setSelectedOption(selectedOption);\r\n this.actions.onChange(selectedOption);\r\n }\r\n\r\n @action.bound\r\n setIsInitialized(isInitialized) {\r\n this.isInitialized = isInitialized;\r\n }\r\n\r\n clear() {\r\n this.setSelectedOption(null);\r\n }\r\n\r\n clearOptions() {\r\n this.originalItems = null;\r\n }\r\n}\r\n\r\nexport default MrbBaseSelectStore;\r\n","import { runInAction } from \"mobx\";\r\nimport { MrbBaseSelectStore } from \"./\";\r\nimport { extend, isFunction } from \"lodash\";\r\n\r\nconst defaultConfig = {\r\n virtualized: false,\r\n createOptionPosition: \"last\",\r\n formatCreateLabel: (value) => `Create \"${value}\"`,\r\n isOptionDisabled: () => {},\r\n};\r\n\r\nclass MrbSelectStore extends MrbBaseSelectStore {\r\n isCreatable = false;\r\n\r\n constructor(config, initialItems) {\r\n super(extend({}, defaultConfig, config), initialItems);\r\n\r\n this.isCreatable = isFunction(this.actions.createOption);\r\n this.createOption = this.createOption.bind(this);\r\n }\r\n\r\n async createOption(value) {\r\n this.loaderStore.suspend();\r\n const createdItem = await this.actions.createOption(value);\r\n runInAction(() => {\r\n if (this.config.isMulti) {\r\n this.addSelectedItem(createdItem);\r\n } else {\r\n this.setSelectedItem(createdItem);\r\n }\r\n this.loaderStore.resume();\r\n });\r\n }\r\n}\r\n\r\nexport default MrbSelectStore;\r\n","import { action, observable, makeObservable, reaction } from \"mobx\";\r\nimport { MrbBaseSelectStore } from \"./\";\r\nimport { findIndex } from \"lodash\";\r\n\r\nclass MrbSimpleSelectStore extends MrbBaseSelectStore {\r\n @observable isOpen = false;\r\n @observable focusedIndex = 0;\r\n valueContainerRef = null;\r\n\r\n constructor(config, initialItems) {\r\n super(config, initialItems);\r\n makeObservable(this);\r\n\r\n reaction(\r\n () => this.isOpen,\r\n (isOpen) => {\r\n if (isOpen) {\r\n this.onOpen();\r\n } else {\r\n this.onClose();\r\n }\r\n }\r\n );\r\n\r\n this.toggleFocusPosition = this.toggleFocusPosition.bind(this);\r\n }\r\n\r\n onOpen() {\r\n if (this.selectedOption) {\r\n const index = findIndex(\r\n this.options,\r\n (option) => option.value === this.selectedOption.value\r\n );\r\n if (index !== -1) {\r\n this.setFocusedIndex(index);\r\n }\r\n }\r\n this.registerKeyDownEventListener();\r\n super.onOpen();\r\n }\r\n\r\n onClose() {\r\n this.removeKeyDownEventListener();\r\n this.resetFocusedIndex();\r\n super.onClose();\r\n }\r\n\r\n @action.bound\r\n setIsOpen(value) {\r\n this.isOpen = value;\r\n }\r\n\r\n @action.bound\r\n setFocusedIndex(value) {\r\n this.focusedIndex = value;\r\n }\r\n\r\n resetFocusedIndex() {\r\n this.setFocusedIndex(0);\r\n }\r\n\r\n close = () => {\r\n this.setIsOpen(false);\r\n };\r\n\r\n toggleIsOpen = () => {\r\n this.setIsOpen(!this.isOpen);\r\n };\r\n\r\n setValueContainerRef = (ref) => {\r\n this.valueContainerRef = ref;\r\n };\r\n\r\n onChange(selectedOption) {\r\n super.onChange(selectedOption);\r\n this.close();\r\n }\r\n\r\n onFocus = (event) => {\r\n this.setIsOpen(true);\r\n };\r\n\r\n onBlur = (event) => {\r\n this.close();\r\n };\r\n\r\n registerKeyDownEventListener() {\r\n document.addEventListener(\"keydown\", this.toggleFocusPosition);\r\n }\r\n\r\n removeKeyDownEventListener() {\r\n document.removeEventListener(\"keydown\", this.toggleFocusPosition);\r\n }\r\n\r\n toggleFocusPosition(event) {\r\n if (event.key === \"ArrowDown\") {\r\n event.preventDefault();\r\n event.stopPropagation();\r\n if (this.focusedIndex === this.options.length - 1) {\r\n this.setFocusedIndex(0);\r\n } else {\r\n this.setFocusedIndex(this.focusedIndex + 1);\r\n }\r\n } else if (event.key === \"ArrowUp\") {\r\n event.preventDefault();\r\n event.stopPropagation();\r\n if (this.focusedIndex === 0) {\r\n this.setFocusedIndex(this.options.length - 1);\r\n } else {\r\n this.setFocusedIndex(this.focusedIndex - 1);\r\n }\r\n } else if (event.key === \"Enter\") {\r\n event.preventDefault();\r\n event.stopPropagation();\r\n if (this.focusedIndex <= this.options.length - 1) {\r\n this.onChange(this.options[this.focusedIndex]);\r\n }\r\n }\r\n }\r\n}\r\n\r\nexport default MrbSimpleSelectStore;\r\n","import { override } from \"mobx\";\r\nimport { MrbSelectStore } from \"../\";\r\nimport { merge } from \"lodash\";\r\nimport { arrayDifference } from \"../../../../common/utils\";\r\n\r\nconst DefaultConfig = {\r\n fetchOnChange: true,\r\n};\r\n\r\nclass MrbQuerySelectStore extends MrbSelectStore {\r\n queryUtility = null;\r\n key = null;\r\n\r\n @override get value() {\r\n return this.queryUtility.filter[this.key];\r\n }\r\n\r\n constructor(config, queryUtility, key, initialItems) {\r\n super(merge({}, DefaultConfig, config), initialItems);\r\n if (!queryUtility) {\r\n throw new Error(\"queryUtility must be provided.\");\r\n }\r\n this.queryUtility = queryUtility;\r\n if (!key) {\r\n throw new Error(\"key must be provided.\");\r\n }\r\n this.key = key;\r\n }\r\n\r\n @override\r\n setValue(value) {\r\n this.queryUtility.filter.set(this.key, value);\r\n }\r\n\r\n @override\r\n onChange(selectedOption) {\r\n const oldValue = this.value;\r\n super.onChange(selectedOption);\r\n\r\n if (this.config.fetchOnChange) {\r\n if (this.config.isMulti) {\r\n if (arrayDifference(oldValue, this.value).length > 0) {\r\n this.queryUtility.fetch();\r\n }\r\n } else if (oldValue !== this.value) {\r\n this.queryUtility.fetch();\r\n }\r\n }\r\n }\r\n}\r\n\r\nexport default MrbQuerySelectStore;\r\n","import { override } from \"mobx\";\r\nimport { MrbSimpleSelectStore } from \"../\";\r\nimport { isArray, arrayDifference, isEmpty, isFunction, isBoolean, merge } from \"lodash\";\r\n\r\nconst DefaultConfig = {\r\n fetchOnChange: true,\r\n};\r\n\r\nclass MrbQuerySimpleSelectStore extends MrbSimpleSelectStore {\r\n queryUtility = null;\r\n key = null;\r\n\r\n @override get value() {\r\n return this.queryUtility.filter[this.key];\r\n }\r\n\r\n constructor(config, queryUtility, key, initialItems) {\r\n super(merge({}, DefaultConfig, config), initialItems);\r\n if (!queryUtility) {\r\n throw new Error(\"queryUtility must be provided.\");\r\n }\r\n this.queryUtility = queryUtility;\r\n if (!key) {\r\n throw new Error(\"key must be provided.\");\r\n }\r\n this.key = key;\r\n }\r\n\r\n @override\r\n setValue(value) {\r\n this.queryUtility.filter.set(this.key, value);\r\n }\r\n\r\n @override\r\n onChange(selectedOption) {\r\n const oldValue = this.value;\r\n super.onChange(selectedOption);\r\n\r\n if (\r\n (isFunction(this.config.fetchOnChange) && this.config.fetchOnChange(selectedOption)) ||\r\n (isBoolean(this.config.fetchOnChange) && this.config.fetchOnChange)\r\n ) {\r\n if (isArray(oldValue) && isArray(this.value)) {\r\n if (arrayDifference(oldValue, this.value).length > 0) {\r\n this.queryUtility.fetch();\r\n }\r\n } else if (oldValue !== this.value && (!isEmpty(oldValue) || !isEmpty(this.value))) {\r\n this.queryUtility.fetch();\r\n }\r\n }\r\n }\r\n}\r\n\r\nexport default MrbQuerySimpleSelectStore;\r\n","import { action, override } from \"mobx\";\r\nimport { MrbSelectStore } from \"../\";\r\nimport { arrayDifference } from \"../../../../common/utils\";\r\nimport { isArray, isEmpty, isString } from \"lodash\";\r\n\r\nclass MrbFieldSelectStore extends MrbSelectStore {\r\n formField = null;\r\n\r\n @override get value() {\r\n return this.formField.value;\r\n }\r\n\r\n constructor(config, formField, initialItems = null) {\r\n super(config, initialItems);\r\n if (!formField) {\r\n throw new Error(\"formField must be provided\");\r\n }\r\n this.formField = formField;\r\n }\r\n\r\n @override\r\n setValue(value) {\r\n if (isArray(this.value) && isArray(value)) {\r\n if (arrayDifference(this.value, value).length > 0) {\r\n this.setFormValue(value);\r\n }\r\n } else if (isString(value)) {\r\n if (this.value !== value && (!isEmpty(this.value) || !isEmpty(value))) {\r\n this.setFormValue(value);\r\n }\r\n } else if (this.value !== value) {\r\n this.setFormValue(value);\r\n }\r\n }\r\n\r\n @action.bound\r\n setFormValue(value) {\r\n this.formField.onChange(value);\r\n }\r\n}\r\n\r\nexport default MrbFieldSelectStore;\r\n","import { action, override } from \"mobx\";\r\nimport { MrbSimpleSelectStore } from \"../\";\r\nimport { arrayDifference } from \"../../../../common/utils\";\r\nimport { isArray, isEmpty } from \"lodash\";\r\n\r\nclass MrbFieldSimpleSelectStore extends MrbSimpleSelectStore {\r\n formField = null;\r\n\r\n @override get value() {\r\n return this.formField.value;\r\n }\r\n\r\n constructor(config, formField, initialItems = null) {\r\n super(config, initialItems);\r\n if (!formField) {\r\n throw new Error(\"formField must be provided\");\r\n }\r\n this.formField = formField;\r\n }\r\n\r\n @override\r\n setValue(value) {\r\n if (isArray(this.formField.value) && isArray(value)) {\r\n if (arrayDifference(this.formField.value, value).length > 0) {\r\n this.setFormValue(value);\r\n }\r\n } else if (\r\n this.formField.value !== value &&\r\n (!isEmpty(this.formField.value) || !isEmpty(value))\r\n ) {\r\n this.setFormValue(value);\r\n }\r\n }\r\n\r\n @action.bound\r\n setFormValue(value) {\r\n this.formField.onChange(value);\r\n }\r\n}\r\n\r\nexport default MrbFieldSimpleSelectStore;\r\n","import React from \"react\";\r\nimport { PropTypes } from \"prop-types\";\r\nimport Select from \"react-select\";\r\nimport Creatable from \"react-select/creatable\";\r\nimport { mergeOrOverrideCss } from \"../../common/utils\";\r\nimport { MrbSelectVirtualizedList } from \"./\";\r\nimport { observer } from \"mobx-react\";\r\n\r\nfunction MrbSelect({\r\n store,\r\n disabled,\r\n placeholder,\r\n autoFocus,\r\n classNameExtend,\r\n classNameOverride,\r\n onChange,\r\n value,\r\n formatOptionLabel,\r\n ...props\r\n}) {\r\n const {\r\n isCreatable,\r\n config,\r\n onOpen,\r\n onClose,\r\n options,\r\n setSelectRef,\r\n setSearchTerm,\r\n loaderStore,\r\n createOption,\r\n selectedOption,\r\n loadNextPage,\r\n } = store;\r\n\r\n function onChangeFn(selected) {\r\n if (onChange) {\r\n onChange(selected);\r\n } else {\r\n store.onChange(selected);\r\n }\r\n }\r\n\r\n const className = mergeOrOverrideCss(null, classNameOverride, classNameExtend);\r\n\r\n const components = props.components || {};\r\n if (!components.MenuList && config.virtualized) {\r\n components.MenuList = MrbSelectVirtualizedList;\r\n }\r\n\r\n const SelectComponent = isCreatable ? Creatable : Select;\r\n\r\n return (\r\n {t(option.label)}
;\r\n}\r\n\r\nMrbSimpleSelectOption.propTypes = {\r\n option: PropTypes.object.isRequired,\r\n t: PropTypes.func,\r\n};\r\n\r\nexport default MrbSimpleSelectOption;\r\n","import React from \"react\";\r\nimport { PropTypes } from \"prop-types\";\r\nimport { MrbNotifyOutsideClick } from \"../../notify-outside-click\";\r\nimport { MrbSimpleSelectOption } from \"./\";\r\nimport { mergeCss } from \"../../../common/utils\";\r\nimport { map } from \"lodash\";\r\nimport { observer } from \"mobx-react\";\r\n\r\nfunction MrbSimpleSelectPanel({ store, optionRender = (props) => \r\n
\r\n )}\r\n No Results
\r\n\r\n
\r\n )}\r\n \r\n {\" \"}\r\n
\r\n \r\n \r\n \r\n )}\r\n
\r\n \r\n
\r\n )}\r\n \r\n {\" \"}\r\n
\r\n {data.length > 0 ? (\r\n createChartjsParams(canvas, data, labels, config)}\r\n options={config.options}\r\n />\r\n ) : (\r\n
\r\n )}\r\n \r\n {data.length > 0 ? (\r\n
\r\n )}\r\n \r\n createChartjsParams(data, labels, config)} options={config.options} />\r\n
\r\n ) : (\r\n emptyStateRenderer()\r\n )}\r\n \r\n
\r\n \r\n {imageUrl &&
\r\n \r\n
\r\n ) : (\r\n \r\n \r\n
\r\n );\r\n};\r\n\r\nexport default UploadedImageLoaderTemplate;\r\n","import React from \"react\";\r\nimport ContentLoader from \"react-content-loader\";\r\n\r\nconst DescriptionLoaderTemplate = (props) => {\r\n const screenwidth = window.innerWidth;\r\n let loaderWidth;\r\n\r\n if (screenwidth > 1200) {\r\n loaderWidth = screenwidth - 690;\r\n } else if (screenwidth > 988) {\r\n loaderWidth = screenwidth - 200;\r\n } else {\r\n loaderWidth = screenwidth - 64;\r\n }\r\n\r\n return (\r\n \r\n {noBackground ? (\r\n \r\n \r\n ) : (\r\n
\r\n );\r\n};\r\n\r\nconst InputLoader = ({ containerWidth, col, row }) => {\r\n const items = [];\r\n // prettier-ignore\r\n const viewWidth = containerWidth === \"base\" ? 1440 : containerWidth === \"sml\" ? 768 : containerWidth === \"tny\" ? 550 : 1920;\r\n const colItems = 100 / col;\r\n\r\n const smlSpace = colItems;\r\n const lrgSpace = 50;\r\n\r\n let x = 0;\r\n let x2 = 0;\r\n\r\n let y = 10;\r\n let y2 = 30;\r\n\r\n for (let i = 0; i < row; i++) {\r\n for (let j = 0; j < col; j++) {\r\n items.push(\r\n \r\n
\r\n )}\r\n \r\n \r\n \r\n {items}\r\n \r\n
\r\n );\r\n};\r\n\r\nexport default ToggleActionsLoaderTemplate;\r\n","import React, { useCallback, useState } from \"react\";\r\nimport ContentLoader from \"react-content-loader\";\r\n\r\nconst UploadAlbumTrackTemplate = () => {\r\n const [loaderWidth, setLoaderWidth] = useState(0);\r\n const [uploadLoaderWidth, setUploadLoaderWidth] = useState(0);\r\n\r\n const ref = useCallback((node) => {\r\n if (node !== null) {\r\n setLoaderWidth(node.getBoundingClientRect().width);\r\n }\r\n }, []);\r\n\r\n const uploadRef = useCallback((node) => {\r\n if (node !== null) {\r\n setUploadLoaderWidth(node.getBoundingClientRect().width);\r\n }\r\n }, []);\r\n\r\n return (\r\n \r\n \r\n
\r\n );\r\n};\r\n\r\nexport default UploadAlbumTrackTemplate;\r\n","import React from \"react\";\r\nimport { MrbFieldSelect } from \"mrb/components\";\r\nimport { components } from \"react-select\";\r\n\r\nfunction StripeAccountFieldSelectTemplate({ isOptionDisabled, ...props }) {\r\n return (\r\n \r\n
\r\n \r\n \r\n
\r\n\r\n \r\n \r\n
\r\n \r\n event.stopPropagation()}\r\n >\r\n \r\n \r\n
\r\n );\r\n}\r\n\r\nStripeAccountLinkTemplate.propTypes = {\r\n accountId: PropTypes.string.isRequired,\r\n t: PropTypes.func,\r\n};\r\n\r\nexport default StripeAccountLinkTemplate;\r\n","import React from \"react\";\r\nimport { PropTypes } from \"prop-types\";\r\nimport { observer } from \"mobx-react\";\r\n\r\nfunction StripeFieldValidationTemplate({ field }) {\r\n const { error } = field;\r\n if (!error) {\r\n return null;\r\n }\r\n\r\n return (\r\n {accountId}
\r\n\r\n {error.message}\r\n
\r\n );\r\n}\r\n\r\nStripeFieldValidationTemplate.propTypes = {\r\n field: PropTypes.object.isRequired,\r\n};\r\n\r\nexport default observer(StripeFieldValidationTemplate);\r\n","import React from \"react\";\r\nimport { PropTypes } from \"prop-types\";\r\nimport { CardElement } from \"@stripe/react-stripe-js\";\r\nimport { StripeFieldValidation } from \"common/components\";\r\nimport { observer } from \"mobx-react\";\r\n\r\nconst cardStyle = {\r\n style: {\r\n base: {\r\n iconColor: \"#f5f5f5\",\r\n color: \"#F5F5F5\",\r\n fontFamily: \"Roboto, Open Sans, Segoe UI, sans-serif\",\r\n fontSize: \"14px\",\r\n \":-webkit-autofill\": {\r\n color: \"#fce883\",\r\n },\r\n \"::placeholder\": {\r\n color: \"rgba(245, 245, 245, 0.4)\",\r\n },\r\n },\r\n },\r\n};\r\n\r\nfunction StripeCreditCardFieldTemplate({ field, label, t = (i) => i }) {\r\n return (\r\n\r\n setIsOpen(false)}>\r\n
\r\n )}\r\n \r\n \r\n );\r\n};\r\n\r\nexport default PopoverTemplate;\r\n","import React from \"react\";\r\n\r\nconst StatusTagTemplate = ({ isActive }) => {\r\n return (\r\n \r\n {trigger}\r\n
\r\n\r\n {isOpen && (\r\n \r\n {children\r\n ? children\r\n : contentList.length > 0 &&\r\n contentList.map((item) => {\r\n return (\r\n {\r\n item.action(event);\r\n setIsOpen(false);\r\n }}\r\n key={Math.random()}\r\n className={mergeCss(\r\n \"c-popover__item\",\r\n item.className,\r\n item.disabled && \"isDisabled\"\r\n )}\r\n >\r\n {item.icon && }\r\n {item.title}\r\n
\r\n );\r\n })}\r\n \r\n \r\n {isActive ? \"Active\" : \"Inactive\"}\r\n
\r\n );\r\n};\r\n\r\nexport default StatusTagTemplate;\r\n","import React, { useState } from \"react\";\r\nimport { mergeCss } from \"mrb/common/utils\";\r\nimport { MrbButton } from \"mrb/components/button\";\r\n\r\nconst AccordionTemplate = (props) => {\r\n const { title, children, className, customStyle, handleRemoveCard, showClose, additionalContent } = props;\r\n const [isOpen, setIsOpen] = useState(false);\r\n\r\n const handleIsOpen = () => {\r\n setIsOpen((prevIsOpen) => !prevIsOpen);\r\n };\r\n\r\n return (\r\n \r\n
\r\n );\r\n};\r\n\r\nexport default AccordionTemplate;\r\n","import React from \"react\";\r\nimport { mergeCss } from \"mrb/common/utils\";\r\n\r\nconst ProgressbarTemplate = (props) => {\r\n const { value, total, displayValue, status } = props;\r\n\r\n const percentage = (value / total).toFixed(2);\r\n const totalWidthValue = percentage * 100;\r\n const widthValue = `calc(${totalWidthValue}%)`;\r\n\r\n const downloadStatus = {\r\n new: \"new\",\r\n downloading: \"downloading\",\r\n finished: \"finished\",\r\n canceled: \"canceled\",\r\n failed: \"failed\",\r\n };\r\n\r\n const statusClass = () => {\r\n switch (status) {\r\n case downloadStatus.downloading:\r\n return \"in-progress\";\r\n case downloadStatus.finished:\r\n return \"is-finished\";\r\n case downloadStatus.failed:\r\n return \"is-failed\";\r\n default:\r\n return \"\";\r\n }\r\n };\r\n\r\n return (\r\n \r\n {title}\r\n\r\n
\r\n\r\n {isOpen && (\r\n \r\n
\r\n \r\n {additionalContent}\r\n\r\n
\r\n )}\r\n {children}
\r\n \r\n
\r\n \r\n );\r\n};\r\n\r\nexport default ProgressbarTemplate;\r\n","import React from \"react\";\r\nimport { createPortal } from \"react-dom\";\r\n\r\nconst FloatingCardTemplate = ({ children }) => {\r\n return createPortal({displayValue}
\r\n\r\n\r\n
\r\n {children}
, document.body);\r\n};\r\n\r\nexport default FloatingCardTemplate;\r\n","import React, { useState } from \"react\";\r\nimport { mergeOrOverrideCss } from \"mrb/common/utils\";\r\nimport { Popover } from \"react-tiny-popover\";\r\n\r\nconst CustomDropdownTemplate = ({\r\n trigger,\r\n isDisabled,\r\n children,\r\n contentClassNameOverride,\r\n contentClassNameExtend,\r\n triggerClassNameOverride,\r\n triggerClassNameExtend,\r\n onOpen,\r\n onClose,\r\n}) => {\r\n const [isOpen, setIsOpen] = useState(false);\r\n\r\n const handleIsOpen = () => {\r\n const value = !isOpen;\r\n setIsOpen(value);\r\n if (value && onOpen) {\r\n onOpen();\r\n } else if (!value && onClose) {\r\n onClose();\r\n }\r\n };\r\n\r\n const triggerClassName = mergeOrOverrideCss(\r\n \"c-dropdown__trigger\",\r\n triggerClassNameOverride,\r\n triggerClassNameExtend\r\n );\r\n const contentClassName = mergeOrOverrideCss(\r\n \"c-dropdown__content\",\r\n contentClassNameOverride,\r\n contentClassNameExtend\r\n );\r\n\r\n return (\r\n \r\n {trigger}\r\n
\r\n \r\n );\r\n};\r\n\r\nexport default CustomDropdownTemplate;\r\n","import React from \"react\";\r\nimport { PropTypes } from \"prop-types\";\r\nimport { PremiumInfoWidget, PastDueSubscriptionWidget, PremiumInfoTrialWidget } from \"application/payment/components\";\r\nimport { ContentPolicyWidget } from \"application/common/components\";\r\nimport { head } from \"lodash\";\r\nimport { observer } from \"mobx-react\";\r\n\r\nfunction ApplicationWidgetPanelTemplate({ rootStore, isContentPolicyVisible = true, t }) {\r\n const { userStore, premiumSubscriptionStore } = rootStore;\r\n if (userStore.isAdministrator) {\r\n return null;\r\n }\r\n\r\n return (\r\n \r\n
\r\n );\r\n}\r\n\r\nexport default AppStartupLoaderTemplate;\r\n","import React from \"react\";\r\nimport { PropTypes } from \"prop-types\";\r\nimport { MrbMenu } from \"mrb/components/menu\";\r\nimport { MrbNotifyOutsideClick } from \"mrb/components/notify-outside-click\";\r\nimport { defaultTemplate } from \"common/hoc\";\r\nimport logo from \"themes/assets/images/logo-spa.svg\";\r\nimport { observer } from \"mobx-react\";\r\nimport { ApplicationWidgetPanel, AdministrationWidgetPanel } from \"common/components\";\r\nimport { version } from \"../../../../../package.json\";\r\n\r\nconst APP_VERSION = `version ${version}`;\r\n\r\nfunction MainSidebarTemplate({ mainSidebarViewStore, t }) {\r\n const { rootStore, logout, user } = mainSidebarViewStore;\r\n const { menuStore } = rootStore;\r\n\r\n return (\r\n \r\n \r\n \r\n
\r\n \r\n
\r\n \r\n 
\r\n
\r\n \r\n
\r\n \r\n \r\n rootStore.authenticationStore.setToken(null)\r\n }\r\n >\r\n Clear Token\r\n */}\r\n
\r\n \r\n \r\n \r\n Log Out\r\n \r\n
\r\n\r\n \r\n
\r\n\r\n {APP_VERSION}
\r\n\r\n {/* Uncomment this to test session expired */}\r\n {/*\r\n \r\n Hi, {displayName}\r\n
\r\n );\r\n});\r\n\r\nMainSidebarTemplate.propTypes = {\r\n mainSidebarViewStore: PropTypes.object.isRequired,\r\n t: PropTypes.func,\r\n};\r\n\r\nexport default defaultTemplate(MainSidebarTemplate);\r\n","import React from \"react\";\r\n\r\nfunction TableNoDataOverlayTemplate() {\r\n return (\r\n \r\n \r\n
\r\n );\r\n}\r\n\r\nexport default TableNoDataOverlayTemplate;\r\n","import React from \"react\";\r\nimport { PropTypes } from \"prop-types\";\r\nimport { DragDropContext, Droppable, Draggable } from \"react-beautiful-dnd\";\r\nimport { map } from \"lodash\";\r\nimport { observer } from \"mobx-react\";\r\n\r\nfunction DragDropListTemplate({\r\n droppableId = \"droppable\",\r\n itemRender,\r\n items,\r\n generateItemKey = (item) => item.id,\r\n onDragEnd,\r\n}) {\r\n return (\r\n \r\n Ooops! Someone cut the cable.\r\n
\r\nThere is no data.
\r\n\r\n {map(items, (item, index) => (\r\n \r\n {(provided) => (\r\n \r\n {itemRender(item)}\r\n
\r\n )}\r\n \r\n ))}\r\n {provided.placeholder}\r\n \r\n )}\r\n \r\n
\r\n );\r\n}\r\n\r\nShuffleWeightPickerTemplate.propTypes = {\r\n field: PropTypes.object.isRequired,\r\n shuffleWeightOptions: PropTypes.array.isRequired,\r\n t: PropTypes.func.isRequired,\r\n};\r\n\r\nexport default observer(ShuffleWeightPickerTemplate);\r\n","import React from \"react\";\r\nimport { PropTypes } from \"prop-types\";\r\nimport { action, observable, makeObservable } from \"mobx\";\r\nimport { observer } from \"mobx-react\";\r\nimport { Editor } from \"react-draft-wysiwyg\";\r\nimport { EditorState, convertToRaw, ContentState } from \"draft-js\";\r\nimport draftToHtml from \"draftjs-to-html\";\r\nimport htmlToDraft from \"html-to-draftjs\";\r\nimport { isFunction } from \"lodash\";\r\nimport \"../../../../../../node_modules/react-draft-wysiwyg/dist/react-draft-wysiwyg.css\";\r\n\r\n@observer\r\nclass RichTextEditorTemplate extends React.Component {\r\n @observable.ref editorState = EditorState.createEmpty();\r\n\r\n constructor(props) {\r\n super();\r\n makeObservable(this);\r\n this.onChange = props.onChange;\r\n if (props.value) {\r\n const content = htmlToDraft(props.value);\r\n if (content) {\r\n const contentState = ContentState.createFromBlockArray(\r\n content.contentBlocks\r\n );\r\n const editorState = EditorState.createWithContent(contentState);\r\n this.setEditorState(editorState);\r\n }\r\n }\r\n }\r\n\r\n @action.bound\r\n setEditorState(editorState) {\r\n this.editorState = editorState;\r\n }\r\n\r\n @action.bound\r\n onEditorStateChange(editorState) {\r\n this.setEditorState(editorState);\r\n if (isFunction(this.onChange)) {\r\n this.onChange(\r\n draftToHtml(convertToRaw(editorState.getCurrentContent()))\r\n );\r\n }\r\n }\r\n\r\n render() {\r\n return (\r\n \r\n {shuffleDisabled && (\r\n
\r\n \r\n \r\n {t(\"Shuffle\")}\r\n \r\n
\r\n )}\r\n \r\n
\r\n \r\n {join(\r\n map(genres, (genre) => genre.name),\r\n \", \"\r\n )}\r\n
\r\n );\r\n }\r\n return null;\r\n}\r\n\r\nGenresTemplate.propTypes = {\r\n genres: PropTypes.array,\r\n};\r\n\r\nexport default GenresTemplate;\r\n","import React from \"react\";\r\nimport { mergeCss } from \"mrb/common/utils\";\r\n\r\nconst PremiumBadgeTemplate = ({ isPremium, isPremiumSubscriptionValid = false, premiumSize, iconSize }) => {\r\n return (\r\n\r\n
\r\n );\r\n}\r\n\r\nPasswordFieldInfoTemplate.propTypes = {\r\n passwordFieldInfoViewStore: PropTypes.object.isRequired,\r\n};\r\n\r\nexport default observer(PasswordFieldInfoTemplate);\r\n","import React from \"react\";\r\n\r\nfunction ImageUploadNoteTemplate({ showInfo }) {\r\n return (\r\n \r\n
\r\n \r\n Example: keepMyData$af3\r\n
\r\n\r\n {\" \"}\r\n
\r\n {\" \"}\r\n
\r\n {\" \"}\r\n
\r\n Click here to upload or
drag and drop image\r\n
- \r\n
- • Upload jpg, png, or gif files \r\n
- • Max. file size is 20MB \r\n
- • 400px x 400px file size is recommended \r\n
\r\n
\r\n \r\n
\r\n {showSearchButton && (\r\n \r\n \r\n {t(searchButtonLabel)}\r\n \r\n
\r\n )}\r\n \r\n
\r\n );\r\n}\r\n\r\nUserDeviceActivityContentCellTemplate.propTypes = {\r\n data: PropTypes.object.isRequired,\r\n};\r\n\r\nfunction ContentTypeIcon({ data }) {\r\n let icon = null;\r\n if (!isNil(data.station)) {\r\n icon = \"stations\";\r\n } else if (!isNil(data.podcast)) {\r\n icon = \"podcasts\";\r\n } else if (!isNil(data.nakiNigunAlbum)) {\r\n icon = \"nigun\";\r\n } else {\r\n return null;\r\n }\r\n\r\n return ;\r\n}\r\n\r\nexport default UserDeviceActivityContentCellTemplate;\r\n","import React from \"react\";\r\nimport { PropTypes } from \"prop-types\";\r\nimport { isNil } from \"lodash\";\r\n\r\nfunction UserPayoutEventListContentCellTemplate({ data }) {\r\n let contentTitle = null;\r\n let isPremium = false;\r\n if (!isNil(data.station)) {\r\n contentTitle = data.station.title;\r\n isPremium = data.station.isPremium;\r\n } else if (!isNil(data.podcast)) {\r\n contentTitle = data.podcast.title;\r\n isPremium = data.podcast.isPremium;\r\n } else if (!isNil(data.nakiNigunAlbum)) {\r\n contentTitle = data.nakiNigunAlbum.title;\r\n isPremium = data.nakiNigunAlbum.isPremium;\r\n } else {\r\n return \"-\";\r\n }\r\n let shuffle = null;\r\n if (data.shuffle) {\r\n shuffle = `(${data.shuffle.title})`;\r\n }\r\n const label = [contentTitle, shuffle].join(\" \");\r\n\r\n return (\r\n \r\n
\r\n );\r\n}\r\n\r\nUserPayoutEventListContentCellTemplate.propTypes = {\r\n data: PropTypes.object.isRequired,\r\n};\r\n\r\nfunction ContentTypeIcon({ data }) {\r\n let icon = null;\r\n if (!isNil(data.station)) {\r\n icon = \"stations\";\r\n } else if (!isNil(data.podcast)) {\r\n icon = \"podcasts\";\r\n } else if (!isNil(data.nakiNigunAlbum)) {\r\n icon = \"nigun\";\r\n } else {\r\n return null;\r\n }\r\n\r\n return ;\r\n}\r\n\r\nexport default UserPayoutEventListContentCellTemplate;\r\n","import React from \"react\";\r\nimport ContentLoader from \"react-content-loader\";\r\n\r\nconst TopTrendingListLoaderTemplate = (props) => {\r\n const { row = 10, noButton, userActivity = false, ...rest } = props;\r\n const screenwidth = window.innerWidth;\r\n const items = [];\r\n let loaderWidth;\r\n\r\n if (screenwidth > 1199) {\r\n loaderWidth = 387;\r\n } else if (userActivity && screenwidth > 990) {\r\n loaderWidth = screenwidth;\r\n } else if (screenwidth > 990) {\r\n loaderWidth = screenwidth / 2 - 200;\r\n } else if (userActivity && screenwidth > 766) {\r\n loaderWidth = screenwidth;\r\n } else if (screenwidth > 766) {\r\n loaderWidth = screenwidth / 2;\r\n } else {\r\n loaderWidth = screenwidth;\r\n }\r\n\r\n let y = 0;\r\n\r\n for (let i = 0; i < row; i++) {\r\n let textWidth = Math.random() * (150 - 100) + 100;\r\n items.push(\r\n \r\n \r\n {items}\r\n {!noButton && (\r\n \r\n \r\n )}\r\n \r\n
\r\n );\r\n};\r\n\r\nexport default TopTrendingListLoaderTemplate;\r\n","import React from \"react\";\r\nimport ContentLoader from \"react-content-loader\";\r\n\r\nconst AnalyticsGraphLoaderTemplate = (props) => {\r\n const screenwidth = window.innerWidth;\r\n let loaderWidth;\r\n let col;\r\n\r\n if (screenwidth > 1199) {\r\n loaderWidth = screenwidth - 690;\r\n col = Math.floor(loaderWidth / 10);\r\n } else if (screenwidth > 990) {\r\n loaderWidth = screenwidth - 250;\r\n col = Math.floor(loaderWidth / 6);\r\n } else {\r\n loaderWidth = screenwidth;\r\n col = Math.floor(loaderWidth / 4);\r\n }\r\n\r\n let itemX = [];\r\n let itemY = [];\r\n\r\n let labelY = [];\r\n let labelX = [];\r\n\r\n let y = 0;\r\n let y2 = 24;\r\n let x = -70;\r\n let x2 = 70;\r\n\r\n for (let i = 0; i < 7; i++) {\r\n itemY.push(\r\n \r\n \r\n {items}\r\n {!noButton && (\r\n \r\n \r\n )}\r\n \r\n
\r\n );\r\n}\r\n\r\nexport default TopTrendingListViewMoreLoaderTemplate\r\n","import React from \"react\";\r\nimport ContentLoader from \"react-content-loader\";\r\n\r\nconst AnalyticsStatsLoaderTemplate = (props) => {\r\n const { newDevices, isPremium, ...rest } = props;\r\n const screenWidth = window.innerWidth;\r\n\r\n let loaderWidth;\r\n let circleLoaderHeight;\r\n\r\n const items = [];\r\n let y = 0;\r\n\r\n if (screenWidth > 1440) {\r\n circleLoaderHeight = 220;\r\n loaderWidth = Math.floor((screenWidth - 760) / 2);\r\n } else if (screenWidth > 1199) {\r\n loaderWidth = Math.floor((screenWidth - 760) / 2);\r\n } else if (screenWidth > 991) {\r\n loaderWidth = Math.floor((screenWidth - 200) / 2);\r\n } else if (screenWidth > 767) {\r\n loaderWidth = Math.floor(screenWidth / 2);\r\n circleLoaderHeight = 120;\r\n } else {\r\n loaderWidth = screenWidth;\r\n circleLoaderHeight = 200;\r\n }\r\n\r\n for (let i = 0; i < 3; i++) {\r\n items.push(\r\n \r\n \r\n {newDevices ?
\r\n );\r\n};\r\n\r\nexport default AnalyticsStatsLoaderTemplate;\r\n\r\nconst NewDevices = () => {\r\n const screenWidth = window.innerWidth;\r\n let circleWidth = null;\r\n let y1 = 10;\r\n let y2 = 55;\r\n let y3 = 85;\r\n let circleY = 60;\r\n\r\n if (screenWidth > 1440) {\r\n circleWidth = 80;\r\n y1 = 65;\r\n y2 = 110;\r\n y3 = 140;\r\n circleY = 100;\r\n } else if (screenWidth > 1199) {\r\n circleWidth = 60;\r\n } else {\r\n circleWidth = 60;\r\n }\r\n\r\n return (\r\n \r\n \r\n {items}\r\n
\r\n );\r\n};\r\n\r\nexport default PortalDetailedActivityLoaderTemplate;\r\n\r\nconst CircleLoader = () => {\r\n return (\r\n \r\n {podcastGruop &&\r\n
\r\n )\r\n}","import React, { useCallback, useState } from \"react\";\r\nimport ContentLoader from \"react-content-loader\";\r\n\r\nconst ContentStatsListLoaderTemplate = (props) => {\r\n const [loaderWidth, setLoaderWidth] = useState(0);\r\n\r\n const ref = useCallback((node) => {\r\n if (node !== null) setLoaderWidth(node.getBoundingClientRect().width);\r\n }, []);\r\n\r\n const loaderList = [];\r\n let y = 0;\r\n\r\n for (let i = 0; i < 10; i++) {\r\n loaderList.push(\r\n \r\n \r\n
\r\n }\r\n \r\n \r\n {podcastGruop &&\r\n \r\n {headerItems}\r\n < rect x={`0`} y={22} rx=\"4\" ry=\"4\" width=\"100%\" height=\"1\" />\r\n \r\n }\r\n {listItems}\r\n {podcastGruop &&\r\n \r\n \r\n }\r\n \r\n
\r\n \r\n \r\n {loaderList}\r\n \r\n
\r\n );\r\n};\r\n\r\nexport default ContentStatsListLoaderTemplate;\r\n","import React from 'react'\r\nimport ContentLoader from \"react-content-loader\";\r\n\r\nconst UserAccountSummaryLoaderTemplate = (props) => {\r\n const { row = 3 } = props;\r\n const screenWidth = window.innerWidth;\r\n let loaderWidth;\r\n\r\n const items = [];\r\n let y = 8;\r\n\r\n if (screenWidth > 1440) {\r\n loaderWidth = Math.floor((screenWidth - 760) / 2);\r\n } else if (screenWidth > 1199) {\r\n loaderWidth = Math.floor((screenWidth - 760) / 2);\r\n } else if (screenWidth > 991) {\r\n loaderWidth = Math.floor((screenWidth - 200) / 2);\r\n } else if (screenWidth > 767) {\r\n loaderWidth = Math.floor(screenWidth / 2);\r\n } else {\r\n loaderWidth = screenWidth;\r\n }\r\n\r\n for (let i = 0; i < row; i++) {\r\n let textWidth = Math.random() * (170 - 100) + 100;\r\n let secondTextWidth = Math.random() * (170 - 100) + 100;\r\n\r\n items.push(\r\n \r\n \r\n {items}\r\n \r\n
\r\n );\r\n}\r\n\r\nexport default UserAccountSummaryLoaderTemplate\r\n","import React from 'react'\r\nimport ContentLoader from \"react-content-loader\";\r\n\r\nconst UserDeviceActivitySummaryLoaderTemplate = (props) => {\r\n\r\n const screenWidth = window.innerWidth;\r\n let loaderWidth;\r\n\r\n if (screenWidth > 1440) {\r\n loaderWidth = Math.floor((screenWidth - 760) / 2);\r\n } else if (screenWidth > 1199) {\r\n loaderWidth = Math.floor((screenWidth - 760) / 2);\r\n } else if (screenWidth > 991) {\r\n loaderWidth = Math.floor((screenWidth - 200) / 2);\r\n } else if (screenWidth > 767) {\r\n loaderWidth = Math.floor(screenWidth / 2);\r\n } else {\r\n loaderWidth = screenWidth;\r\n }\r\n\r\n return (\r\n \r\n \r\n
\r\n );\r\n}\r\n\r\nUserAccountSummaryTemplate.propTypes = {\r\n userDeviceActivityViewStore: PropTypes.object.isRequired,\r\n t: PropTypes.func.isRequired,\r\n};\r\n\r\nfunction SubscriptionInfo({ subscription }) {\r\n return (\r\n Summary
\r\n\r\n {userPortalSummary && (\r\n
\r\n )}\r\n \r\n
\r\n )}\r\n \r\n
\r\n\r\n \r\n
\r\n User
\r\n\r\n
\r\n
\r\n Registration Date
\r\n\r\n {dateFormatter.format(userPortalSummary.dateOfRegistration, {\r\n format: applicationDefaults.formats.date,\r\n })}\r\n
\r\n\r\n
\r\n Registered Devices
\r\n{userPortalSummary.numberOfDevices}
\r\n\r\n
\r\n \r\n \r\n {subscription.subscriptionStatus.name}\r\n \r\n ) : (\r\n
\r\n {subscription && (\r\n Premium Subscription
\r\n {subscription ? (\r\n-
\r\n )}\r\n\r\n
\r\n Subscription Start Date
\r\n\r\n {subscription && subscription.startDate\r\n ? dateFormatter.format(subscription.startDate, {\r\n format: applicationDefaults.formats.date,\r\n })\r\n : \"-\"}\r\n
\r\n\r\n
\r\n Subscription End Date
\r\n\r\n {subscription && subscription.endDate\r\n ? dateFormatter.format(subscription.endDate, {\r\n format: applicationDefaults.formats.date,\r\n })\r\n : \"-\"}\r\n
\r\n\r\n
\r\n );\r\n}\r\n\r\nUserContentListSummaryTemplate.propTypes = {\r\n userDeviceActivityViewStore: PropTypes.object.isRequired,\r\n t: PropTypes.func,\r\n};\r\n\r\nfunction EmptyState() {\r\n return (\r\n Device Activity (Overall)
\r\n\r\n
\r\n \r\n \r\n
\r\n );\r\n}\r\n\r\nexport default observer(UserContentListSummaryTemplate);\r\n","import React from \"react\";\r\nimport { PropTypes } from \"prop-types\";\r\nimport { MrbRouterLink } from \"mrb/core/infrastructure/router\";\r\nimport { observer } from \"mobx-react\";\r\nimport { MrbContentLoader } from \"mrb/components/loader\";\r\nimport { TopTrendingListLoader } from \"administration/analytics/components\";\r\nimport { numberFormatter } from \"common/utils\";\r\nimport { map } from \"lodash\";\r\n\r\nfunction UserContentPlaybackSummaryTemplate({ userDeviceActivityViewStore, t }) {\r\n const { userDeviceActivitySummaryViewStore } = userDeviceActivityViewStore;\r\n const { loaderStore } = userDeviceActivitySummaryViewStore;\r\n return (\r\n No activity data
\r\nThe user has no active devices.
\r\n\r\n
\r\n );\r\n}\r\n\r\nUserContentPlaybackSummaryTemplate.propTypes = {\r\n userDeviceActivityViewStore: PropTypes.object.isRequired,\r\n t: PropTypes.func,\r\n};\r\n\r\nconst PlaybacksList = observer(function PlaybacksList({ userDeviceActivitySummaryViewStore }) {\r\n const { contentPlaybacks } = userDeviceActivitySummaryViewStore;\r\n return (\r\n Top Stations & Podcasts (Overall)
\r\n\r\n
\r\n \r\n {contentPlaybacks.length > 0 ? (\r\n \r\n {map(contentPlaybacks, (item, index) => (\r\n \r\n ) : (\r\n
\r\n );\r\n});\r\n\r\nfunction PlaybackItem({ index, item }) {\r\n let title, route, isPremium, params;\r\n if (item.station) {\r\n title = item.station.title;\r\n isPremium = item.station.isPremium;\r\n route = \"master.administration.analytics.station-activity\";\r\n params = { id: item.station.id };\r\n } else if (item.podcast) {\r\n title = item.podcast.title;\r\n isPremium = item.podcast.isPremium;\r\n route = \"master.administration.analytics.podcast-activity\";\r\n params = { id: item.podcast.id };\r\n }\r\n return (\r\n \r\n
\r\n );\r\n}\r\n\r\nfunction EmptyState() {\r\n return (\r\n \r\n {index + 1}.\r\n \r\n {title}\r\n {isPremium && }\r\n \r\n
\r\n {numberFormatter.format(item.playbacks)}\r\n \r\n \r\n
\r\n );\r\n}\r\n\r\nexport default observer(UserContentPlaybackSummaryTemplate);\r\n","import React from \"react\";\r\nimport { PropTypes } from \"prop-types\";\r\nimport { numberFormatter } from \"common/utils\";\r\nimport { timeRangeType } from \"administration/analytics/constants\";\r\nimport { applicationDefaults } from \"common/constants\";\r\nimport { dateFormatter } from \"mrb/common/formatting\";\r\nimport { observer } from \"mobx-react\";\r\nimport { mergeCss } from \"mrb/common/utils\";\r\n\r\nfunction AnalyticsCounterTemplate({\r\n filteredBy,\r\n currentCycleNumber,\r\n previousCycleNumber = 0,\r\n classNameExtend,\r\n timeRangeLabelRenderer,\r\n}) {\r\n const diff = currentCycleNumber - previousCycleNumber;\r\n const trend = Math.sign(diff);\r\n let indicatorClass = null;\r\n if (trend > 0) {\r\n indicatorClass = \"increase\";\r\n } else if (trend < 0) {\r\n indicatorClass = \"decrease\";\r\n } else {\r\n indicatorClass = \"neutral\";\r\n }\r\n\r\n return (\r\n No activity data
\r\nThe user has no detected plays.
\r\n\r\n \r\n
\r\n );\r\n}\r\n\r\nfunction Sign({ number }) {\r\n if (number > 0) {\r\n return \"+\";\r\n } else if (number < 0) {\r\n return \"-\";\r\n }\r\n\r\n return null;\r\n}\r\n\r\nfunction TimeRangeLabel({ filteredBy }) {\r\n if (filteredBy.range === timeRangeType.today) {\r\n return \"Today\";\r\n } else if (filteredBy.range === timeRangeType.yesterday) {\r\n return \"Yesterday\";\r\n } else if (filteredBy.range === timeRangeType.last3Days) {\r\n return \"Last 3 days\";\r\n } else if (filteredBy.range === timeRangeType.thisWeek) {\r\n return \"This Week\";\r\n } else if (filteredBy.range === timeRangeType.lastWeek) {\r\n return \"Last Week\";\r\n } else if (filteredBy.range === timeRangeType.thisMonth) {\r\n return \"This Month\";\r\n } else if (filteredBy.range === timeRangeType.lastMonth) {\r\n return \"Last Month\";\r\n } else {\r\n const fromDate = dateFormatter.format(filteredBy.from, {\r\n format: applicationDefaults.formats.date,\r\n timeZone: filteredBy.timeZone,\r\n });\r\n const toDate = dateFormatter.format(filteredBy.to, {\r\n format: applicationDefaults.formats.date,\r\n timeZone: filteredBy.timeZone,\r\n });\r\n return `${fromDate} - ${toDate}`;\r\n }\r\n}\r\n\r\nAnalyticsCounterTemplate.propTypes = {\r\n filteredBy: PropTypes.object.isRequired,\r\n currentCycleNumber: PropTypes.number.isRequired,\r\n previousCycleNumber: PropTypes.number,\r\n timeRangeLabelRenderer: PropTypes.func,\r\n};\r\n\r\nexport default observer(AnalyticsCounterTemplate);\r\n","import React from \"react\";\r\nimport { PropTypes } from \"prop-types\";\r\nimport { mergeCss } from \"mrb/common/utils\";\r\nimport { isNil } from \"lodash\";\r\nfunction TrendingIndicatorTemplate({\r\n showIncreaseNumber = true,\r\n currentCycleNumber,\r\n previousCycleNumber,\r\n classNameExtend,\r\n indicatorClassNameExtend,\r\n}) {\r\n let indicatorClass = null;\r\n if (isNil(previousCycleNumber)) {\r\n indicatorClass = \"up\";\r\n } else {\r\n const diff = previousCycleNumber - currentCycleNumber;\r\n const trend = Math.sign(diff);\r\n if (trend > 0) {\r\n indicatorClass = \"up\";\r\n } else if (trend < 0) {\r\n indicatorClass = \"down\";\r\n } else {\r\n indicatorClass = \"neutral\";\r\n }\r\n }\r\n\r\n return (\r\n \r\n {timeRangeLabelRenderer ? (\r\n timeRangeLabelRenderer({ filteredBy })\r\n ) : (\r\n
\r\n
\r\n ) : (\r\n \r\n
\r\n {item.currentCyclePosition && item.previousCyclePosition && (\r\n \r\n
\r\n \r\n Total # of playbacks in {currentPeriodLabel}\r\n
\r\n{numberFormatter.format(item.currentCycleScore)}
\r\n\r\n
\r\n \r\n {\" \"}\r\n {currentPeriodLabel} chart position\r\n
\r\n{item.currentCyclePosition ? item.currentCyclePosition : \"Unlisted\"}
\r\n\r\n
\r\n \r\n {previousPeriodLabel} chart position\r\n
\r\n{item.previousCyclePosition ? item.previousCyclePosition : \"Unlisted\"}
\r\n\r\n
\r\n )}\r\n \r\n \r\n \r\n View More\r\n \r\n
\r\n \r\n
\r\n );\r\n}\r\n\r\nAnalyticsTimeRangeTemplate.propTypes = {\r\n analyticsTimeRangeViewStore: PropTypes.object.isRequired,\r\n t: PropTypes.func.isRequired,\r\n};\r\n\r\nexport default observer(AnalyticsTimeRangeTemplate);\r\n","import React from \"react\";\r\nimport { PropTypes } from \"prop-types\";\r\nimport { LineChart } from \"common/components\";\r\nimport { MrbRouterLink } from \"mrb/core/infrastructure/router\";\r\nimport { AnalyticsGraphLoader } from \"administration/analytics/components\";\r\nimport { observer } from \"mobx-react\";\r\n\r\nfunction DeviceActivitySummaryTemplate({ deviceActivitySummaryViewStore, t }) {\r\n const {\r\n deviceActivityChartStore,\r\n rootStore: { routerStore },\r\n } = deviceActivitySummaryViewStore;\r\n\r\n return (\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n Active devices\r\n \r\n \r\n
\r\n );\r\n}\r\n\r\nDeviceActivitySummaryTemplate.propTypes = {\r\n deviceActivitySummaryViewStore: PropTypes.object.isRequired,\r\n t: PropTypes.func.isRequired,\r\n};\r\n\r\nexport default observer(DeviceActivitySummaryTemplate);\r\n","import React from \"react\";\r\nimport { PropTypes } from \"prop-types\";\r\nimport { observer } from \"mobx-react\";\r\nimport { map } from \"lodash\";\r\nimport { mergeCss } from \"mrb/common/utils\";\r\nimport { MrbRouterLink } from \"mrb/core/infrastructure/router\";\r\nimport { numberFormatter } from \"common/utils\";\r\nimport { TopTrendingEmptyState, TopTrendingListLoader, TrendingIndicator } from \"administration/analytics/components\";\r\nimport { MrbContentLoader } from \"mrb/components/loader\";\r\nimport { MrbRadioButtons } from \"baasic-react-bootstrap/src\";\r\n\r\nfunction TopTrendingPodcastsTemplate({ topTrendingPodcastsViewStore, t }) {\r\n const {\r\n data,\r\n loaderStore,\r\n filterOptions,\r\n selectedFilterOption,\r\n setFilterOption,\r\n rootStore: { routerStore },\r\n } = topTrendingPodcastsViewStore;\r\n\r\n return (\r\n \r\n
\r\n \r\n \r\n Top 10 trending podcasts\r\n \r\n \r\n
\r\n );\r\n}\r\n\r\nTopTrendingPodcastsTemplate.propTypes = {\r\n topTrendingPodcastsViewStore: PropTypes.object.isRequired,\r\n t: PropTypes.func.isRequired,\r\n};\r\n\r\nexport default observer(TopTrendingPodcastsTemplate);\r\n","import React from \"react\";\r\nimport { PropTypes } from \"prop-types\";\r\nimport { observer } from \"mobx-react\";\r\nimport { map } from \"lodash\";\r\nimport { mergeCss } from \"mrb/common/utils\";\r\nimport { MrbRouterLink } from \"mrb/core/infrastructure/router\";\r\nimport { numberFormatter } from \"common/utils\";\r\nimport { TopTrendingEmptyState, TopTrendingListLoader, TrendingIndicator } from \"administration/analytics/components\";\r\nimport { MrbContentLoader } from \"mrb/components/loader\";\r\nimport { MrbRadioButtons } from \"baasic-react-bootstrap/src\";\r\nfunction TopTrendingStationsTemplate({ topTrendingStationsViewStore, t }) {\r\n const {\r\n data,\r\n loaderStore,\r\n filterOptions,\r\n selectedFilterOption,\r\n setFilterOption,\r\n rootStore: { routerStore },\r\n } = topTrendingStationsViewStore;\r\n\r\n return (\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n {data && data.length > 0 ? (\r\n
\r\n )}\r\n \r\n {map(data, (item) => (\r\n
\r\n ) : (\r\n \r\n
\r\n ))}\r\n \r\n \r\n {item.podcast.title}\r\n \r\n ) : (\r\n Unknown podcast\r\n )}\r\n \r\n
\r\n \r\n {numberFormatter.format(item.currentCycleScore)}\r\n
\r\n\r\n \r\n Top 10 trending stations\r\n \r\n \r\n
\r\n );\r\n}\r\n\r\nTopTrendingStationsTemplate.propTypes = {\r\n topTrendingStationsViewStore: PropTypes.object.isRequired,\r\n t: PropTypes.func.isRequired,\r\n};\r\n\r\nexport default observer(TopTrendingStationsTemplate);\r\n","import React from 'react'\r\n\r\nconst DeviceActivityEmptyStateTemplate = () => {\r\n return (\r\n \r\n
\r\n {/* Top 10 trending stations
*/}\r\n\r\n \r\n
\r\n \r\n {data && data.length > 0 ? (\r\n
\r\n )}\r\n \r\n {map(data, (item) => (\r\n
\r\n ) : (\r\n \r\n
\r\n ))}\r\n \r\n \r\n {item.station.title}\r\n \r\n ) : (\r\n Unknown station\r\n )}\r\n \r\n
\r\n \r\n {numberFormatter.format(item.currentCycleScore)}\r\n
\r\n\r\n \r\n
\r\n )\r\n}\r\n\r\nexport default DeviceActivityEmptyStateTemplate\r\n","import React from \"react\";\r\n\r\nconst TopTrendingEmptyStateTemplate = () => {\r\n return (\r\n No results found
\r\nTry adjusting your search to find what you are looking for.
\r\n\r\n \r\n
\r\n );\r\n};\r\n\r\nexport default TopTrendingEmptyStateTemplate;\r\n","import React from \"react\";\r\nimport { PropTypes } from \"prop-types\";\r\nimport { numberFormatter } from \"common/utils\";\r\nimport { TrendingIndicator } from \"administration/analytics/components\";\r\nimport { MrbRouterLink } from \"mrb/core/infrastructure/router\";\r\nimport { mergeCss } from \"mrb/common/utils\";\r\nimport { Image } from \"common/components\";\r\nimport { isNil } from \"lodash\";\r\n\r\nfunction TrendingListItemTemplate({ item }) {\r\n return (\r\n No trending list
\r\nTry adjusting your search to find what you are looking for.
\r\n\r\n
\r\n );\r\n}\r\n\r\nTrendingListItemTemplate.propTypes = {\r\n item: PropTypes.object.isRequired,\r\n};\r\n\r\nexport default TrendingListItemTemplate;\r\n","import React from \"react\";\r\nimport { PropTypes } from \"prop-types\";\r\nimport { AnalyticsCounter, AnalyticsStatsLoader } from \"administration/analytics/components\";\r\nimport { MrbRouterLink } from \"mrb/core/infrastructure/router\";\r\nimport { numberFormatter } from \"common/utils\";\r\nimport { observer } from \"mobx-react\";\r\nimport { MrbContentLoader } from \"mrb/components/loader\";\r\n\r\nfunction PortalUserDeviceTemplate({ portalViewStore, t }) {\r\n const {\r\n data,\r\n loaderStore,\r\n rootStore: { routerStore },\r\n } = portalViewStore;\r\n\r\n return (\r\n \r\n {item.currentCyclePosition}.\r\n
\r\n\r\n \r\n
\r\n \r\n
\r\n \r\n {item.routeParams ? (\r\n \r\n {item.title}\r\n \r\n ) : (\r\n {item.title || \"Unknown\"}\r\n )}\r\n
\r\n\r\n \r\n
\r\n \r\n \r\n {isNil(item.previousCyclePosition) ? \"Unlisted\" : item.previousCyclePosition}\r\n \r\n PP\r\n
\r\n\r\n \r\n
\r\n {numberFormatter.format(item.score)}
\r\n P\r\n\r\n
\r\n );\r\n}\r\n\r\nPortalUserDeviceTemplate.propTypes = {\r\n portalViewStore: PropTypes.object.isRequired,\r\n t: PropTypes.func.isRequired,\r\n};\r\n\r\nexport default observer(PortalUserDeviceTemplate);\r\n","import React from \"react\";\r\nimport { PropTypes } from \"prop-types\";\r\nimport { observer } from \"mobx-react\";\r\nimport {\r\n AnalyticsCounter,\r\n AnalyticsStatsLoader,\r\n PercentageIncreaseDonutChart,\r\n} from \"administration/analytics/components\";\r\nimport { calculatePercantageIncrease, numberFormatter } from \"common/utils\";\r\nimport { MrbRouterLink } from \"mrb/core/infrastructure/router\";\r\nimport { MrbContentLoader } from \"mrb/components/loader\";\r\nimport { timeRangeType } from \"administration/analytics/constants\";\r\nimport { applicationDefaults } from \"common/constants\";\r\nimport { dateFormatter } from \"mrb/common/formatting\";\r\n\r\nfunction PortalNewDevicesTemplate({ portalViewStore, t }) {\r\n const {\r\n data,\r\n loaderStore,\r\n rootStore: { routerStore },\r\n } = portalViewStore;\r\n\r\n return (\r\n Users & Devices
\r\n\r\n \r\n {data && (\r\n \r\n )}\r\n \r\n
\r\n \r\n \r\n
\r\n )}\r\n \r\n \r\n
\r\n \r\n
\r\n \r\n \r\n
\r\n\r\n \r\n Premium users\r\n \r\n
\r\n\r\n {numberFormatter.format(data.subscriptions.total)}\r\n
\r\n\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n
\r\n\r\n \r\n Registered devices\r\n \r\n
\r\n\r\n {numberFormatter.format(data.registeredUserDevices.total)}{\" \"}\r\n
\r\n\r\n
\r\n \r\n \r\n
\r\n \r\n Portal users\r\n \r\n
\r\n\r\n {numberFormatter.format(data.registeredUsers.total)}\r\n
\r\n\r\n \r\n Connected devices\r\n \r\n \r\n
\r\n );\r\n}\r\n\r\nPortalNewDevicesTemplate.propTypes = {\r\n portalViewStore: PropTypes.object.isRequired,\r\n t: PropTypes.func.isRequired,\r\n};\r\n\r\nfunction TimeRangeLabel({ filteredBy }) {\r\n if (filteredBy.range === timeRangeType.today) {\r\n return \"new devics today\";\r\n } else if (filteredBy.range === timeRangeType.yesterday) {\r\n return \"new devices yesterday\";\r\n } else if (filteredBy.range === timeRangeType.last3Days) {\r\n return \"new devices in the last 3 days\";\r\n } else if (filteredBy.range === timeRangeType.thisWeek) {\r\n return \"new devices this week\";\r\n } else if (filteredBy.range === timeRangeType.lastWeek) {\r\n return \"new devices in the last week\";\r\n } else if (filteredBy.range === timeRangeType.thisMonth) {\r\n return \"new devices this month\";\r\n } else if (filteredBy.range === timeRangeType.lastMonth) {\r\n return \"new devices in the last month\";\r\n } else {\r\n const fromDate = dateFormatter.format(filteredBy.from, {\r\n format: applicationDefaults.formats.date,\r\n timeZone: filteredBy.timeZone,\r\n });\r\n const toDate = dateFormatter.format(filteredBy.to, {\r\n format: applicationDefaults.formats.date,\r\n timeZone: filteredBy.timeZone,\r\n });\r\n return `new devices ${fromDate} - ${toDate}`;\r\n }\r\n}\r\n\r\nexport default observer(PortalNewDevicesTemplate);\r\n","import React from \"react\";\r\nimport { PropTypes } from \"prop-types\";\r\nimport { AnalyticsLayout } from \"administration/analytics/layouts\";\r\nimport {\r\n AnalyticsCounter,\r\n AnalyticsGraphLoader,\r\n PercentageIncreaseDonutChart,\r\n PortalDetailedActivityLoader,\r\n} from \"administration/analytics/components\";\r\nimport { MrbContentLoader } from \"mrb/components/loader\";\r\nimport { calculatePercantageIncrease, numberFormatter } from \"common/utils\";\r\nimport { LineChart } from \"common/components\";\r\nimport { timeRangeLabelParser } from \"administration/analytics/utils\";\r\nimport { observer } from \"mobx-react\";\r\n\r\nfunction PortalDetailedActivityTemplate({ store, activityLabel, totalLabel, nameFieldRenderer, t }) {\r\n const { analyticsTimeRangeViewStore, chartStore } = store;\r\n return (\r\n \r\n \r\n {data && (\r\n \r\n \r\n )}\r\n \r\n )}\r\n \r\n
\r\n \r\n
\r\n\r\n \r\n Total of{\" \"}\r\n \r\n {numberFormatter.format(data.connectedDevices.total)}\r\n {\" \"}\r\n devices\r\n
\r\n\r\n
\r\n \r\n
\r\n \r\n
\r\n\r\n {activityLabel || \"Activity\"}
\r\n\r\n
\r\n \r\n
\r\n \r\n \r\n
\r\n );\r\n});\r\n\r\nexport default observer(PortalDetailedActivityTemplate);\r\n","import React from \"react\";\r\nimport { numberFormatter } from \"common/utils\";\r\nimport { mergeCss } from \"mrb/common/utils\";\r\n\r\nfunction PercentageIncreaseDonutChartTemplate(props) {\r\n const { value, chartSize } = props;\r\n const graphValue = Math.abs(value);\r\n const sign = Math.sign(value);\r\n\r\n return (\r\n Summary
\r\n\r\n {summaryData && (\r\n
\r\n )}\r\n \r\n {nameFieldRenderer && (\r\n
\r\n )}\r\n {nameFieldRenderer({ summaryData })}
\r\n )}\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n {totalLabel || \"Total\"}
\r\n{numberFormatter.format(summaryData.total)}
\r\n\r\n
\r\n \r\n {timeRangeLabelParser.createCurrentCycleLabel(\r\n summaryData.filteredBy.range,\r\n summaryData.filteredBy.from,\r\n summaryData.filteredBy.to,\r\n summaryData.filteredBy.timeZone\r\n )}\r\n
\r\n{numberFormatter.format(summaryData.currentCycleTotal)}
\r\n\r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n {timeRangeLabelParser.createPreviousCycleLabel(\r\n summaryData.filteredBy.range,\r\n summaryData.filteredBy.previousCycleFrom,\r\n summaryData.filteredBy.previousCycleTo,\r\n summaryData.filteredBy.timeZone\r\n )}{\" \"}\r\n (Previous period)\r\n
\r\n{numberFormatter.format(summaryData.previousCycleTotal)}
\r\n\r\n \r\n = 0 ? \"#99ceff\" : \"#cf6679\"}`}\r\n strokeWidth=\"1.5\"\r\n >\r\n\r\n = 0 ? \"#339dff\" : \"#cf6679\"}`}\r\n strokeWidth=\"5\"\r\n strokeDasharray={`${graphValue} ${100 - graphValue}`}\r\n strokeDashoffset=\"25\"\r\n >\r\n\r\n \r\n \r\n {numberFormatter.format(value)}%\r\n \r\n \r\n {sign >= 0 ? \"increase\" : \"decrease\"}\r\n \r\n \r\n \r\n
\r\n );\r\n}\r\n\r\nexport default PercentageIncreaseDonutChartTemplate;\r\n","import React from \"react\";\r\nimport { observer } from \"mobx-react\";\r\nimport { PropTypes } from \"prop-types\";\r\nimport { MrbPageContentHeader } from \"mrb/components/layout\";\r\nimport { MrbGrid } from \"mrb/components/grid\";\r\nimport { TableNoDataOverlay } from \"common/components\";\r\nimport { ContentStatsListLoader, PodcastListenersCell } from \"administration/analytics/components\";\r\n\r\nfunction PodcastListenersListTemplate({ podcastListenersListViewStore, t }) {\r\n const { gridStore } = podcastListenersListViewStore;\r\n return (\r\n \r\n
\r\n );\r\n}\r\n\r\nPodcastListenersListTemplate.propTypes = {\r\n podcastListenersListViewStore: PropTypes.object.isRequired,\r\n t: PropTypes.func,\r\n};\r\n\r\nexport default observer(PodcastListenersListTemplate);\r\n","import React from \"react\";\r\nimport { observer } from \"mobx-react\";\r\nimport { PropTypes } from \"prop-types\";\r\nimport { MrbPageContentHeader } from \"mrb/components/layout\";\r\nimport { MrbGrid } from \"mrb/components/grid\";\r\nimport { TableNoDataOverlay } from \"common/components\";\r\nimport { ContentStatsListLoader, NakiNigunListenersCell } from \"administration/analytics/components\";\r\n\r\nfunction NakiNigunListTemplate({ nakiNigunListenersListViewStore, t }) {\r\n const { gridStore } = nakiNigunListenersListViewStore;\r\n return (\r\n \r\n
\r\n \r\n
\r\n \r\n Position\r\n \r\n Title\r\n \r\n # of Devices\r\n
\r\n \r\n
\r\n );\r\n}\r\n\r\nNakiNigunListTemplate.propTypes = {\r\n nakiNigunListenersListViewStore: PropTypes.object.isRequired,\r\n t: PropTypes.func,\r\n};\r\n\r\nexport default observer(NakiNigunListTemplate);\r\n","import React from \"react\";\r\nimport { observer } from \"mobx-react\";\r\nimport { PropTypes } from \"prop-types\";\r\nimport { MrbPageContentHeader } from \"mrb/components/layout\";\r\nimport { MrbGrid } from \"mrb/components/grid\";\r\nimport { TableNoDataOverlay } from \"common/components\";\r\nimport { ContentStatsListLoader, StationListenersCell } from \"administration/analytics/components\";\r\n\r\nfunction StationListenersListTemplate({ stationListenersListViewStore, t }) {\r\n const { gridStore } = stationListenersListViewStore;\r\n return (\r\n \r\n
\r\n \r\n
\r\n \r\n Position\r\n \r\n Title\r\n \r\n # of Devices\r\n
\r\n \r\n
\r\n );\r\n}\r\n\r\nStationListenersListTemplate.propTypes = {\r\n stationListenersListViewStore: PropTypes.object.isRequired,\r\n t: PropTypes.func,\r\n};\r\n\r\nexport default observer(StationListenersListTemplate);\r\n","import React from \"react\";\r\nimport { Image } from \"common/components\";\r\nimport { numberFormatter } from \"common/utils\";\r\nimport { MrbRouterLink } from \"mrb/core/infrastructure/router\";\r\nimport { isNil } from \"lodash\";\r\n\r\nfunction PodcastListenersCellTemplate({ item }) {\r\n return (\r\n \r\n
\r\n \r\n
\r\n \r\n Position\r\n \r\n Title\r\n \r\n # of Devices\r\n
\r\n \r\n
\r\n );\r\n}\r\n\r\nexport default PodcastListenersCellTemplate;\r\n","import React from \"react\";\r\nimport { Image } from \"common/components\";\r\nimport { numberFormatter } from \"common/utils\";\r\nimport { MrbRouterLink } from \"mrb/core/infrastructure/router\";\r\n\r\nfunction StationListenersCellTemplate({ item }) {\r\n return (\r\n \r\n {item.position}.\r\n
\r\n \r\n
\r\n \r\n {isNil(item.podcastGroupId) ? (\r\n
\r\n\r\n \r\n \r\n {item.title}\r\n \r\n {item.isPremium ? : null}\r\n
\r\n ) : (\r\n \r\n
\r\n )}\r\n \r\n \r\n {item.title}\r\n \r\n {item.isPremium ? (\r\n \r\n ) : null}\r\n
\r\n {item.podcastGroupTitle}
\r\n {numberFormatter.format(item.total)}
\r\n \r\n
\r\n );\r\n}\r\n\r\nexport default StationListenersCellTemplate;\r\n","import React from \"react\";\r\nimport { Image } from \"common/components\";\r\nimport { numberFormatter } from \"common/utils\";\r\nimport { MrbRouterLink } from \"mrb/core/infrastructure/router\";\r\n\r\nfunction NakiNigunListenersCellTemplate({ item }) {\r\n return (\r\n \r\n {item.position}.\r\n
\r\n \r\n
\r\n \r\n
\r\n\r\n \r\n \r\n {item.title}\r\n \r\n {item.isPremium ? : null}\r\n
\r\n {numberFormatter.format(item.total)}
\r\n \r\n
\r\n );\r\n}\r\n\r\nexport default NakiNigunListenersCellTemplate;\r\n","import React from \"react\";\r\nimport { PropTypes } from \"prop-types\";\r\nimport { observer } from \"mobx-react\";\r\nimport { map } from \"lodash\";\r\nimport { mergeCss } from \"mrb/common/utils\";\r\nimport { MrbRouterLink } from \"mrb/core/infrastructure/router\";\r\nimport { numberFormatter } from \"common/utils\";\r\nimport { TopTrendingEmptyState, TopTrendingListLoader, TrendingIndicator } from \"administration/analytics/components\";\r\nimport { MrbContentLoader } from \"mrb/components/loader\";\r\nimport { MrbRadioButtons } from \"baasic-react-bootstrap/src\";\r\n\r\nfunction TopTrendingNakiNigunAlbumsTemplate({ topTrendingNakiNigunAlbumsViewStore, t }) {\r\n const {\r\n data,\r\n loaderStore,\r\n filterOptions,\r\n selectedFilterOption,\r\n setFilterOption,\r\n rootStore: { routerStore },\r\n } = topTrendingNakiNigunAlbumsViewStore;\r\n\r\n return (\r\n \r\n {item.position}.\r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n {item.title}\r\n \r\n {item.isPremium ? : null}\r\n
\r\n {item.artistName}
\r\n {numberFormatter.format(item.total)}
\r\n \r\n \r\n Top 10 trending albums\r\n \r\n \r\n
\r\n );\r\n}\r\n\r\nTopTrendingNakiNigunAlbumsTemplate.propTypes = {\r\n topTrendingNakiNigunAlbumsViewStore: PropTypes.object.isRequired,\r\n t: PropTypes.func.isRequired,\r\n};\r\n\r\nexport default observer(TopTrendingNakiNigunAlbumsTemplate);\r\n","import React from \"react\";\r\nimport { DeviceHardwareCellTemplate } from \"themes/administration/analytics/components\";\r\n\r\nfunction DeviceHardwareCell(props) {\r\n return \r\n
\r\n \r\n \r\n
\r\n \r\n {data && data.length > 0 ? (\r\n
\r\n )}\r\n \r\n {map(data, (item) => (\r\n
\r\n ) : (\r\n \r\n
\r\n ))}\r\n \r\n \r\n {item.nakiNigunAlbum.title}\r\n \r\n ) : (\r\n Unknown album\r\n )}\r\n \r\n
\r\n \r\n {numberFormatter.format(item.currentCycleScore)}\r\n
\r\nApplication is loading
;\r\n }\r\n\r\n return (\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n );\r\n}\r\n\r\nMrbMenuToggle.propTypes = {\r\n menuStore: PropTypes.object.isRequired,\r\n};\r\n\r\nexport default observer(MrbMenuToggle);\r\n","import React from \"react\";\r\nimport PropTypes from \"prop-types\";\r\nimport { MrbMenuItem, MrbSecondaryMenuLevel } from \"./\";\r\nimport { observer } from \"mobx-react\";\r\nimport { map } from \"lodash\";\r\n\r\nfunction MrbPrimaryMenuLevel({ menuStore, t = (i) => i }) {\r\n const { menu } = menuStore;\r\n return (\r\n - \r\n {map(menu, (item) => {\r\n return (\r\n
- \r\n {map(secondaryMenu, (item) => {\r\n return (\r\n
There is no data.
;\r\n}\r\n\r\nexport default MrbGridEmptyState;\r\n","import React from \"react\";\r\nimport { PropTypes } from \"prop-types\";\r\nimport { MrbGridEmptyState } from \"./components\";\r\nimport { MrbPager } from \"../pager\";\r\nimport { MrbContentLoader, MrbRectangleContentLoader } from \"../loader\";\r\nimport { map } from \"lodash\";\r\nimport { observer } from \"mobx-react\";\r\nimport { mergeOrOverrideCss } from \"../../common/utils\";\r\n\r\nfunction MrbGrid({\r\n store,\r\n cellRender,\r\n pagerRender,\r\n t,\r\n classNameOverride,\r\n classNameExtend,\r\n emptyStateRender = () => \r\n \r\n {map(data, (item, index) => (\r\n \r\n {cellRender({\r\n item,\r\n actions,\r\n onCellClick,\r\n valueFormatter:\r\n formatValue,\r\n t,\r\n })}\r\n \r\n ))}\r\n
\r\n \r\n ) : (\r\n \r\n \r\n {title &&
\r\n );\r\n};\r\n\r\nexport default HomeListLoaderTemplate;\r\n","import React from \"react\";\r\nimport ContentLoader from \"react-content-loader\";\r\n\r\nconst HomePreviewStationsLoaderTemplate = (props) => {\r\n const screenwidth = window.innerWidth;\r\n let loaderWidth;\r\n\r\n if (screenwidth > 1200) {\r\n loaderWidth = 380;\r\n } else if (screenwidth > 990) {\r\n loaderWidth = screenwidth - 260;\r\n } else {\r\n loaderWidth = screenwidth;\r\n }\r\n\r\n const items = [];\r\n let row = 3;\r\n let y = 0;\r\n\r\n for (let i = 0; i < row; i++) {\r\n items.push(\r\n \r\n
\r\n );\r\n};\r\n\r\nconst HomePreviewCollapsePanelLoaderTemplate = (props) => {\r\n const screenwidth = window.innerWidth;\r\n let loaderWidth;\r\n\r\n if (screenwidth > 1200) {\r\n loaderWidth = screenwidth - 690;\r\n } else if (screenwidth > 988) {\r\n loaderWidth = screenwidth - 200;\r\n } else {\r\n loaderWidth = screenwidth - 64;\r\n }\r\n\r\n return (\r\n \r\n \r\n
\r\n {screenwidth > 1198 && }\r\n No results found
\r\nTry adjusting your search to find what you are looking for.
\r\n \r\n );\r\n}\r\n\r\nHomeEmptyStateTemplate.propTypes = {\r\n t: PropTypes.func.isRequired,\r\n classNameExtend: PropTypes.string,\r\n classNameOverride: PropTypes.string,\r\n};\r\n\r\nexport default HomeEmptyStateTemplate;\r\n","import React from \"react\";\r\nimport { PropTypes } from \"prop-types\";\r\nimport { MrbModal } from \"mrb/components/modal\";\r\nimport { MrbButton } from \"mrb/components/button\";\r\n\r\nfunction ConnectDeviceModalTemplate({\r\n title = \"APPLICATION.HOME.CONNECT_DEVICE.TITLE\",\r\n description = \"APPLICATION.HOME.CONNECT_DEVICE.DESCRIPTION\",\r\n modalParams,\r\n t,\r\n}) {\r\n const { params } = modalParams;\r\n return (\r\n\r\n
\r\n \r\n \r\n
\r\n \r\n
\r\n {t(title)}
\r\n\r\n
\r\n {t(description)}
\r\n\r\n
\r\n OR
\r\n onCellClick(item)} className=\"c-home__preview__item c-home__preview__item--search\">\r\n
\r\n );\r\n}\r\n\r\nHomeSearchResultGridCellTemplate.propTypes = {\r\n item: PropTypes.object.isRequired,\r\n};\r\n\r\nexport default HomeSearchResultGridCellTemplate;\r\n","import { podcastType } from \"common/constants\";\r\n\r\nfunction getContentActivityStatusIcon(item) {\r\n if (item.podcastType === podcastType.podcastGroup) {\r\n if (item.numberOfEnabledSubPodcasts === 0) {\r\n return \"c-home__status--disabled\";\r\n } else if (item.numberOfSubPodcasts === item.numberOfEnabledSubPodcasts) {\r\n return \"c-home__status--enabled\";\r\n } else if (item.numberOfSubPodcasts > item.numberOfEnabledSubPodcasts) {\r\n return \"c-home__status--mix\";\r\n }\r\n } else {\r\n if (item.isTurnedOn) {\r\n return \"c-home__status--enabled\";\r\n } else {\r\n return \"c-home__status--disabled\";\r\n }\r\n }\r\n return null;\r\n}\r\n\r\nexport default getContentActivityStatusIcon;\r\n","import React from \"react\";\r\nimport { PropTypes } from \"prop-types\";\r\nimport { mergeCss } from \"mrb/common/utils\";\r\nimport { MrbCheckbox } from \"mrb/components/checkbox\";\r\nimport { getContentActivityStatusIcon } from \"application/home/utils\";\r\nimport { podcastType, podcastContentType } from \"common/constants\";\r\nimport { PremiumBadge, Image } from \"common/components\";\r\nimport { useCanAccessContent, nakiRadioContentType } from \"application/common/content-access\";\r\nimport { isNil } from \"lodash\";\r\nimport { observer } from \"mobx-react\";\r\n\r\nfunction HomeGridCellTemplate({ onCellClick, goTo, item, homeManageSelectedItemsViewStore }) {\r\n const { isBulk, selectItem, selectedItems } = homeManageSelectedItemsViewStore;\r\n let contentType;\r\n if (!isNil(item.stationId)) {\r\n contentType = nakiRadioContentType.station;\r\n } else if (!isNil(item.podcastId)) {\r\n contentType = nakiRadioContentType.podcast;\r\n }\r\n const contentAccessResult = useCanAccessContent(contentType, {\r\n isPremium: item.isPremium,\r\n isLegacySubscriptionValid: item.validLegacySubscription,\r\n unavailableInMobileApp: item.isVisibleInApp === false,\r\n unavailableInNakiTouch: item.isVisibleInEmbeddedApp === false,\r\n });\r\n\r\n return (\r\n \r\n
\r\n \r\n
\r\n \r\n {item.title}{\" \"}\r\n {item.isPremium && !contentAccessResult.canAccessPremium && (\r\n \r\n )}\r\n
\r\n {item.parentPodcastTitle && (\r\n \r\n {item.parentPodcastTitle}\r\n
\r\n )}\r\n \r\n {}}\r\n value={\r\n selectedItems.find(\r\n (x) => x.stationId === item.stationId && x.podcastId === item.podcastId\r\n ) !== undefined\r\n }\r\n />\r\n
\r\n )}\r\n goTo(item)}>\r\n {item.title}\r\n
\r\n \r\n );\r\n}\r\n\r\nHomeGridCellTemplate.propTypes = {\r\n onCellClick: PropTypes.func.isRequired,\r\n premiumSubscriptionStore: PropTypes.object.isRequired,\r\n goTo: PropTypes.func.isRequired,\r\n item: PropTypes.object.isRequired,\r\n};\r\n\r\nexport default observer(HomeGridCellTemplate);\r\n","import React from \"react\";\r\nimport { PropTypes } from \"prop-types\";\r\nimport { MrbButton } from \"mrb/components/button\";\r\nimport { MrbRouterLink } from \"mrb/core/infrastructure/router\";\r\nimport { HomeDeviceSelect, TogglePremium } from \"application/home/components\";\r\nimport { observer } from \"mobx-react\";\r\nimport { isNil } from \"lodash\";\r\n\r\nfunction HomePreviewHeaderTemplate({ store, hideStatusButton, t }) {\r\n const {\r\n deviceSelectStore,\r\n goBack,\r\n rootStore: { userDeviceStore },\r\n } = store;\r\n\r\n return (\r\n \r\n \r\n \r\n ) : (\r\n {\r\n event.stopPropagation();\r\n event.preventDefault();\r\n }}\r\n >\r\n Connect Device\r\n \r\n )}\r\n
\r\n );\r\n}\r\n\r\nHomePreviewHeaderTemplate.propTypes = {\r\n store: PropTypes.object.isRequired,\r\n hideStatusButton: PropTypes.bool,\r\n t: PropTypes.func.isRequired,\r\n};\r\n\r\nconst StatusToggle = observer(function StatusToggle({ store, t }) {\r\n const { item, updateTurnedOnStatus, statusToggleLoader, updatingStatus, isTurnedOn, contentAccessResult } = store;\r\n if (isNil(item)) {\r\n return null;\r\n }\r\n if (!contentAccessResult.canAccessOnSelectedDevice) {\r\n return (\r\n \r\n \r\n
\r\n {userDeviceStore.deviceCount > 0 ? (\r\n \r\n
\r\n )}\r\n \r\n {\r\n setIsDeviceSyncEnabled(!isDeviceSyncEnabled);\r\n event.preventDefault();\r\n event.stopPropagation();\r\n }}\r\n />\r\n
\r\n );\r\n});\r\n\r\nconst DeviceOption = observer(function DeviceOption({ option, userDeviceStore }) {\r\n const { isDeviceSyncEnabled } = userDeviceStore;\r\n const isMobile = option.item.device.systemType.abrv;\r\n const isDisabled = option.item.isDisabled;\r\n\r\n return (\r\n {selectedOption.label}
\r\n \r\n \r\n \r\n
\r\n\r\n {option.label}\r\n \r\n );\r\n});\r\n\r\nexport default HomeDeviceSelectTemplate;\r\n","import React from \"react\";\r\nimport { PropTypes } from \"prop-types\";\r\nimport { MrbSimpleSelect } from \"mrb/components/select\";\r\n\r\nfunction HomeOrderBySelectTemplate({ store, t }) {\r\n return (\r\n \r\n \r\n
\r\n \r\n );\r\n}\r\n\r\nHomePageHeaderTemplate.propTypes = {\r\n homeViewStore: PropTypes.object.isRequired,\r\n t: PropTypes.func.isRequired,\r\n};\r\n\r\nexport default observer(HomePageHeaderTemplate);\r\n","import React from \"react\";\r\nimport PropTypes from \"prop-types\";\r\nimport { MrbPage } from \"mrb/components/layout\";\r\nimport { getPageObject } from \"mrb/components/layout/utils\";\r\n\r\nfunction HomePageLayoutTemplate({ store, children, t, ...pageProps }) {\r\n const { header, content } = getPageObject(children);\r\n\r\n return (\r\n \r\n
\r\n\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n\r\n \r\n
\r\n \r\n {anyDevice && !inSearchMode && (\r\n
\r\n \r\n
\r\n )}\r\n \r\n
\r\n {content.children}
\r\n {content.footer}\r\n \r\n
\r\n )}\r\n \r\n );\r\n}\r\n\r\nHomeSubPodcastTemplate.propTypes = {\r\n homeSubPodcastViewStore: PropTypes.object.isRequired,\r\n};\r\n\r\nconst SubPodcastPanelHeader = observer(function SubPodcastPanelHeader({ homeSubPodcastViewStore, isCollapsed, t }) {\r\n const {\r\n subPodcast,\r\n coverImageUrl,\r\n isTurnedOn,\r\n isDisabled,\r\n toggleSubPodcastStatus,\r\n contentAccessResult,\r\n rootStore: { premiumSubscriptionStore, userDeviceStore },\r\n } = homeSubPodcastViewStore;\r\n const isLegacySubscriptionValid = premiumSubscriptionStore.isLegacySubscriptionActive(\r\n subPodcast.legacySubscriptionExpirationDate\r\n );\r\n return (\r\n \r\n
\r\n\r\n \r\n
\r\n \r\n {t(\"APPLICATION.HOME.PODCAST.FIELDS.DESCRIPTION_LINK\")}\r\n
\r\n {subPodcast.descriptionLink && (\r\n \r\n {subPodcast.descriptionLink}\r\n \r\n )}\r\n\r\n
\r\n\r\n {t(\"APPLICATION.HOME.PODCAST.FIELDS.LOCATION\")}
\r\n{subPodcast.location && subPodcast.location.name}
\r\n\r\n
\r\n\r\n {t(\"APPLICATION.HOME.PODCAST.FIELDS.LANGUAGE\")}
\r\n{subPodcast.language && subPodcast.language.name}
\r\n\r\n
\r\n\r\n {t(\"APPLICATION.HOME.PODCAST.FIELDS.GENRES\")}
\r\n {subPodcast.genres}\r\n\r\n \r\n {subPodcast.alternativeDescription}\r\n \r\n
\r\n \r\n {t(\"APPLICATION.HOME.PODCAST.FIELDS.DESCRIPTION\")}\r\n
\r\n\r\n \r\n \r\n
\r\n \r\n
\r\n \r\n\r\n {userDeviceStore.deviceCount > 0 && contentAccessResult.canAccessOnSelectedDevice && (\r\n \r\n
\r\n {!contentAccessResult.canAccessOnSelectedDevice && \r\n {subPodcast.title}\r\n
\r\n {!contentAccessResult.canAccessPremium && (\r\n \r\n )}\r\n\r\n Old subscription until:{\" \"}\r\n \r\n {dateFormatter.format(subPodcast.legacySubscriptionExpirationDate, {\r\n format: applicationDefaults.formats.date,\r\n })}\r\n \r\n
\r\n )}\r\n\r\n \r\n {\r\n toggleSubPodcastStatus(!isTurnedOn);\r\n }}\r\n icon=\"u-icon u-icon--lrg u-icon--premium--white\"\r\n classNameOverride={mergeCss(\r\n \"c-btn c-btn--xsml c-btn--status c-btn--rounded\",\r\n isTurnedOn ? \"c-btn--status--enabled\" : \"c-btn--status--disabled\"\r\n )}\r\n />\r\n \r\n
\r\n )}\r\n \r\n
\r\n\r\n \r\n
\r\n \r\n
\r\n\r\n \r\n
\r\n \r\n
\r\n )}\r\n \r\n
\r\n )}\r\n\r\n \r\n
\r\n\r\n {/* Search results
\r\n\r\n\r\n
\r\n \r\n
*/}\r\n \r\n
\r\n )}\r\n \r\n
\r\n\r\n \r\n {t(\"APPLICATION.HOME.LIST.GENERIC_SEARCH.APPEARS_IN\")}\r\n
\r\n {isAppearsInScrollable && (\r\n \r\n
\r\n )}\r\n \r\n
\r\n \r\n {map(podcastGroups, (podcastGroup) => (\r\n
\r\n onClickPodcastGroup(item)}>\r\n
\r\n );\r\n}\r\n\r\nexport default observer(HomeSearchResultsTemplate);\r\n","import React from \"react\";\r\nimport { PropTypes } from \"prop-types\";\r\nimport { MrbCheckbox } from \"mrb/components/checkbox\";\r\nimport { PremiumBadge, Image } from \"common/components\";\r\nimport { MrbContentLoader } from \"mrb/components/loader\";\r\nimport { getContentActivityStatusIcon } from \"application/home/utils\";\r\nimport { useCanAccessContent, nakiRadioContentType } from \"application/common/content-access\";\r\nimport { HomeListLoader } from \"application/home/components\";\r\nimport { mergeCss } from \"mrb/common/utils\";\r\nimport { map, isNil } from \"lodash\";\r\nimport { podcastType, podcastContentType } from \"common/constants\";\r\nimport { observer } from \"mobx-react\";\r\n\r\nfunction HomeFeaturedContentTemplate({ homeFeaturedContentViewStore, homeManageSelectedItemsViewStore, t }) {\r\n const {\r\n items,\r\n loaderStore,\r\n onClickFeaturedItem,\r\n isFeaturedScrollable,\r\n scrollFeaturedLeft,\r\n scrollFeaturedRight,\r\n setFeaturedContainerRef,\r\n goTo,\r\n } = homeFeaturedContentViewStore;\r\n const { isBulk } = homeManageSelectedItemsViewStore;\r\n\r\n return (\r\n \r\n
\r\n \r\n
\r\n {item.title}
\r\n \r\n
\r\n )}\r\n \r\n
\r\n\r\n \r\n {t(\"APPLICATION.HOME.LIST.FEATURED\")}\r\n
\r\n {isFeaturedScrollable && (\r\n \r\n
\r\n )}\r\n \r\n
\r\n \r\n {map(items, (item) => (\r\n
\r\n \r\n {}}\r\n value={\r\n selectedItems.find(\r\n (x) => x.stationId === item.stationId && x.podcastId === item.podcastId\r\n ) !== undefined\r\n }\r\n />\r\n
\r\n )}\r\n \r\n {isBulk ? (\r\n
\r\n );\r\n}\r\n\r\nHomeManageSelectedItemsTemplate.propTypes = {\r\n homeManageSelectedItemsViewStore: PropTypes.object.isRequired,\r\n t: PropTypes.func.isRequired,\r\n};\r\n\r\nexport default observer(HomeManageSelectedItemsTemplate);\r\n","import React from \"react\";\r\nimport { HomeListSearchLoaderTemplate } from \"themes/application/home/components\";\r\n\r\nfunction HomeListSearchLoader(props) {\r\n return \r\n
\r\n ) : (\r\n \r\n changeTurnOn(true)}\r\n disabled={isUpdating || !homeManageSelectedItemsViewStore.isSelectedItemsAny}\r\n />\r\n changeTurnOn(false)}\r\n disabled={isUpdating || !homeManageSelectedItemsViewStore.isSelectedItemsAny}\r\n />\r\n
\r\n \r\n
\r\n )}\r\n \r\n
\r\n )\r\n}\r\n\r\nexport default ExplorePremiumLoaderTemplate\r\n\r\nconst ExplorePremiumItem = (props) => {\r\n const { loaderWidth } = props\r\n const screenwidth = window.innerWidth;\r\n\r\n let imgSize = 150;\r\n\r\n let imgX = \"38%\";\r\n let titleX = \"40%\";\r\n\r\n let titleY = 234;\r\n let loaderHeight = 290;\r\n let borderLineY = 274;\r\n let arrowY = 258;\r\n\r\n if (screenwidth > 1199) {\r\n imgSize = 220;\r\n } else if (screenwidth > 988) {\r\n imgX = \"20%\";\r\n titleX = \"26%\";\r\n imgSize = 220;\r\n } else if (screenwidth > 550) {\r\n imgX = \"31%\";\r\n titleX = \"34%\";\r\n imgSize = 220;\r\n } else {\r\n imgX = \"30%\";\r\n titleX = \"26%\";\r\n\r\n loaderHeight = 234;\r\n\r\n arrowY = arrowY - 56;\r\n titleY = titleY - 70;\r\n }\r\n\r\n return (\r\n \r\n \r\n {screenwidth > 1199 ?\r\n \r\n \r\n :\r\n \r\n \r\n }\r\n \r\n
\r\n )\r\n}","import React, { useRef, useState, useEffect } from \"react\";\r\nimport ContentLoader from \"react-content-loader\";\r\n\r\nconst PaymentCardLoaderTemplate = (props) => {\r\n const ref = useRef(null);\r\n const [loaderWidth, setLoaderWidth] = useState(0);\r\n const loaderHeight = 580;\r\n\r\n useEffect(() => {\r\n setLoaderWidth(ref.current.offsetWidth);\r\n }, []);\r\n\r\n return (\r\n \r\n \r\n {/* Img */}\r\n
\r\n );\r\n};\r\n\r\nconst InfoList = ({ start, list = 4 }) => {\r\n const infoList = [];\r\n let y = start;\r\n\r\n for (let i = 0; i < list; i++) {\r\n infoList.push(\r\n \r\n \r\n
\r\n \r\n \r\n
\r\n \r\n \r\n
\r\n );\r\n};\r\n\r\nexport default PlanCardLoaderTemplate;\r\n","import React, { useRef, useState, useEffect } from \"react\";\r\nimport ContentLoader from \"react-content-loader\";\r\nimport { PlanCardLoader } from \"application/payment/components\";\r\n\r\nconst ChangeSubscriptionPlanLoaderTemplate = () => {\r\n return (\r\n \r\n
\r\n );\r\n};\r\n\r\nexport default ChangeSubscriptionPlanLoaderTemplate;\r\n\r\nconst ChangeSubscriptionInfoLoader = (props) => {\r\n const ref = useRef(null);\r\n const [loaderWidth, setLoaderWidth] = useState(0);\r\n const loaderHeight = 495;\r\n\r\n useEffect(() => {\r\n setLoaderWidth(ref.current.offsetWidth);\r\n }, []);\r\n\r\n return (\r\n \r\n
\r\n\r\n \r\n \r\n
\r\n \r\n \r\n
\r\n );\r\n};\r\n","import React from \"react\";\r\nimport { PropTypes } from \"prop-types\";\r\nimport { applicationErrorCodes } from \"common/constants\";\r\n\r\nfunction InvalidPaymentInfoTemplate({ subscription, paymentError, t }) {\r\n let message = null;\r\n if (paymentError) {\r\n if (paymentError.errorCode === applicationErrorCodes.payment.paymentFailedExpiredCreditCard) {\r\n message = (\r\n \r\n Your credit card has expired. In order to continue using {subscription.product.name} subscription,\r\n provide new credit card information.\r\n \r\n );\r\n } else if (paymentError.errorCode === applicationErrorCodes.payment.paymentFailedInvalidCreditCard) {\r\n message = (\r\n \r\n Your credit card is invalid. In order to continue using {subscription.product.name} subscription,\r\n provide new credit card information.\r\n \r\n );\r\n } else {\r\n message = (\r\n \r\n We are unable to process the credit card payment. In order to continue using{\" \"}\r\n {subscription.product.name} subscription, provide new credit card, or contact the\r\n support team.\r\n \r\n );\r\n }\r\n }\r\n\r\n if (!message) {\r\n return null;\r\n }\r\n\r\n return {message}
;\r\n}\r\n\r\nInvalidPaymentInfoTemplate.propTypes = {\r\n subscription: PropTypes.object.isRequired,\r\n paymentError: PropTypes.object.isRequired,\r\n t: PropTypes.func.isRequired,\r\n};\r\n\r\nexport default InvalidPaymentInfoTemplate;\r\n","import { PropTypes } from \"prop-types\";\r\nimport { isNil } from \"lodash\";\r\nimport moment from \"moment\";\r\n\r\nfunction PremiumTrialExpirationTemplate({ subscription, t }) {\r\n const todayDate = moment().startOf(\"day\");\r\n const diff = moment(subscription.trialPeriod.trialEndDate).startOf(\"day\").diff(todayDate, \"days\");\r\n\r\n if (isNil(subscription.nextBillingDate)) {\r\n return getTrialExpiresDescription(diff, subscription.product, t);\r\n }\r\n return getPremiumStartsDescription(diff, subscription.product, t);\r\n}\r\n\r\nPremiumTrialExpirationTemplate.propTypes = {\r\n subscription: PropTypes.object.isRequired,\r\n t: PropTypes.func,\r\n};\r\n\r\nfunction getPremiumStartsDescription(daysDiff, product, t) {\r\n if (daysDiff === 1) {\r\n return t(\"APPLICATION.PREMIUM.PREMIUM_STARTS.DESCRIPTION_TOMORROW\", { subscriptionPlan: product.name });\r\n } else if (daysDiff === 0) {\r\n return t(\"APPLICATION.PREMIUM.PREMIUM_STARTS.DESCRIPTION_TODAY\", { subscriptionPlan: product.name });\r\n }\r\n return t(\"APPLICATION.PREMIUM.PREMIUM_STARTS.DESCRIPTION\", { daysNum: daysDiff, subscriptionPlan: product.name });\r\n}\r\n\r\nfunction getTrialExpiresDescription(daysDiff, product, t) {\r\n if (daysDiff === 1) {\r\n return t(\"APPLICATION.PREMIUM.TRIAL_WIDGET.DESCRIPTION_TOMORROW\", { subscriptionPlan: product.name });\r\n } else if (daysDiff === 0) {\r\n return t(\"APPLICATION.PREMIUM.TRIAL_WIDGET.DESCRIPTION_TODAY\", { subscriptionPlan: product.name });\r\n }\r\n return t(\"APPLICATION.PREMIUM.TRIAL_WIDGET.DESCRIPTION\", { daysNum: daysDiff, subscriptionPlan: product.name });\r\n}\r\n\r\nexport default PremiumTrialExpirationTemplate;\r\n","import React from \"react\";\r\nimport { PropTypes } from \"prop-types\";\r\nimport { PremiumBadge, HTMLRender, Image } from \"common/components\";\r\nimport { MrbCollapsiblePanel } from \"mrb/components/collapsible-panel\";\r\nimport { PremiumContentSubListItem } from \"application/payment/components\";\r\nimport { HomeListLoader } from \"application/home/components\";\r\nimport { map } from \"lodash\";\r\nimport { observer } from \"mobx-react\";\r\nimport { MrbContentLoader } from \"mrb/components/loader\";\r\n\r\nfunction PremiumContentListItemTemplate({ premiumContentListItemViewStore, item, premiumContentListViewStore }) {\r\n const { goTo } = premiumContentListViewStore;\r\n const { isCollapsed, toggleCollapse, setPanelRef, hasSubContent } = premiumContentListItemViewStore;\r\n\r\n return (\r\n \r\n {map(items, (item) => (\r\n
\r\n )}\r\n \r\n );\r\n});\r\n\r\nconst ContentItemPanelHeader = observer(function ContentItemPanelHeader({\r\n item,\r\n isCollapsed,\r\n onCellClick,\r\n hasSubContent,\r\n}) {\r\n return (\r\n \r\n {hasSubContent && (\r\n \r\n )}\r\n {item.alternativeDescription} \r\n
\r\n \r\n \r\n
\r\n \r\n
\r\n \r\n onCellClick(item)}\r\n >\r\n {item.title}\r\n
\r\n \r\n
\r\n );\r\n}\r\n\r\nconst ContentFilter = observer(function ContentFilter({ premiumContentListViewStore, t }) {\r\n const { contentTypeOptions, queryUtility, changeContentFilter } = premiumContentListViewStore;\r\n if (isNil(contentTypeOptions)) {\r\n return null;\r\n }\r\n if (contentTypeOptions.length <= 1) {\r\n return null;\r\n }\r\n return (\r\n Explore {selectedSubscriptionPlan.name} Content
\r\n\r\n
\r\n );\r\n});\r\n\r\nPremiumContentListTemplate.propTypes = {\r\n premiumContentListViewStore: PropTypes.object.isRequired,\r\n t: PropTypes.func,\r\n};\r\n\r\nexport default observer(PremiumContentListTemplate);\r\n","import React from \"react\";\r\nimport { PropTypes } from \"prop-types\";\r\nimport { MrbRouterLink } from \"mrb/core/infrastructure/router\";\r\nimport { join, map } from \"lodash\";\r\n\r\nfunction PastDueSubscriptionWidgetTemplate({ subscriptions, t }) {\r\n const productNames = map(subscriptions, (subscription) => subscription.product.name);\r\n return (\r\n \r\n \r\n {t(\"APPLICATION.PREMIUM.PAST_DUE_WIDGET.ACTION\")}\r\n \r\n
\r\n );\r\n}\r\n\r\nPastDueSubscriptionWidgetTemplate.propTypes = {\r\n subscriptions: PropTypes.object.isRequired,\r\n t: PropTypes.func.isRequired,\r\n};\r\n\r\nexport default PastDueSubscriptionWidgetTemplate;\r\n","import React from \"react\";\r\nimport { PropTypes } from \"prop-types\";\r\nimport { MrbButton } from \"mrb/components/button\";\r\nimport { isNil } from \"lodash\";\r\n\r\nfunction CreditCardInfoTemplate({ creditCard, onClickUpdateCreditCard, t }) {\r\n if (isNil(creditCard)) {\r\n return null;\r\n }\r\n\r\n return (\r\n \r\n \r\n
\r\n\r\n {t(\"APPLICATION.PREMIUM.PAST_DUE_WIDGET.TITLE\")}
\r\n\r\n {t(\r\n productNames.length > 1\r\n ? \"APPLICATION.PREMIUM.PAST_DUE_WIDGET.DESCRIPTION_PLURAL\"\r\n : \"APPLICATION.PREMIUM.PAST_DUE_WIDGET.DESCRIPTION\",\r\n {\r\n subscriptionPlan: join(productNames, \" and \"),\r\n }\r\n )}\r\n
\r\n\r\n\r\n \r\n #### #### #### {creditCard.last4Numbers} {\" \"}\r\n \r\n {t(`APPLICATION.PREMIUM.CREDIT_CARD_BRAND.${creditCard.brand.toUpperCase()}`)}\r\n \r\n {onClickUpdateCreditCard && (\r\n
\r\n );\r\n}\r\n\r\nCreditCardInfoTemplate.propTypes = {\r\n creditCard: PropTypes.object.isRequired,\r\n onClickUpdateCreditCard: PropTypes.func,\r\n secondary: PropTypes.bool,\r\n t: PropTypes.func.isRequired,\r\n};\r\n\r\nexport default CreditCardInfoTemplate;\r\n","import React from \"react\";\r\nimport { PropTypes } from \"prop-types\";\r\nimport { MrbRouterLink } from \"mrb/core/infrastructure/router\";\r\nimport { applicationDefaults } from \"common/constants\";\r\nimport { dateFormatter } from \"mrb/common/formatting\";\r\nimport { PremiumTrialExpiration, SubscriptionPrice } from \"application/payment/components\";\r\nimport { isNil } from \"lodash\";\r\nimport { mergeCss } from \"mrb/common/utils\";\r\nimport { observer } from \"mobx-react\";\r\n\r\nfunction PremiumTrialTermsInfoTemplate({ subscription, t }) {\r\n return (\r\n \r\n \r\n
\r\n {isNil(subscription.nextBillingDate) && (\r\n \r\n
\r\n
\r\n ) : (\r\n \r\n To continue using all {subscription.product.name} features after the trial period, activate\r\n subscription. You won't be charged until{\" \"}\r\n {dateFormatter.format(subscription.trialPeriod.trialEndDate, {\r\n format: applicationDefaults.formats.date,\r\n })}\r\n , cancel anytime.\r\n
\r\n\r\n
\r\n )}\r\n \r\n {subscription.product.name} subscription is activated and starting from{\" \"}\r\n {dateFormatter.format(subscription.trialPeriod.trialEndDate, {\r\n format: applicationDefaults.formats.date,\r\n })}{\" \"}\r\n we will charge your credit card
Payment Method
\r\n\r\n \r\n setIsCreditCardFormVisible(!isCreditCardFormVisible)}\r\n label=\"Cancel\"\r\n />\r\n \r\n )}\r\n\r\n {!isCreditCardFormVisible && (\r\n \r\n \r\n setIsCreditCardFormVisible(!isCreditCardFormVisible)}\r\n label=\"Update Card\"\r\n />\r\n \r\n )}\r\n
\r\n \r\n \r\n
\r\n\r\n {isCreditCardFormVisible && (\r\n \r\n
\r\n \r\n #### #### #### {creditCard.last4Numbers} \r\n
\r\n );\r\n});\r\n\r\nexport default observer(CustomerPaymentMethodInfoTemplate);\r\n","import React from \"react\";\r\nimport { PropTypes } from \"prop-types\";\r\nimport { MrbModal } from \"mrb/components/modal\";\r\nimport { MrbButton } from \"mrb/components/button\";\r\nimport { applicationDefaults } from \"common/constants\";\r\nimport { dateFormatter } from \"mrb/common/formatting\";\r\nimport { defaultTemplate } from \"common/hoc\";\r\n\r\nfunction PaymentSuccessModalTemplate({ modalParams, t }) {\r\n const { params, data = {} } = modalParams;\r\n let title, description;\r\n if (data.trialUpgraded) {\r\n const billingStartDate = dateFormatter.format(data.billingStartDate, {\r\n format: applicationDefaults.formats.longDate,\r\n });\r\n title = t(\"APPLICATION.PREMIUM.TRIAL.UPGRADE_SUCCESS.TITLE\");\r\n description = t(\"APPLICATION.PREMIUM.TRIAL.UPGRADE_SUCCESS.DESCRIPTION\", {\r\n startDate: billingStartDate,\r\n subscriptionPlan: data.subscriptionPlan,\r\n });\r\n } else {\r\n title = t(\"APPLICATION.PAYMENT.PAYMENT_SUCCESS.TITLE\");\r\n description = t(\"APPLICATION.PAYMENT.PAYMENT_SUCCESS.DESCRIPTION\", { subscriptionPlan: data.subscriptionPlan });\r\n }\r\n const buttonLabel = t(\"APPLICATION.PAYMENT.PAYMENT_SUCCESS.CONFIRM_BUTTON\", {\r\n subscriptionPlan: data.subscriptionPlan,\r\n });\r\n return (\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n
\r\n {title}
\r\n\r\n
\r\n {description}
\r\n\r\n
\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n
\r\n {t(\"APPLICATION.PREMIUM.TRIAL.ACTIVATE_SUCCESS.TITLE\")}
\r\n\r\n
\r\n \r\n {t(\"APPLICATION.PREMIUM.TRIAL.ACTIVATE_SUCCESS.DESCRIPTION\", {\r\n endDate: trialEndDate,\r\n subscriptionPlan: data.subscriptionPlan,\r\n })}\r\n
\r\n\r\n
\r\n \r\n \r\n \r\n \r\n \r\n Subscriptions\r\n \r\n
\r\n );\r\n}\r\n\r\nTakePaymentHeaderTemplate.propTypes = {\r\n onClickCancel: PropTypes.func,\r\n t: PropTypes.func,\r\n cancelLabel: PropTypes.string,\r\n};\r\n\r\nconst EditPageActions = observer(function EditPageActions({ onClickCancel, cancelLabel = \"Cancel\", t }) {\r\n return (\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n
\r\n\r\n \r\n {subscriptionPlan.name}\r\n \r\n {subscriptionPlan.price === 0 ? (\r\n \"Free\"\r\n ) : (\r\n
\r\n {map(subscriptionPlan.features, (feature) => {\r\n return (\r\n
\r\n\r\n {isFunction(footerRenderer) ? (\r\n footerRenderer({\r\n subscriptionPlan,\r\n subscriptionExist,\r\n isPremiumTrialPeriodUsed,\r\n isInternalSubscriptionActive,\r\n onClickExploreContent,\r\n isSubscriptionBundleActive,\r\n })\r\n ) : (\r\n \r\n \r\n {feature.isStrong ? (\r\n {feature.description}\r\n ) : (\r\n feature.description\r\n )}\r\n
\r\n );\r\n })}\r\n\r\n {actionButton}\r\n
\r\n );\r\n}\r\n\r\nfunction DefaultActionButton({ subscriptionPlan, isPremiumTrialPeriodUsed, subscriptionExist, isDisabled }) {\r\n return (\r\n \r\n onClickExploreContent(subscriptionPlan)}\r\n >\r\n Explore {subscriptionPlan.name}\r\n \r\n
\r\n Free
\r\n ) : (\r\n \r\n {error.message}\r\n
\r\n );\r\n}\r\n\r\nPaymentValidationTemplate.propTypes = {\r\n store: PropTypes.object.isRequired,\r\n};\r\n\r\nexport default observer(PaymentValidationTemplate);\r\n","import React from \"react\";\r\nimport { PropTypes } from \"prop-types\";\r\nimport { MrbRouterLink } from \"mrb/core/infrastructure/router\";\r\n\r\nfunction PremiumInfoWidgetTemplate({ t }) {\r\n return (\r\n\r\n \r\n {t(\"APPLICATION.PREMIUM.INFO_WIDGET.ACTION\")}\r\n \r\n
\r\n );\r\n}\r\n\r\nPremiumInfoWidgetTemplate.propTypes = {\r\n t: PropTypes.func.isRequired,\r\n};\r\n\r\nexport default PremiumInfoWidgetTemplate;\r\n","import React from \"react\";\r\nimport { PropTypes } from \"prop-types\";\r\nimport { MrbRouterLink } from \"mrb/core/infrastructure/router\";\r\nimport { PremiumTrialExpiration } from \"application/payment/components\";\r\nimport { isNil } from \"lodash\";\r\n\r\nfunction PremiumInfoTrialWidgetTemplate({ subscription, t }) {\r\n return (\r\n \r\n \r\n
\r\n\r\n {t(\"APPLICATION.PREMIUM.INFO_WIDGET.TITLE\")}
\r\n{t(\"APPLICATION.PREMIUM.INFO_WIDGET.DESCRIPTION\")}
\r\n\r\n\r\n \r\n {t(\"APPLICATION.PREMIUM.TRIAL_WIDGET.MORE_INFO\")}\r\n \r\n
\r\n );\r\n}\r\n\r\nPremiumInfoTrialWidgetTemplate.propTypes = {\r\n subscription: PropTypes.object.isRequired,\r\n t: PropTypes.func.isRequired,\r\n};\r\n\r\nexport default PremiumInfoTrialWidgetTemplate;\r\n","import React from \"react\";\r\nimport { MrbRouterLink } from \"mrb/core/infrastructure/router\";\r\nimport { applicationDefaults } from \"common/constants\";\r\n\r\nfunction PaymentInfoTemplate({ userSubscriptionInfoViewStore }) {\r\n const { isPremiumTrialPeriodUsed } = userSubscriptionInfoViewStore;\r\n return (\r\n \r\n \r\n
\r\n\r\n \r\n {isNil(subscription.nextBillingDate)\r\n ? t(\"APPLICATION.PREMIUM.TRIAL_WIDGET.TITLE\")\r\n : t(\"APPLICATION.PREMIUM.PREMIUM_STARTS.TITLE\")}\r\n
\r\n\r\n
\r\n \r\n $10/month\r\n \r\n ) : (\r\n \r\n Free {applicationDefaults.trialPeriodDays}-day Trial\r\n \r\n )}\r\n
\r\n \r\n \r\n
\r\n\r\n \r\n
\r\n\r\n {isPremiumTrialPeriodUsed ? (\r\n You will get:
\r\n\r\n \r\n 250+ hours of quality content from world-class producers\r\n
\r\n\r\n \r\n Story Shuffle compatible, exclusive Premium Shuffle included\r\n
\r\n\r\n \r\n Pause / Resume, Fast Forward / Rewind compatible\r\n
\r\n\r\n \r\n Cancel anytime\r\n
\r\n\r\n \r\n Pricing: $10/month\r\n
\r\nloading
;\r\n }\r\n store.setStripe(stripe);\r\n\r\n const onSubmit = () => {\r\n // Get a reference to a mounted CardElement. Elements knows how\r\n // to find your CardElement because there can only ever be one of\r\n // each type of element.\r\n const cardElement = elements.getElement(CardElement);\r\n store.onFormSubmit(cardElement);\r\n };\r\n\r\n return (\r\n \r\n {\r\n onSubmit();\r\n event.preventDefault();\r\n event.stopPropagation();\r\n }}\r\n >\r\n
\r\n \r\n
\r\n\r\n \r\n\r\n \r\n
\r\n \r\n onCellClick(item)}>\r\n
\r\n );\r\n}\r\n\r\nPremiumContentSubListItemTemplate.propTypes = {\r\n onCellClick: PropTypes.func.isRequired,\r\n item: PropTypes.object.isRequired,\r\n};\r\n\r\nexport default PremiumContentSubListItemTemplate;\r\n","import React from \"react\";\r\nimport { PropTypes } from \"prop-types\";\r\nimport { dateFormatter } from \"mrb/common/formatting\";\r\nimport { MrbButton } from \"mrb/components/button\";\r\nimport {\r\n PremiumTrialTermsInfo,\r\n SubscriptionPrice,\r\n InvalidPaymentInfo,\r\n NakiRadioPremiumBadge,\r\n NakiNigunPremiumBadge,\r\n NakiRadioFreeBadge,\r\n} from \"application/payment/components\";\r\nimport { MrbRouterLink } from \"mrb/core/infrastructure/router\";\r\nimport { applicationDefaults, subscriptionPlans, subscriptionStatuses } from \"common/constants\";\r\nimport { isSubscriptionBundle } from \"common/utils\";\r\nimport { observer } from \"mobx-react\";\r\nimport { isNil } from \"lodash\";\r\nimport { mergeCss } from \"mrb/common/utils\";\r\nimport moment from \"moment\";\r\n\r\nfunction UserSubscriptionInfoTemplate({ userSubscriptionsPreviewViewStore, t }) {\r\n const { activeSubscription, pendingSubscription, isSubscriptionBundleActive } = userSubscriptionsPreviewViewStore;\r\n return (\r\n \r\n
\r\n\r\n \r\n
\r\n {item.title}
\r\n \r\n
\r\n );\r\n}\r\n\r\nfunction SubscriptionHeader({ subscription }) {\r\n let premiumBadge = null;\r\n let activeClassName = \"\";\r\n switch (subscription.product.slug) {\r\n case subscriptionPlans.nakiRadioPremium:\r\n premiumBadge = \r\n \r\n \r\n ) : null}\r\n
\r\n \r\n \r\n
\r\n \r\n
\r\n );\r\n}\r\n\r\nconst SubscriptionDetails = observer(function SubscriptionDetails({ store, t }) {\r\n const {\r\n activeSubscription,\r\n pendingSubscription,\r\n rootStore: { premiumSubscriptionStore },\r\n } = store;\r\n const isPremiumSubscriptionTrial = activeSubscription.subscriptionStatus.abrv === subscriptionStatuses.trial;\r\n\r\n return (\r\n \r\n {premiumBadge}\r\n\r\n
\r\n \r\n
\r\n {subscription.product.name}
\r\n\r\n {isTrial || subscription.amount === 0 ? (\r\n Free\r\n ) : (\r\n
\r\n {subscription.subscriptionStatus.name}\r\n
\r\n\r\n {activeSubscription.product.productCategory &&\r\n isSubscriptionBundle(activeSubscription.product.productCategory) &&\r\n activeSubscription.currentBillingCycle < 12 ? (\r\n \r\n \r\n ) : (\r\n \r\n {isNil(pendingSubscription) ? (\r\n \r\n )}\r\n {!premiumSubscriptionStore.isSubscriptionBundleActive && }\r\n\r\n {isPremiumSubscriptionTrial &&
\r\n );\r\n});\r\n\r\nconst Discount = observer(function Discount({ userSubscriptionsPreviewViewStore, t }) {\r\n const { activeSubscription } = userSubscriptionsPreviewViewStore;\r\n let activeTo;\r\n\r\n if (isNil(activeSubscription.discount)) {\r\n return null;\r\n }\r\n\r\n if (activeSubscription.discount.activeTo) {\r\n activeTo = dateFormatter.format(activeSubscription.discount.activeTo, {\r\n format: \"MM/DD/YYYY\",\r\n });\r\n }\r\n\r\n return (\r\n \r\n {activeSubscription.isInternal ? (\r\n
\r\n \r\n
\r\n );\r\n});\r\nUserSubscriptionInfoTemplate.propTypes = {\r\n userSubscriptionsPreviewViewStore: PropTypes.object.isRequired,\r\n t: PropTypes.func.isRequired,\r\n};\r\n\r\nfunction DefaultSubscriptionDetails({ subscription }) {\r\n const isPremiumSubscriptionTrial = subscription.subscriptionStatus.abrv === subscriptionStatuses.trial;\r\n\r\n return (\r\n \r\n
\r\n Discount
\r\n {activeSubscription.discount.amountOff ? (\r\n-${activeSubscription.discount.amountOff} off
\r\n ) : (\r\n{activeSubscription.discount.percentOff}% off
\r\n )}\r\n {activeTo ?Discount is valid until {activeTo}
: null}\r\n\r\n Start Date:\r\n\r\n
\r\n )}\r\n \r\n {dateFormatter.format(subscription.startDate, {\r\n format: applicationDefaults.formats.date,\r\n })}\r\n
\r\n\r\n {isNil(subscription.endDate) ? (\r\n \r\n {!isNil(subscription.nextBillingDate) && (\r\n \r\n \r\n {isPremiumSubscriptionTrial ? \"Start Billing Date:\" : \"Next Billing Date:\"}\r\n \r\n \r\n )}\r\n \r\n ) : (\r\n \r\n End Date:\r\n \r\n )}\r\n
\r\n \r\n {dateFormatter.format(subscription.nextBillingDate, {\r\n format: applicationDefaults.formats.date,\r\n })}\r\n
\r\n\r\n {dateFormatter.format(subscription.endDate, {\r\n format: applicationDefaults.formats.date,\r\n })}\r\n
\r\n\r\n After{\" \"}\r\n {dateFormatter.format(moment(activeSubscription.startDate).add(12, \"M\"), {\r\n format: applicationDefaults.formats.date,\r\n })}\r\n , your subscription may be cancelled at any time. For technical support and device repair/replacement,\r\n please contact our support team at support@nakiradio.com.\r\n
\r\n\r\n Your {activeSubscription.product.name} subscription will remain active until{\" \"}\r\n \r\n {isSubscriptionBundleActive\r\n ? activeSubscription.endDate\r\n ? dateFormatter.format(activeSubscription.endDate, {\r\n format: applicationDefaults.formats.date,\r\n })\r\n : null\r\n : activeSubscription.endDate\r\n ? dateFormatter.format(activeSubscription.nextBillingDate, {\r\n format: applicationDefaults.formats.date,\r\n })\r\n : null}\r\n \r\n .\r\n
\r\n\r\n Your {pendingSubscription.product.name} subscription starts on{\" \"}\r\n \r\n {pendingSubscription.startDate\r\n ? dateFormatter.format(pendingSubscription.startDate, {\r\n format: applicationDefaults.formats.date,\r\n })\r\n : null}\r\n \r\n , and we will charge you{\" \"}\r\n \r\n
\r\n
\r\n );\r\n});\r\n\r\nconst SubscriptionControls = observer(function SubscriptionControls({ store, t }) {\r\n const {\r\n activeSubscription,\r\n pendingSubscription,\r\n cancelSubscription,\r\n renewSubscription,\r\n revertSubscription,\r\n endTrial,\r\n rootStore: { premiumSubscriptionStore },\r\n } = store;\r\n const isPremiumSubscriptionTrial = activeSubscription.subscriptionStatus.abrv === subscriptionStatuses.trial;\r\n\r\n if (premiumSubscriptionStore.isSubscriptionBundleActive) {\r\n if (activeSubscription.currentBillingCycle >= 12) {\r\n return (\r\n \r\n
\r\n );\r\n } else {\r\n return null;\r\n }\r\n }\r\n\r\n if (activeSubscription.product.slug === subscriptionPlans.nakiRadioFree) {\r\n return (\r\n \r\n \r\n Upgrade Plan\r\n \r\n
\r\n );\r\n }\r\n\r\n if (isPremiumSubscriptionTrial) {\r\n if (isNil(activeSubscription.endDate)) {\r\n return (\r\n \r\n
\r\n );\r\n }\r\n return (\r\n \r\n endTrial(activeSubscription.id)}\r\n />\r\n
\r\n );\r\n }\r\n\r\n if (isNil(activeSubscription.endDate)) {\r\n return (\r\n \r\n \r\n Change Plan\r\n \r\n
\r\n );\r\n } else if (!isNil(pendingSubscription)) {\r\n return (\r\n \r\n
\r\n );\r\n });\r\n}\r\n\r\nfunction getErrorMessage(error, errorsMap, t) {\r\n if (!isNil(errorsMap) && isFunction(errorsMap[error.code])) {\r\n return errorsMap[error.code](error, t);\r\n }\r\n return error.message;\r\n}\r\n\r\nMrbFileUploadValidation.propTypes = {\r\n store: PropTypes.object.isRequired,\r\n t: PropTypes.func,\r\n};\r\n\r\nexport default observer(MrbFileUploadValidation);\r\n","import React from \"react\";\r\nimport { PropTypes } from \"prop-types\";\r\nimport Dropzone from \"react-dropzone\";\r\nimport { MrbFileUploadValidation } from \"./\";\r\nimport { observer } from \"mobx-react\";\r\n\r\nfunction MrbFileUpload({ store, children, t }) {\r\n const { onChange, disabled, setUploadInputRef, clear, config, onDropRejected } = store;\r\n return (\r\n Unable to upload file: {rejectedFile.file.name}
\r\n {map(rejectedFile.errors, (error) => {\r\n return (\r\n\r\n {getErrorMessage(error, errorsMap, t)}\r\n
\r\n );\r\n })}\r\n\r\n \r\n {children}\r\n {config.showValidation &&
\r\n \r\n
\r\n );\r\n}\r\n\r\nMrbConfirmDialogPanel.propTypes = {\r\n message: PropTypes.string.isRequired,\r\n onConfirm: PropTypes.func.isRequired,\r\n onCancel: PropTypes.func,\r\n yesLabel: PropTypes.string,\r\n noLabel: PropTypes.string,\r\n t: PropTypes.func,\r\n loading: PropTypes.bool,\r\n};\r\n\r\nexport default observer(MrbConfirmDialogPanel);\r\n","import React from \"react\";\r\nimport Modal from \"react-modal\";\r\nimport PropTypes from \"prop-types\";\r\nimport { observer } from \"mobx-react\";\r\nimport { isFunction } from \"lodash\";\r\n\r\nModal.setAppElement(\"#root\");\r\nfunction MrbModal({\r\n modalParams,\r\n children,\r\n className = \"modal__content\",\r\n overlayClassName = \"modal__overlay\",\r\n shouldCloseOnOverlayClick = true,\r\n displayCloseIcon = true,\r\n ...other\r\n}) {\r\n return (\r\n \r\n
\r\n {t(message)}
\r\n\r\n {description &&
\r\n {description}
}\r\n\r\n
\r\n There is no data.
;\r\n}\r\n\r\nexport default MrbInfiniteScrollGridEmptyState;\r\n","import React from \"react\";\r\nimport { PropTypes } from \"prop-types\";\r\nimport { MrbInfiniteScrollGridEmptyState } from \"./components\";\r\nimport { MrbContentLoader, MrbRectangleContentLoader } from \"../loader\";\r\nimport InfiniteScroll from \"react-infinite-scroller\";\r\nimport { map, isUndefined } from \"lodash\";\r\nimport { observer } from \"mobx-react\";\r\nimport { mergeOrOverrideCss } from \"../../common/utils\";\r\n\r\nfunction MrbInfiniteScrollGrid({\r\n store,\r\n cellRenderer,\r\n t,\r\n classNameOverride,\r\n classNameExtend,\r\n scrollParent,\r\n emptyStateRenderer = () => \r\n \r\n {map(data, (item, index) => (\r\n \r\n {cellRenderer({\r\n item,\r\n actions,\r\n onCellClick,\r\n valueFormatter: formatValue,\r\n index,\r\n t,\r\n })}\r\n \r\n ))}\r\n
\r\n \r\n ) : (\r\n {children}
;\r\n return (\r\n \r\n {map(options, (option, index) => {\r\n const itemId = `${id}_${option.value}`;\r\n const isChecked = value === option.value;\r\n const defaultClass = `c-segmented ${\r\n index === 0 ? \" c-segmented--first\" : `${index === options.length - 1 ? \" c-segmented--last\" : \"\"}`\r\n }`;\r\n return (\r\n \r\n onChange(option.value)}\r\n disabled={disabled}\r\n type=\"radio\"\r\n tabIndex={0}\r\n className={`${mergeOrOverrideCss(\r\n defaultClass,\r\n inputClassNameOverride,\r\n inputClassNameExtend\r\n )} ${isChecked ? \"active\" : \"\"}`}\r\n />\r\n {labelRender ? (\r\n labelRender({ itemId, t })\r\n ) : (\r\n \r\n )}\r\n \r\n );\r\n })}\r\n
\r\n );\r\n}\r\n\r\nMrbRadioButtons.propTypes = {\r\n id: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).isRequired,\r\n onChange: PropTypes.func.isRequired,\r\n value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\r\n disabled: PropTypes.bool,\r\n t: PropTypes.func,\r\n labelRender: PropTypes.func,\r\n options: PropTypes.arrayOf(PropTypes.object).isRequired,\r\n};\r\n\r\nMrbRadioButtons.defaultProps = {\r\n disabled: false,\r\n};\r\n\r\nexport default observer(MrbRadioButtons);\r\n","import React from \"react\";\r\nimport { PropTypes } from \"prop-types\";\r\nimport { MrbRadioButtons } from \"./\";\r\nimport { MrbFieldLayout } from \"../layout/content/form\";\r\nimport { observer } from \"mobx-react\";\r\n\r\nfunction MrbFieldRadioButtons({\r\n field,\r\n t = (i) => i,\r\n showLabel = true,\r\n labelRender = null,\r\n validationRender = null,\r\n rowView = true,\r\n ...props\r\n}) {\r\n return (\r\n tableStore.setSort(colId) : null}>\r\n {displayName}\r\n {tableStore.orderBy === colId ? (\r\n \r\n ) : null}\r\n
\r\n );\r\n}\r\n\r\nMrbTableHeader.propTypes = {\r\n displayName: PropTypes.string,\r\n enableSorting: PropTypes.bool,\r\n tableStore: PropTypes.object,\r\n column: PropTypes.object,\r\n t: PropTypes.func,\r\n};\r\n\r\nexport default observer(MrbTableHeader);\r\n","import React from \"react\";\r\nimport { AgGridColumn } from \"@ag-grid-community/react\";\r\nimport { MrbTableHeader } from \"./\";\r\nimport { mergeCss } from \"../../../common/utils\";\r\nimport { isBoolean, isFunction } from \"lodash\";\r\n\r\nfunction mrbTableColumnRenderer(column, tableStore, HeaderComponent = MrbTableHeader, t = (i) => i) {\r\n if (isFunction(column.onCellClicked)) {\r\n column.cellClass = mergeCss(\"u-cursor--pointer\", column.cellClass);\r\n }\r\n return (\r\n \r\n
\r\n );\r\n}\r\n\r\nexport default MrbTableLoadingOverlay;\r\n","import React from \"react\";\r\n\r\nfunction MrbTableNoDataOverlay() {\r\n return (\r\n \r\n \r\n \r\n
\r\n \r\n
\r\n );\r\n}\r\n\r\nexport default MrbTableNoDataOverlay;\r\n","import React from \"react\";\r\nimport PropTypes from \"prop-types\";\r\nimport { ModuleRegistry } from \"@ag-grid-community/core\";\r\nimport { ClientSideRowModelModule } from \"@ag-grid-community/client-side-row-model\";\r\nimport { InfiniteRowModelModule } from \"@ag-grid-community/infinite-row-model\";\r\nimport { AgGridReact } from \"@ag-grid-community/react\";\r\nimport { observer } from \"mobx-react\";\r\nimport { MrbPager } from \"../pager\";\r\nimport { mrbTableColumnRenderer, mrbTableActionColumnRenderer } from \"./columns\";\r\nimport { MrbTableLoadingOverlay, MrbTableNoDataOverlay } from \"./overlays\";\r\nimport { mergeCss } from \"../../common/utils\";\r\nimport { map, isFunction } from \"lodash\";\r\n\r\n// Note: this will register modules globally. See: https://www.ag-grid.com/documentation/javascript/modules/#providing-modules-globally\r\nModuleRegistry.registerModules([ClientSideRowModelModule, InfiniteRowModelModule]);\r\n\r\nfunction MrbTable({\r\n tableStore,\r\n ActionsComponent,\r\n HeaderComponent,\r\n className,\r\n pagerRender,\r\n t = (i) => i,\r\n loadingRender,\r\n emptyStateRender,\r\n ...props\r\n}) {\r\n const {\r\n onGridReady,\r\n onRowSelected,\r\n onSelectionChanged,\r\n rowDataChanged,\r\n processCellForClipboard,\r\n isRowSelectable,\r\n config: {\r\n selection,\r\n rows: { rowClass, getRowClass, getRowStyle },\r\n actions,\r\n columns,\r\n defaultColumnDefinition,\r\n onRowClick,\r\n multiSortKey,\r\n },\r\n getContextMenuItems,\r\n } = tableStore;\r\n\r\n return (\r\n \r\n Ooops! Someone cut the cable.\r\n
\r\nThere is no data.
\r\n\r\n \r\n {renderColumns(columns, tableStore, HeaderComponent, t)}\r\n {mrbTableActionColumnRenderer(tableStore, actions, ActionsComponent, t)}\r\n \r\n
\r\n );\r\n}\r\n\r\nfunction renderColumns(columns, tableStore, HeaderComponent, t) {\r\n return map(columns, (column) => mrbTableColumnRenderer(column, tableStore, HeaderComponent, t));\r\n}\r\n\r\nconst PagerWrapper = observer(function PagerWrapper({ tableStore, t, pagerRender }) {\r\n const renderer = pagerRender ? pagerRender : (props) => \r\n
\r\n );\r\n}\r\n\r\nProducerPaymentReportCellTemplate.propTypes = {\r\n item: PropTypes.object.isRequired,\r\n};\r\n\r\nfunction PlaybackTime({ reportVersion, value }) {\r\n const totalPlaybackTime = producerPlaybackTimeConverter(reportVersion, value);\r\n if (totalPlaybackTime) {\r\n return totalPlaybackTime;\r\n }\r\n\r\n return \"-\";\r\n}\r\n\r\nexport default observer(ProducerPaymentReportCellTemplate);\r\n","import React from \"react\";\r\nimport { PropTypes } from \"prop-types\";\r\n\r\nfunction UserEventPayoutCellTemplate({ data }) {\r\n if (data.isAllowedForPayout) {\r\n return ;\r\n }\r\n return \"-\";\r\n}\r\n\r\nUserEventPayoutCellTemplate.propTypes = {\r\n data: PropTypes.object.isRequired,\r\n};\r\n\r\nexport default UserEventPayoutCellTemplate;\r\n","import { PropTypes } from \"prop-types\";\r\nimport { producerPlaybackTimeConverter } from \"common/utils\";\r\n\r\nfunction ProducerPlaybackTimeCellTemplate({ data }) {\r\n const { currentMonthReportVersion, currentMonthTotalProducerPlaybacks } = data;\r\n const value = producerPlaybackTimeConverter(currentMonthReportVersion, currentMonthTotalProducerPlaybacks);\r\n if (value) {\r\n return value;\r\n }\r\n\r\n return \"-\";\r\n}\r\n\r\nProducerPlaybackTimeCellTemplate.propTypes = {\r\n data: PropTypes.object.isRequired,\r\n};\r\n\r\nexport default ProducerPlaybackTimeCellTemplate;\r\n","import React from \"react\";\r\nimport { PropTypes } from \"prop-types\";\r\nimport { dateFormatter } from \"mrb/common/formatting\";\r\nimport { applicationDefaults } from \"common/constants\";\r\nimport { isProducerReportComplete } from \"common/utils\";\r\n\r\nfunction ProducerPreviewReportPeriodCellTemplate({ data }) {\r\n const isCompleted = isProducerReportComplete(data.monthOfYear, data.periodEndDate);\r\n\r\n return (\r\n setIsCollapsed(!isCollapsed)}>\r\n
\r\n\r\n {isCollapsed && (\r\n \r\n \r\n
\r\n \r\n {maskUserNames\r\n ? t(\"COMMON.PRODUCER.REPORT.PLACEHOLDERS.USER\", { number: index + 1 })\r\n : `${item.user.firstName} ${item.user.lastName}`}\r\n
\r\n \r\n {dateFormatter.format(item.subscriptionCycleStartDate, {\r\n format: applicationDefaults.formats.dateTime,\r\n })}\r\n
\r\n \r\n {dateFormatter.format(item.subscriptionCycleEndDate, {\r\n format: applicationDefaults.formats.dateTime,\r\n })}\r\n
\r\n \r\n
\r\n {numberFormatter.format(item.producerPlaybacks)}
\r\n \r\n
\r\n \r\n {currencyFormatter.format(item.producerPayment, {\r\n currency: \"USD\",\r\n })}\r\n
\r\n {item.subscriptionPlan.name}
\r\n \r\n \r\n {items}\r\n \r\n
\r\n );\r\n};\r\n\r\nexport default ProducersDetailsListLoaderTemplate;\r\n","import React from \"react\";\r\nimport ContentLoader from \"react-content-loader\";\r\n\r\nconst ProducerSummaryLoaderTemplate = (props) => {\r\n const { row = 3, statsPreview, className, isDetails } = props;\r\n const screenwidth = window.innerWidth;\r\n const items = [];\r\n let loaderWidth;\r\n\r\n if (screenwidth > 1199) {\r\n loaderWidth = 387;\r\n } else if (screenwidth > 990) {\r\n loaderWidth = screenwidth / 2 - 40;\r\n } else if (screenwidth > 766) {\r\n loaderWidth = screenwidth / 2 + 60;\r\n } else {\r\n loaderWidth = screenwidth;\r\n }\r\n\r\n let y = 0;\r\n\r\n for (let i = 0; i < row; i++) {\r\n if (i === 0) {\r\n items.push(\r\n \r\n
\r\n \r\n
\r\n \r\n {title &&
\r\n );\r\n}\r\n\r\nProducerReportsTableTemplate.propTypes = {\r\n title: PropTypes.string,\r\n gridStore: PropTypes.object.isRequired,\r\n emptyStateRenderer: PropTypes.any,\r\n t: PropTypes.func,\r\n};\r\n\r\nexport default observer(ProducerReportsTableTemplate);\r\n","import React from \"react\";\r\nimport { PropTypes } from \"prop-types\";\r\nimport { ProducerPaymentReportCell, ProducersDetailsListLoader } from \"common/components/producer\";\r\nimport { MrbInfiniteScrollGrid } from \"mrb/components/infinite-scroll-grid\";\r\n\r\nfunction ProducerReportTemplate({ producerReportViewStore, t }) {\r\n const { gridStore, routeStore, setContainerRef } = producerReportViewStore;\r\n return (\r\n {t(title)}
}\r\n\r\n
\r\n );\r\n}\r\n\r\nProducerReportTemplate.propTypes = {\r\n producerReportViewStore: PropTypes.object.isRequired,\r\n t: PropTypes.func,\r\n};\r\n\r\nfunction EmptyState({ t }) {\r\n return (\r\n {t(\"COMMON.PRODUCER.REPORT.TITLE\")}
\r\n\r\n\r\n
\r\n \r\n
\r\n {t(\"COMMON.PRODUCER.REPORT.COLUMNS.USER\")}
\r\n \r\n {t(\"COMMON.PRODUCER.REPORT.COLUMNS.SUBSCRIPTION_CYCLE_START_DATE\")}\r\n
\r\n \r\n {t(\"COMMON.PRODUCER.REPORT.COLUMNS.SUBSCRIPTION_CYCLE_END_DATE\")}\r\n
\r\n \r\n {t(\"COMMON.PRODUCER.REPORT.COLUMNS.PRODUCER_PLAYBACK_TIME\")}\r\n
\r\n \r\n {t(\"COMMON.PRODUCER.REPORT.COLUMNS.PRODUCER_PLAYBACK_POINTS\")}\r\n
\r\n \r\n {t(\"COMMON.PRODUCER.REPORT.COLUMNS.TOTAL_USER_PLAYBACK_TIME\")}\r\n
\r\n {t(\"COMMON.PRODUCER.REPORT.COLUMNS.PRODUCER_PAYMENT\")}
\r\n \r\n {t(\"COMMON.PRODUCER.REPORT.COLUMNS.SUBSCRIPTION_PLAN\")}\r\n
\r\n \r\n
\r\n \r\n
\r\n );\r\n}\r\n\r\nexport default ProducerReportTemplate;\r\n","import React from \"react\";\r\nimport { PropTypes } from \"prop-types\";\r\nimport { MrbTable } from \"mrb/components/table\";\r\nimport { mergeCss } from \"mrb/common/utils\";\r\nimport { observer } from \"mobx-react\";\r\n\r\nfunction ProducerAccountPreviewBalanceTemplate({ title, gridStore, emptyStateRenderer, t }) {\r\n return (\r\n \r\n \r\n
\r\n {t(\"COMMON.PRODUCER.REPORT.EMPTY_STATE.MESSAGE\")}
\r\n\r\n {title &&
\r\n );\r\n}\r\n\r\nProducerAccountPreviewBalanceTemplate.propTypes = {\r\n title: PropTypes.string,\r\n gridStore: PropTypes.object.isRequired,\r\n emptyStateRenderer: PropTypes.any,\r\n t: PropTypes.func,\r\n};\r\n\r\nexport default observer(ProducerAccountPreviewBalanceTemplate);\r\n","import React from \"react\";\r\nimport { PropTypes } from \"prop-types\";\r\nimport { MrbTable } from \"mrb/components/table\";\r\nimport { mergeCss } from \"mrb/common/utils\";\r\nimport { observer } from \"mobx-react\";\r\n\r\nfunction ProducerAccountPreviewRevenueTransactionTemplate({ title, gridStore, emptyStateRenderer, t }) {\r\n return (\r\n {t(title)}
}\r\n\r\n {title &&
\r\n );\r\n}\r\n\r\nProducerAccountPreviewRevenueTransactionTemplate.propTypes = {\r\n title: PropTypes.string,\r\n gridStore: PropTypes.object.isRequired,\r\n emptyStateRenderer: PropTypes.any,\r\n t: PropTypes.func,\r\n};\r\n\r\nexport default observer(ProducerAccountPreviewRevenueTransactionTemplate);\r\n","const nakiRadioContentType = {\r\n podcast: \"podcast\",\r\n station: \"station\",\r\n nakiNigun: \"naki-nigun\",\r\n};\r\n\r\nexport default nakiRadioContentType;\r\n","class ContentAccessResult {\r\n canAccessOnSelectedDevice = true;\r\n canAccessPremium = true;\r\n\r\n get canAccess() {\r\n return this.canAccessOnSelectedDevice === true && this.canAccessPremium === true;\r\n }\r\n}\r\n\r\nexport default ContentAccessResult;\r\n","import { computed, makeObservable } from \"mobx\";\r\nimport { nakiRadioSystemTypes, subscriptionStatuses, subscriptionPlans } from \"common/constants\";\r\nimport { nakiRadioContentType, ContentAccessResult } from \"application/common/content-access\";\r\nimport { isNil, find } from \"lodash\";\r\n\r\nconst CONTENT_ACCESS_MAP = {};\r\nconst premiumContentAccess = [\r\n {\r\n contentType: nakiRadioContentType.podcast,\r\n deviceSystemType: nakiRadioSystemTypes.venice,\r\n },\r\n {\r\n contentType: nakiRadioContentType.station,\r\n deviceSystemType: nakiRadioSystemTypes.venice,\r\n },\r\n {\r\n contentType: nakiRadioContentType.nakiNigun,\r\n deviceSystemType: nakiRadioSystemTypes.venice,\r\n },\r\n {\r\n contentType: nakiRadioContentType.podcast,\r\n deviceSystemType: nakiRadioSystemTypes.mobile,\r\n },\r\n {\r\n contentType: nakiRadioContentType.station,\r\n deviceSystemType: nakiRadioSystemTypes.mobile,\r\n },\r\n {\r\n contentType: nakiRadioContentType.nakiNigun,\r\n deviceSystemType: nakiRadioSystemTypes.mobile,\r\n },\r\n {\r\n contentType: nakiRadioContentType.podcast,\r\n deviceSystemType: nakiRadioSystemTypes.mobile_embedded,\r\n },\r\n {\r\n contentType: nakiRadioContentType.station,\r\n deviceSystemType: nakiRadioSystemTypes.mobile_embedded,\r\n },\r\n {\r\n contentType: nakiRadioContentType.nakiNigun,\r\n deviceSystemType: nakiRadioSystemTypes.mobile_embedded,\r\n },\r\n];\r\nCONTENT_ACCESS_MAP[subscriptionPlans.nakiRadioPremium] = premiumContentAccess;\r\nCONTENT_ACCESS_MAP[subscriptionPlans.subscriptionBundleSolo] = premiumContentAccess;\r\nCONTENT_ACCESS_MAP[subscriptionPlans.subscriptionBundleDuo] = premiumContentAccess;\r\nCONTENT_ACCESS_MAP[subscriptionPlans.subscriptionBundleNaki23Black] = premiumContentAccess;\r\n\r\nCONTENT_ACCESS_MAP[subscriptionPlans.nakiNigun] = [\r\n {\r\n contentType: nakiRadioContentType.nakiNigun,\r\n deviceSystemType: nakiRadioSystemTypes.mobile,\r\n },\r\n {\r\n contentType: nakiRadioContentType.nakiNigun,\r\n deviceSystemType: nakiRadioSystemTypes.venice,\r\n },\r\n {\r\n contentType: nakiRadioContentType.nakiNigun,\r\n deviceSystemType: nakiRadioSystemTypes.mobile_embedded,\r\n },\r\n];\r\n\r\nclass ContentAccessValidator {\r\n @computed get selectedDevice() {\r\n return this.userDeviceStore.selectedDevice;\r\n }\r\n\r\n @computed get subscriptions() {\r\n return this.premiumSubscriptionStore.subscriptions;\r\n }\r\n\r\n constructor(rootStore) {\r\n makeObservable(this);\r\n this.rootStore = rootStore;\r\n this.userDeviceStore = this.rootStore.userDeviceStore;\r\n this.premiumSubscriptionStore = this.rootStore.premiumSubscriptionStore;\r\n }\r\n\r\n canAccessPodcast(options) {\r\n return this._canAccessContent(options, nakiRadioContentType.podcast);\r\n }\r\n\r\n canAccessStation(options) {\r\n return this._canAccessContent(options, nakiRadioContentType.station);\r\n }\r\n\r\n canAccessNakiNigun(options) {\r\n return this._canAccessContent(options, nakiRadioContentType.nakiNigun);\r\n }\r\n\r\n _canAccessContent(options, contentType) {\r\n if (!this._validateParameters(options)) {\r\n throw new Error(\"Invalid options parameters.\");\r\n }\r\n const result = new ContentAccessResult();\r\n if (options.unavailableInMobileApp || options.unavailableInNakiTouch) {\r\n if (!isNil(this.selectedDevice)) {\r\n const systemType = this.selectedDevice.device.systemType.abrv;\r\n const isUnavailable =\r\n (options.unavailableInMobileApp && systemType === nakiRadioSystemTypes.mobile) ||\r\n (options.unavailableInNakiTouch && systemType === nakiRadioSystemTypes.mobile_embedded);\r\n\r\n result.canAccessOnSelectedDevice = !isUnavailable;\r\n }\r\n }\r\n\r\n if (!options.isPremium) {\r\n result.canAccessPremium = true;\r\n } else {\r\n result.canAccessPremium = this._canAccessPremiumContent(options, contentType);\r\n }\r\n\r\n return result;\r\n }\r\n\r\n _canAccessPremiumContent(options, contentType) {\r\n if (isNil(this.selectedDevice)) {\r\n return false;\r\n }\r\n\r\n for (let subscription of this.subscriptions) {\r\n const isSubscriptionValid = this._validateSubscription(subscription);\r\n if (!isSubscriptionValid && !this._validateLegacySubscription(options)) {\r\n continue;\r\n }\r\n\r\n const subscriptionAccessRules = CONTENT_ACCESS_MAP[subscription.product.slug];\r\n if (subscriptionAccessRules) {\r\n const canAccess = find(\r\n subscriptionAccessRules,\r\n (rule) =>\r\n rule.contentType === contentType &&\r\n rule.deviceSystemType === this.selectedDevice.device.systemType.abrv\r\n );\r\n if (canAccess) {\r\n return true;\r\n }\r\n }\r\n }\r\n\r\n return false;\r\n }\r\n\r\n _validateParameters(options) {\r\n if (isNil(options)) {\r\n throw new Error(\"options parameter is required\");\r\n }\r\n\r\n return true;\r\n }\r\n\r\n _validateSubscription(subscription) {\r\n if (isNil(subscription)) {\r\n return false;\r\n }\r\n\r\n switch (subscription.subscriptionStatus.abrv) {\r\n case subscriptionStatuses.active:\r\n case subscriptionStatuses.pastDue:\r\n case subscriptionStatuses.trial:\r\n return true;\r\n default:\r\n return false;\r\n }\r\n }\r\n\r\n _validateLegacySubscription(options) {\r\n if (isNil(options)) {\r\n return false;\r\n }\r\n if (!isNil(options.isLegacySubscriptionValid)) {\r\n return options.isLegacySubscriptionValid;\r\n }\r\n if (!isNil(options.legacySubscriptionExpirationDate)) {\r\n return this.premiumSubscriptionStore.isLegacySubscriptionActive(options.legacySubscriptionExpirationDate);\r\n }\r\n\r\n return false;\r\n }\r\n}\r\n\r\nexport default ContentAccessValidator;\r\n","import { useContext } from \"react\";\r\nimport { RootContext } from \"mrb/core/contexts\";\r\nimport { nakiRadioContentType } from \"application/common/content-access\";\r\nimport { isNil } from \"lodash\";\r\n\r\nfunction useCanAccessContent(contentType, options) {\r\n const rootStore = useContext(RootContext);\r\n if (isNil(contentType)) {\r\n throw new Error(\"Missing contentType parameter.\");\r\n }\r\n switch (contentType) {\r\n case nakiRadioContentType.podcast:\r\n return rootStore.contentAccessValidator.canAccessPodcast(options);\r\n case nakiRadioContentType.station:\r\n return rootStore.contentAccessValidator.canAccessStation(options);\r\n case nakiRadioContentType.nakiNigun:\r\n return rootStore.contentAccessValidator.canAccessNakiNigun(options);\r\n default:\r\n throw new Error(`Invalid contentType parameter: ${contentType}`);\r\n }\r\n}\r\n\r\nexport default useCanAccessContent;\r\n","import { action, computed, observable, makeObservable } from \"mobx\";\r\nimport { MrbBaseViewStore } from \"mrb/core\";\r\nimport { MrbModalParams } from \"mrb/common/models\";\r\nimport { StripeField } from \"common/models\";\r\nimport { subscriptionPlans } from \"common/constants\";\r\nimport { isNil } from \"lodash\";\r\n\r\nclass BasePaymentViewStore extends MrbBaseViewStore {\r\n @observable.ref stripe = null;\r\n @observable.ref subscriptionPlan = null;\r\n stripeField = null;\r\n\r\n @computed get isPaymentDisabled() {\r\n if (this.paymentMethodExist) {\r\n return false;\r\n }\r\n return isNil(this.stripe) || isNil(this.stripeField) || !this.stripeField.isCompleted;\r\n }\r\n\r\n get paymentMethodExist() {\r\n return !isNil(this.rootStore.premiumSubscriptionStore.customerPaymentMethod);\r\n }\r\n\r\n constructor(rootStore, { routeStore }) {\r\n super(rootStore);\r\n makeObservable(this);\r\n this.routeStore = routeStore;\r\n this.stripeField = new StripeField();\r\n\r\n this.paymentSuccessModal = new MrbModalParams(null, {\r\n onClickExplorePremium: this.goToPremiumContent,\r\n });\r\n }\r\n\r\n @action.bound\r\n setSubscriptionPlan(plan) {\r\n this.subscriptionPlan = plan;\r\n }\r\n\r\n goToPremiumContent = () => {\r\n switch (this.subscriptionPlan.slug) {\r\n case subscriptionPlans.nakiTales:\r\n case subscriptionPlans.nakiRadioPremium:\r\n this.rootStore.routerStore.goTo(\"master.application.home.list\", null, {\r\n isPremium: true,\r\n });\r\n break;\r\n case subscriptionPlans.nakiNigun:\r\n this.rootStore.routerStore.goTo(\"master.application.naki-nigun.list\");\r\n break;\r\n default:\r\n break;\r\n }\r\n };\r\n\r\n @action.bound\r\n async authorizePaymentRequest(clientSecret) {\r\n try {\r\n const result = await this.stripe.handleCardAction(clientSecret);\r\n if (result.error) {\r\n } else {\r\n await this.routeStore.confirmPayment({\r\n providerPaymentRequestId: result.paymentIntent.id,\r\n });\r\n }\r\n } catch (err) {\r\n this.rootStore.notificationStore.error(\r\n \"Unexpected error occurred while trying to complete payment. Please contact the support team.\",\r\n err\r\n );\r\n }\r\n }\r\n\r\n @action.bound\r\n setStripe(stripe) {\r\n this.stripe = stripe;\r\n }\r\n}\r\n\r\nexport default BasePaymentViewStore;\r\n","import { override } from \"mobx\";\r\nimport { MrbBaseRouteStore } from \"mrb/core\";\r\nimport { PaymentService, ProductService } from \"common/services\";\r\n\r\nclass TakePaymentRouteStore extends MrbBaseRouteStore {\r\n constructor(rootStore) {\r\n super(rootStore);\r\n\r\n this.service = rootStore.createApplicationService(PaymentService);\r\n this.productService = rootStore.createApplicationService(ProductService);\r\n }\r\n\r\n @override\r\n onBeforeEnter(fromState, toState) {\r\n const subscriptionPlanId = toState.params.planId;\r\n const subscription =\r\n this.rootStore.premiumSubscriptionStore.getSubscriptionBySubscriptionPlan(subscriptionPlanId);\r\n if (subscription) {\r\n return Promise.reject(\"master.application.premium.subscriptions\");\r\n }\r\n return Promise.resolve();\r\n }\r\n\r\n async getSubscriptionPlan(planId) {\r\n const response = await this.productService.getSubscription(planId);\r\n return response.data;\r\n }\r\n\r\n async setupPaymentMethodRequest() {\r\n const response = await this.service.setupPaymentMethodRequest();\r\n return response.data;\r\n }\r\n\r\n preprocessPayment(planId) {\r\n return this.rootStore.premiumSubscriptionStore.preprocessPayment(planId);\r\n }\r\n\r\n postprocessPayment(subscriptionId) {\r\n return this.rootStore.premiumSubscriptionStore.postprocessPayment(subscriptionId);\r\n }\r\n\r\n subscribeUsingExistingPaymentMethod(planId) {\r\n return this.rootStore.premiumSubscriptionStore.subscribeUsingExistingPaymentMethod(planId);\r\n }\r\n}\r\n\r\nexport default TakePaymentRouteStore;\r\n","import { action, makeObservable } from \"mobx\";\r\nimport { BasePaymentViewStore } from \"application/payment/stores\";\r\nimport { currencyFormatter } from \"mrb/common/formatting\";\r\n\r\nclass TakePaymentViewStore extends BasePaymentViewStore {\r\n planId = null;\r\n\r\n constructor(rootStore, { routeStore }) {\r\n super(rootStore, { routeStore });\r\n makeObservable(this);\r\n this.planId = rootStore.routerStore.routerState.params.planId;\r\n\r\n this.onClickSubscribe = this.onClickSubscribe.bind(this);\r\n }\r\n\r\n async onInit() {\r\n return this.fetchSubscriptionPlan();\r\n }\r\n\r\n async fetchSubscriptionPlan() {\r\n try {\r\n const subscriptionPlan = await this.routeStore.getSubscriptionPlan(this.planId);\r\n this.setSubscriptionPlan(subscriptionPlan);\r\n } catch (err) {\r\n this.rootStore.notificationStore.error(\"Unexpected error occurred. Please contact the support team.\", err);\r\n }\r\n }\r\n\r\n onClickSubscribe(cardElements) {\r\n if (this.paymentMethodExist) {\r\n this.subscribeUsingExistingPaymentMethod();\r\n } else {\r\n this.submitPayment(cardElements);\r\n }\r\n }\r\n\r\n @action.bound\r\n subscribeUsingExistingPaymentMethod() {\r\n const formattedPrice = currencyFormatter.format(this.subscriptionPlan.price, {\r\n currency: \"USD\",\r\n });\r\n this.rootStore.confirmDialogStore.showConfirm({\r\n message: \"Ready to start your subscription?\",\r\n description: `Your card will be charged ${formattedPrice} each month, cancel anytime.`,\r\n yesLabel: `Pay ${formattedPrice}`,\r\n onConfirm: async () => {\r\n try {\r\n await this.routeStore.subscribeUsingExistingPaymentMethod(this.planId);\r\n this.paymentSuccessModal.open({\r\n subscriptionPlan: this.subscriptionPlan.name,\r\n });\r\n } catch (err) {\r\n this.rootStore.notificationStore.error(\r\n \"Unexpected error occurred while trying to process payment. Please contact the support team.\",\r\n err\r\n );\r\n }\r\n },\r\n });\r\n }\r\n\r\n @action.bound\r\n submitPayment(cardElements) {\r\n const formattedPrice = currencyFormatter.format(this.subscriptionPlan.price, {\r\n currency: \"USD\",\r\n });\r\n this.rootStore.confirmDialogStore.showConfirm({\r\n message: \"Ready to start your subscription?\",\r\n description: `Your card will be charged ${formattedPrice} each month, cancel anytime.`,\r\n yesLabel: `Pay ${formattedPrice}`,\r\n onConfirm: async () => {\r\n try {\r\n const { user } = this.rootStore.userStore;\r\n this.stripeField.resetValidation();\r\n const result = await this.routeStore.preprocessPayment(this.planId);\r\n let payload = null;\r\n let paymentMethod = null;\r\n if (result.clientSecret) {\r\n payload = await this.stripe.confirmCardPayment(result.clientSecret, {\r\n payment_method: {\r\n card: cardElements,\r\n },\r\n receipt_email: user.email,\r\n });\r\n } else {\r\n const setupPaymentMethodResponse = await this.routeStore.setupPaymentMethodRequest();\r\n payload = await this.stripe.confirmCardSetup(setupPaymentMethodResponse.token, {\r\n payment_method: {\r\n card: cardElements,\r\n },\r\n });\r\n if (!payload.error) {\r\n paymentMethod = payload.setupIntent.payment_method;\r\n }\r\n }\r\n\r\n if (payload.error) {\r\n this.stripeField.setError(payload.error);\r\n const data = {\r\n undoChanges: true,\r\n paymentProviderSubscriptionId: result.paymentProviderSubscriptionId,\r\n };\r\n await this.routeStore.postprocessPayment(data);\r\n } else {\r\n const data = {\r\n paymentProviderPaymentMethodId: paymentMethod,\r\n paymentProviderSubscriptionId: result.paymentProviderSubscriptionId,\r\n };\r\n await this.routeStore.postprocessPayment(data);\r\n this.paymentSuccessModal.open({\r\n subscriptionPlan: this.subscriptionPlan.name,\r\n });\r\n }\r\n } catch (err) {\r\n this.rootStore.notificationStore.error(\r\n \"Unexpected error occurred while trying to process payment. Please contact the support team.\",\r\n err\r\n );\r\n }\r\n },\r\n });\r\n }\r\n}\r\n\r\nexport default TakePaymentViewStore;\r\n","import { override } from \"mobx\";\r\nimport { MrbBaseRouteStore } from \"mrb/core\";\r\nimport { subscriptionStatuses } from \"common/constants\";\r\nimport { PaymentService, ProductService } from \"common/services\";\r\nimport { isNil } from \"lodash\";\r\n\r\nclass UpgradeTrialRouteStore extends MrbBaseRouteStore {\r\n constructor(rootStore) {\r\n super(rootStore);\r\n\r\n this.service = rootStore.createApplicationService(PaymentService);\r\n this.productService = rootStore.createApplicationService(ProductService);\r\n }\r\n\r\n @override\r\n onBeforeEnter(fromState, toState) {\r\n const subscriptionId = toState.params.subscriptionId;\r\n const subscription = this.rootStore.premiumSubscriptionStore.getSubscription(subscriptionId);\r\n if (\r\n subscription &&\r\n subscription.subscriptionStatus.abrv === subscriptionStatuses.trial &&\r\n !isNil(subscription.endDate)\r\n ) {\r\n return Promise.resolve();\r\n }\r\n return Promise.reject(\"master.application.premium.subscriptions\");\r\n }\r\n\r\n async getSubscriptionPlan(planId) {\r\n const response = await this.productService.getSubscription(planId);\r\n return response.data;\r\n }\r\n\r\n async setupPaymentMethodRequest() {\r\n const response = await this.service.setupPaymentMethodRequest();\r\n return response.data;\r\n }\r\n}\r\n\r\nexport default UpgradeTrialRouteStore;\r\n","import { action, computed, observable, makeObservable } from \"mobx\";\r\nimport { applicationDefaults } from \"common/constants\";\r\nimport { BasePaymentViewStore } from \"application/payment/stores\";\r\nimport { dateFormatter, currencyFormatter } from \"mrb/common/formatting\";\r\n\r\nclass UpgradeTrialViewStore extends BasePaymentViewStore {\r\n @observable.ref subscriptionId = null;\r\n\r\n @computed get subscription() {\r\n return this.rootStore.premiumSubscriptionStore.getSubscription(this.subscriptionId);\r\n }\r\n\r\n constructor(rootStore, { routeStore }) {\r\n super(rootStore, { routeStore });\r\n makeObservable(this);\r\n\r\n this.reaction(\r\n () => this.subscription,\r\n (subscription) => {\r\n this.setSubscriptionPlan(subscription.product);\r\n }\r\n );\r\n this.setSubscriptionId(rootStore.routerStore.routerState.params.subscriptionId);\r\n\r\n this.onClickSubscribe = this.onClickSubscribe.bind(this);\r\n }\r\n\r\n @action.bound\r\n upgradeTrialToFullSubscription(cardElements) {\r\n this.rootStore.confirmDialogStore.showConfirm({\r\n message: \"Ready to start your subscription?\",\r\n description: `Starting from ${dateFormatter.format(this.subscription.trialPeriod.trialEndDate, {\r\n format: applicationDefaults.formats.date,\r\n })} your card will be charged ${currencyFormatter.format(this.subscription.product.price, {\r\n currency: \"USD\",\r\n })} each month. Cancel anytime.`,\r\n yesLabel: \"Subscribe\",\r\n onConfirm: async () => {\r\n if (this.paymentMethodExist) {\r\n await this.upgradeUsingExistingPaymentMethod();\r\n } else {\r\n await this.upgradeUsingNewCreditCard(cardElements);\r\n }\r\n },\r\n });\r\n }\r\n\r\n @action.bound\r\n async upgradeUsingNewCreditCard(cardElements) {\r\n this.stripeField.resetValidation();\r\n try {\r\n const setupPaymentMethodResponse = await this.routeStore.setupPaymentMethodRequest();\r\n const payload = await this.stripe.confirmCardSetup(setupPaymentMethodResponse.token, {\r\n payment_method: {\r\n card: cardElements,\r\n },\r\n });\r\n if (payload.error) {\r\n this.stripeField.setError(payload.error);\r\n } else {\r\n await this.rootStore.premiumSubscriptionStore.upgradeTrialSubscription(\r\n this.subscription.id,\r\n payload.setupIntent.payment_method\r\n );\r\n this.paymentSuccessModal.open({\r\n trialUpgraded: true,\r\n billingStartDate: this.subscription.trialPeriod.trialEndDate, //subscription will be charged at the last day of trial period,\r\n subscriptionPlan: this.subscriptionPlan.name,\r\n });\r\n }\r\n } catch (err) {\r\n this.rootStore.notificationStore.error(\r\n \"An unexpected error occurred while trying to process payment. Please contact the support team.\",\r\n err\r\n );\r\n }\r\n }\r\n\r\n @action.bound\r\n async upgradeUsingExistingPaymentMethod() {\r\n try {\r\n await this.rootStore.premiumSubscriptionStore.upgradeTrialSubscription(this.subscription.id, null);\r\n this.paymentSuccessModal.open({\r\n trialUpgraded: true,\r\n billingStartDate: this.subscription.trialPeriod.trialEndDate, //subscription will be charged at the last day of trial period,\r\n subscriptionPlan: this.subscriptionPlan.name,\r\n });\r\n } catch (err) {\r\n this.rootStore.notificationStore.error(\r\n \"An unexpected error occurred while trying to process payment. Please contact the support team.\",\r\n err\r\n );\r\n }\r\n }\r\n\r\n onClickSubscribe(cardElements) {\r\n this.upgradeTrialToFullSubscription(cardElements);\r\n }\r\n\r\n @action.bound\r\n setSubscriptionId(subscriptionId) {\r\n this.subscriptionId = subscriptionId;\r\n }\r\n}\r\n\r\nexport default UpgradeTrialViewStore;\r\n","import { override } from \"mobx\";\r\nimport { MrbBaseRouteStore } from \"mrb/core\";\r\nimport { PaymentService, ProductService } from \"common/services\";\r\n\r\nclass ActivateTrialRouteStore extends MrbBaseRouteStore {\r\n constructor(rootStore) {\r\n super(rootStore);\r\n\r\n this.service = rootStore.createApplicationService(PaymentService);\r\n this.productService = rootStore.createApplicationService(ProductService);\r\n }\r\n\r\n @override\r\n onBeforeEnter() {\r\n if (\r\n this.rootStore.premiumSubscriptionStore.subscriptionExist ||\r\n this.rootStore.premiumSubscriptionStore.isPremiumTrialPeriodUsed\r\n ) {\r\n return Promise.reject(\"master.application.premium.subscriptions\");\r\n }\r\n }\r\n\r\n async getSubscriptionPlan(planId) {\r\n const response = await this.productService.getSubscription(planId);\r\n return response.data;\r\n }\r\n}\r\n\r\nexport default ActivateTrialRouteStore;\r\n","import { action, observable, makeObservable } from \"mobx\";\r\nimport { MrbBaseViewStore } from \"mrb/core/stores\";\r\nimport { MrbModalParams } from \"mrb/common/models\";\r\n\r\nclass ActivateTrialViewStore extends MrbBaseViewStore {\r\n @observable isSubmitDisabled = false;\r\n @observable.ref subscriptionPlan = null;\r\n planId = null;\r\n\r\n constructor(rootStore, { routeStore }) {\r\n super(rootStore);\r\n makeObservable(this);\r\n this.routeStore = routeStore;\r\n this.planId = rootStore.routerStore.routerState.params.planId;\r\n\r\n this.trialActivatedModal = new MrbModalParams(null, {\r\n onClickExplorePremium: this.goToPremiumContent,\r\n });\r\n }\r\n\r\n goToPremiumContent = () => {\r\n this.rootStore.routerStore.goTo(\"master.application.home.list\", null, {\r\n isPremium: true,\r\n });\r\n };\r\n\r\n onInit() {\r\n return this.fetchSubscriptionPlan();\r\n }\r\n\r\n async fetchSubscriptionPlan() {\r\n try {\r\n const subscriptionPlan = await this.routeStore.getSubscriptionPlan(this.planId);\r\n this.setSubscriptionPlan(subscriptionPlan);\r\n } catch (err) {\r\n this.rootStore.notificationStore.error(\"Unexpected error occurred. Please contact the support team.\", err);\r\n }\r\n }\r\n\r\n @action.bound\r\n setSubscriptionPlan(plan) {\r\n this.subscriptionPlan = plan;\r\n }\r\n\r\n @action.bound\r\n activateTrial() {\r\n this.rootStore.confirmDialogStore.showConfirm({\r\n message: \"Start trial?\",\r\n description: \"You won't be charged for the evaluation period.\",\r\n yesLabel: \"Start\",\r\n onConfirm: async () => {\r\n try {\r\n this.setIsSubmitDisabled(true);\r\n await this.rootStore.premiumSubscriptionStore.activateTrial(this.planId);\r\n this.trialActivatedModal.open({\r\n trialEndDate: this.rootStore.premiumSubscriptionStore.subscription.trialPeriod.trialEndDate,\r\n subscriptionPlan: this.subscriptionPlan.name,\r\n });\r\n } catch (err) {\r\n this.rootStore.notificationStore.error(\r\n \"Unexpected error occurred while trying to activate trial period. Please contact the support team.\",\r\n err\r\n );\r\n } finally {\r\n this.setIsSubmitDisabled(false);\r\n }\r\n },\r\n });\r\n }\r\n\r\n @action.bound\r\n setIsSubmitDisabled(value) {\r\n this.isSubmitDisabled = value;\r\n }\r\n}\r\n\r\nexport default ActivateTrialViewStore;\r\n","import { override } from \"mobx\";\r\nimport { MrbBaseRouteStore } from \"mrb/core\";\r\nimport { PaymentService, ProductService } from \"common/services\";\r\n\r\nclass ChangeSubscriptionPlanRouteStore extends MrbBaseRouteStore {\r\n constructor(rootStore) {\r\n super(rootStore);\r\n\r\n this.service = rootStore.createApplicationService(PaymentService);\r\n this.productService = rootStore.createApplicationService(ProductService);\r\n }\r\n\r\n @override\r\n onBeforeEnter(fromState, toState) {\r\n const subscriptionPlanId = toState.params.planId;\r\n const subscription =\r\n this.rootStore.premiumSubscriptionStore.getSubscriptionBySubscriptionPlan(subscriptionPlanId);\r\n if (subscription) {\r\n return Promise.reject(\"master.application.premium.subscriptions\");\r\n }\r\n return Promise.resolve();\r\n }\r\n\r\n async getSubscriptionPlan(planId) {\r\n const response = await this.productService.getSubscription(planId);\r\n return response.data;\r\n }\r\n\r\n changeSubscriptionPlan(planId) {\r\n return this.rootStore.premiumSubscriptionStore.changeSubscriptionPlan(planId);\r\n }\r\n\r\n async getSubscriptionChangePreview(subscriptionId, planId) {\r\n const response = await this.service.getSubscriptionChangePreview(subscriptionId, planId);\r\n return response.data;\r\n }\r\n}\r\n\r\nexport default ChangeSubscriptionPlanRouteStore;\r\n","import { action, computed, observable, makeObservable } from \"mobx\";\r\nimport { MrbBaseViewStore } from \"mrb/core/stores\";\r\nimport { MrbModalParams } from \"mrb/common/models\";\r\nimport { dateFormatter, currencyFormatter } from \"mrb/common/formatting\";\r\nimport { applicationDefaults, subscriptionPlans, subscriptionStatuses } from \"common/constants\";\r\nimport { cloneDeep, isNil } from \"lodash\";\r\n\r\nclass ChangeSubscriptionPlanViewStore extends MrbBaseViewStore {\r\n @observable.ref subscriptionChangePreview = null;\r\n @observable isChangePlanDisabled = false;\r\n planId = null;\r\n @observable.ref currentSubscription = null;\r\n\r\n @computed get customerPaymentMethod() {\r\n return this.rootStore.premiumSubscriptionStore.customerPaymentMethod;\r\n }\r\n\r\n constructor(rootStore, { routeStore }) {\r\n super(rootStore);\r\n makeObservable(this);\r\n this.routeStore = routeStore;\r\n this.planId = rootStore.routerStore.routerState.params.planId;\r\n\r\n this.changePlan = this.changePlan.bind(this);\r\n\r\n this.changePlanSuccessModal = new MrbModalParams(null, {\r\n onClickExplorePremium: this.goToPremiumContent,\r\n });\r\n }\r\n\r\n async onInit() {\r\n this.currentSubscription = cloneDeep(this.rootStore.premiumSubscriptionStore.subscription);\r\n await this.fetchSubscriptionChangePreview();\r\n }\r\n\r\n goToPremiumContent = () => {\r\n switch (this.subscriptionChangePreview.newSubscriptionPlan.slug) {\r\n case subscriptionPlans.nakiTales:\r\n case subscriptionPlans.nakiRadioPremium:\r\n this.rootStore.routerStore.goTo(\"master.application.home.list\", null, {\r\n isPremium: true,\r\n });\r\n break;\r\n case subscriptionPlans.nakiNigun:\r\n this.rootStore.routerStore.goTo(\"master.application.naki-nigun.list\");\r\n break;\r\n default:\r\n break;\r\n }\r\n };\r\n\r\n async fetchSubscriptionChangePreview() {\r\n try {\r\n const preview = await this.routeStore.getSubscriptionChangePreview(\r\n this.currentSubscription.id,\r\n this.planId\r\n );\r\n this.setSubscriptionChangePreview(preview);\r\n } catch (err) {\r\n this.rootStore.notificationStore.error(\"Unexpected error occurred. Please contact the support team.\", err);\r\n }\r\n }\r\n\r\n async changePlan() {\r\n const formattedSubscriptionPlanPrice = currencyFormatter.format(\r\n this.subscriptionChangePreview.newSubscriptionPlan.price,\r\n {\r\n currency: \"USD\",\r\n }\r\n );\r\n let description;\r\n if (\r\n this.currentSubscription.subscriptionStatus.abrv === subscriptionStatuses.trial &&\r\n !isNil(this.currentSubscription.endDate)\r\n ) {\r\n description = `Your trial subscription will expire on ${dateFormatter.format(\r\n this.currentSubscription.endDate,\r\n {\r\n format: applicationDefaults.formats.date,\r\n }\r\n )}.`;\r\n } else {\r\n description = `Your card will be charged ${formattedSubscriptionPlanPrice} each month, cancel anytime.`;\r\n }\r\n this.rootStore.confirmDialogStore.showConfirm({\r\n message: `Change your subscription plan to ${this.subscriptionChangePreview.newSubscriptionPlan.name}?`,\r\n description: description,\r\n yesLabel: \"Change Plan\",\r\n onConfirm: async () => {\r\n this.setIsChangePlanDisabled(true);\r\n try {\r\n await this.routeStore.changeSubscriptionPlan(this.planId);\r\n this.changePlanSuccessModal.open({\r\n billingStartDate: this.subscriptionChangePreview.dateOfChange, //subscription will be charged at the last day of trial period,\r\n subscriptionPlan: this.subscriptionChangePreview.newSubscriptionPlan.name,\r\n });\r\n } catch (err) {\r\n this.rootStore.notificationStore.error(\r\n \"Unexpected error occurred. Please contact the support team.\",\r\n err\r\n );\r\n } finally {\r\n this.setIsChangePlanDisabled(false);\r\n }\r\n },\r\n });\r\n }\r\n\r\n setIsChangePlanDisabled(value) {\r\n this.isChangePlanDisabled = value;\r\n }\r\n\r\n @action.bound\r\n setSubscriptionChangePreview(preview) {\r\n this.subscriptionChangePreview = preview;\r\n }\r\n}\r\n\r\nexport default ChangeSubscriptionPlanViewStore;\r\n","import { MrbBaseRouteStore } from \"mrb/core\";\r\nimport { ProductService } from \"common/services\";\r\n\r\nclass ChangeSubscriptionPlanPreviewRouteStore extends MrbBaseRouteStore {\r\n constructor(rootStore) {\r\n super(rootStore);\r\n\r\n this.productService = rootStore.createApplicationService(ProductService);\r\n }\r\n\r\n async getAllSubscriptionProducts() {\r\n const response = await this.productService.getAllSubscriptions();\r\n return response.data;\r\n }\r\n}\r\n\r\nexport default ChangeSubscriptionPlanPreviewRouteStore;\r\n","import { subscriptionPlans } from \"common/constants\";\r\n\r\nconst subscriptionPlansSortOrder = [\r\n subscriptionPlans.nakiRadioPremium,\r\n subscriptionPlans.nakiTales,\r\n subscriptionPlans.nakiNigun,\r\n subscriptionPlans.nakiRadioFree,\r\n];\r\n\r\nexport default subscriptionPlansSortOrder;\r\n","import { action, computed, observable, makeObservable } from \"mobx\";\r\nimport { MrbBaseViewStore } from \"mrb/core/stores\";\r\nimport { subscriptionPlansSortOrder } from \"application/payment/utils\";\r\nimport { isNil, sortBy, indexOf } from \"lodash\";\r\n\r\nclass ChangeSubscriptionPlanPreviewViewStore extends MrbBaseViewStore {\r\n @observable.ref subscriptionPlans = [];\r\n\r\n @computed get subscription() {\r\n return this.rootStore.premiumSubscriptionStore.subscription;\r\n }\r\n\r\n constructor(rootStore, { routeStore }) {\r\n super(rootStore);\r\n makeObservable(this);\r\n this.routeStore = routeStore;\r\n }\r\n\r\n async onInit() {\r\n if (!isNil(this.subscription)) {\r\n await this.fetchSubscriptionPlans();\r\n }\r\n }\r\n\r\n async fetchSubscriptionPlans() {\r\n const items = await this.routeStore.getAllSubscriptionProducts();\r\n const sortedSubscriptionPlans = sortBy(items, (subscriptionPlan) => {\r\n return indexOf(subscriptionPlansSortOrder, subscriptionPlan.slug);\r\n });\r\n this.setSubscriptionPlans(sortedSubscriptionPlans);\r\n }\r\n\r\n @action.bound\r\n setSubscriptionPlans(items) {\r\n this.subscriptionPlans = items;\r\n }\r\n}\r\n\r\nexport default ChangeSubscriptionPlanPreviewViewStore;\r\n","import { action, computed, observable, makeObservable } from \"mobx\";\r\nimport { MrbBaseViewStore } from \"mrb/core/stores\";\r\nimport { StripeField } from \"common/models\";\r\nimport { logger } from \"common/utils\";\r\nimport { isNil, map, join } from \"lodash\";\r\n\r\nclass CustomerPaymentMethodInfoViewStore extends MrbBaseViewStore {\r\n @observable.ref stripe = null;\r\n @observable isCreditCardFormVisible = false;\r\n stripeField = null;\r\n\r\n @computed get isPaymentDisabled() {\r\n return isNil(this.stripe) || !this.stripeField.isCompleted;\r\n }\r\n\r\n @computed get creditCardExist() {\r\n return !isNil(this.rootStore.premiumSubscriptionStore.customerPaymentMethod);\r\n }\r\n\r\n @computed get customerPaymentMethod() {\r\n return this.rootStore.premiumSubscriptionStore.customerPaymentMethod;\r\n }\r\n\r\n constructor(rootStore) {\r\n super(rootStore);\r\n makeObservable(this);\r\n this.stripeField = new StripeField();\r\n\r\n this.reaction(\r\n () => this.isCreditCardFormVisible,\r\n (isVisible) => {\r\n if (!isVisible) {\r\n this.stripeField.reset();\r\n }\r\n }\r\n );\r\n }\r\n\r\n @action.bound\r\n setStripe(stripe) {\r\n this.stripe = stripe;\r\n }\r\n\r\n @action.bound\r\n onFormSubmit(cardElements) {\r\n if (this.rootStore.premiumSubscriptionStore.invalidPaymentExist) {\r\n return this.submitPaymentMethod(cardElements);\r\n } else if (!this.creditCardExist) {\r\n this.addPaymentMethod(cardElements);\r\n } else {\r\n return this.createNewPaymentMethod(cardElements);\r\n }\r\n }\r\n\r\n @action.bound\r\n addPaymentMethod(cardElements) {\r\n this.rootStore.confirmDialogStore.showConfirm({\r\n message: \"Add your credit card information?\",\r\n description: \"New credit card will be used for subscription payments.\",\r\n yesLabel: \"Add Card\",\r\n onConfirm: async () => {\r\n this.stripeField.resetValidation();\r\n try {\r\n const setupPaymentMethodResponse =\r\n await this.rootStore.premiumSubscriptionStore.setupPaymentMethodRequest();\r\n const payload = await this.stripe.confirmCardSetup(setupPaymentMethodResponse.token, {\r\n payment_method: {\r\n card: cardElements,\r\n },\r\n });\r\n if (payload.error) {\r\n this.stripeField.setError(payload.error);\r\n } else {\r\n await this.rootStore.premiumSubscriptionStore.updateDefaultPaymentMethod(\r\n payload.setupIntent.payment_method\r\n );\r\n this.setIsCreditCardFormVisible(false); // close update payment method form\r\n }\r\n } catch (err) {\r\n logger.logError(err);\r\n this.rootStore.notificationStore.error(\r\n \"An unexpected error occurred while trying to add credit card. Please contact the support team.\",\r\n err\r\n );\r\n }\r\n },\r\n });\r\n }\r\n\r\n @action.bound\r\n createNewPaymentMethod(cardElements) {\r\n this.rootStore.confirmDialogStore.showConfirm({\r\n message: \"Update your credit card information?\",\r\n description: \"New credit card will be used for subscription payments.\",\r\n yesLabel: \"Update Card\",\r\n onConfirm: async () => {\r\n this.stripeField.resetValidation();\r\n try {\r\n const setupPaymentMethodResponse =\r\n await this.rootStore.premiumSubscriptionStore.setupPaymentMethodRequest();\r\n const payload = await this.stripe.confirmCardSetup(setupPaymentMethodResponse.token, {\r\n payment_method: {\r\n card: cardElements,\r\n },\r\n });\r\n if (payload.error) {\r\n this.stripeField.setError(payload.error);\r\n } else {\r\n await this.rootStore.premiumSubscriptionStore.updateDefaultPaymentMethod(\r\n payload.setupIntent.payment_method\r\n );\r\n this.setIsCreditCardFormVisible(false); // close update payment method form\r\n }\r\n } catch (err) {\r\n logger.logError(err);\r\n this.rootStore.notificationStore.error(\r\n \"An unexpected error occurred while trying to update credit card information. Please contact the support team.\",\r\n err\r\n );\r\n }\r\n },\r\n });\r\n }\r\n\r\n @action.bound\r\n submitPaymentMethod(cardElements) {\r\n const invalidPaymentSubscriptions = this.rootStore.premiumSubscriptionStore.invalidPaymentSubscriptions;\r\n const productNames = map(invalidPaymentSubscriptions, (subscription) => subscription.product.name);\r\n const description = `New credit card will be charged immediately to cover ${join(\r\n productNames,\r\n \" and \"\r\n )} past due ${productNames.length === 1 ? \"subscription\" : \"subscriptions\"}.`;\r\n this.rootStore.confirmDialogStore.showConfirm({\r\n message: \"Update your credit card information?\",\r\n description: description,\r\n yesLabel: \"Update Card\",\r\n onConfirm: async () => {\r\n this.stripeField.resetValidation();\r\n try {\r\n let paymentMethod = null;\r\n for (let subscription of invalidPaymentSubscriptions) {\r\n const payload = await this.stripe.confirmCardPayment(\r\n subscription.latestInvalidPaymentTransaction.processorAuthorizationCode,\r\n {\r\n setup_future_usage: \"off_session\",\r\n payment_method: !isNil(paymentMethod)\r\n ? paymentMethod\r\n : {\r\n card: cardElements,\r\n },\r\n }\r\n );\r\n if (payload.error) {\r\n this.stripeField.setError(payload.error);\r\n break;\r\n } else if (isNil(paymentMethod)) {\r\n // setup new payment method only once, and use it afterward\r\n paymentMethod = payload.paymentIntent.payment_method;\r\n }\r\n }\r\n await this.rootStore.premiumSubscriptionStore.postprocessPaymentMethodUpdate(paymentMethod);\r\n this.setIsCreditCardFormVisible(false); // close update payment method form\r\n } catch (err) {\r\n logger.logError(err);\r\n this.rootStore.notificationStore.error(\r\n \"An unexpected error occurred while trying to update credit card information. Please contact the support team.\",\r\n err\r\n );\r\n }\r\n },\r\n });\r\n }\r\n\r\n @action.bound\r\n setIsCreditCardFormVisible(isCreditCardFormVisible) {\r\n this.isCreditCardFormVisible = isCreditCardFormVisible;\r\n }\r\n}\r\n\r\nexport default CustomerPaymentMethodInfoViewStore;\r\n","import { MrbBaseRouteStore } from \"mrb/core\";\r\nimport { PaymentService, ProductService, UserContentService, NakiNigunUserContentService } from \"common/services\";\r\n\r\nclass PremiumSubscriptionsRouteStore extends MrbBaseRouteStore {\r\n constructor(rootStore) {\r\n super(rootStore);\r\n\r\n this.service = rootStore.createApplicationService(PaymentService);\r\n this.productService = rootStore.createApplicationService(ProductService);\r\n this.userContentService = this.rootStore.createApplicationService(UserContentService);\r\n this.nakiNigunUserContentService = this.rootStore.createApplicationService(NakiNigunUserContentService);\r\n }\r\n\r\n async getAllSubscriptionProducts() {\r\n const response = await this.productService.getAllSubscriptions();\r\n return response.data;\r\n }\r\n\r\n cancelSubscription(subscriptionId) {\r\n return this.rootStore.premiumSubscriptionStore.cancelSubscription(subscriptionId);\r\n }\r\n\r\n renewSubscription(subscriptionId) {\r\n return this.rootStore.premiumSubscriptionStore.renewSubscription(subscriptionId);\r\n }\r\n\r\n async setupPaymentMethodRequest() {\r\n const response = await this.service.setupPaymentMethodRequest();\r\n return response.data;\r\n }\r\n\r\n async findUserContent(params) {\r\n const response = await this.userContentService.findPremiumContentInfo(params);\r\n return response.data;\r\n }\r\n\r\n async getSubPodcasts(params) {\r\n const response = await this.userContentService.getSubPodcasts(params);\r\n return response.data;\r\n }\r\n\r\n async getPodcastVolumes(params) {\r\n const response = await this.userContentService.getPodcastVolumes(params);\r\n return response.data;\r\n }\r\n\r\n async getAlbumsByArtist(params) {\r\n const response = await this.nakiNigunUserContentService.getAlbumsByArtist(params);\r\n return response.data;\r\n }\r\n}\r\n\r\nexport default PremiumSubscriptionsRouteStore;\r\n","import { subscriptionPlans } from \"common/constants\";\r\n\r\nclass NakiRadioFreePlan {\r\n constructor() {\r\n this.id = \"-1\";\r\n this.name = \"NakiRadio Free\";\r\n this.slug = subscriptionPlans.nakiRadioFree;\r\n this.price = 0;\r\n this.features = [\r\n {\r\n description: \"The classic NakiRadio experience\",\r\n sortOrder: 1,\r\n },\r\n {\r\n description: \"More than 50 stations of music, stories and entertainment\",\r\n sortOrder: 2,\r\n },\r\n {\r\n description: \"Thousands of stories, inspirational speeches, and shiurim for all ages\",\r\n sortOrder: 3,\r\n },\r\n {\r\n description: \"Customize your NakiRadio with additional stations and podcasts\",\r\n sortOrder: 4,\r\n },\r\n ];\r\n }\r\n}\r\n\r\nexport default NakiRadioFreePlan;\r\n","import { action, computed, observable, makeObservable } from \"mobx\";\r\nimport { MrbBaseViewStore } from \"mrb/core/stores\";\r\nimport { NakiRadioFreePlan } from \"application/payment/models\";\r\nimport { subscriptionPlansSortOrder } from \"application/payment/utils\";\r\nimport { subscriptionStatuses } from \"common/constants\";\r\nimport { sortBy, indexOf, head } from \"lodash\";\r\n\r\nclass PremiumSubscriptionsViewStore extends MrbBaseViewStore {\r\n @observable.ref subscriptionPlans = [];\r\n @observable.ref selectedSubscriptionPlan = null;\r\n\r\n @computed get subscriptionExist() {\r\n return this.rootStore.premiumSubscriptionStore.subscriptionExist;\r\n }\r\n\r\n @computed get existingSubscriptions() {\r\n return this.rootStore.premiumSubscriptionStore.subscriptions;\r\n }\r\n\r\n constructor(rootStore, { routeStore }) {\r\n super(rootStore);\r\n makeObservable(this);\r\n this.routeStore = routeStore;\r\n const route = this.rootStore.routerStore.getCurrentRoute();\r\n if (route && route.data && route.data.title) {\r\n this.title = route.data.title;\r\n }\r\n }\r\n\r\n async onInit() {\r\n await this.fetchSubscriptionPlans();\r\n this.setSelectedSubscriptionPlan(head(this.subscriptionPlans));\r\n }\r\n\r\n async fetchSubscriptionPlans() {\r\n const items = await this.routeStore.getAllSubscriptionProducts();\r\n this.setSubscriptionPlans(items);\r\n }\r\n\r\n @action.bound\r\n setSubscriptionPlans(items) {\r\n let hasActivePlan = false;\r\n for (let subscriptionPlan of items) {\r\n const subscription = this.rootStore.premiumSubscriptionStore.getSubscriptionBySubscriptionPlan(\r\n subscriptionPlan.id\r\n );\r\n if (subscription) {\r\n subscriptionPlan.subscription = subscription;\r\n hasActivePlan = true;\r\n }\r\n }\r\n const freePlan = new NakiRadioFreePlan();\r\n if (!hasActivePlan && !this.rootStore.premiumSubscriptionStore.subscriptionExist) {\r\n freePlan.subscription = {\r\n id: -1,\r\n subscriptionStatus: {\r\n abrv: subscriptionStatuses.active,\r\n },\r\n };\r\n }\r\n items.push(freePlan);\r\n const sortedSubscriptionPlans = sortBy(items, (subscriptionPlan) => {\r\n return indexOf(subscriptionPlansSortOrder, subscriptionPlan.slug);\r\n });\r\n this.subscriptionPlans = sortedSubscriptionPlans;\r\n }\r\n\r\n @action.bound\r\n setSelectedSubscriptionPlan(subscriptionPlan) {\r\n this.selectedSubscriptionPlan = subscriptionPlan;\r\n }\r\n}\r\n\r\nexport default PremiumSubscriptionsViewStore;\r\n","import { MrbBaseRouteStore } from \"mrb/core\";\r\n\r\nclass UserSubscriptionsPreviewRouteStore extends MrbBaseRouteStore {\r\n constructor(rootStore) {\r\n super(rootStore);\r\n }\r\n}\r\n\r\nexport default UserSubscriptionsPreviewRouteStore;\r\n","import { action, computed, makeObservable } from \"mobx\";\r\nimport { MrbBaseViewStore } from \"mrb/core/stores\";\r\nimport { applicationDefaults, subscriptionStatuses } from \"common/constants\";\r\nimport { dateFormatter } from \"mrb/common/formatting\";\r\nimport { NakiRadioFreePlan } from \"application/payment/models\";\r\n\r\nclass UserSubscriptionsPreviewViewStore extends MrbBaseViewStore {\r\n @computed get activeSubscription() {\r\n return this.preprocessSubscription(this.rootStore.premiumSubscriptionStore.subscription);\r\n }\r\n\r\n @computed get pendingSubscription() {\r\n return this.rootStore.premiumSubscriptionStore.pendingSubscription;\r\n }\r\n\r\n @computed get isSubscriptionBundleActive() {\r\n return this.rootStore.premiumSubscriptionStore.isSubscriptionBundleActive;\r\n }\r\n\r\n constructor(rootStore, { routeStore }) {\r\n super(rootStore);\r\n makeObservable(this);\r\n this.routeStore = routeStore;\r\n\r\n const route = this.rootStore.routerStore.getCurrentRoute();\r\n if (route && route.data && route.data.title) {\r\n this.title = route.data.title;\r\n }\r\n }\r\n\r\n @action.bound\r\n setIsCanceling(isCanceling) {\r\n this.isCanceling = isCanceling;\r\n }\r\n\r\n @action.bound\r\n endTrial(subscriptionId) {\r\n this.rootStore.confirmDialogStore.showConfirm({\r\n message: \"End Premium trial?\",\r\n onConfirm: async () => {\r\n try {\r\n await this.rootStore.premiumSubscriptionStore.endTrialPeriod(subscriptionId);\r\n } catch (err) {\r\n this.rootStore.notificationStore.error(\"Unable to end trial. Please contact the support team.\");\r\n }\r\n },\r\n yesLabel: \"End Trial\",\r\n noLabel: \"Cancel\",\r\n description:\r\n \"Your trial will end immediately, and you won't be able to access Premium features or activate trial anymore.\",\r\n });\r\n }\r\n\r\n @action.bound\r\n cancelSubscription() {\r\n let description;\r\n if (this.activeSubscription.isInternal) {\r\n description =\r\n \"Your subscription will end immediately, and you won't be able to access Premium features anymore.\";\r\n } else {\r\n description = `You'll still be able to access Premium content until ${dateFormatter.format(\r\n this.activeSubscription.nextBillingDate,\r\n {\r\n format: applicationDefaults.formats.date,\r\n }\r\n )}.`;\r\n }\r\n this.rootStore.confirmDialogStore.showConfirm({\r\n message: \"Cancel Subscription?\",\r\n onConfirm: async () => {\r\n try {\r\n await this.rootStore.premiumSubscriptionStore.cancelSubscription(this.activeSubscription.id);\r\n } catch (err) {\r\n this.rootStore.notificationStore.error(\r\n \"Unable to cancel subscription. Please contact the support team.\"\r\n );\r\n }\r\n },\r\n yesLabel: \"Cancel Subscription\",\r\n noLabel: \"Cancel\",\r\n description: description,\r\n });\r\n }\r\n\r\n @action.bound\r\n renewSubscription() {\r\n this.rootStore.confirmDialogStore.showConfirm({\r\n message: \"Renew Subscription?\",\r\n onConfirm: async () => {\r\n try {\r\n await this.rootStore.premiumSubscriptionStore.renewSubscription(this.activeSubscription.id);\r\n } catch (err) {\r\n this.rootStore.notificationStore.error(\r\n \"Unable to renew subscription. Please contact the support team.\"\r\n );\r\n }\r\n },\r\n yesLabel: `Renew ${this.activeSubscription.product.name}`,\r\n noLabel: \"Cancel\",\r\n description: `Your ${this.activeSubscription.product.name} subscription won't be canceled and you can continue enjoying Premium content.`,\r\n });\r\n }\r\n\r\n @action.bound\r\n revertSubscription() {\r\n this.rootStore.confirmDialogStore.showConfirm({\r\n message: \"Revert Subscription?\",\r\n onConfirm: async () => {\r\n try {\r\n await this.rootStore.premiumSubscriptionStore.renewSubscription(this.activeSubscription.id);\r\n } catch (err) {\r\n this.rootStore.notificationStore.error(\r\n \"Unable to revert subscription. Please contact the support team.\"\r\n );\r\n }\r\n },\r\n yesLabel: `Revert to ${this.activeSubscription.product.name}`,\r\n noLabel: \"Cancel\",\r\n description: `Your ${this.activeSubscription.product.name} subscription won't be canceled and you can continue using Premium content.`,\r\n });\r\n }\r\n\r\n preprocessSubscription(subscription) {\r\n if (subscription) {\r\n return subscription;\r\n }\r\n\r\n return {\r\n id: \"-1\",\r\n amount: 0,\r\n product: new NakiRadioFreePlan(),\r\n subscriptionStatus: {\r\n name: \"Active\",\r\n abrv: subscriptionStatuses.active,\r\n },\r\n };\r\n }\r\n}\r\n\r\nexport default UserSubscriptionsPreviewViewStore;\r\n","import { observable, makeObservable } from \"mobx\";\r\nimport { MrbFilterParameters } from \"mrb/core/filter\";\r\n\r\nclass PremiumContentListFilter extends MrbFilterParameters {\r\n @observable contentType;\r\n\r\n constructor() {\r\n super();\r\n makeObservable(this);\r\n this.reset();\r\n }\r\n\r\n reset() {\r\n super.reset();\r\n this.contentType = 1;\r\n }\r\n}\r\n\r\nexport default PremiumContentListFilter;\r\n","import { action, computed, runInAction, makeObservable } from \"mobx\";\r\nimport { MrbBaseListViewStore } from \"mrb/core\";\r\nimport { MrbInfiniteScrollGridViewStore } from \"mrb/components/infinite-scroll-grid\";\r\nimport { PremiumContentListFilter } from \"application/payment/filters\";\r\nimport { podcastType } from \"common/constants\";\r\nimport { head, findIndex } from \"lodash\";\r\n\r\nclass PremiumContentListViewStore extends MrbBaseListViewStore {\r\n _contentTypeOptions = {\r\n \"naki-radio-premium\": [\r\n {\r\n label: \"Naki Tales\",\r\n value: 1,\r\n },\r\n {\r\n label: \"Naki Nigun\",\r\n value: 2,\r\n },\r\n ],\r\n \"naki-nigun-premium\": [\r\n {\r\n label: \"Naki Nigun\",\r\n value: 2,\r\n },\r\n ],\r\n \"naki-radio-free\": [\r\n {\r\n label: \"NakiRadio Free\",\r\n value: 3,\r\n },\r\n ],\r\n };\r\n\r\n @computed get contentTypeOptions() {\r\n if (this.premiumSubscriptionsViewStore.selectedSubscriptionPlan) {\r\n return this._contentTypeOptions[this.premiumSubscriptionsViewStore.selectedSubscriptionPlan.slug];\r\n }\r\n return [];\r\n }\r\n\r\n constructor(rootStore, { routeStore, premiumSubscriptionsViewStore }) {\r\n super(rootStore, {\r\n queryConfig: {\r\n orderBy: \"title\",\r\n orderDirection: \"asc\",\r\n disableUpdateQueryParams: true,\r\n filter: new PremiumContentListFilter(),\r\n },\r\n });\r\n makeObservable(this);\r\n this.routeStore = routeStore;\r\n this.premiumSubscriptionsViewStore = premiumSubscriptionsViewStore;\r\n\r\n this.setGridStore(\r\n new MrbInfiniteScrollGridViewStore(this.rootStore, this.queryUtility, {\r\n onCellClick: (item) => this.goTo(item),\r\n generateKey: (item) => item.stationId || item.podcastId || item.nakiNigunArtistId,\r\n mapper: (item) => {\r\n return {\r\n ...item,\r\n coverImageUrl: this.createCoverImageUrl(item),\r\n };\r\n },\r\n })\r\n );\r\n\r\n this.reaction(\r\n () => this.contentTypeOptions,\r\n (contentTypeOptions) => {\r\n const index = findIndex(\r\n contentTypeOptions,\r\n (option) => option.value === this.queryUtility.filter.contentType\r\n );\r\n if (index === -1) {\r\n this.changeContentFilter(head(contentTypeOptions).value);\r\n }\r\n }\r\n );\r\n\r\n this.createCoverImageUrl = this.createCoverImageUrl.bind(this);\r\n }\r\n\r\n async fetchResources(filter) {\r\n // Display grid (Skeleton loader) only during the first page load, and in other cases, during loading more data on scroll event,\r\n // display only top bar loader (mainLoaderStore)\r\n const isFirstPageLoad = filter.pageNumber === 1;\r\n if (isFirstPageLoad) {\r\n this.gridStore.suspend();\r\n } else {\r\n this.rootStore.mainLoaderStore.suspend();\r\n }\r\n try {\r\n const response = await this.find(filter);\r\n runInAction(() => {\r\n this.gridStore.setData(response);\r\n if (isFirstPageLoad) {\r\n this.gridStore.resume();\r\n } else {\r\n this.rootStore.mainLoaderStore.resume();\r\n }\r\n });\r\n } catch (err) {\r\n if (isFirstPageLoad) {\r\n this.gridStore.resume();\r\n } else {\r\n this.rootStore.mainLoaderStore.resume();\r\n }\r\n this.onFetchError(err);\r\n }\r\n }\r\n\r\n find(params) {\r\n params.isPremium = true;\r\n return this.routeStore.findUserContent(params);\r\n }\r\n\r\n goTo = (item) => {\r\n if (item.stationId) {\r\n this.rootStore.routerStore.goTo(\"master.application.home.station\", {\r\n id: item.stationId,\r\n });\r\n } else if (item.podcastId) {\r\n if (item.podcastType === podcastType.podcast) {\r\n this.rootStore.routerStore.goTo(\"master.application.home.podcast\", {\r\n id: item.podcastId,\r\n });\r\n } else {\r\n this.rootStore.routerStore.goTo(\"master.application.home.podcast-group\", {\r\n id: item.podcastId,\r\n });\r\n }\r\n } else if (item.nakiNigunArtistId) {\r\n this.rootStore.routerStore.goTo(\"master.application.naki-nigun.artist\", {\r\n id: item.nakiNigunArtistId,\r\n });\r\n }\r\n };\r\n\r\n createCoverImageUrl(item) {\r\n if (item.coverImageId) {\r\n if (item.stationId) {\r\n return this.rootStore.coverImageFactory.createStationCoverImageUrl(item.coverImageId, 200, 200);\r\n } else if (item.podcastId) {\r\n return this.rootStore.coverImageFactory.createPodcastCoverImageUrl(item.coverImageId, 200, 200);\r\n } else if (item.nakiNigunArtistId) {\r\n return this.rootStore.coverImageFactory.createNakiNigunArtistCoverImageUrl(item.coverImageId, 200, 200);\r\n }\r\n }\r\n return null;\r\n }\r\n\r\n @action.bound\r\n changeContentFilter(value) {\r\n this.queryUtility.filter.set(\"contentType\", value);\r\n this.queryUtility.fetch();\r\n }\r\n}\r\n\r\nexport default PremiumContentListViewStore;\r\n","import React from \"react\";\r\nimport { observable, action, makeObservable } from \"mobx\";\r\nimport { MrbBaseViewStore } from \"mrb/core\";\r\nimport { podcastType } from \"common/constants\";\r\nimport { map, isNil } from \"lodash\";\r\n\r\nconst SUB_ITEM_TYPE = {\r\n SUB_PODCAST: \"sub-podcast\",\r\n PODCAST_VOLUME: \"podcast-volume\",\r\n NAKI_NIGUN_ALBUM: \"naki-nigun-album\",\r\n};\r\n\r\nclass PremiumContentListItemViewStore extends MrbBaseViewStore {\r\n @observable isCollapsed = false;\r\n panelRef = React.createRef();\r\n item = null;\r\n @observable.ref items = [];\r\n @observable isPopulated = false;\r\n\r\n get hasSubItems() {\r\n return (\r\n this.item.numberOfSubPodcasts > 0 || this.item.numberOfPodcastVolumes > 0 || this.item.numberOfAlbums > 0\r\n );\r\n }\r\n\r\n get hasSubContent() {\r\n return this.hasSubItems || this.item.premiumInfo;\r\n }\r\n\r\n constructor(rootStore, { item, routeStore }) {\r\n super(rootStore);\r\n makeObservable(this);\r\n this.item = item;\r\n this.routeStore = routeStore;\r\n\r\n this.reaction(\r\n () => this.isCollapsed,\r\n (isCollapsed) => {\r\n if (isCollapsed && this.panelRef) {\r\n // We need to execute scroll function asynchronously in order to take effect.\r\n setTimeout(() => {\r\n if (this.panelRef) {\r\n this.panelRef.scrollIntoView({\r\n behavior: \"smooth\",\r\n block: \"center\",\r\n });\r\n }\r\n });\r\n }\r\n }\r\n );\r\n\r\n this.onClickSubItem = this.onClickSubItem.bind(this);\r\n this.createCoverImageUrl = this.createCoverImageUrl.bind(this);\r\n }\r\n\r\n @action.bound\r\n async toggleCollapse() {\r\n this.isCollapsed = !this.isCollapsed;\r\n if (this.isCollapsed && !this.isPopulated && this.hasSubContent) {\r\n await this.getItems();\r\n }\r\n this.setIsPopulated(true);\r\n }\r\n\r\n @action.bound\r\n setIsPopulated(isPopulated) {\r\n this.isPopulated = isPopulated;\r\n }\r\n\r\n setPanelRef = (ref) => {\r\n this.panelRef = ref;\r\n };\r\n\r\n @action.bound\r\n setItems(items) {\r\n this.items = items;\r\n }\r\n\r\n async getNakiNigunArtistSubContent() {\r\n let items = await this.routeStore.getAlbumsByArtist(this.item.nakiNigunArtistId);\r\n items = map(items, (item) => {\r\n return {\r\n ...item,\r\n type: SUB_ITEM_TYPE.NAKI_NIGUN_ALBUM,\r\n coverImageUrl: this.createNakiNigunAlbumCoverImageUrl(item),\r\n };\r\n });\r\n this.setItems(items);\r\n }\r\n\r\n async getPodcastSubContent() {\r\n if (this.item.podcastType === podcastType.podcastGroup) {\r\n let items = await this.routeStore.getSubPodcasts(this.item.podcastId);\r\n items = map(items, (item) => {\r\n return {\r\n ...item,\r\n type: SUB_ITEM_TYPE.SUB_PODCAST,\r\n coverImageUrl: this.createCoverImageUrl(item),\r\n };\r\n });\r\n this.setItems(items);\r\n } else if (this.item.podcastType === podcastType.podcast) {\r\n let items = await this.routeStore.getPodcastVolumes(this.item.podcastId);\r\n items = map(items, (item) => {\r\n return {\r\n ...item,\r\n type: SUB_ITEM_TYPE.PODCAST_VOLUME,\r\n coverImageUrl: this.createCoverImageUrl(item),\r\n };\r\n });\r\n this.setItems(items);\r\n }\r\n }\r\n\r\n async getItems() {\r\n try {\r\n this.loaderStore.suspend();\r\n if (!isNil(this.item.nakiNigunArtistId)) {\r\n await this.getNakiNigunArtistSubContent();\r\n } else if (!isNil(this.item.podcastId)) {\r\n this.getPodcastSubContent();\r\n }\r\n await this.getPodcastSubContent();\r\n } catch (err) {\r\n console.log(err);\r\n this.rootStore.notificationStore.error(\"An unexpected error occurred while trying to fetch content.\", err);\r\n } finally {\r\n this.loaderStore.resume();\r\n }\r\n }\r\n\r\n onClickSubItem(subItem) {\r\n if (subItem.type === SUB_ITEM_TYPE.PODCAST_VOLUME) {\r\n this.rootStore.routerStore.goTo(\"master.application.home.podcast\", {\r\n id: this.item.podcastId,\r\n });\r\n } else if (subItem.type === SUB_ITEM_TYPE.SUB_PODCAST) {\r\n this.rootStore.routerStore.goTo(\"master.application.home.podcast-group\", {\r\n id: this.item.podcastId,\r\n });\r\n } else if (subItem.type === SUB_ITEM_TYPE.NAKI_NIGUN_ALBUM) {\r\n this.rootStore.routerStore.goTo(\"master.application.naki-nigun.artist\", {\r\n id: this.item.nakiNigunArtistId,\r\n });\r\n }\r\n }\r\n\r\n createNakiNigunAlbumCoverImageUrl(item) {\r\n if (item.coverImageId) {\r\n return this.rootStore.coverImageFactory.createNakiNigunAlbumCoverImageUrl(item.coverImageId, 200, 200);\r\n }\r\n return null;\r\n }\r\n\r\n createCoverImageUrl(item) {\r\n if (item.coverImageId) {\r\n return this.rootStore.coverImageFactory.createPodcastCoverImageUrl(item.coverImageId, 200, 200);\r\n } else if (item.podcastFileEntryId) {\r\n return this.rootStore.coverImageFactory.createPodcastCoverImageUrl(item.podcastFileEntryId, 200, 200);\r\n }\r\n return null;\r\n }\r\n}\r\n\r\nexport default PremiumContentListItemViewStore;\r\n"],"sourceRoot":""}