Adding upstream version 110.0.1.upstream/110.0.1upstream

Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>

2 files changed, 79 insertions, 0 deletions

diff --git a/browser/components/pocket/content/panels/js/home/entry.js b/browser/components/pocket/content/panels/js/home/entry.js
new file mode 100644
index 0000000000..56d8134577
--- /dev/null
+++ b/browser/components/pocket/content/panels/js/home/entry.js
@@ -0,0 +1,17 @@
+/* global PKT_PANEL:false */
+
+function onDOMLoaded() {
+  if (!window.thePKT_PANEL) {
+    var thePKT_PANEL = new PKT_PANEL();
+    /* global thePKT_PANEL */
+    window.thePKT_PANEL = thePKT_PANEL;
+    thePKT_PANEL.initHome();
+  }
+  window.thePKT_PANEL.create();
+}
+
+if (document.readyState != `loading`) {
+  onDOMLoaded();
+} else {
+  document.addEventListener(`DOMContentLoaded`, onDOMLoaded);
+}
diff --git a/browser/components/pocket/content/panels/js/home/overlay.js b/browser/components/pocket/content/panels/js/home/overlay.js
new file mode 100644
index 0000000000..865caca6c5
--- /dev/null
+++ b/browser/components/pocket/content/panels/js/home/overlay.js
@@ -0,0 +1,62 @@
+/* global Handlebars:false */
+
+/*
+HomeOverlay is the view itself and contains all of the methods to manipute the overlay and messaging.
+It does not contain any logic for saving or communication with the extension or server.
+*/
+
+import React from "react";
+import ReactDOM from "react-dom";
+import Home from "../components/Home/Home";
+
+var HomeOverlay = function(options) {
+  this.inited = false;
+  this.active = false;
+};
+
+HomeOverlay.prototype = {
+  create({ pockethost }) {
+    const { searchParams } = new URL(window.location.href);
+    const locale = searchParams.get(`locale`) || ``;
+    const hideRecentSaves = searchParams.get(`hiderecentsaves`) === `true`;
+    const utmSource = searchParams.get(`utmSource`);
+    const utmCampaign = searchParams.get(`utmCampaign`);
+    const utmContent = searchParams.get(`utmContent`);
+
+    if (this.active) {
+      return;
+    }
+
+    this.active = true;
+
+    ReactDOM.render(
+      <Home
+        locale={locale}
+        hideRecentSaves={hideRecentSaves}
+        pockethost={pockethost}
+        utmSource={utmSource}
+        utmCampaign={utmCampaign}
+        utmContent={utmContent}
+        topics={[
+          { title: "Technology", topic: "technology" },
+          { title: "Self Improvement", topic: "self-improvement" },
+          { title: "Food", topic: "food" },
+          { title: "Parenting", topic: "parenting" },
+          { title: "Science", topic: "science" },
+          { title: "Entertainment", topic: "entertainment" },
+          { title: "Career", topic: "career" },
+          { title: "Health", topic: "health" },
+          { title: "Travel", topic: "travel" },
+          { title: "Must-Reads", topic: "must-reads" },
+        ]}
+      />,
+      document.querySelector(`body`)
+    );
+
+    if (window?.matchMedia(`(prefers-color-scheme: dark)`).matches) {
+      document.querySelector(`body`).classList.add(`theme_dark`);
+    }
+  },
+};
+
+export default HomeOverlay;