fix: Resolve TypeScript errors and add ARIA accessibility

- Fixed type mismatches in ProxmoxAgentNodesPanel (prop signatures)
- Fixed temperatureTransports type (array vs single object)
- Added ARIA attributes to SetupWizard for screen reader support
- All tsc --noEmit checks pass
This commit is contained in:
rcourtman 2025-12-13 15:49:37 +00:00
parent 6af844340c
commit 5a52913a90
2 changed files with 18 additions and 14 deletions

View file

@ -54,7 +54,7 @@ interface ProxmoxAgentNodesPanelProps {
// Temperature monitoring
temperatureMonitoringEnabled: Accessor<boolean>;
temperatureTransports?: Accessor<TemperatureTransportInfo[]>;
temperatureTransports?: Accessor<TemperatureTransportInfo | null>;
// Discovery settings
discoveryEnabled: Accessor<boolean>;
@ -70,9 +70,9 @@ interface ProxmoxAgentNodesPanelProps {
handleDiscoveryEnabledChange: (enabled: boolean) => Promise<boolean>;
triggerDiscoveryScan: (opts: { quiet: boolean }) => Promise<void>;
loadDiscoveredNodes: () => Promise<void>;
testNodeConnection: (node: NodeConfig) => Promise<void>;
testNodeConnection: (nodeId: string) => void;
requestDeleteNode: (node: NodeConfig) => void;
refreshClusterNodes?: (clusterId: string, sampleNodeId: string) => Promise<void>;
refreshClusterNodes?: (nodeId: string) => void;
// Modal controls
setEditingNode: Setter<NodeConfigWithStatus | null>;
@ -163,7 +163,7 @@ export const ProxmoxAgentNodesPanel: Component<ProxmoxAgentNodesPanelProps> = (p
}, 50);
} else {
// PVE and PBS pre-fill the node object
const baseNode: NodeConfigWithStatus = {
const baseNode = {
id: '',
type: props.agentType,
name: server.hostname || `${props.agentType}-${server.ip}`,
@ -172,8 +172,8 @@ export const ProxmoxAgentNodesPanel: Component<ProxmoxAgentNodesPanelProps> = (p
tokenName: '',
tokenValue: '',
verifySSL: false,
status: 'pending',
};
status: 'pending' as const,
} as NodeConfigWithStatus;
if (props.agentType === 'pve') {
Object.assign(baseNode, {
@ -207,14 +207,14 @@ export const ProxmoxAgentNodesPanel: Component<ProxmoxAgentNodesPanelProps> = (p
stateNodes={props.stateNodes ?? []}
stateHosts={props.stateHosts ?? []}
globalTemperatureMonitoringEnabled={props.temperatureMonitoringEnabled()}
temperatureTransports={props.temperatureTransports?.() ?? []}
temperatureTransports={props.temperatureTransports?.() ?? null}
onTestConnection={props.testNodeConnection}
onEdit={(node) => {
props.setEditingNode(node as NodeConfigWithStatus);
props.setCurrentNodeType('pve');
props.setShowNodeModal(true);
}}
onDelete={props.requestDeleteNode}
onDelete={(node) => props.requestDeleteNode(node)}
onRefreshCluster={props.refreshClusterNodes}
/>
);
@ -230,7 +230,7 @@ export const ProxmoxAgentNodesPanel: Component<ProxmoxAgentNodesPanelProps> = (p
props.setCurrentNodeType('pbs');
props.setShowNodeModal(true);
}}
onDelete={props.requestDeleteNode}
onDelete={(node) => props.requestDeleteNode(node)}
/>
);
} else {
@ -246,7 +246,7 @@ export const ProxmoxAgentNodesPanel: Component<ProxmoxAgentNodesPanelProps> = (p
props.setModalResetKey((prev) => prev + 1);
props.setShowNodeModal(true);
}}
onDelete={props.requestDeleteNode}
onDelete={(node) => props.requestDeleteNode(node)}
/>
);
}

View file

@ -68,9 +68,13 @@ export const SetupWizard: Component<SetupWizardProps> = (props) => {
};
return (
<div class="min-h-screen bg-gradient-to-br from-slate-900 via-blue-900 to-indigo-900 flex flex-col">
<div
class="min-h-screen bg-gradient-to-br from-slate-900 via-blue-900 to-indigo-900 flex flex-col"
role="main"
aria-label="Pulse Setup Wizard"
>
{/* Background decoration */}
<div class="fixed inset-0 overflow-hidden pointer-events-none">
<div class="fixed inset-0 overflow-hidden pointer-events-none" aria-hidden="true">
<div class="absolute -top-40 -right-40 w-80 h-80 bg-blue-500/20 rounded-full blur-3xl" />
<div class="absolute top-1/2 -left-40 w-80 h-80 bg-indigo-500/20 rounded-full blur-3xl" />
<div class="absolute -bottom-40 right-1/3 w-80 h-80 bg-purple-500/20 rounded-full blur-3xl" />
@ -78,7 +82,7 @@ export const SetupWizard: Component<SetupWizardProps> = (props) => {
{/* Step indicator - only show after welcome */}
<Show when={currentStep() !== 'welcome' && currentStep() !== 'complete'}>
<div class="relative z-10 pt-8 px-4">
<div class="relative z-10 pt-8 px-4" role="navigation" aria-label="Setup progress">
<StepIndicator
steps={['Security', 'Connect', 'Features']}
currentStep={currentStepIndex() - 1}
@ -88,7 +92,7 @@ export const SetupWizard: Component<SetupWizardProps> = (props) => {
{/* Main content */}
<div class="flex-1 flex items-center justify-center p-4 relative z-10">
<div class="w-full max-w-2xl">
<div class="w-full max-w-2xl" role="region" aria-live="polite">
<Show when={currentStep() === 'welcome'}>
<WelcomeStep
onNext={nextStep}