CyberMind-FR
34f980312f
Fixed two issues preventing components page from loading: 1. Added getTheme() method to theme.js - components.js was calling Theme.getTheme() which didn't exist - Added method to return theme data from SecuBox 2. Updated ACL to grant access to new methods - Added get_components and get_components_by_category to read permissions - Added luci.secubox methods (modules, modules_by_category, get_theme) - Resolves "Access denied" error (-32002) This fixes the "Theme.getTheme is not a function" and "Access denied" errors. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
79 lines
2.0 KiB
JavaScript
79 lines
2.0 KiB
JavaScript
'use strict';
|
|
'require baseclass';
|
|
'require rpc';
|
|
|
|
/**
|
|
* System Hub Theme Manager
|
|
* Uses centralized theme from SecuBox configuration
|
|
* Version: 1.0.0
|
|
*/
|
|
|
|
console.log('🎨 System Hub Theme Manager v1.0.0 loaded');
|
|
|
|
// RPC call to get theme from secu-box config
|
|
var callGetTheme = rpc.declare({
|
|
object: 'luci.secubox',
|
|
method: 'get_theme',
|
|
expect: {}
|
|
});
|
|
|
|
return baseclass.extend({
|
|
/**
|
|
* Initialize theme system
|
|
* Loads theme preference from SecuBox and applies it to the page
|
|
*/
|
|
init: function() {
|
|
var self = this;
|
|
|
|
return callGetTheme().then(function(data) {
|
|
var themePref = data.theme || 'dark';
|
|
self.applyTheme(themePref);
|
|
|
|
// Listen for system theme changes if preference is 'system'
|
|
if (themePref === 'system' && window.matchMedia) {
|
|
var darkModeQuery = window.matchMedia('(prefers-color-scheme: dark)');
|
|
darkModeQuery.addListener(function() {
|
|
self.applyTheme('system');
|
|
});
|
|
}
|
|
}).catch(function(err) {
|
|
console.error('Failed to load theme preference from SecuBox, using dark theme:', err);
|
|
self.applyTheme('dark');
|
|
});
|
|
},
|
|
|
|
/**
|
|
* Apply theme to the page
|
|
* @param {string} theme - Theme preference: 'dark', 'light', or 'system'
|
|
*/
|
|
applyTheme: function(theme) {
|
|
var effectiveTheme = theme;
|
|
|
|
// If 'system', detect from OS
|
|
if (theme === 'system' && window.matchMedia) {
|
|
effectiveTheme = window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
|
|
}
|
|
|
|
// Apply theme to document root
|
|
document.documentElement.setAttribute('data-theme', effectiveTheme);
|
|
|
|
console.log('🎨 System Hub theme applied:', theme, '(effective:', effectiveTheme + ')');
|
|
},
|
|
|
|
/**
|
|
* Get current effective theme
|
|
* @returns {string} 'dark' or 'light'
|
|
*/
|
|
getCurrentTheme: function() {
|
|
return document.documentElement.getAttribute('data-theme') || 'dark';
|
|
},
|
|
|
|
/**
|
|
* Get theme preference from SecuBox
|
|
* @returns {Promise} Promise resolving to theme data
|
|
*/
|
|
getTheme: function() {
|
|
return callGetTheme();
|
|
}
|
|
});
|