diff --git a/src/background.js b/src/background.js index e64de3a..ca8a57c 100644 --- a/src/background.js +++ b/src/background.js @@ -2,57 +2,13 @@ * License, v. 2.0. If a copy of the MPL was not distributed with this * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ -import {hasKeys} from 'commerce/utils'; - -const PRODUCT_KEYS = ['title', 'image', 'price']; -const SIDEBAR_URL = browser.extension.getURL('/sidebar.html'); - -/** - * Open the sidebar when the page action is clicked. - */ -browser.pageAction.onClicked.addListener(() => { - browser.sidebarAction.open(); -}); - -/** - * Prep initial sidebar on location change for a given tab. - */ -browser.tabs.onUpdated.addListener((tabId, changeInfo, tab) => { - if (changeInfo.url && tab.status === 'loading') { - browser.sidebarAction.setPanel({ - panel: SIDEBAR_URL, - tabId, - }); - } -}); - browser.runtime.onConnect.addListener((port) => { port.onMessage.addListener((message) => { if (message.type === 'product-data') { - // If this page contains a product, prep the sidebar and show the - // page action icon for opening the sidebar. - const isProductPage = hasKeys(message.data, PRODUCT_KEYS); - if (isProductPage) { - browser.sidebarAction.setPanel({ - panel: getPanelURL(message.data), - tabId: port.sender.tab.id, - }); - browser.pageAction.show(port.sender.tab.id); - } + console.log(message.data); // eslint-disable-line no-console } }); port.postMessage({ type: 'background-ready', }); }); - -/** - * Generate the sidebar panel URL for a specific product. - */ -function getPanelURL(productData) { - const url = new URL(SIDEBAR_URL); - for (const key of PRODUCT_KEYS) { - url.searchParams.set(key, productData[key]); - } - return url.href; -} diff --git a/src/manifest.json b/src/manifest.json index 51fd82b..71c6eab 100644 --- a/src/manifest.json +++ b/src/manifest.json @@ -17,21 +17,12 @@ "background": { "scripts": ["background.bundle.js"] }, - "page_action": { - "default_icon": "icon.svg", - "default_title": "Show Shopping Sidebar" - }, "content_scripts": [ { "matches": [""], "js": ["product_info.bundle.js"] } ], - "sidebar_action": { - "default_icon": "icon.svg", - "default_title": "Commerce", - "default_panel": "sidebar.html" - }, "permissions": [ "", "tabs" diff --git a/src/sidebar.html b/src/sidebar.html deleted file mode 100644 index 1d4ac66..0000000 --- a/src/sidebar.html +++ /dev/null @@ -1,11 +0,0 @@ - - - - - - - - - - - diff --git a/src/sidebar/components/Accordion.css b/src/sidebar/components/Accordion.css deleted file mode 100644 index c3ed96c..0000000 --- a/src/sidebar/components/Accordion.css +++ /dev/null @@ -1,30 +0,0 @@ -.accordion { - display: flex; - flex-direction: column; -} - -.accordion-section { - flex: 0 1; -} - -.accordion-section.active { - flex: 1; -} - -.accordion-section-title { - background: #ccc; - border: 1px solid #666; - margin: 0; - font-size: 14px; - font-weight: bold; - padding: 5px 10px; - cursor: pointer; -} - -.accordion-section.active .accordion-section-title { - background: #eee; -} - -.accordion-section-content { - overflow: hidden; -} diff --git a/src/sidebar/components/Accordion.jsx b/src/sidebar/components/Accordion.jsx deleted file mode 100644 index 59a4627..0000000 --- a/src/sidebar/components/Accordion.jsx +++ /dev/null @@ -1,119 +0,0 @@ -/* This Source Code Form is subject to the terms of the Mozilla Public - * License, v. 2.0. If a copy of the MPL was not distributed with this - * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ - -import autobind from 'autobind-decorator'; -import pt from 'prop-types'; -import React from 'react'; - -import 'commerce/sidebar/components/Accordion.css'; - -/** - * An expandable section in an Accordion container. Must be used as a - * direct child of an Accordion. - */ -@autobind -class AccordionSection extends React.Component { - static propTypes = { - /** Text displayed in the clickable header of the section */ - title: pt.string.isRequired, - - /** If true, this section will be expanded by default. */ - initial: pt.bool, // eslint-disable-line react/no-unused-prop-types - - /** Contents that will be displayed when this section is active. */ - children: pt.node.isRequired, - - // All remaining props are provided by Accordion automatically. - active: pt.bool, - index: pt.number, - onClick: pt.func, - - } - - static defaultProps = { - active: false, - initial: false, - onClick() {}, - index: null, - } - - handleClick() { - this.props.onClick(this.props.index); - } - - render() { - const {active, children, title} = this.props; - return ( -
-

{title}

-
- {active && children} -
-
- ); - } -} - -/** - * Displays collapsible content panels in a vertical stack. Only one section can - * be expanded at a time. - * - * @example - * - * Section 1 Content - * Section 2 Content - * - */ -@autobind -export default class Accordion extends React.Component { - static Section = AccordionSection; - - static propTypes = { - /** The only direct children of an Accordion should be Accordion.Section elements */ - children: pt.node.isRequired, - - /** Extra classnames to add to the container element */ - className: pt.string, - } - - static defaultProps = { - className: '', - } - - constructor(props) { - super(props); - this.state = { - activeChildIndex: null, - }; - } - - componentDidMount() { - // Find the first child with `initial` set and make it active. - const childArray = React.Children.toArray(this.props.children); - const initialChildIndex = childArray.findIndex(child => child.props.initial); - this.setState({activeChildIndex: initialChildIndex}); - } - - handleSectionClicked(index) { - this.setState({activeChildIndex: index}); - } - - render() { - const {children, className} = this.props; - return ( -
- { - // toArray strips out null children, which we want. - React.Children.toArray(children).map( - (child, childIndex) => React.cloneElement(child, { - active: childIndex === this.state.activeChildIndex, - onClick: this.handleSectionClicked, - index: childIndex, - }), - ) - } -
- ); - } -} diff --git a/src/sidebar/index.css b/src/sidebar/index.css deleted file mode 100644 index f0b770b..0000000 --- a/src/sidebar/index.css +++ /dev/null @@ -1,17 +0,0 @@ -* { - box-sizing: border-box; -} - -html, -body { - margin: 0; - padding: 0; - height: 100%; - width: 100%; -} - -#sidebar, -.sidebar-container { - width: 100%; - height: 100%; -} diff --git a/src/sidebar/index.jsx b/src/sidebar/index.jsx deleted file mode 100644 index 0c9107c..0000000 --- a/src/sidebar/index.jsx +++ /dev/null @@ -1,65 +0,0 @@ -/* This Source Code Form is subject to the terms of the Mozilla Public - * License, v. 2.0. If a copy of the MPL was not distributed with this - * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ - -import React from 'react'; -import ReactDOM from 'react-dom'; -import pt from 'prop-types'; - -import Accordion from 'commerce/sidebar/components/Accordion'; - -import 'commerce/sidebar/index.css'; - -const PRODUCT_KEYS = ['title', 'image', 'price']; - -class Sidebar extends React.Component { - static propTypes = { - product: pt.shape({ - title: pt.string, - image: pt.string, - price: pt.string, - }), - } - - static defaultProps = { - product: undefined, - } - - componentDidCatch() { - // TODO: Show friendly message when errors happen. - } - - render() { - const {product} = this.props; - return ( - - {product && ( - -
    -
  • {product.title || 'Unknown'}
    • -
  • {product.image || 'Unknown'}
    • -
  • {product.price || 'Unknown'}
    • -
- - )} - -
Collections
- - - ); - } -} - -// Pull in product data from query parameters -const url = new URL(window.location); -const product = { - title: url.searchParams.get('title'), - image: url.searchParams.get('image'), - price: url.searchParams.get('price'), -}; -const isValidProduct = PRODUCT_KEYS.map(key => product[key]).every(val => val); - -ReactDOM.render( - , - document.getElementById('sidebar'), -); diff --git a/src/tests/sidebar/components/test_Accordion.jsx b/src/tests/sidebar/components/test_Accordion.jsx deleted file mode 100644 index 131bae1..0000000 --- a/src/tests/sidebar/components/test_Accordion.jsx +++ /dev/null @@ -1,16 +0,0 @@ -/* This Source Code Form is subject to the terms of the Mozilla Public - * License, v. 2.0. If a copy of the MPL was not distributed with this - * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ - -import React from 'react'; -import {shallow} from 'enzyme'; - -import test from 'tape'; - -import Accordion from 'commerce/sidebar/components/Accordion'; - -test(' should apply the className prop to the returned container element', (t) => { - const wrapper = shallow(); - t.ok(wrapper.is('.foobar.accordion'), 'Accordion container has extra class'); - t.end(); -}); diff --git a/src/tests/test_basic.js b/src/tests/test_basic.js new file mode 100644 index 0000000..6fc9dd2 --- /dev/null +++ b/src/tests/test_basic.js @@ -0,0 +1,10 @@ +/* This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this + * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ + +import test from 'tape'; + +test('that the test suite runs', (t) => { + t.equal(1 + 1, 2, 'Addition works'); + t.end(); +}); diff --git a/src/utils.js b/src/utils.js index 34e0cfc..c50545a 100644 --- a/src/utils.js +++ b/src/utils.js @@ -37,10 +37,3 @@ export async function retry(callback, maxRetries = 5, delayFactor = 2, initialDe } throw lastError; } - -/** - * Check if an object contains all the specified keys. - */ -export function hasKeys(object, keys) { - return keys.map(key => key in object).every(val => val); -} diff --git a/webpack.config.js b/webpack.config.js index 9dd7c9f..f5e070e 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -21,7 +21,6 @@ module.exports = { target: 'web', entry: { background: './src/background', - sidebar: './src/sidebar/index', product_info: './src/product_info', }, output: {