Chrome extension prep (#71)

* Fixed bug showing 2 user auth comps.  Fixed test.

* Deployment prep work

* Updated for Chrome ext deployment

.env

@@ -0,0 +1 @@
+INLINE_RUNTIME_CHUNK=false 

README.md

@@ -1,10 +1,31 @@
 # Star Daddy
 
-Star Daddy is an application for categorization and re-discovery of starred GitHub repositories. It aims to improve on GitHubs existing starred repository system by allowing users to tag repos with labels that make sense to them and the use these labels to filter their stars down to that one perfect repo when they need it.
+<p align="center">
+  <img width="200" height="200" src="https://yrkwlw.db.files.1drv.com/y4mFBElswbp2x1ukUFu84CqhzyXt1R4WHsQaFxIjPYmCuFiv9h_mBx0mkl1VP1OLZIghgJ8vuKoohq1oC83GODDISVuaFjiXTAznaxZDhFILZIyI512NHaOIAecAUroGpgHutRTNdA28_JQtDCRHyf2IWM3qJmxrjefFq1pbEFxdViAZQHIH2KySjaVH8viRzua46AAfbk2CA6UhLAqagxKbA?width=256&height=256&cropmode=none">
+</p>
 
-This project is a **work in progress** and still in early alpha.
+Star Daddy is a Firefox browser extension for categorization and re-discovery of starred GitHub repositories. It aims to improve on GitHubs existing starred repository system by allowing users to tag repos with labels that make sense to them and the use these labels to filter their stars down to that one perfect repo when they need it.
+
+This project is a **work in progress** and preparing for initial release.
 
 See [Requirements Doc](https://github.com/donanroherty/StarDaddy/wiki/Requirements) for more info, or download [AdobeXD Design File](https://1drv.ms/u/s!Arcuy-4Tl1Q4laUjFtirvPZLcqeYHg).
 
-**Mockup**
-![enter image description here](https://yrkvlw.db.files.1drv.com/y4mbXnO_jmJFPVbzeTbyUUT6ozfWsF9LSTDoYcBNisH2YegXOBPhUC1w-yBnxb5pUKTm41NFBD9aqM856lxtWmqWsvYkWVap27uJhBcCoUARdQRLRbW4zxNXLof2m-Z6PHbGF3GgaugANGdUgDFNIRmGfXQ13g5ep_CXQtzvIlBDuaF-8h6YtJyGmduZCyFMqt5ZYdo-v7w874mQWLTs7EAXw?width=1366&height=768&cropmode=none)
+## Build instructions
+
+```
+// Software versions
+node: v10.16.2
+yarn: 1.17.3
+```
+
+
+```javascript
+// Development
+yarn start
+
+// Run tests
+yarn test
+
+// Build
+yarn build    // outputs to `project-root/build`
+```

package.json

@@ -1,9 +1,10 @@
 {
   "name": "star-daddy",
-  "version": "0.1.0",
+  "version": "1.0.0",
   "private": true,
   "dependencies": {
     "@types/react-tooltip": "^3.9.3",
+    "addons-linter": "^1.12.1",
     "axios": "^0.19.0",
     "polished": "^3.4.1",
     "react": "^16.9.0-alpha.0",
@@ -22,11 +23,12 @@
   },
   "scripts": {
     "start": "react-scripts start",
-    "run-ext": "cd build && web-ext run --firefox=firefoxdeveloperedition",
-    "build": "INLINE_RUNTIME_CHUNK=false react-scripts build",
+    "build": "react-scripts build",
     "test": "react-scripts test --transformIgnorePatterns \"node_modules/(?!react-dnd)/\"",
     "eject": "react-scripts eject",
-    "netlify": "react-scripts build && netlify deploy --prod"
+    "netlify": "react-scripts build && netlify deploy --prod",
+    "firefox": "react-scripts build && cd build && web-ext run",
+    "addons-linter": "react-scripts build && cd build && addons-linter ./"
   },
   "eslintConfig": {
     "extends": "react-app"

public/background.js

@@ -1,7 +1,7 @@
 /* eslint-disable no-undef */
 
 function openAppPage() {
-  browser.tabs
+  chrome.tabs
     .create({
       url: './index.html'
     })
@@ -10,4 +10,4 @@ function openAppPage() {
     })
 }
 
-browser.browserAction.onClicked.addListener(openAppPage)
+chrome.browserAction.onClicked.addListener(openAppPage)

public/index.html

@@ -5,6 +5,8 @@
     <link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico" />
     <meta name="viewport" content="width=device-width, initial-scale=1" />
     <meta name="theme-color" content="#000000" />
+    <meta content="text/html;charset=utf-8" http-equiv="Content-Type" />
+    <meta content="utf-8" http-equiv="encoding" />
     <!--
       manifest.json provides metadata used when your web app is installed on a
       user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
@@ -19,10 +21,10 @@
       work correctly both with client-side routing and a non-root public URL.
       Learn how to configure a non-root public URL by running `npm run build`.
     -->
-    <title>React App</title>
+    <title>StarDaddy</title>
   </head>
   <body>
-    <noscript>You need to enable JavaScript to run this app.</noscript>
+    <noscript>You need to enable JavaScript to run this app!</noscript>
     <div id="root"></div>
     <!--
       This HTML file is a template.

public/manifest.json

@@ -1,7 +1,7 @@
 {
   "name": "Star Daddy",
-  "description": "A browser extension for sorting and rediscovery of starred GitHub repos",
-  "version": "0.01",
+  "description": "A browser extension for rediscovering starred GitHub repos",
+  "version": "1.0.0",
   "manifest_version": 2,
   "icons": {
     "48": "icons/logo-48.png"

src/components/App.tsx

@@ -19,7 +19,7 @@ const App: React.FC = () => {
       <GlobalStyle />
       <ConfirmationPopup />
       <About show={aboutModalIsVisible} dismiss={dismissAboutModal} />
-      <UserAuthenticator show={authState !== AuthState.loggedIn} />
+
       {authState === AuthState.loggedIn ? (
         <Panels />
       ) : (

src/components/UserAuthenticator.tsx

@@ -92,9 +92,10 @@ const UserAuthenticator: React.FC<UserAuthenticatorProps> = ({ show }) => {
           </ReactTooltip>
           <AccessTokenInput
             type="text"
-            name="access token"
-            title="access token"
-            placeholder="access token"
+            name="personal access token"
+            title="personal access token"
+            data-testid="access-token-input"
+            placeholder="personal access token"
             value={input}
             onChange={e => setInput(e.target.value)}
           />

src/components/__tests__/App.test.tsx

@@ -9,10 +9,8 @@ afterAll(() => mock.restore())
 afterEach(() => cleanup())
 
 test('Login', async () => {
-  const { getByTitle, getByText, getByTestId, queryByTestId, debug } = render(
-    <App />
-  )
-  fireEvent.change(getByTitle(/access token/i), {
+  const { getByText, getByTestId, queryByTestId, debug } = render(<App />)
+  fireEvent.change(getByTestId('access-token-input'), {
     target: { value: 'abcdef' }
   })
   fireEvent.click(getByText(/Authenticate/i))