\n 0 ? 'hidden' : ''} />\n
\n )}\n />\n );\n});\n\nexport default Search;","import { createBrowserHistory } from 'history';\n\nexport function isMobile() {\n return document.documentElement.clientWidth < 1200;\n}\n\nexport function sleep(s) {\n return new Promise((resolve) => setTimeout(resolve, s * 1000));\n}\n\nexport function getProductIdByURL(url) {\n if (!url) {\n return;\n }\n\n const dpRegexMatch = url.match(/\\/dp\\/[a-z0-9A-Z]{10}/);\n if (dpRegexMatch) {\n // remove e.g. /dp/DPRODUC93f => DPRODUC93f\n return dpRegexMatch.toString().substring(4);\n }\n\n const productRegexMatch = url.toLowerCase().match(/\\/product\\/[a-z0-9]{10}/);\n if (productRegexMatch) {\n // remove e.g. /product/DPRODUC93f => DPRODUC93f\n return productRegexMatch.toString().substring(9);\n }\n\n const lazy = url.match(/\\/[a-z0-9A-Z]{10}/);\n if (lazy) {\n // remove e.g. /DPRODUC93f => DPRODUC93f\n return lazy.toString().substring(1);\n }\n}\n\nexport const lowestScoreFirst = 'lowest score first';\nexport const highestScoreFirst = 'highest score first';\nexport const recentFirst = 'newest first';\nexport const oldestFirst = 'oldest first';\nexport function sortBy(comments, sortOption) {\n let sortedComments;\n switch (sortOption) {\n case highestScoreFirst:\n sortedComments = comments.sort((a, b) => b.props.comment.score - a.props.comment.score);\n break;\n case lowestScoreFirst:\n sortedComments = comments.sort((a, b) => a.props.comment.score - b.props.comment.score);\n break;\n case recentFirst:\n sortedComments = comments.sort((a, b) => b.props.comment.created - a.props.comment.created);\n break;\n case oldestFirst:\n sortedComments = comments.sort((a, b) => a.props.comment.created - b.props.comment.created);\n break;\n default:\n sortedComments = comments;\n break;\n }\n return sortedComments;\n}\n\nexport function logPageViewEvent(pathname) {\n window.gtag && window.gtag('event', 'page_view', {\n page_title: pathname,\n page_location: window.location,\n page_path: pathname\n });\n}\n\nexport function getPathName() {\n const pathname = createBrowserHistory().location.pathname\n return pathname.substring(0, 3) === '/r/' ? pathname.substring(2) : pathname;\n}\n\nexport function getSubNameByPathname(pathname) {\n return pathname.substring(1).toLowerCase().replace('/', '');\n}\n","import React, { Component } from 'react';\nimport { withRouter, Link } from 'react-router-dom';\nimport Search from '../Search';\nimport './index.css';\nimport { isMobile } from '../../utils/utils';\nimport { throwStatement } from '@babel/types';\n\nclass Header extends Component {\n constructor(props) {\n super(props);\n this.state = { subs: [] };\n this.searchRef = React.createRef();\n this.ppRef = React.createRef();\n }\n\n async componentDidMount() {\n if (isMobile()) {\n window.addEventListener('scroll', this.onScroll);\n }\n\n const response = await fetch('https://f.shopbysub.com/sublist.json');\n if (response.status !== 200 && response.status !== 304) {\n return;\n }\n const subs = await response.json();\n this.setState({ subs });\n }\n\n componentWillUnmount() {\n if (isMobile()) {\n window.removeEventListener('scroll', this.onScroll);\n }\n }\n\n shouldComponentUpdate(nextProps, nextState) {\n return this.state.subs.length === 0 && nextState.subs.length > 0;\n }\n\n handleSubmit = (event, value) => {\n if (!value) {\n return;\n }\n\n // Prevents any trailing slash from mucking up the request for comments\n const pathname = this.props.history.location.pathname;\n if (pathname !== '/' && pathname[pathname.length - 1] === '/') {\n this.props.history.location.pathname = pathname.substring(0, pathname.length - 1);\n }\n\n this.props.history.replace(value);\n event.preventDefault();\n }\n\n onScroll = () => {\n if (this.searchRef) {\n let offsetTop = this.searchRef.offsetTop;\n if (window.pageYOffset > offsetTop) {\n this.searchRef.className = 'sticky';\n this.ppRef.className = 'extra-padding-top'\n } else {\n this.searchRef.className = '';\n this.ppRef.className = ''\n }\n }\n }\n\n render() {\n const { subs } = this.state;\n return (\n \n ShopBySub.com\n
\n )\n }\n}\n\nexport default withRouter(Header);","import React, { useState, useEffect, useRef } from 'react';\nimport ReactMarkdown from 'react-markdown';\nimport Launch from '@material-ui/icons/Launch';\nimport ExpandMore from '@material-ui/icons/ExpandMore';\nimport ExpandLess from '@material-ui/icons/ExpandLess';\nimport { Link } from 'react-router-dom';\nimport AmazonLogo from '../../assets/amazon_logo.png';\nimport './index.css';\nimport { getProductIdByURL } from '../../utils/utils';\n\nconst TAG = 'sbs0e48-20';\n\nfunction getRefLink(url) {\n const queryIdx = url.indexOf('?');\n if (queryIdx === -1) {\n return `${url}?tag=${TAG}`;\n } else {\n const tagIdx = url.toLowerCase().indexOf('tag');\n if (tagIdx === -1) {\n return `${url}&tag=${TAG}`;\n } else {\n const regex = /tag=[^&]*/gi;\n return url.replace(regex, `tag=${TAG}`);\n }\n }\n}\n\nfunction getImgSrc(productId) {\n if (typeof productId !== 'string') {\n return;\n }\n // return `//ws-na.amazon-adsystem.com/widgets/q?_encoding=UTF8&ASIN=${productId.toUpperCase()}&Format=_SL250_&ID=AsinImage&MarketPlace=US&ServiceVersion=20070822&WS=1&tag=${TAG}&language=en_US`; // Deprecated\n return `https://images.amazon.com/images/P/${productId.toUpperCase()}.jpg`;\n}\n\nconst transformLinkUri = (uri) => {\n if (uri && uri.toLowerCase().includes('amazon')) {\n const myUrl = getRefLink(uri);\n return ReactMarkdown.uriTransformer(myUrl);\n }\n return ReactMarkdown.uriTransformer(uri);\n};\n\nconst onReflinkClick = (productUrl, permalink) => {\n window.gtag && window.gtag('event', 'click', {\n 'event_category': 'Product',\n 'event_label': permalink,\n 'product_url': productUrl,\n });\n}\n\nconst CommentText = React.memo((props) => {\n const { body } = props;\n const [isOverflow, setIsOverflow] = useState(false);\n const [isCollapsed, setIsCollapsed] = useState(true);\n const ref = useRef(null);\n useEffect(() => setIsOverflow(ref.current.clientHeight > 100), []);\n\n return (\n this.searchRef = ref}>\n
\n Discover products mentioned on Reddit\n \n \n
\n \n
\n );\n});\n\nconst AmazonPreviewImage = React.memo(props => {\n const { productUrl, permalink, productId, productImgSrc } = props;\n const [imgBorked, setImgBorked] = useState(false);\n\n // Check if the image is a single pixel fallback, to set error state\n const handleImageLoad = (e) => {\n const img = e.target;\n if (img.naturalWidth === 1 && img.naturalHeight === 1) {\n setImgBorked(true); // Image is likely a 1x1 fallback\n e.target.style = 'display: none';\n }\n };\n\n return (\n onReflinkClick(productUrl, permalink)}>\n \n
\n {isOverflow &&\n setIsCollapsed(!isCollapsed)}>\n {isCollapsed ? 'expand' : 'collapse'}\n {isCollapsed ?
\n }\n 
\n \n {productId && !imgBorked ? 
{ e.target.style = 'display: none'; setImgBorked(true) }} /> : 'Link to product'}\n
\n \n );\n});\n\nconst AmazonProductPreview = React.memo(props => {\n const { productId } = props;\n return (\n \n \n \n
\n );\n});\n\nconst Comment = React.memo((props) => {\n const { showSubreddit, shouldDisplayProductPreview } = props;\n const { username, score, body, reflink, permalink, subreddit } = props.comment;\n const productId = getProductIdByURL(reflink);\n const productImgSrc = getImgSrc(productId);\n const productUrl = `https://${getRefLink(reflink)}`;\n\n return (\n \n {showSubreddit && /r/{subreddit}}\n {!shouldDisplayProductPreview &&
\n );\n});\n\nexport default Comment;\n","import React from 'react';\nimport './index.css';\n\nconst Spinner = React.memo(() => {\n return (\n \n );\n});\n\nexport default Spinner;","import React from 'react';\nimport TextField from '@material-ui/core/TextField';\nimport './index.css';\n\nconst Filter = React.memo((props) => {\n const { onFilter } = props;\n return (\n \n permalink\n
\n \n - /u/{username}\n
\n \n \n {subName === 'Most Recent' ?\n <>\n Most Recent\n
\n As an Amazon Associate I earn from qualifying purchases\n
\n \n {subName === 'Most Recent' ?\n <>\n Most Recent\n
\n New comment ingestion disabled due to Reddit API cost surge, sorry!\n :\n `/r/${subName}`}\n
\n As an Amazon Associate I earn from qualifying purchases\n \n \n \n \n \n \n \n
\n \n {loading ?
\n \n
\n \n )\n});\n\nexport default PrivacyPolicy;","import React from 'react';\nimport {\n BrowserRouter as Router,\n Switch,\n Route\n} from \"react-router-dom\";\nimport './App.css';\nimport SubPage from './components/SubPage';\nimport PrivacyPolicy from './components/PrivacyPolicy';\n\nfunction App() {\n return (\n <>\n Privacy Policy
\n{privacyPolicyText}
\n\n Amazon product previews {amazonCookiesDisabled ? 'disabled' : 'enabled'} and Amazon tracking cookies {amazonCookiesDisabled ? 'disabled' : 'enabled'}\n { setAmazonCookiesDisabled(!amazonCookiesDisabled); storeAmazonCookiesSetting(!amazonCookiesDisabled) }}>\n {amazonCookiesDisabled && \n
\n