diff --git a/src/app/models/amazon-snippet.ts b/src/app/models/amazon-snippet.ts new file mode 100644 index 000000000..1b11ba665 --- /dev/null +++ b/src/app/models/amazon-snippet.ts @@ -0,0 +1,3 @@ +export default Promise.resolve( + 'This is a blurb about how cheap our books are' +); \ No newline at end of file diff --git a/src/app/pages/details/common/get-this-title-files/options.js b/src/app/pages/details/common/get-this-title-files/options.js index ad9c2833d..2fbbc0e45 100644 --- a/src/app/pages/details/common/get-this-title-files/options.js +++ b/src/app/pages/details/common/get-this-title-files/options.js @@ -1,6 +1,5 @@ import React from 'react'; import {FontAwesomeIcon} from '@fortawesome/react-fontawesome'; -import {faBook} from '@fortawesome/free-solid-svg-icons/faBook'; import {faLaptop} from '@fortawesome/free-solid-svg-icons/faLaptop'; import {faListOl} from '@fortawesome/free-solid-svg-icons/faListOl'; import {faCloudDownloadAlt} from '@fortawesome/free-solid-svg-icons/faCloudDownloadAlt'; @@ -11,7 +10,6 @@ import $ from '~/helpers/$'; import {treatSpaceOrEnterAsClick} from '~/helpers/events'; import {useIntl, FormattedMessage} from 'react-intl'; import OrderPrintCopy from './order-print-copy/order-print-copy'; -import useAmazonAssociatesLink from './amazon-associates-link'; import useTOCContext from '../toc-slideout/context'; import {useDialog} from '~/components/dialog/dialog'; import RecommendedCallout from './recommended-callout/recommended-callout'; @@ -179,28 +177,6 @@ export function usePrintCopyDialog() { return {onClick, PCDialog}; } -export function PrintOption({model, icon = faBook}) { - const slug = (model.slug || '').replace('books/', ''); - const amazonDataLink = useAmazonAssociatesLink(slug); - const intl = useIntl(); - const printText = intl.formatMessage({id: 'getit.print'}); - const text = $.isPolish(model.title) - ? 'Zamów egzemplarz drukowany' - : printText; - const {onClick, PCDialog} = usePrintCopyDialog({}); - - return ( - - - - ); -} - export function BookshareOption({model}) { return (
); } -function PhoneBoxes({contentArray, ...otherProps}) { +function PhoneBoxes({contentArray}) { return (
- {contentArray.map((entry) => )} + {contentArray.map((entry) => ( + + ))}
); } function Button({href, text, buttonClass, onClick}) { return ( - + {text} ); } -function DesktopBox({index, entry, closeAfterDelay}) { +function DesktopBox({index, entry}) { const buttonClass = ['primary', 'secondary'][index]; - return (
-
-
); + if (typeof entry === 'string') { + return ; + } + + return ( +
+
+
+ ); } -function DesktopBoxes({contentArray, ...otherProps}) { +function DesktopBoxes({contentArray}) { return (
- { - contentArray.map((entry, index) => - - ) - } + {contentArray.map((entry, index) => ( + + ))}
); } -export default function OrderPrintCopy({amazonDataLink, hideDialog}) { - const { formatMessage } = useIntl(); - const contentArray = React.useMemo( - () => { - const individual = formatMessage({ - id: 'printcopy.individual', - defaultMessage: 'Individual' - }); - const bookstore = formatMessage({ - id: 'printcopy.bookstore', - defaultMessage: 'Bookstore' - }); - const disclosure = formatMessage({ - id: 'printcopy.disclosure', - defaultMessage: '***' - }); - const button1Text = formatMessage({ - id: 'printcopy.button1', - defaultMessage: 'Order a personal copy' - }); - const button2Text = formatMessage({ - id: 'printcopy.button2', - defaultMessage: 'Order options' - }); +export default function OrderPrintCopy({slug}) { + const amazonDataLink = useAmazonAssociatesLink(slug); + const {formatMessage} = useIntl(); + const {iframe} = useDetailsContext(); + + const iframeCode = React.useMemo( + () => iframe.length > 0 ? (` + ${iframe} +
+ ${amazonDataLink.disclosure} +
+ `) : null, + [iframe, amazonDataLink.disclosure] + ); + const contentArray = React.useMemo(() => { + const individual = formatMessage({ + id: 'printcopy.individual', + defaultMessage: 'Individual' + }); + const bookstore = formatMessage({ + id: 'printcopy.bookstore', + defaultMessage: 'Bookstore' + }); + const disclosure = formatMessage({ + id: 'printcopy.disclosure', + defaultMessage: '***' + }); + const button1Text = formatMessage({ + id: 'printcopy.button1', + defaultMessage: 'Order a personal copy' + }); + const button2Text = formatMessage({ + id: 'printcopy.button2', + defaultMessage: 'Order options' + }); - return [ + return [ + (iframeCode ?? { headerText: individual, headerIcon: faUser, - disclosure: disclosure === '***' ? amazonDataLink.disclosure : disclosure, + disclosure: + disclosure === '***' + ? amazonDataLink.disclosure + : disclosure, buttonText: button1Text, buttonUrl: amazonDataLink.url - }, - { - headerText: bookstore, - headerIcon: faUsers, - buttonText: button2Text, - buttonUrl: 'https://buyprint.openstax.org/bookstore-suppliers' - } - ]; - }, - [amazonDataLink, formatMessage] - ); - const otherProps = React.useMemo( - () => ({ - closeAfterDelay(event) { - if (event) { - window.requestAnimationFrame(hideDialog); - } + }), + { + headerText: bookstore, + headerIcon: faUsers, + buttonText: button2Text, + buttonUrl: 'https://buyprint.openstax.org/bookstore-suppliers' } - }), - [hideDialog] - ); + ]; + }, [amazonDataLink, formatMessage, iframeCode]); + const blurb = usePromise(amazonSnippet, ''); return ( -