From 68bf0fa5d78b04c3534fe7c16739df5d22a5b445 Mon Sep 17 00:00:00 2001
From: Simon <simobilleter@gmail.com>
Date: Wed, 12 Feb 2025 10:21:32 +0700
Subject: [PATCH] add show cookie button

---
 extension/background.js | 13 ++++++++++---
 extension/index.html    |  2 ++
 extension/popup.js      | 28 ++++++++++++++++++++++++++++
 extension/style.css     |  5 +++++
 4 files changed, 45 insertions(+), 3 deletions(-)

diff --git a/extension/background.js b/extension/background.js
index f76ba97..0717b50 100644
--- a/extension/background.js
+++ b/extension/background.js
@@ -179,10 +179,8 @@ function buildCookieLine(cookie) {
   ].join('\t');
 }
 
-async function sendCookies() {
-  console.log('function sendCookies');
+async function getCookieLines() {
   const acceptableDomains = ['.youtube.com', 'youtube.com', 'www.youtube.com'];
-
   let cookieStores = await browserType.cookies.getAllCookieStores();
   let cookieLines = [
     '# Netscape HTTP Cookie File',
@@ -202,7 +200,12 @@ async function sendCookies() {
       }
     }
   }
+  return cookieLines;
+}
 
+async function sendCookies() {
+  console.log('function sendCookies');
+  let cookieLines = await getCookieLines();
   let response = cookieStr(cookieLines);
 
   return response;
@@ -244,6 +247,7 @@ type Message =
   | { type: 'verify' }
   | { type: 'cookieState' }
   | { type: 'sendCookie' }
+  | { type: 'getCookieLines' }
   | { type: 'continuousSync', checked: boolean }
   | { type: 'download', url: string }
   | { type: 'subscribe', url: string }
@@ -268,6 +272,9 @@ function handleMessage(request, sender, sendResponse) {
       case 'sendCookie': {
         return await sendCookies();
       }
+      case 'getCookieLines': {
+        return await getCookieLines();
+      }
       case 'continuousSync': {
         return await handleContinuousCookie(request.checked);
       }
diff --git a/extension/index.html b/extension/index.html
index 72bda83..cf3fe19 100644
--- a/extension/index.html
+++ b/extension/index.html
@@ -38,6 +38,8 @@
                 <span>Continuous Cookie Sync</span>
             </div>
             <button id="sendCookies">Copy Now</button>
+            <button id="showCookies">Show Cookie</button><br>
+            <textarea id="cookieLinesResponse" readonly></textarea>
         </div>
         <p>Download:</p>
         <div class="options">
diff --git a/extension/popup.js b/extension/popup.js
index df8ee63..786c963 100644
--- a/extension/popup.js
+++ b/extension/popup.js
@@ -78,6 +78,11 @@ document.getElementById('sendCookies').addEventListener('click', function () {
   sendCookie();
 });
 
+// show cookies
+document.getElementById('showCookies').addEventListener('click', function () {
+  showCookies();
+});
+
 // continuous sync
 document.getElementById('continuous-sync').addEventListener('click', function () {
   toggleContinuousSync();
@@ -121,6 +126,29 @@ function sendCookie() {
   sending.then(handleResponse, handleError);
 }
 
+function showCookies() {
+  console.log('popup show cookies');
+  const textArea = document.getElementById('cookieLinesResponse');
+
+  function handleResponse(message) {
+    textArea.value = message.join('\n');
+    textArea.style.display = 'initial';
+  }
+  function handleError(error) {
+    console.log(`Error: ${error}`);
+  }
+
+  if (textArea.value) {
+    textArea.value = '';
+    textArea.style.display = 'none';
+    document.getElementById('showCookies').textContent = 'Show Cookie';
+  } else {
+    let sending = sendMessage({ type: 'getCookieLines' });
+    sending.then(handleResponse, handleError);
+    document.getElementById('showCookies').textContent = 'Hide Cookie';
+  }
+}
+
 function toggleContinuousSync() {
   const checked = document.getElementById('continuous-sync').checked;
   let toStore = {
diff --git a/extension/style.css b/extension/style.css
index cdcca87..d9a19e2 100644
--- a/extension/style.css
+++ b/extension/style.css
@@ -81,3 +81,8 @@ button:hover {
     color: red;
     display: none; /* will be made visible when an error occurs */
 }
+#cookieLinesResponse {
+    display: none;
+    width: 100%;
+    height: 50px;
+}