Kraft102 commited on
Commit
038a1a3
·
1 Parent(s): b6f7ab5

feat(api): implement dynamic api configuration via options page

Browse files
browser-extension/background.js CHANGED
@@ -1,6 +1,18 @@
1
  // WidgeTDC Harvester Background Script
2
 
3
- const API_BASE = 'http://localhost:3001'; // Default, configurable via options
 
 
 
 
 
 
 
 
 
 
 
 
4
 
5
  // Listen for messages from popup or content script
6
  chrome.runtime.onMessage.addListener((request, sender, sendResponse) => {
 
1
  // WidgeTDC Harvester Background Script
2
 
3
+ let API_BASE = 'http://localhost:3001';
4
+
5
+ // Load config on startup
6
+ chrome.storage.sync.get({ widgetdc_api_url: 'http://localhost:3001' }, (items) => {
7
+ API_BASE = items.widgetdc_api_url;
8
+ });
9
+
10
+ // Listen for config changes
11
+ chrome.storage.onChanged.addListener((changes, namespace) => {
12
+ if (namespace === 'sync' && changes.widgetdc_api_url) {
13
+ API_BASE = changes.widgetdc_api_url.newValue;
14
+ }
15
+ });
16
 
17
  // Listen for messages from popup or content script
18
  chrome.runtime.onMessage.addListener((request, sender, sendResponse) => {
browser-extension/content.js CHANGED
@@ -7,6 +7,16 @@ class WidgeTDCAssistant {
7
  constructor() {
8
  this.apiUrl = 'http://localhost:3001/api';
9
  this.sidebar = null;
 
 
 
 
 
 
 
 
 
 
10
  this.init();
11
  }
12
 
 
7
  constructor() {
8
  this.apiUrl = 'http://localhost:3001/api';
9
  this.sidebar = null;
10
+
11
+ // Try to load from storage
12
+ try {
13
+ chrome.storage.sync.get({ widgetdc_api_url: 'http://localhost:3001' }, (items) => {
14
+ this.apiUrl = `${items.widgetdc_api_url}/api`;
15
+ });
16
+ } catch (e) {
17
+ // Fallback if storage access fails
18
+ }
19
+
20
  this.init();
21
  }
22
 
browser-extension/manifest.json CHANGED
@@ -34,6 +34,7 @@
34
  "action": {
35
  "default_popup": "popup.html"
36
  },
 
37
  "web_accessible_resources": [
38
  {
39
  "resources": [],
 
34
  "action": {
35
  "default_popup": "popup.html"
36
  },
37
+ "options_page": "options.html",
38
  "web_accessible_resources": [
39
  {
40
  "resources": [],
browser-extension/options.html ADDED
@@ -0,0 +1,78 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html>
3
+
4
+ <head>
5
+ <title>WidgeTDC Options</title>
6
+ <style>
7
+ body {
8
+ font-family: 'Segoe UI', sans-serif;
9
+ padding: 20px;
10
+ background: #0f172a;
11
+ color: #e2e8f0;
12
+ }
13
+
14
+ .container {
15
+ max-width: 400px;
16
+ margin: 0 auto;
17
+ }
18
+
19
+ h1 {
20
+ font-size: 18px;
21
+ border-bottom: 1px solid #334155;
22
+ padding-bottom: 10px;
23
+ }
24
+
25
+ label {
26
+ display: block;
27
+ margin-top: 15px;
28
+ margin-bottom: 5px;
29
+ font-size: 14px;
30
+ }
31
+
32
+ input {
33
+ width: 100%;
34
+ padding: 8px;
35
+ background: #1e293b;
36
+ border: 1px solid #334155;
37
+ color: white;
38
+ border-radius: 4px;
39
+ box-sizing: border-box;
40
+ }
41
+
42
+ button {
43
+ margin-top: 20px;
44
+ padding: 10px 20px;
45
+ background: #2563eb;
46
+ color: white;
47
+ border: none;
48
+ border-radius: 4px;
49
+ cursor: pointer;
50
+ }
51
+
52
+ button:hover {
53
+ background: #1d4ed8;
54
+ }
55
+
56
+ #status {
57
+ margin-top: 10px;
58
+ font-size: 13px;
59
+ color: #4ade80;
60
+ height: 20px;
61
+ }
62
+ </style>
63
+ </head>
64
+
65
+ <body>
66
+ <div class="container">
67
+ <h1>WidgeTDC Settings</h1>
68
+
69
+ <label for="apiUrl">Backend API URL</label>
70
+ <input type="text" id="apiUrl" placeholder="http://localhost:3001">
71
+
72
+ <button id="save">Save Settings</button>
73
+ <div id="status"></div>
74
+ </div>
75
+ <script src="options.js"></script>
76
+ </body>
77
+
78
+ </html>
browser-extension/options.js ADDED
@@ -0,0 +1,30 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ // Saves options to chrome.storage
2
+ const saveOptions = () => {
3
+ const apiUrl = document.getElementById('apiUrl').value;
4
+
5
+ chrome.storage.sync.set(
6
+ { widgetdc_api_url: apiUrl },
7
+ () => {
8
+ // Update status to let user know options were saved.
9
+ const status = document.getElementById('status');
10
+ status.textContent = 'Options saved.';
11
+ setTimeout(() => {
12
+ status.textContent = '';
13
+ }, 2000);
14
+ }
15
+ );
16
+ };
17
+
18
+ // Restores select box and checkbox state using the preferences
19
+ // stored in chrome.storage.
20
+ const restoreOptions = () => {
21
+ chrome.storage.sync.get(
22
+ { widgetdc_api_url: 'http://localhost:3001' },
23
+ (items) => {
24
+ document.getElementById('apiUrl').value = items.widgetdc_api_url;
25
+ }
26
+ );
27
+ };
28
+
29
+ document.addEventListener('DOMContentLoaded', restoreOptions);
30
+ document.getElementById('save').addEventListener('click', saveOptions);