documentation and svg cleanup

app/content-scripts/rewards/HotDog.jsx

@@ -1,3 +1,16 @@
+/**
+ * HotDog Component
+ *
+ * Ghostery Browser Extension
+ * https://www.ghostery.com/
+ *
+ * Copyright 2018 Ghostery, Inc. All rights reserved.
+ *
+ * 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, { Component } from 'react';
 import { withRouter } from 'react-router-dom';
 import msgModule from '../utils/msg';
@@ -6,6 +19,10 @@ import { log } from '../../../src/utils/common';
 const msg = msgModule('hotdog');
 const { sendMessage } = msg;
 
+/**
+ * @class Create the Rewards "HotDog", aka UI element
+ * @memberOf RewardsContentScript
+ */
 class HotDog extends Component {
 	constructor(props) {
 		super(props);

app/content-scripts/rewards/Notification.jsx

@@ -1,5 +1,22 @@
+/**
+ * Notification Component
+ *
+ * Ghostery Browser Extension
+ * https://www.ghostery.com/
+ *
+ * Copyright 2018 Ghostery, Inc. All rights reserved.
+ *
+ * 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, { Component } from 'react';
 
+/**
+ * @class Handles notifications for Rewards
+ * @memberOf RewardsContentScript
+ */
 class Notification extends Component {
 	constructor(props) {
 		super(props);

app/content-scripts/rewards/OfferCard.jsx

@@ -1,3 +1,16 @@
+/**
+ * Offer Card Component
+ *
+ * Ghostery Browser Extension
+ * https://www.ghostery.com/
+ *
+ * Copyright 2018 Ghostery, Inc. All rights reserved.
+ *
+ * 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, { Component } from 'react';
 import ReactDOM from 'react-dom';
 import { Link } from 'react-router-dom';
@@ -6,12 +19,16 @@ import { computeTimeDelta } from '../../panel/utils/utils';
 import { log } from '../../../src/utils/common';
 import Notification from './Notification';
 import Settings from './Settings';
-import ClickOutside from '../../panel/components/helpers/ClickOutside';
+import ClickOutside from '../../panel/components/BuildingBlocks/ClickOutside';
 import Tooltip from '../../panel/components/Tooltip';
 
 const msg = msgModule('rewards');
 const { sendMessage } = msg;
 
+/**
+ * @class Generate Rewards offer card
+ * @memberOf RewardsContentScript
+ */
 class OfferCard extends Component {
 	constructor(props) {
 		super(props);

app/content-scripts/rewards/Settings.jsx

@@ -1,5 +1,22 @@
+/**
+ * Settings Component
+ *
+ * Ghostery Browser Extension
+ * https://www.ghostery.com/
+ *
+ * Copyright 2018 Ghostery, Inc. All rights reserved.
+ *
+ * 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, { Component } from 'react';
 
+/**
+ * @class Handles settings for Rewards
+ * @memberOf RewardsContentScript
+ */
 class Settings extends Component {
 	constructor(props) {
 		super(props);

app/content-scripts/rewards/index.jsx

@@ -1,8 +1,6 @@
 /**
  * Ghostery Rewards
  *
- * This file injects Ghostery Rewards
- *
  * Ghostery Browser Extension
  * https://www.ghostery.com/
  *
@@ -12,11 +10,12 @@
  * 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
  */
+
 /**
  * @namespace RewardsContentScript
  */
-/* eslint no-use-before-define: 0 */
 
+/* eslint no-use-before-define: 0 */
 import React from 'react';
 import ReactDOM from 'react-dom';
 import { Router, Route } from 'react-router-dom';
@@ -33,6 +32,10 @@ const { BROWSER_INFO, onMessage } = globals;
 const viewport = document.getElementById('viewport');
 const channelsSupported = (typeof chrome.runtime.connect === 'function');
 
+/**
+ * @class Injects Ghostery Rewards components
+ * @memberOf RewardsContentScript
+ */
 class RewardsApp {
 	constructor() {
 		this.reward = null;

app/images/panel/caret-up.svg

@@ -1,12 +1,3 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<svg width="11px" height="7px" viewBox="0 0 11 7" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-    <!-- Generator: Sketch 47.1 (45422) - http://www.bohemiancoding.com/sketch -->
-    <title>Shape</title>
-    <desc>Created with Sketch.</desc>
-    <defs></defs>
-    <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-        <g id="Expert-View-Panel---expanded-catagories--hover" transform="translate(-1178.000000, -216.000000)" fill="#4A4A4A">
-            <polygon id="Shape" transform="translate(1183.500000, 219.500000) scale(-1, -1) rotate(90.000000) translate(-1183.500000, -219.500000) " points="1180 215.283333 1181.32432 214 1187 219.5 1181.32432 225 1180 223.716667 1184.35135 219.5"></polygon>
-        </g>
-    </g>
-</svg>
+<svg width="11" height="7" viewBox="0 0 11 7" xmlns="http://www.w3.org/2000/svg">
+  <path d="M1.283 7L0 5.676 5.5 0 11 5.676 9.717 7 5.5 2.649z" fill="#4A4A4A" fill-rule="evenodd"/>
+</svg>

app/images/panel/icon-list-view.svg

@@ -1,21 +1,5 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<svg width="21px" height="21px" viewBox="0 0 21 21" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-    <!-- Generator: Sketch 47.1 (45422) - http://www.bohemiancoding.com/sketch -->
-    <title>icon- List view</title>
-    <desc>Created with Sketch.</desc>
-    <defs></defs>
-    <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-        <g id="Detailed-View-Panel---Main-Specs" transform="translate(-3089.000000, -1591.000000)" stroke="#4A4A4A" stroke-width="0.5" fill="#4A4A4A">
-            <g id="Group-8" transform="translate(3080.000000, 1592.000000)">
-                <g id="icon--List-view" transform="translate(19.500000, 10.000000) scale(-1, 1) translate(-19.500000, -10.000000) translate(10.000000, 0.000000)">
-                    <path d="M0.7278,16.8518 C0.7278,17.3028 0.7308,17.7538 0.7258,18.2058 C0.7248,18.3468 0.7658,18.4158 0.9198,18.4148 C1.8288,18.4118 2.7378,18.4118 3.6468,18.4148 C3.7968,18.4158 3.8478,18.3548 3.8468,18.2098 C3.8428,17.3148 3.8418,16.4188 3.8468,15.5238 C3.8478,15.3638 3.7858,15.3118 3.6318,15.3128 C2.7358,15.3178 1.8408,15.3178 0.9448,15.3128 C0.7748,15.3108 0.7228,15.3748 0.7258,15.5388 C0.7328,15.9768 0.7278,16.4148 0.7278,16.8518 M4.5718,16.8748 C4.5718,17.3398 4.5728,17.8048 4.5708,18.2688 C4.5698,18.7758 4.2298,19.1478 3.7208,19.1548 C2.7638,19.1678 1.8068,19.1678 0.8508,19.1548 C0.3398,19.1478 0.0018,18.7778 0.0008,18.2688 C-0.0002,17.3318 -0.0002,16.3958 0.0008,15.4588 C0.0018,14.9508 0.3438,14.5798 0.8508,14.5738 C1.8078,14.5608 2.7648,14.5608 3.7208,14.5738 C4.2278,14.5798 4.5698,14.9528 4.5708,15.4598 C4.5728,15.9318 4.5718,16.4028 4.5718,16.8748" id="Fill-1"></path>
-                    <path d="M3.845,2.2991 C3.845,1.8681 3.837,1.4371 3.848,1.0061 C3.853,0.8171 3.799,0.7441 3.599,0.7461 C2.723,0.7551 1.848,0.7541 0.973,0.7471 C0.793,0.7451 0.722,0.7941 0.724,0.9871 C0.733,1.8621 0.731,2.7371 0.725,3.6121 C0.724,3.7831 0.771,3.8531 0.953,3.8511 C1.842,3.8441 2.731,3.8441 3.619,3.8511 C3.801,3.8531 3.851,3.7821 3.847,3.6121 C3.839,3.1741 3.845,2.7361 3.845,2.2991 M4.572,2.3141 C4.572,2.7721 4.573,3.2301 4.572,3.6881 C4.57,4.2111 4.236,4.5821 3.716,4.5891 C2.759,4.6031 1.803,4.6041 0.846,4.5881 C0.334,4.5801 0.002,4.2101 0.001,3.6981 C5.42101086e-20,2.7691 5.42101086e-20,1.8391 0.001,0.9091 C0.002,0.3771 0.346,0.0121 0.876,0.0071 C1.819,-0.0019 2.762,-0.0029 3.705,0.0071 C4.226,0.0141 4.57,0.3821 4.571,0.9001 C4.573,1.3711 4.572,1.8421 4.572,2.3141" id="Fill-3"></path>
-                    <path d="M2.2859,11.1311 C2.7169,11.1311 3.1479,11.1311 3.5779,11.1311 C3.8359,11.1311 3.8449,11.1221 3.8449,10.8751 C3.8449,10.0131 3.8409,9.1511 3.8479,8.2891 C3.8499,8.1011 3.7999,8.0271 3.5989,8.0281 C2.7239,8.0371 1.8489,8.0361 0.9729,8.0291 C0.7939,8.0281 0.7229,8.0761 0.7239,8.2681 C0.7329,9.1441 0.7329,10.0191 0.7239,10.8951 C0.7229,11.0871 0.7929,11.1381 0.9729,11.1341 C1.4099,11.1251 1.8479,11.1311 2.2859,11.1311 M0.0009,9.5821 C0.0009,9.1171 -0.0011,8.6521 0.0009,8.1871 C0.0029,7.6651 0.3419,7.2971 0.8609,7.2911 C1.8109,7.2791 2.7609,7.2791 3.7109,7.2911 C4.2299,7.2971 4.5709,7.6671 4.5709,8.1871 C4.5729,9.1171 4.5719,10.0471 4.5709,10.9771 C4.5709,11.4971 4.2299,11.8671 3.7109,11.8731 C2.7609,11.8841 1.8109,11.8841 0.8609,11.8731 C0.3419,11.8661 0.0029,11.4981 0.0009,10.9761 C-0.0001,10.5111 0.0009,10.0471 0.0009,9.5821" id="Fill-5"></path>
-                    <path d="M12.4211,2.6629 L6.4751,2.6629 C6.2291,2.6629 6.0791,2.5689 6.0361,2.3899 C5.9821,2.1629 6.1381,1.9539 6.3741,1.9369 C6.4071,1.9349 6.4411,1.9359 6.4751,1.9359 C10.4521,1.9359 14.4301,1.9369 18.4081,1.9339 C18.6131,1.9339 18.7701,1.9899 18.8401,2.1899 C18.9191,2.4129 18.7521,2.6489 18.5091,2.6609 C18.3411,2.6689 18.1721,2.6629 18.0041,2.6629 L12.4211,2.6629 Z" id="Fill-7"></path>
-                    <path d="M12.4407,9.219 L18.3667,9.219 C18.4277,9.219 18.4887,9.215 18.5487,9.222 C18.7207,9.245 18.8487,9.395 18.8537,9.571 C18.8577,9.757 18.7297,9.916 18.5497,9.942 C18.5037,9.948 18.4557,9.946 18.4087,9.946 L6.4757,9.946 C6.4347,9.946 6.3947,9.948 6.3547,9.944 C6.1627,9.924 6.0257,9.767 6.0297,9.573 C6.0337,9.387 6.1687,9.239 6.3527,9.221 C6.4127,9.215 6.4737,9.219 6.5347,9.219 L12.4407,9.219 Z" id="Fill-10"></path>
-                    <path d="M12.4416,16.5012 C14.4376,16.5012 16.4326,16.5012 18.4286,16.5012 C18.6996,16.5012 18.8586,16.6432 18.8536,16.8752 C18.8486,17.0592 18.7136,17.2072 18.5286,17.2262 C18.4886,17.2302 18.4486,17.2282 18.4076,17.2282 L6.4746,17.2282 C6.2196,17.2282 6.0666,17.1252 6.0326,16.9352 C5.9926,16.7042 6.1506,16.5082 6.3936,16.5022 C6.6436,16.4972 6.8926,16.5012 7.1426,16.5012 L12.4416,16.5012 Z" id="Fill-12"></path>
-                </g>
-            </g>
-        </g>
-    </g>
-</svg>
+<svg width="21" height="21" viewBox="0 0 21 21" xmlns="http://www.w3.org/2000/svg">
+  <g stroke="#4A4A4A" stroke-width=".5" fill="#4A4A4A" fill-rule="evenodd">
+    <path d="M19.272 17.852c0 .45-.003.902.002 1.354.001.14-.04.21-.194.209-.909-.003-1.818-.003-2.727 0-.15 0-.2-.06-.2-.205.004-.895.005-1.791 0-2.686 0-.16.061-.212.215-.211.896.005 1.791.005 2.687 0 .17-.002.222.062.22.226-.008.438-.003.876-.003 1.313m-3.844.023l.001 1.394c.001.507.341.879.85.886.957.013 1.914.013 2.87 0 .511-.007.85-.377.85-.886v-2.81c0-.508-.343-.88-.85-.885-.957-.013-1.914-.013-2.87 0-.507.006-.849.379-.85.886-.002.472 0 .943 0 1.415M16.155 3.3c0-.432.008-.863-.003-1.294-.005-.189.049-.262.249-.26.876.01 1.751.008 2.626.001.18-.002.251.047.249.24-.009.875-.007 1.75-.001 2.625.001.171-.046.241-.228.24a169.23 169.23 0 0 0-2.666 0c-.182.001-.232-.07-.228-.24.008-.438.002-.876.002-1.313m-.727.015v1.374c.002.523.336.894.856.901.957.014 1.913.015 2.87 0 .512-.009.844-.379.845-.89v-2.79c-.001-.532-.345-.897-.875-.902-.943-.009-1.886-.01-2.829 0-.521.007-.865.375-.866.893-.002.471-.001.942-.001 1.414M17.714 12.131h-1.292c-.258 0-.267-.009-.267-.256 0-.862.004-1.724-.003-2.586-.002-.188.048-.262.25-.26.874.008 1.75.007 2.625 0 .18 0 .25.047.25.24-.01.875-.01 1.75 0 2.626 0 .192-.07.243-.25.24-.437-.01-.875-.004-1.313-.004M20 10.582c0-.465.002-.93 0-1.395-.002-.522-.34-.89-.86-.896-.95-.012-1.9-.012-2.85 0-.519.006-.86.376-.86.896a864.9 864.9 0 0 0 0 2.79c0 .52.341.89.86.896.95.011 1.9.011 2.85 0 .52-.007.858-.375.86-.897v-1.394M7.579 3.663h5.946c.246 0 .396-.094.439-.273a.365.365 0 0 0-.338-.453c-.033-.002-.067-.001-.101-.001-3.977 0-7.955 0-11.933-.002-.205 0-.362.056-.432.256-.08.223.088.459.33.47.169.009.338.003.506.003h5.583zM7.56 10.219H1.632c-.06 0-.122-.004-.182.003a.359.359 0 0 0-.305.349.36.36 0 0 0 .304.371c.046.006.094.004.141.004h11.933c.041 0 .081.002.121-.002a.359.359 0 0 0 .325-.371.355.355 0 0 0-.323-.352c-.06-.006-.12-.002-.182-.002H7.56zM7.558 17.501H1.571c-.27 0-.43.142-.425.374.005.184.14.332.325.351.04.004.08.002.121.002h11.933c.255 0 .408-.103.442-.293a.36.36 0 0 0-.36-.433c-.25-.005-.5 0-.75 0H7.558z"/>
+  </g>
+</svg>

app/images/panel/left-left-moon.svg

@@ -1,15 +1,6 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<svg width="24px" height="52px" viewBox="0 0 24 52" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-    <!-- Generator: Sketch 47.1 (45422) - http://www.bohemiancoding.com/sketch -->
-    <title>symbol-half circle hover caret left</title>
-    <desc>Created with Sketch.</desc>
-    <defs></defs>
-    <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-        <g id="Global-BlockingExpanded-MAX-View-Panel" transform="translate(-624.000000, -1326.000000)">
-            <g id="symbol-half-circle-hover-caret-left" transform="translate(624.000000, 1326.000000)">
-                <path d="M24,51.8484415 C10.5751046,50.8271917 0,39.6106802 0,25.9242207 C0,12.2377612 10.5751046,1.02124974 24,2.14481211e-13 L24,51.8484415 Z" id="Combined-Shape" fill="#EBEBEB"></path>
-                <polygon id="Shape-Copy-2" fill="#4A4A4A" transform="translate(13.500000, 25.500000) rotate(180.000000) translate(-13.500000, -25.500000) " points="10 21.2833333 11.3243243 20 17 25.5 11.3243243 31 10 29.7166667 14.3513514 25.5"></polygon>
-            </g>
-        </g>
-    </g>
-</svg>
+<svg width="24" height="52" viewBox="0 0 24 52" xmlns="http://www.w3.org/2000/svg">
+  <g fill="none" fill-rule="evenodd">
+    <path d="M24 51.848C10.575 50.828 0 39.611 0 25.924 0 12.238 10.575 1.021 24 0v51.848z" fill="#EBEBEB"/>
+    <path fill="#4A4A4A" d="M17 29.717L15.676 31 10 25.5l5.676-5.5L17 21.283 12.649 25.5z"/>
+  </g>
+</svg>

app/images/panel/left-right-moon.svg

@@ -1,15 +1,6 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<svg width="24px" height="52px" viewBox="0 0 24 52" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-    <!-- Generator: Sketch 47.1 (45422) - http://www.bohemiancoding.com/sketch -->
-    <title>symbol-hover right half ricle caret right</title>
-    <desc>Created with Sketch.</desc>
-    <defs></defs>
-    <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-        <g id="Expert-View-Panel---expanded-catagories--hover" transform="translate(-253.000000, -440.000000)">
-            <g id="symbol-hover-right-half-ricle-caret-right" transform="translate(253.000000, 440.000000)">
-                <path d="M24,51.8484415 C10.5751046,50.8271917 0,39.6106802 0,25.9242207 C0,12.2377612 10.5751046,1.02124974 24,2.14481211e-13 L24,51.8484415 Z" id="Combined-Shape" fill="#EBEBEB"></path>
-                <polygon id="Shape" fill="#4A4A4A" transform="translate(13.500000, 25.500000) scale(-1, 1) rotate(180.000000) translate(-13.500000, -25.500000) " points="10 21.2833333 11.3243243 20 17 25.5 11.3243243 31 10 29.7166667 14.3513514 25.5"></polygon>
-            </g>
-        </g>
-    </g>
-</svg>
+<svg width="24" height="52" viewBox="0 0 24 52" xmlns="http://www.w3.org/2000/svg">
+  <g fill="none" fill-rule="evenodd">
+    <path d="M24 51.848C10.575 50.828 0 39.611 0 25.924 0 12.238 10.575 1.021 24 0v51.848z" fill="#EBEBEB"/>
+    <path fill="#4A4A4A" d="M10 29.717L11.324 31 17 25.5 11.324 20 10 21.283l4.351 4.217z"/>
+  </g>
+</svg>

app/images/panel/line-empty-moon.svg

@@ -1,10 +1,3 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<svg width="4px" height="23px" viewBox="0 0 4 23" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-    <!-- Generator: Sketch 49.2 (51160) - http://www.bohemiancoding.com/sketch -->
-    <title>Line</title>
-    <desc>Created with Sketch.</desc>
-    <defs></defs>
-    <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round">
-        <path d="M2,1.5 L2,21.5" id="Line" stroke="#D1D9DC" stroke-width="3"></path>
-    </g>
+<svg width="4" height="23" viewBox="0 0 4 23" xmlns="http://www.w3.org/2000/svg">
+  <path d="M2 1.5v20" stroke="#D1D9DC" stroke-width="3" fill="none" fill-rule="evenodd" stroke-linecap="round"/>
 </svg>

app/images/panel/plus.svg

@@ -1,19 +1,6 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<svg width="15px" height="15px" viewBox="0 0 15 15" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-    <!-- Generator: Sketch 47.1 (45422) - http://www.bohemiancoding.com/sketch -->
-    <title>icon- add site</title>
-    <desc>Created with Sketch.</desc>
-    <defs></defs>
-    <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-        <g id="Settings" transform="translate(-741.000000, -1877.000000)" fill="#9B9B9B">
-            <g id="Group-2" transform="translate(201.000000, 1726.000000)">
-                <g id="Group" transform="translate(246.000000, 144.000000)">
-                    <g id="icon--add-site" transform="translate(294.000000, 7.000000)">
-                        <path d="M7.5,13.9655172 C3.93103448,13.9655172 1.03448276,11.0689655 1.03448276,7.5 C1.03448276,3.93103448 3.93103448,1.03448276 7.5,1.03448276 C11.0689655,1.03448276 13.9655172,3.93103448 13.9655172,7.5 C13.9655172,11.0689655 11.0689655,13.9655172 7.5,13.9655172 M7.5,0 C3.36206897,0 0,3.36206897 0,7.5 C0,11.637931 3.36206897,15 7.5,15 C11.637931,15 15,11.637931 15,7.5 C15,3.36206897 11.637931,0 7.5,0" id="Fill-1"></path>
-                        <polygon id="Fill-3" points="8 4 7 4 7 7 4 7 4 8 7 8 7 11 8 11 8 8 11 8 11 7 8 7"></polygon>
-                    </g>
-                </g>
-            </g>
-        </g>
-    </g>
-</svg>
+<svg width="15" height="15" viewBox="0 0 15 15" xmlns="http://www.w3.org/2000/svg">
+  <g fill="#9B9B9B" fill-rule="evenodd">
+    <path d="M7.5 13.966A6.468 6.468 0 0 1 1.034 7.5 6.468 6.468 0 0 1 7.5 1.034 6.468 6.468 0 0 1 13.966 7.5 6.468 6.468 0 0 1 7.5 13.966M7.5 0A7.505 7.505 0 0 0 0 7.5C0 11.638 3.362 15 7.5 15S15 11.638 15 7.5 11.638 0 7.5 0"/>
+    <path d="M8 4H7v3H4v1h3v3h1V8h3V7H8z"/>
+  </g>
+</svg>