fix: Dashboard and NetworkServices use live domain/cell_name from ConfigContext
- Dashboard: SERVICES array (Cell Home, Calendar, Files, Webmail) now builds URLs from useConfig() domain + cell_name instead of hardcoded 'mycell.cell' - NetworkServices: imports useConfig() and cellAPI; shows current DNS zone and DHCP range in page header; fetches service_configs.network to display configured DHCP range and NTP servers alongside live operational data Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -17,16 +17,17 @@ import {
|
||||
RotateCcw
|
||||
} from 'lucide-react';
|
||||
import { cellAPI, servicesAPI } from '../services/api';
|
||||
|
||||
const SERVICES = [
|
||||
{ name: 'Cell Home', url: 'http://mycell.cell', desc: 'Main UI — no login needed' },
|
||||
{ name: 'Calendar', url: 'http://calendar.cell', desc: 'Login: your WireGuard username' },
|
||||
{ name: 'Files', url: 'http://files.cell', desc: 'Login: admin / admin123' },
|
||||
{ name: 'Webmail', url: 'http://mail.cell', desc: 'Login: admin@rainloop.net / 12345' },
|
||||
];
|
||||
import { useConfig } from '../contexts/ConfigContext';
|
||||
|
||||
function Dashboard({ isOnline }) {
|
||||
const navigate = useNavigate();
|
||||
const { domain = 'cell', cell_name = 'mycell' } = useConfig();
|
||||
const SERVICES = [
|
||||
{ name: 'Cell Home', url: `http://${cell_name}.${domain}`, desc: 'Main UI — no login needed' },
|
||||
{ name: 'Calendar', url: `http://calendar.${domain}`, desc: 'Login: your WireGuard username' },
|
||||
{ name: 'Files', url: `http://files.${domain}`, desc: 'Login: admin / admin123' },
|
||||
{ name: 'Webmail', url: `http://mail.${domain}`, desc: 'Login: admin@rainloop.net / 12345' },
|
||||
];
|
||||
const [cellStatus, setCellStatus] = useState(null);
|
||||
const [servicesStatus, setServicesStatus] = useState(null);
|
||||
const [isLoading, setIsLoading] = useState(true);
|
||||
|
||||
@@ -1,11 +1,14 @@
|
||||
import { useState, useEffect } from 'react';
|
||||
import { Network, Server, Clock } from 'lucide-react';
|
||||
import { networkAPI } from '../services/api';
|
||||
import { networkAPI, cellAPI } from '../services/api';
|
||||
import { useConfig } from '../contexts/ConfigContext';
|
||||
|
||||
function NetworkServices() {
|
||||
const { domain = 'cell' } = useConfig();
|
||||
const [dnsRecords, setDnsRecords] = useState([]);
|
||||
const [dhcpLeases, setDhcpLeases] = useState([]);
|
||||
const [ntpStatus, setNtpStatus] = useState(null);
|
||||
const [networkConfig, setNetworkConfig] = useState({});
|
||||
const [isLoading, setIsLoading] = useState(true);
|
||||
|
||||
useEffect(() => {
|
||||
@@ -14,15 +17,17 @@ function NetworkServices() {
|
||||
|
||||
const fetchNetworkData = async () => {
|
||||
try {
|
||||
const [dnsResponse, dhcpResponse, ntpResponse] = await Promise.all([
|
||||
const [dnsResponse, dhcpResponse, ntpResponse, cfgResponse] = await Promise.all([
|
||||
networkAPI.getDNSRecords(),
|
||||
networkAPI.getDHCPLeases(),
|
||||
networkAPI.getNTPStatus()
|
||||
networkAPI.getNTPStatus(),
|
||||
cellAPI.getConfig(),
|
||||
]);
|
||||
|
||||
setDnsRecords(dnsResponse.data);
|
||||
setDhcpLeases(dhcpResponse.data);
|
||||
setNtpStatus(ntpResponse.data);
|
||||
setNetworkConfig(cfgResponse.data?.service_configs?.network || {});
|
||||
} catch (error) {
|
||||
console.error('Failed to fetch network data:', error);
|
||||
} finally {
|
||||
@@ -43,7 +48,10 @@ function NetworkServices() {
|
||||
<div className="mb-8">
|
||||
<h1 className="text-2xl font-bold text-gray-900">Network Services</h1>
|
||||
<p className="mt-2 text-gray-600">
|
||||
Manage DNS, DHCP, and NTP services
|
||||
DNS zone: <span className="font-mono font-medium text-gray-800">{domain}</span>
|
||||
{networkConfig.dhcp_range && (
|
||||
<> · DHCP: <span className="font-mono font-medium text-gray-800">{networkConfig.dhcp_range}</span></>
|
||||
)}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
@@ -77,6 +85,9 @@ function NetworkServices() {
|
||||
<Server className="h-6 w-6 text-primary-500 mr-2" />
|
||||
<h3 className="text-lg font-medium text-gray-900">DHCP Leases</h3>
|
||||
</div>
|
||||
{networkConfig.dhcp_range && (
|
||||
<p className="text-xs text-gray-400 mb-2">Range: {networkConfig.dhcp_range}</p>
|
||||
)}
|
||||
<div className="space-y-2">
|
||||
{dhcpLeases.length > 0 ? (
|
||||
dhcpLeases.map((lease, index) => (
|
||||
@@ -97,6 +108,13 @@ function NetworkServices() {
|
||||
<Clock className="h-6 w-6 text-primary-500 mr-2" />
|
||||
<h3 className="text-lg font-medium text-gray-900">NTP Status</h3>
|
||||
</div>
|
||||
{networkConfig.ntp_servers && (
|
||||
<p className="text-xs text-gray-400 mb-2">
|
||||
Servers: {Array.isArray(networkConfig.ntp_servers)
|
||||
? networkConfig.ntp_servers.join(', ')
|
||||
: networkConfig.ntp_servers}
|
||||
</p>
|
||||
)}
|
||||
{ntpStatus ? (
|
||||
<div className="space-y-2">
|
||||
<div className="flex justify-between">
|
||||
|
||||
Reference in New Issue
Block a user