Graphical PDS migrator for AT Protocol

Update MigrationProgress.tsx

Changed files
-35
islands
-35
islands/MigrationProgress.tsx
··· 4 4 MigrationError, 5 5 MigrationErrorType, 6 6 MigrationProgressProps, 7 - MigrationStateInfo, 8 7 MigrationStep, 9 8 } from "../lib/client.ts"; 10 - import { getMigrationState } from "../lib/migration-state.ts"; 11 - 12 9 /** 13 10 * The migration progress component. 14 11 * @param props - The migration progress props ··· 17 14 */ 18 15 export default function MigrationProgress(props: MigrationProgressProps) { 19 16 const [token, setToken] = useState(""); 20 - const migrationState: MigrationStateInfo = getMigrationState(); 21 17 const [showContinueAnyway, setShowContinueAnyway] = useState< 22 18 Record<number, boolean> 23 19 >({}); ··· 293 289 294 290 return ( 295 291 <div class="space-y-8"> 296 - {/* Migration state alert */} 297 - {migrationState && !migrationState.allowMigration && ( 298 - <div 299 - class={`p-4 rounded-lg border ${ 300 - migrationState.state === "maintenance" 301 - ? "bg-yellow-50 border-yellow-200 text-yellow-800 dark:bg-yellow-900/20 dark:border-yellow-800 dark:text-yellow-200" 302 - : "bg-red-50 border-red-200 text-red-800 dark:bg-red-900/20 dark:border-red-800 dark:text-red-200" 303 - }`} 304 - > 305 - <div class="flex items-center"> 306 - <div 307 - class={`mr-3 ${ 308 - migrationState.state === "maintenance" 309 - ? "text-yellow-600 dark:text-yellow-400" 310 - : "text-red-600 dark:text-red-400" 311 - }`} 312 - > 313 - {migrationState.state === "maintenance" ? "⚠️" : "🚫"} 314 - </div> 315 - <div> 316 - <h3 class="font-semibold mb-1"> 317 - {migrationState.state === "maintenance" 318 - ? "Maintenance Mode" 319 - : "Service Unavailable"} 320 - </h3> 321 - <p class="text-sm">{migrationState.message}</p> 322 - </div> 323 - </div> 324 - </div> 325 - )} 326 - 327 292 <div class="space-y-4"> 328 293 {steps.map((step, index) => ( 329 294 <div key={step.name} class={getStepClasses(step.status)}>