cb06077fab
- New SetupWizard component with 5-step flow: 1. Welcome: Bootstrap token unlock, platform showcase 2. Security: Admin account + API token creation 3. Connect: Multi-platform infrastructure (Proxmox, Docker, K8s) 4. Features: AI and auto-updates toggles 5. Complete: Credentials display with copy/download - Replaced FirstRunSetup with SetupWizard in Login.tsx - Added Install Update button to UpdatesSettingsPanel - Enhanced UpdatesSettingsPanel with update plan integration - Added UpdateConfirmationModal to Settings for inline updates Positions Pulse as a unified infrastructure monitoring platform, not just a Proxmox-specific tool.
37 lines
1.7 KiB
TypeScript
37 lines
1.7 KiB
TypeScript
import { Component } from 'solid-js';
|
|
|
|
interface StepIndicatorProps {
|
|
steps: string[];
|
|
currentStep: number;
|
|
}
|
|
|
|
export const StepIndicator: Component<StepIndicatorProps> = (props) => {
|
|
return (
|
|
<div class="flex items-center justify-center gap-2">
|
|
{props.steps.map((step, index) => (
|
|
<div class="flex items-center">
|
|
<div class={`flex items-center gap-2 px-3 py-1.5 rounded-full text-sm font-medium transition-all ${index < props.currentStep
|
|
? 'bg-green-500/20 text-green-300'
|
|
: index === props.currentStep
|
|
? 'bg-blue-500/30 text-white border border-blue-400/50'
|
|
: 'bg-white/10 text-white/50'
|
|
}`}>
|
|
<span class={`w-5 h-5 flex items-center justify-center rounded-full text-xs ${index < props.currentStep
|
|
? 'bg-green-500 text-white'
|
|
: index === props.currentStep
|
|
? 'bg-blue-500 text-white'
|
|
: 'bg-white/20 text-white/50'
|
|
}`}>
|
|
{index < props.currentStep ? '✓' : index + 1}
|
|
</span>
|
|
<span class="hidden sm:inline">{step}</span>
|
|
</div>
|
|
{index < props.steps.length - 1 && (
|
|
<div class={`w-8 h-0.5 mx-1 ${index < props.currentStep ? 'bg-green-500/50' : 'bg-white/20'
|
|
}`} />
|
|
)}
|
|
</div>
|
|
))}
|
|
</div>
|
|
);
|
|
};
|