From fa8316a94c092e986b4b2616f1992ee2a3eec01a Mon Sep 17 00:00:00 2001
From: Indrajith K L
Date: Fri, 12 Jul 2019 19:59:42 +0530
Subject: Initial Commit :tada: * Adds Manifest for Extension * Adds barebone
 messaging from extension and front-end * Adds .env to run react app under CSP

---
 .env                     |  1 +
 package.json             |  6 +++-
 public/background.js     | 24 +++++++++++++++
 public/content_script.js | 27 +++++++++++++++++
 public/index.html        | 26 ++--------------
 public/manifest.json     | 28 ++++++++++--------
 public/page.html         | 16 ++++++++++
 src/App.css              | 33 ---------------------
 src/App.js               | 77 +++++++++++++++++++++++++++++++++++-------------
 src/index.js             |  3 ++
 yarn.lock                | 43 +++++++++++++++++++++++++--
 11 files changed, 190 insertions(+), 94 deletions(-)
 create mode 100644 .env
 create mode 100644 public/background.js
 create mode 100644 public/content_script.js
 create mode 100644 public/page.html

diff --git a/.env b/.env
new file mode 100644
index 0000000..2d2e9a0
--- /dev/null
+++ b/.env
@@ -0,0 +1 @@
+INLINE_RUNTIME_CHUNK=false
\ No newline at end of file
diff --git a/package.json b/package.json
index 259b759..ce0b14c 100644
--- a/package.json
+++ b/package.json
@@ -3,9 +3,13 @@
   "version": "0.1.0",
   "private": true,
   "dependencies": {
+    "classnames": "^2.2.6",
+    "primeicons": "^1.0.0",
+    "primereact": "^3.1.7",
     "react": "^16.8.6",
     "react-dom": "^16.8.6",
-    "react-scripts": "3.0.1"
+    "react-scripts": "3.0.1",
+    "react-transition-group": "^4.2.1"
   },
   "scripts": {
     "start": "react-scripts start",
diff --git a/public/background.js b/public/background.js
new file mode 100644
index 0000000..f94c039
--- /dev/null
+++ b/public/background.js
@@ -0,0 +1,24 @@
+
+
+chrome.browserAction.onClicked.addListener( (tab) =>{
+	chrome.tabs.create({ 'url': chrome.extension.getURL('index.html') },  (tab) => {
+
+	});
+});
+
+
+chrome.runtime.onConnect.addListener(port => {
+	port.onMessage.addListener(message => {
+		/* Perform an action if the message meets our criteria */
+		if (message.code === "getBookMarks") {
+			getBookMarks(port)
+		}
+	})
+});
+
+getBookMarks = (port) => {
+	chrome.bookmarks.getTree(function (data) {
+		port.postMessage({ bookMarkData: data})
+	});
+	
+}
\ No newline at end of file
diff --git a/public/content_script.js b/public/content_script.js
new file mode 100644
index 0000000..612ecf5
--- /dev/null
+++ b/public/content_script.js
@@ -0,0 +1,27 @@
+(function(){
+    
+    /* Open port on popup file */
+    const port = chrome.runtime.connect({
+        name: "bookmarkArranger"
+    });
+    
+    /* Listen for messages on the port */
+    port.onMessage.addListener(message => {
+       console.log(message)
+    });
+
+    document.getElementById('sendMessage').addEventListener('click', ()=>{
+        /* Send a message through the port */
+        port.postMessage({
+            code: "getBookMarks"
+        });
+    })
+    
+
+
+
+})();
+
+
+
+
diff --git a/public/index.html b/public/index.html
index dd1ccfd..4c5a273 100644
--- a/public/index.html
+++ b/public/index.html
@@ -5,34 +5,12 @@
     <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" />
-    <!--
-      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/
-    -->
-    <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
-    <!--
-      Notice the use of %PUBLIC_URL% in the tags above.
-      It will be replaced with the URL of the `public` folder during the build.
-      Only files inside the `public` folder can be referenced from the HTML.
 
-      Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
-      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>
+    <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
+    <title>Bookmark Arranger</title>
   </head>
   <body>
     <noscript>You need to enable JavaScript to run this app.</noscript>
     <div id="root"></div>
-    <!--
-      This HTML file is a template.
-      If you open it directly in the browser, you will see an empty page.
-
-      You can add webfonts, meta tags, or analytics to this file.
-      The build step will place the bundled scripts into the <body> tag.
-
-      To begin the development, run `npm start` or `yarn start`.
-      To create a production bundle, use `npm run build` or `yarn build`.
-    -->
   </body>
 </html>
diff --git a/public/manifest.json b/public/manifest.json
index 1f2f141..72678e3 100644
--- a/public/manifest.json
+++ b/public/manifest.json
@@ -1,15 +1,17 @@
 {
-  "short_name": "React App",
-  "name": "Create React App Sample",
-  "icons": [
-    {
-      "src": "favicon.ico",
-      "sizes": "64x64 32x32 24x24 16x16",
-      "type": "image/x-icon"
-    }
+  "short_name": "Bookmark Arranger",
+  "name": "Bookmark Arranger",
+  "version": "1.0",
+  "description": "Bookmark Arrange",
+  "manifest_version": 2,
+  "background": {
+    "scripts": [
+      "background.js"
+    ],
+    "persistent": false
+  },
+  "permissions": [
+    "bookmarks"
   ],
-  "start_url": ".",
-  "display": "standalone",
-  "theme_color": "#000000",
-  "background_color": "#ffffff"
-}
+  "browser_action": {}
+}
\ No newline at end of file
diff --git a/public/page.html b/public/page.html
new file mode 100644
index 0000000..66f4a9d
--- /dev/null
+++ b/public/page.html
@@ -0,0 +1,16 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta http-equiv="X-UA-Compatible" content="ie=edge">
+    <title>Document</title>
+</head>
+<body>
+    <h2>Ola</h2>
+    <div id="renderArea"></div>
+    <button id="sendMessage">Send Message</button>
+
+    <script src="./content_script.js"></script>
+</body>
+</html>
\ No newline at end of file
diff --git a/src/App.css b/src/App.css
index b41d297..e69de29 100644
--- a/src/App.css
+++ b/src/App.css
@@ -1,33 +0,0 @@
-.App {
-  text-align: center;
-}
-
-.App-logo {
-  animation: App-logo-spin infinite 20s linear;
-  height: 40vmin;
-  pointer-events: none;
-}
-
-.App-header {
-  background-color: #282c34;
-  min-height: 100vh;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  font-size: calc(10px + 2vmin);
-  color: white;
-}
-
-.App-link {
-  color: #61dafb;
-}
-
-@keyframes App-logo-spin {
-  from {
-    transform: rotate(0deg);
-  }
-  to {
-    transform: rotate(360deg);
-  }
-}
diff --git a/src/App.js b/src/App.js
index ce9cbd2..adbdf16 100644
--- a/src/App.js
+++ b/src/App.js
@@ -1,26 +1,61 @@
+/*global chrome*/
 import React from 'react';
-import logo from './logo.svg';
-import './App.css';
+import { DataTable } from 'primereact/datatable';
+import { Column } from 'primereact/column';
+class App extends React.Component {
 
-function App() {
-  return (
-    <div className="App">
-      <header className="App-header">
-        <img src={logo} className="App-logo" alt="logo" />
-        <p>
-          Edit <code>src/App.js</code> and save to reload.
-        </p>
-        <a
-          className="App-link"
-          href="https://reactjs.org"
-          target="_blank"
-          rel="noopener noreferrer"
-        >
-          Learn React
-        </a>
-      </header>
-    </div>
-  );
+  /* Open port on popup file */
+  port = chrome.runtime.connect({
+    name: "bookmarkArranger"
+  });
+
+  getBookMarks = () => {
+    this.port.postMessage({
+        code: "getBookMarks"
+    });
+  }
+
+  listenMessages = () => {
+    this.port.onMessage.addListener(message => {
+      console.log(message)
+    });
+  }
+
+  componentDidMount(){
+    this.listenMessages();
+  }
+
+  render(){
+    return (
+      <div>
+        <div className="content-section introduction">
+          <div className="feature-intro">
+            <h1>DataTable - Sort</h1>
+            <p>Enabling sortable property on a column is enough to make a column sortable. Multiple column sorting is enabled using sortMode property and
+                  used with metaKey.</p>
+          </div>
+        </div>
+  
+        <div className="content-section implementation">
+          <h3>Single Column</h3>
+          {/* <DataTable value={this.state.cars}>
+            <Column field="vin" header="Vin" sortable={true} />
+            <Column field="year" header="Year" sortable={true} />
+            <Column field="brand" header="Brand" sortable={true} />
+            <Column field="color" header="Color" sortable={true} />
+          </DataTable>
+  
+          <h3>Multiple Columns</h3>
+          <DataTable value={this.state.cars} sortMode="multiple">
+            <Column field="vin" header="Vin" sortable={true} />
+            <Column field="year" header="Year" sortable={true} />
+            <Column field="brand" header="Brand" sortable={true} />
+            <Column field="color" header="Color" sortable={true} />
+          </DataTable> */}
+        </div>
+      </div>
+    );
+  }
 }
 
 export default App;
diff --git a/src/index.js b/src/index.js
index 87d1be5..eb72966 100644
--- a/src/index.js
+++ b/src/index.js
@@ -3,6 +3,9 @@ import ReactDOM from 'react-dom';
 import './index.css';
 import App from './App';
 import * as serviceWorker from './serviceWorker';
+import 'primereact/resources/themes/nova-light/theme.css';
+import 'primereact/resources/primereact.min.css';
+import 'primeicons/primeicons.css';
 
 ReactDOM.render(<App />, document.getElementById('root'));
 
diff --git a/yarn.lock b/yarn.lock
index 25b6936..f4a0be4 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -859,6 +859,13 @@
   dependencies:
     regenerator-runtime "^0.13.2"
 
+"@babel/runtime@^7.1.2", "@babel/runtime@^7.4.5":
+  version "7.5.4"
+  resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.5.4.tgz#cb7d1ad7c6d65676e66b47186577930465b5271b"
+  integrity sha512-Na84uwyImZZc3FKf4aUF1tysApzwf3p2yuFBIyBfbzT5glzKTdvYI4KVW4kcgjrzoGUjC7w3YyCHcJKaRxsr2Q==
+  dependencies:
+    regenerator-runtime "^0.13.2"
+
 "@babel/template@^7.1.0", "@babel/template@^7.4.0", "@babel/template@^7.4.4":
   version "7.4.4"
   resolved "https://registry.yarnpkg.com/@babel/template/-/template-7.4.4.tgz#f4b88d1225689a08f5bc3a17483545be9e4ed237"
@@ -2421,6 +2428,11 @@ class-utils@^0.3.5:
     isobject "^3.0.0"
     static-extend "^0.1.1"
 
+classnames@^2.2.6:
+  version "2.2.6"
+  resolved "https://registry.yarnpkg.com/classnames/-/classnames-2.2.6.tgz#43935bffdd291f326dad0a205309b38d00f650ce"
+  integrity sha512-JR/iSQOSt+LQIWwrwEzJ9uk0xfN3mTVYMwt1Ir5mUcSN6pU+V4zQFFaJsclJbPuAUQH+yfWef6tm7l1quW3C8Q==
+
 clean-css@4.2.x:
   version "4.2.1"
   resolved "https://registry.yarnpkg.com/clean-css/-/clean-css-4.2.1.tgz#2d411ef76b8569b6d0c84068dabe85b0aa5e5c17"
@@ -3257,6 +3269,13 @@ dom-converter@^0.2:
   dependencies:
     utila "~0.4"
 
+dom-helpers@^3.4.0:
+  version "3.4.0"
+  resolved "https://registry.yarnpkg.com/dom-helpers/-/dom-helpers-3.4.0.tgz#e9b369700f959f62ecde5a6babde4bccd9169af8"
+  integrity sha512-LnuPJ+dwqKDIyotW1VzmOZ5TONUN7CwkCR5hrgawTUbkBGYdeoNLZo6nNfGkCrjtE1nXXaj7iMMpDa8/d9WoIA==
+  dependencies:
+    "@babel/runtime" "^7.1.2"
+
 dom-serializer@0:
   version "0.1.1"
   resolved "https://registry.yarnpkg.com/dom-serializer/-/dom-serializer-0.1.1.tgz#1ec4059e284babed36eec2941d4a970a189ce7c0"
@@ -7605,6 +7624,16 @@ pretty-format@^24.8.0:
     ansi-styles "^3.2.0"
     react-is "^16.8.4"
 
+primeicons@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/primeicons/-/primeicons-1.0.0.tgz#90061f168ef6227f21f0a7db8204ffa85cd27aec"
+  integrity sha512-p/hzIjUVccW4eJPhuORHI3AUkDpqfvCQVrjxbFEejnTEdWY4C8fomVfjiaA9jCu83fSQnBHuRIGB96iAR8R6uA==
+
+primereact@^3.1.7:
+  version "3.1.7"
+  resolved "https://registry.yarnpkg.com/primereact/-/primereact-3.1.7.tgz#218b04cb9e087ad59bdd8fb160ad936d99433c8b"
+  integrity sha512-adRKXQ95WiWBRdzlIxiZdjhNkZIbSkgkw95K12+pcK9QqjKPBJXP9HfJgdRrY4p/BaqbEdpm99kFWBp7JFLusQ==
+
 private@^0.1.6:
   version "0.1.8"
   resolved "https://registry.yarnpkg.com/private/-/private-0.1.8.tgz#2381edb3689f7a53d653190060fcf822d2f368ff"
@@ -7846,7 +7875,7 @@ react-dev-utils@^9.0.1:
     strip-ansi "5.2.0"
     text-table "0.2.0"
 
-react-dom@16.8.6:
+react-dom@^16.8.6:
   version "16.8.6"
   resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-16.8.6.tgz#71d6303f631e8b0097f56165ef608f051ff6e10f"
   integrity sha512-1nL7PIq9LTL3fthPqwkvr2zY7phIPjYrT0jp4HjyEQrEROnw4dG41VVwi/wfoCneoleqrNX7iAD+pXebJZwrwA==
@@ -7926,7 +7955,17 @@ react-scripts@3.0.1:
   optionalDependencies:
     fsevents "2.0.6"
 
-react@16.8.6:
+react-transition-group@^4.2.1:
+  version "4.2.1"
+  resolved "https://registry.yarnpkg.com/react-transition-group/-/react-transition-group-4.2.1.tgz#61fc9e36568bff9a1fe4e60fae323c8a6dbc0680"
+  integrity sha512-IXrPr93VzCPupwm2O6n6C2kJIofJ/Rp5Ltihhm9UfE8lkuVX2ng/SUUl/oWjblybK9Fq2Io7LGa6maVqPB762Q==
+  dependencies:
+    "@babel/runtime" "^7.4.5"
+    dom-helpers "^3.4.0"
+    loose-envify "^1.4.0"
+    prop-types "^15.6.2"
+
+react@^16.8.6:
   version "16.8.6"
   resolved "https://registry.yarnpkg.com/react/-/react-16.8.6.tgz#ad6c3a9614fd3a4e9ef51117f54d888da01f2bbe"
   integrity sha512-pC0uMkhLaHm11ZSJULfOBqV4tIZkx87ZLvbbQYunNixAAvjnC+snJCg0XQXn9VIsttVsbZP/H/ewzgsd5fxKXw==
-- 
cgit v1.2.3