From aae508f5a14556c34bfad0cd334c25591ce721c3 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Sat, 22 Jun 2024 00:45:46 +0300
Subject: [PATCH] fix firefox redmond themes / fixed topbar and panel headers
 not having proper theme2 inputs/alerts colors

---
 src/services/theme_data/theme2_to_theme3.js   | 20 +++++++++----------
 .../theme_data/theme_data_3.service.js        |  2 +-
 2 files changed, 11 insertions(+), 11 deletions(-)

diff --git a/src/services/theme_data/theme2_to_theme3.js b/src/services/theme_data/theme2_to_theme3.js
index 6ea128369e..2c97d18b18 100644
--- a/src/services/theme_data/theme2_to_theme3.js
+++ b/src/services/theme_data/theme2_to_theme3.js
@@ -138,7 +138,7 @@ export const convertTheme2To3 = (data) => {
     Object.keys(data.opacity || {}).forEach(key => {
       if (!opacityKeys.has(key) || data.opacity[key] === undefined) return null
       const originalOpacity = data.opacity[key]
-      const rule = {}
+      const rule = { source: '2to3' }
 
       switch (key) {
         case 'alert':
@@ -213,7 +213,7 @@ export const convertTheme2To3 = (data) => {
     Object.keys(data.radii || {}).forEach(key => {
       if (!radiiKeys.has(key) || data.radii[key] === undefined) return null
       const originalRadius = data.radii[key]
-      const rule = {}
+      const rule = { source: '2to3' }
 
       switch (key) {
         case 'btn':
@@ -266,7 +266,7 @@ export const convertTheme2To3 = (data) => {
     Object.keys(data.fonts || {}).forEach(key => {
       if (!fontsKeys.has(key)) return
       const originalFont = data.fonts[key].family
-      const rule = {}
+      const rule = { source: '2to3' }
 
       switch (key) {
         case 'interface':
@@ -300,7 +300,7 @@ export const convertTheme2To3 = (data) => {
     Object.keys(data.shadows || {}).forEach(key => {
       if (!shadowsKeys.has(key)) return
       const originalShadow = data.shadows[key]
-      const rule = {}
+      const rule = { source: '2to3' }
 
       switch (key) {
         case 'panel':
@@ -369,7 +369,7 @@ export const convertTheme2To3 = (data) => {
 
   const extendedRules = Object.entries(extendedBaseKeys).map(([prefix, keys]) => {
     if (nonComponentPrefixes.has(prefix)) return null
-    const rule = {}
+    const rule = { source: '2to3' }
     if (prefix === 'alertPopup') {
       rule.component = 'Alert'
       rule.parent = { component: 'Popover' }
@@ -402,7 +402,7 @@ export const convertTheme2To3 = (data) => {
       const leftoverKey = key.replace(prefix, '')
       const parts = (leftoverKey || 'Bg').match(/[A-Z][a-z]*/g)
       const last = parts.slice(-1)[0]
-      let newRule = { directives: {} }
+      let newRule = { source: '2to3', directives: {} }
       let variantArray = []
 
       switch (last) {
@@ -462,12 +462,12 @@ export const convertTheme2To3 = (data) => {
 
       if (prefix === 'popover' && variantArray[0] === 'Post') {
         newRule.component = 'Post'
-        newRule.parent = { component: 'Popover' }
+        newRule.parent = { source: '2to3hack', component: 'Popover' }
         variantArray = variantArray.filter(x => x !== 'Post')
       }
 
       if (prefix === 'selectedMenu' && variantArray[0] === 'Popover') {
-        newRule.parent = { component: 'Popover' }
+        newRule.parent = { source: '2to3hack', component: 'Popover' }
         variantArray = variantArray.filter(x => x !== 'Popover')
       }
 
@@ -477,12 +477,12 @@ export const convertTheme2To3 = (data) => {
         case 'alert': {
           const hasPanel = variantArray.find(x => x === 'Panel')
           if (hasPanel) {
-            newRule.parent = { component: 'PanelHeader' }
+            newRule.parent = { source: '2to3hack', component: 'PanelHeader', parent: newRule.parent }
             variantArray = variantArray.filter(x => x !== 'Panel')
           }
           const hasTop = variantArray.find(x => x === 'Top') // TopBar
           if (hasTop) {
-            newRule.parent = { component: 'TopBar' }
+            newRule.parent = { source: '2to3hack', component: 'TopBar', parent: newRule.parent }
             variantArray = variantArray.filter(x => x !== 'Top' && x !== 'Bar')
           }
           break
diff --git a/src/services/theme_data/theme_data_3.service.js b/src/services/theme_data/theme_data_3.service.js
index 51ecc051fc..645f2e5ebf 100644
--- a/src/services/theme_data/theme_data_3.service.js
+++ b/src/services/theme_data/theme_data_3.service.js
@@ -156,7 +156,7 @@ export const init = (extraRuleset, ultimateBackgroundColor, debug) => {
 
   const rulesetUnsorted = [
     ...Object.values(components)
-      .map(c => (c.defaultRules || []).map(r => ({ component: c.name, ...r })))
+      .map(c => (c.defaultRules || []).map(r => ({ component: c.name, ...r, source: 'Built-in' })))
       .reduce((acc, arr) => [...acc, ...arr], []),
     ...extraRuleset
   ].map(rule => {