comparing a0ef5d0ae7e10a3eb7a6cf40ec5207b2b5d9fde2 and steps-refactor on knotbin.com/airport

.DS_Store

This is a binary file and will not be displayed.

.env.example

···

       1
       1
       +
       # generate with `openssl ecparam --name secp256k1 --genkey --noout --outform DER | tail --bytes=+8 | head --bytes=32 | xxd --plain --cols 32`

     

       2
       2
       +
       COOKIE_SECRET=my_secret

     

       3
       3
       +
       MIGRATION_STATE=up

-36

.github/workflows/deploy.yml

···

       1
       1
       -
       name: Deploy

     

       2
       2
       -
       on:

     

       3
       3
       -
         push:

     

       4
       4
       -
           branches: main

     

       5
       5
       -
         pull_request:

     

       6
       6
       -
           branches: main

     

       7
       7
       -
       

     

       8
       8
       -
       jobs:

     

       9
       9
       -
         deploy:

     

       10
       10
       -
           name: Deploy

     

       11
       11
       -
           runs-on: ubuntu-latest

     

       12
       12
       -
       

     

       13
       13
       -
           permissions:

     

       14
       14
       -
             id-token: write # Needed for auth with Deno Deploy

     

       15
       15
       -
             contents: read # Needed to clone the repository

     

       16
       16
       -
       

     

       17
       17
       -
           steps:

     

       18
       18
       -
             - name: Clone repository

     

       19
       19
       -
               uses: actions/checkout@v4

     

       20
       20
       -
       

     

       21
       21
       -
             - name: Install Deno

     

       22
       22
       -
               uses: denoland/setup-deno@v2

     

       23
       23
       -
               with:

     

       24
       24
       -
                 deno-version: v2.x

     

       25
       25
       -
       

     

       26
       26
       -
             - name: Build step

     

       27
       27
       -
               run: "deno task build"

     

       28
       28
       -
       

     

       29
       29
       -
             - name: Upload to Deno Deploy

     

       30
       30
       -
               uses: denoland/deployctl@v1

     

       31
       31
       -
               with:

     

       32
       32
       -
                 project: "roscoerubin-airport-67"

     

       33
       33
       -
                 entrypoint: "main.ts"

     

       34
       34
       -
                 root: "."

     

       35
       35
       -
                 

     

       36
       36
       -

.gitignore

···

       5
       5
        
       .env.production.local

     

       6
       6
        
       .env.local

     

       7
       7
        
       

     

       8
       8
       +
       .DS_Store

     

       9
       9
       +
       

     

       8
       10
        
       # Fresh build directory

     

       9
       11
        
       _fresh/

     

       10
       12
        
       # npm dependencies

+35 -9

.zed/settings.json

···

       1
       1
       +
       // Folder-specific settings

     

       2
       2
       +
       //

     

       3
       3
       +
       // For a full list of overridable settings, and general information on folder-specific settings,

     

       4
       4
       +
       // see the documentation: https://zed.dev/docs/configuring-zed#settings-files

     

       1
       5
        
       {

     

       6
       6
       +
         "lsp": {

     

       7
       7
       +
           "deno": {

     

       8
       8
       +
             "settings": {

     

       9
       9
       +
               "deno": {

     

       10
       10
       +
                 "enable": true,

     

       11
       11
       +
                 "cacheOnSave": true,

     

       12
       12
       +
                 "suggest": {

     

       13
       13
       +
                   "imports": {

     

       14
       14
       +
                     "autoDiscover": true

     

       15
       15
       +
                   }

     

       16
       16
       +
                 }

     

       17
       17
       +
               }

     

       18
       18
       +
             }

     

       19
       19
       +
           }

     

       20
       20
       +
         },

     

       2
       21
        
         "languages": {

     

       22
       22
       +
           "JavaScript": {

     

       23
       23
       +
             "language_servers": [

     

       24
       24
       +
               "deno",

     

       25
       25
       +
               "!vtsls",

     

       26
       26
       +
               "!eslint",

     

       27
       27
       +
               "..."

     

       28
       28
       +
             ]

     

       29
       29
       +
           },

     

       3
       30
        
           "TypeScript": {

     

       4
       31
        
             "language_servers": [

     

       5
       5
       -
               "wakatime",

     

       6
       32
        
               "deno",

     

       7
       33
        
               "!typescript-language-server",

     

       8
       34
        
               "!vtsls",

     

       9
       9
       -
               "!eslint"

     

       10
       10
       -
             ],

     

       11
       11
       -
             "formatter": "language_server"

     

       35
       35
       +
               "!eslint",

     

       36
       36
       +
               "..."

     

       37
       37
       +
             ]

     

       12
       38
        
           },

     

       13
       39
        
           "TSX": {

     

       14
       40
        
             "language_servers": [

     

       15
       15
       -
               "wakatime",

     

       16
       41
        
               "deno",

     

       17
       42
        
               "!typescript-language-server",

     

       18
       43
        
               "!vtsls",

     

       19
       19
       -
               "!eslint"

     

       20
       20
       -
             ],

     

       21
       21
       -
             "formatter": "language_server"

     

       44
       44
       +
               "!eslint",

     

       45
       45
       +
               "..."

     

       46
       46
       +
             ]

     

       22
       47
        
           }

     

       23
       23
       -
         }

     

       48
       48
       +
         },

     

       49
       49
       +
         "formatter": "language_server"

     

       24
       50
        
       }

+18 -20

README.md

···

       1
       1
        
       # Airport

     

       2
       2
        
       

     

       3
       3
       -
       Your terminal for seamless AT Protocol PDS (Personal Data Server) migration and backup.

     

       3
       3
       +
       Your terminal for seamless AT Protocol PDS (Personal Data Server) migration and

     

       4
       4
       +
       backup.

     

       4
       5
        
       

     

       5
       5
       -
       Airport is a web application built with Fresh and Deno that helps users safely migrate and backup their Bluesky PDS data. It provides a user-friendly interface for managing your AT Protocol data.

     

       6
       6
       -
       

     

       7
       7
       -
       ⚠️ **Alpha Status**: Airport is currently in alpha. Please use migration tools at your own risk and avoid using with main accounts during this phase.

     

       6
       6
       +
       Airport is a web application built with Fresh and Deno that helps users safely

     

       7
       7
       +
       migrate and backup their Bluesky PDS data. It provides a user-friendly interface

     

       8
       8
       +
       for managing your AT Protocol data.

     

       8
       9
        
       

     

       9
       10
        
       ## Features

     

       10
       11
        
       

     
···

       13
       14
        
       - User-friendly interface

     

       14
       15
        
       - Coming soon: PLC Key retrieval, data backup

     

       15
       16
        
       

     

       16
       16
       -
       ## Technology Stack

     

       17
       17
       +
       ## Tech Stack

     

       17
       18
        
       

     

       18
       18
       -
       - [Fresh](https://fresh.deno.dev/) - The next-gen web framework

     

       19
       19
       -
       - [Deno](https://deno.com/) - A modern runtime for JavaScript and TypeScript

     

       20
       20
       -
       - [Tailwind CSS](https://tailwindcss.com/) - For styling

     

       21
       21
       -
       - AT Protocol Integration

     

       22
       22
       -
       

     

       23
       23
       -
       ## Getting Started

     

       19
       19
       +
       - [Fresh](https://fresh.deno.dev/) - Web Framework

     

       20
       20
       +
       - [Deno](https://deno.com/) - Runtime

     

       21
       21
       +
       - [Tailwind](https://tailwindcss.com/) - Styling

     

       24
       22
        
       

     

       25
       25
       -
       ### Prerequisites

     

       23
       23
       +
       ## Development

     

       26
       24
        
       

     

       27
       27
       -
       Make sure to install Deno:

     

       25
       25
       +
       Make sure you have Deno installed:

     

       28
       26
        
       https://docs.deno.com/runtime/getting_started/installation

     

       29
       27
        
       

     

       30
       30
       -
       ### Development

     

       31
       31
       -
       

     

       32
       28
        
       Start the project in development mode:

     

       33
       29
        
       

     

       34
       34
       -
       ```

     

       30
       30
       +
       ```shell

     

       35
       31
        
       deno task dev

     

       36
       32
        
       ```

     

       37
       33
        
       

     

       38
       38
       -
       This will watch the project directory and restart as necessary.

     

       39
       39
       -
       

     

       40
       34
        
       ## About

     

       41
       35
        
       

     

       42
       42
       -
       Airport is developed with ❤️ by [Roscoe](https://bsky.app/profile/knotbin.com) for [Spark](https://sprk.so), a new short-video platform for AT Protocol.

     

       36
       36
       +
       Airport is developed with ❤️ by [Roscoe](https://bsky.app/profile/knotbin.com)

     

       37
       37
       +
       for [Spark](https://sprk.so), a new short-video platform for AT Protocol.

     

       43
       38
        
       

     

       44
       39
        
       ## Contributing

     

       45
       40
        
       

     

       46
       46
       -
       We welcome contributions! Please feel free to submit a Pull Request. Please only submit pull requests that are relevant to the project. This project targets people with a non-advanced understanding of AT Protocol, so please avoid submitting pull requests that add features that complicate the user experience.

     

       41
       41
       +
       We welcome contributions! Please feel free to submit a Pull Request. Please only

     

       42
       42
       +
       submit pull requests that are relevant to the project. This project targets

     

       43
       43
       +
       people with a non-advanced understanding of AT Protocol, so please avoid

     

       44
       44
       +
       submitting pull requests that add features that complicate the user experience.

     

       47
       45
        
       

     

       48
       46
        
       ## License

     

       49
       47

components/AirportSign.tsx

···

       1
       1
       +
       /**

     

       2
       2
       +
        * The airport sign component, used on the landing page.

     

       3
       3
       +
        * Looks like a physical airport sign with a screen.

     

       4
       4
       +
        * @returns The airport sign component

     

       5
       5
       +
        * @component

     

       6
       6
       +
        */

     

       1
       7
        
       export default function AirportSign() {

     

       2
       8
        
         return (

     

       3
       9
        
           <div class="relative inline-block mb-8 sm:mb-12">

+43 -11

components/Button.tsx

···

       9
       9
        
         condensed?: boolean;

     

       10
       10
        
       };

     

       11
       11
        
       

     

       12
       12
       -
       type ButtonProps = ButtonBaseProps & Omit<JSX.HTMLAttributes<HTMLButtonElement>, keyof ButtonBaseProps>;

     

       13
       13
       -
       type AnchorProps = ButtonBaseProps & Omit<JSX.HTMLAttributes<HTMLAnchorElement>, keyof ButtonBaseProps> & { href: string };

     

       12
       12
       +
       type ButtonProps =

     

       13
       13
       +
         & ButtonBaseProps

     

       14
       14
       +
         & Omit<JSX.HTMLAttributes<HTMLButtonElement>, keyof ButtonBaseProps>;

     

       15
       15
       +
       type AnchorProps =

     

       16
       16
       +
         & ButtonBaseProps

     

       17
       17
       +
         & Omit<JSX.HTMLAttributes<HTMLAnchorElement>, keyof ButtonBaseProps>

     

       18
       18
       +
         & { href: string };

     

       14
       19
        
       

     

       20
       20
       +
       /**

     

       21
       21
       +
        * The button props or anchor props for a button or link.

     

       22
       22
       +
        * @type {Props}

     

       23
       23
       +
        */

     

       15
       24
        
       type Props = ButtonProps | AnchorProps;

     

       16
       25
        
       

     

       26
       26
       +
       /**

     

       27
       27
       +
        * Styled button component.

     

       28
       28
       +
        * @param props - The button props

     

       29
       29
       +
        * @returns The button component

     

       30
       30
       +
        * @component

     

       31
       31
       +
        */

     

       17
       32
        
       export function Button(props: Props) {

     

       18
       18
       -
         const { color = "blue", icon, iconAlt, label, className = "", condensed = false, ...rest } = props;

     

       19
       19
       -
         const isAnchor = 'href' in props;

     

       33
       33
       +
         const {

     

       34
       34
       +
           color = "blue",

     

       35
       35
       +
           icon,

     

       36
       36
       +
           iconAlt,

     

       37
       37
       +
           label,

     

       38
       38
       +
           className = "",

     

       39
       39
       +
           condensed = false,

     

       40
       40
       +
           ...rest

     

       41
       41
       +
         } = props;

     

       42
       42
       +
         const isAnchor = "href" in props;

     

       20
       43
        
       

     

       21
       44
        
         const baseStyles = "airport-sign flex items-center [transition:none]";

     

       22
       22
       -
         const paddingStyles = condensed ? 'px-2 py-1.5' : 'px-3 py-2 sm:px-6 sm:py-3';

     

       23
       23
       -
         const transformStyles = "translate-y-0 hover:translate-y-1 hover:transition-transform hover:duration-200 hover:ease-in-out";

     

       45
       45
       +
         const paddingStyles = condensed ? "px-2 py-1.5" : "px-3 py-2 sm:px-6 sm:py-3";

     

       46
       46
       +
         const transformStyles =

     

       47
       47
       +
           "translate-y-0 hover:translate-y-1 hover:transition-transform hover:duration-200 hover:ease-in-out";

     

       24
       48
        
         const colorStyles = {

     

       25
       25
       -
           blue: "bg-gradient-to-r from-blue-400 to-blue-500 text-white hover:from-blue-500 hover:to-blue-600",

     

       26
       26
       -
           amber: "bg-gradient-to-r from-amber-400 to-amber-500 text-slate-900 hover:from-amber-500 hover:to-amber-600",

     

       49
       49
       +
           blue:

     

       50
       50
       +
             "bg-gradient-to-r from-blue-400 to-blue-500 text-white hover:from-blue-500 hover:to-blue-600",

     

       51
       51
       +
           amber:

     

       52
       52
       +
             "bg-gradient-to-r from-amber-400 to-amber-500 text-slate-900 hover:from-amber-500 hover:to-amber-600",

     

       27
       53
        
         };

     

       28
       54
        
       

     

       29
       55
        
         const buttonContent = (

     
···

       32
       58
        
               <img

     

       33
       59
        
                 src={icon}

     

       34
       60
        
                 alt={iconAlt || ""}

     

       35
       35
       -
                 className={`${condensed ? 'w-4 h-4' : 'w-6 h-6'} mr-2`}

     

       36
       36
       -
                 style={{ filter: color === 'blue' ? "brightness(0) invert(1)" : "brightness(0)" }}

     

       61
       61
       +
                 className={`${condensed ? "w-4 h-4" : "w-6 h-6"} mr-2`}

     

       62
       62
       +
                 style={{

     

       63
       63
       +
                   filter: color === "blue"

     

       64
       64
       +
                     ? "brightness(0) invert(1)"

     

       65
       65
       +
                     : "brightness(0)",

     

       66
       66
       +
                 }}

     

       37
       67
        
               />

     

       38
       68
        
             )}

     

       39
       69
        
             {label && (

     
···

       44
       74
        
           </>

     

       45
       75
        
         );

     

       46
       76
        
       

     

       47
       47
       -
         const buttonStyles = `${baseStyles} ${paddingStyles} ${transformStyles} ${colorStyles[color]} ${className}`;

     

       77
       77
       +
         const buttonStyles = `${baseStyles} ${paddingStyles} ${transformStyles} ${

     

       78
       78
       +
           colorStyles[color]

     

       79
       79
       +
         } ${className}`;

     

       48
       80
        
       

     

       49
       81
        
         if (isAnchor) {

     

       50
       82
        
           return (

+65

components/Link.tsx

···

       1
       1
       +
       import { JSX } from "preact";

     

       2
       2
       +
       

     

       3
       3
       +
       /**

     

       4
       4
       +
        * Props for the Link component

     

       5
       5
       +
        */

     

       6
       6
       +
       type Props = Omit<JSX.HTMLAttributes<HTMLAnchorElement>, "href"> & {

     

       7
       7
       +
         /** URL for the link */

     

       8
       8
       +
         href: string;

     

       9
       9
       +
         /** Whether this is an external link that should show an outbound icon */

     

       10
       10
       +
         isExternal?: boolean;

     

       11
       11
       +
         /** Link text content */

     

       12
       12
       +
         children: JSX.Element | string;

     

       13
       13
       +
       };

     

       14
       14
       +
       

     

       15
       15
       +
       /**

     

       16
       16
       +
        * A link component that handles external links with appropriate styling and accessibility.

     

       17
       17
       +
        * Automatically adds external link icon and proper attributes for external links.

     

       18
       18
       +
        */

     

       19
       19
       +
       export function Link(props: Props) {

     

       20
       20
       +
         const {

     

       21
       21
       +
           isExternal = false,

     

       22
       22
       +
           class: className = "",

     

       23
       23
       +
           children,

     

       24
       24
       +
           href,

     

       25
       25
       +
           ...rest

     

       26
       26
       +
         } = props;

     

       27
       27
       +
       

     

       28
       28
       +
         // SVG for external link icon

     

       29
       29
       +
         const externalLinkIcon = (

     

       30
       30
       +
           <svg

     

       31
       31
       +
             xmlns="http://www.w3.org/2000/svg"

     

       32
       32
       +
             viewBox="0 0 20 20"

     

       33
       33
       +
             fill="currentColor"

     

       34
       34
       +
             className="w-4 h-4 inline-block ml-1"

     

       35
       35
       +
             aria-hidden="true"

     

       36
       36
       +
           >

     

       37
       37
       +
             <path

     

       38
       38
       +
               fillRule="evenodd"

     

       39
       39
       +
               d="M4.25 5.5a.75.75 0 00-.75.75v8.5c0 .414.336.75.75.75h8.5a.75.75 0 00.75-.75v-4a.75.75 0 011.5 0v4A2.25 2.25 0 0112.75 17h-8.5A2.25 2.25 0 012 14.75v-8.5A2.25 2.25 0 014.25 4h5a.75.75 0 010 1.5h-5z"

     

       40
       40
       +
             />

     

       41
       41
       +
             <path

     

       42
       42
       +
               fillRule="evenodd"

     

       43
       43
       +
               d="M6.194 12.753a.75.75 0 001.06.053L16.5 4.44v2.81a.75.75 0 001.5 0v-4.5a.75.75 0 00-.75-.75h-4.5a.75.75 0 000 1.5h2.553l-9.056 8.194a.75.75 0 00-.053 1.06z"

     

       44
       44
       +
             />

     

       45
       45
       +
           </svg>

     

       46
       46
       +
         );

     

       47
       47
       +
       

     

       48
       48
       +
         return (

     

       49
       49
       +
           <a

     

       50
       50
       +
             href={href}

     

       51
       51
       +
             {...rest}

     

       52
       52
       +
             className={`inline-flex items-center hover:underline ${className}`}

     

       53
       53
       +
             {...(isExternal && {

     

       54
       54
       +
               target: "_blank",

     

       55
       55
       +
               rel: "noopener noreferrer",

     

       56
       56
       +
               "aria-label": `${

     

       57
       57
       +
                 typeof children === "string" ? children : ""

     

       58
       58
       +
               } (opens in new tab)`,

     

       59
       59
       +
             })}

     

       60
       60
       +
           >

     

       61
       61
       +
             {children}

     

       62
       62
       +
             {isExternal && externalLinkIcon}

     

       63
       63
       +
           </a>

     

       64
       64
       +
         );

     

       65
       65
       +
       }

+77

components/MigrationCompletion.tsx

···

       1
       1
       +
       export interface MigrationCompletionProps {

     

       2
       2
       +
         isVisible: boolean;

     

       3
       3
       +
       }

     

       4
       4
       +
       

     

       5
       5
       +
       export default function MigrationCompletion(

     

       6
       6
       +
         { isVisible }: MigrationCompletionProps,

     

       7
       7
       +
       ) {

     

       8
       8
       +
         if (!isVisible) return null;

     

       9
       9
       +
       

     

       10
       10
       +
         const handleLogout = async () => {

     

       11
       11
       +
           try {

     

       12
       12
       +
             const response = await fetch("/api/logout", {

     

       13
       13
       +
               method: "POST",

     

       14
       14
       +
               credentials: "include",

     

       15
       15
       +
             });

     

       16
       16
       +
             if (!response.ok) {

     

       17
       17
       +
               throw new Error("Logout failed");

     

       18
       18
       +
             }

     

       19
       19
       +
             globalThis.location.href = "/";

     

       20
       20
       +
           } catch (error) {

     

       21
       21
       +
             console.error("Failed to logout:", error);

     

       22
       22
       +
           }

     

       23
       23
       +
         };

     

       24
       24
       +
       

     

       25
       25
       +
         return (

     

       26
       26
       +
           <div class="p-4 bg-green-50 dark:bg-green-900 rounded-lg border-2 border-green-200 dark:border-green-800">

     

       27
       27
       +
             <p class="text-sm text-green-800 dark:text-green-200 pb-2">

     

       28
       28
       +
               Migration completed successfully! Sign out to finish the process and

     

       29
       29
       +
               return home.<br />

     

       30
       30
       +
               Please consider donating to Airport to support server and development

     

       31
       31
       +
               costs.

     

       32
       32
       +
             </p>

     

       33
       33
       +
             <div class="flex space-x-4">

     

       34
       34
       +
               <button

     

       35
       35
       +
                 type="button"

     

       36
       36
       +
                 onClick={handleLogout}

     

       37
       37
       +
                 class="px-4 py-2 bg-green-600 hover:bg-green-700 text-white rounded-md transition-colors duration-200 flex items-center space-x-2"

     

       38
       38
       +
               >

     

       39
       39
       +
                 <svg

     

       40
       40
       +
                   class="w-5 h-5"

     

       41
       41
       +
                   fill="none"

     

       42
       42
       +
                   stroke="currentColor"

     

       43
       43
       +
                   viewBox="0 0 24 24"

     

       44
       44
       +
                 >

     

       45
       45
       +
                   <path

     

       46
       46
       +
                     stroke-linecap="round"

     

       47
       47
       +
                     stroke-linejoin="round"

     

       48
       48
       +
                     stroke-width="2"

     

       49
       49
       +
                     d="M17 16l4-4m0 0l-4-4m4 4H7m6 4v1a3 3 0 01-3 3H6a3 3 0 01-3-3V7a3 3 0 013-3h4a3 3 0 013 3v1"

     

       50
       50
       +
                   />

     

       51
       51
       +
                 </svg>

     

       52
       52
       +
                 <span>Sign Out</span>

     

       53
       53
       +
               </button>

     

       54
       54
       +
               <a

     

       55
       55
       +
                 href="https://ko-fi.com/knotbin"

     

       56
       56
       +
                 target="_blank"

     

       57
       57
       +
                 class="px-4 py-2 bg-green-600 hover:bg-green-700 text-white rounded-md transition-colors duration-200 flex items-center space-x-2"

     

       58
       58
       +
               >

     

       59
       59
       +
                 <svg

     

       60
       60
       +
                   class="w-5 h-5"

     

       61
       61
       +
                   fill="none"

     

       62
       62
       +
                   stroke="currentColor"

     

       63
       63
       +
                   viewBox="0 0 24 24"

     

       64
       64
       +
                 >

     

       65
       65
       +
                   <path

     

       66
       66
       +
                     stroke-linecap="round"

     

       67
       67
       +
                     stroke-linejoin="round"

     

       68
       68
       +
                     stroke-width="2"

     

       69
       69
       +
                     d="M4.318 6.318a4.5 4.5 0 000 6.364L12 20.364l7.682-7.682a4.5 4.5 0 00-6.364-6.364L12 7.636l-1.318-1.318a4.5 4.5 0 00-6.364 0z"

     

       70
       70
       +
                   />

     

       71
       71
       +
                 </svg>

     

       72
       72
       +
                 <span>Support Us</span>

     

       73
       73
       +
               </a>

     

       74
       74
       +
             </div>

     

       75
       75
       +
           </div>

     

       76
       76
       +
         );

     

       77
       77
       +
       }

+208

components/MigrationStep.tsx

···

       1
       1
       +
       import { IS_BROWSER } from "fresh/runtime";

     

       2
       2
       +
       import { ComponentChildren } from "preact";

     

       3
       3
       +
       

     

       4
       4
       +
       export type StepStatus =

     

       5
       5
       +
         | "pending"

     

       6
       6
       +
         | "in-progress"

     

       7
       7
       +
         | "verifying"

     

       8
       8
       +
         | "completed"

     

       9
       9
       +
         | "error";

     

       10
       10
       +
       

     

       11
       11
       +
       export interface MigrationStepProps {

     

       12
       12
       +
         name: string;

     

       13
       13
       +
         status: StepStatus;

     

       14
       14
       +
         error?: string;

     

       15
       15
       +
         isVerificationError?: boolean;

     

       16
       16
       +
         index: number;

     

       17
       17
       +
         onRetryVerification?: (index: number) => void;

     

       18
       18
       +
         children?: ComponentChildren;

     

       19
       19
       +
       }

     

       20
       20
       +
       

     

       21
       21
       +
       export function MigrationStep({

     

       22
       22
       +
         name,

     

       23
       23
       +
         status,

     

       24
       24
       +
         error,

     

       25
       25
       +
         isVerificationError,

     

       26
       26
       +
         index,

     

       27
       27
       +
         onRetryVerification,

     

       28
       28
       +
         children,

     

       29
       29
       +
       }: MigrationStepProps) {

     

       30
       30
       +
         return (

     

       31
       31
       +
           <div key={name} class={getStepClasses(status)}>

     

       32
       32
       +
             {getStepIcon(status)}

     

       33
       33
       +
             <div class="flex-1">

     

       34
       34
       +
               <p

     

       35
       35
       +
                 class={`font-medium ${

     

       36
       36
       +
                   status === "error"

     

       37
       37
       +
                     ? "text-red-900 dark:text-red-200"

     

       38
       38
       +
                     : status === "completed"

     

       39
       39
       +
                     ? "text-green-900 dark:text-green-200"

     

       40
       40
       +
                     : status === "in-progress"

     

       41
       41
       +
                     ? "text-blue-900 dark:text-blue-200"

     

       42
       42
       +
                     : "text-gray-900 dark:text-gray-200"

     

       43
       43
       +
                 }`}

     

       44
       44
       +
               >

     

       45
       45
       +
                 {getStepDisplayName(

     

       46
       46
       +
                   { name, status, error, isVerificationError },

     

       47
       47
       +
                   index,

     

       48
       48
       +
                 )}

     

       49
       49
       +
               </p>

     

       50
       50
       +
               {error && (

     

       51
       51
       +
                 <div class="mt-1">

     

       52
       52
       +
                   <p class="text-sm text-red-600 dark:text-red-400">

     

       53
       53
       +
                     {(() => {

     

       54
       54
       +
                       try {

     

       55
       55
       +
                         const err = JSON.parse(error);

     

       56
       56
       +
                         return err.message || error;

     

       57
       57
       +
                       } catch {

     

       58
       58
       +
                         return error;

     

       59
       59
       +
                       }

     

       60
       60
       +
                     })()}

     

       61
       61
       +
                   </p>

     

       62
       62
       +
                   {isVerificationError && onRetryVerification && (

     

       63
       63
       +
                     <div class="flex space-x-2 mt-2">

     

       64
       64
       +
                       <button

     

       65
       65
       +
                         type="button"

     

       66
       66
       +
                         onClick={() => onRetryVerification(index)}

     

       67
       67
       +
                         class="px-3 py-1 text-xs bg-blue-600 hover:bg-blue-700 text-white rounded transition-colors duration-200 dark:bg-blue-500 dark:hover:bg-blue-400"

     

       68
       68
       +
                         disabled={!IS_BROWSER}

     

       69
       69
       +
                       >

     

       70
       70
       +
                         Retry Verification

     

       71
       71
       +
                       </button>

     

       72
       72
       +
                     </div>

     

       73
       73
       +
                   )}

     

       74
       74
       +
                 </div>

     

       75
       75
       +
               )}

     

       76
       76
       +
               {children}

     

       77
       77
       +
             </div>

     

       78
       78
       +
           </div>

     

       79
       79
       +
         );

     

       80
       80
       +
       }

     

       81
       81
       +
       

     

       82
       82
       +
       function getStepDisplayName(

     

       83
       83
       +
         step: Pick<

     

       84
       84
       +
           MigrationStepProps,

     

       85
       85
       +
           "name" | "status" | "error" | "isVerificationError"

     

       86
       86
       +
         >,

     

       87
       87
       +
         index: number,

     

       88
       88
       +
       ) {

     

       89
       89
       +
         if (step.status === "completed") {

     

       90
       90
       +
           switch (index) {

     

       91
       91
       +
             case 0:

     

       92
       92
       +
               return "Account Created";

     

       93
       93
       +
             case 1:

     

       94
       94
       +
               return "Data Migrated";

     

       95
       95
       +
             case 2:

     

       96
       96
       +
               return "Identity Migrated";

     

       97
       97
       +
             case 3:

     

       98
       98
       +
               return "Migration Finalized";

     

       99
       99
       +
           }

     

       100
       100
       +
         }

     

       101
       101
       +
       

     

       102
       102
       +
         if (step.status === "in-progress") {

     

       103
       103
       +
           switch (index) {

     

       104
       104
       +
             case 0:

     

       105
       105
       +
               return "Creating your new account...";

     

       106
       106
       +
             case 1:

     

       107
       107
       +
               return "Migrating your data...";

     

       108
       108
       +
             case 2:

     

       109
       109
       +
               return step.name ===

     

       110
       110
       +
                   "Enter the token sent to your email to complete identity migration"

     

       111
       111
       +
                 ? step.name

     

       112
       112
       +
                 : "Migrating your identity...";

     

       113
       113
       +
             case 3:

     

       114
       114
       +
               return "Finalizing migration...";

     

       115
       115
       +
           }

     

       116
       116
       +
         }

     

       117
       117
       +
       

     

       118
       118
       +
         if (step.status === "verifying") {

     

       119
       119
       +
           switch (index) {

     

       120
       120
       +
             case 0:

     

       121
       121
       +
               return "Verifying account creation...";

     

       122
       122
       +
             case 1:

     

       123
       123
       +
               return "Verifying data migration...";

     

       124
       124
       +
             case 2:

     

       125
       125
       +
               return "Verifying identity migration...";

     

       126
       126
       +
             case 3:

     

       127
       127
       +
               return "Verifying migration completion...";

     

       128
       128
       +
           }

     

       129
       129
       +
         }

     

       130
       130
       +
       

     

       131
       131
       +
         return step.name;

     

       132
       132
       +
       }

     

       133
       133
       +
       

     

       134
       134
       +
       function getStepIcon(status: StepStatus) {

     

       135
       135
       +
         switch (status) {

     

       136
       136
       +
           case "pending":

     

       137
       137
       +
             return (

     

       138
       138
       +
               <div class="w-8 h-8 rounded-full border-2 border-gray-300 dark:border-gray-600 flex items-center justify-center">

     

       139
       139
       +
                 <div class="w-3 h-3 rounded-full bg-gray-300 dark:bg-gray-600" />

     

       140
       140
       +
               </div>

     

       141
       141
       +
             );

     

       142
       142
       +
           case "in-progress":

     

       143
       143
       +
             return (

     

       144
       144
       +
               <div class="w-8 h-8 rounded-full border-2 border-blue-500 border-t-transparent animate-spin flex items-center justify-center">

     

       145
       145
       +
                 <div class="w-3 h-3 rounded-full bg-blue-500" />

     

       146
       146
       +
               </div>

     

       147
       147
       +
             );

     

       148
       148
       +
           case "verifying":

     

       149
       149
       +
             return (

     

       150
       150
       +
               <div class="w-8 h-8 rounded-full border-2 border-yellow-500 border-t-transparent animate-spin flex items-center justify-center">

     

       151
       151
       +
                 <div class="w-3 h-3 rounded-full bg-yellow-500" />

     

       152
       152
       +
               </div>

     

       153
       153
       +
             );

     

       154
       154
       +
           case "completed":

     

       155
       155
       +
             return (

     

       156
       156
       +
               <div class="w-8 h-8 rounded-full bg-green-500 flex items-center justify-center">

     

       157
       157
       +
                 <svg

     

       158
       158
       +
                   class="w-5 h-5 text-white"

     

       159
       159
       +
                   fill="none"

     

       160
       160
       +
                   stroke="currentColor"

     

       161
       161
       +
                   viewBox="0 0 24 24"

     

       162
       162
       +
                 >

     

       163
       163
       +
                   <path

     

       164
       164
       +
                     stroke-linecap="round"

     

       165
       165
       +
                     stroke-linejoin="round"

     

       166
       166
       +
                     stroke-width="2"

     

       167
       167
       +
                     d="M5 13l4 4L19 7"

     

       168
       168
       +
                   />

     

       169
       169
       +
                 </svg>

     

       170
       170
       +
               </div>

     

       171
       171
       +
             );

     

       172
       172
       +
           case "error":

     

       173
       173
       +
             return (

     

       174
       174
       +
               <div class="w-8 h-8 rounded-full bg-red-500 flex items-center justify-center">

     

       175
       175
       +
                 <svg

     

       176
       176
       +
                   class="w-5 h-5 text-white"

     

       177
       177
       +
                   fill="none"

     

       178
       178
       +
                   stroke="currentColor"

     

       179
       179
       +
                   viewBox="0 0 24 24"

     

       180
       180
       +
                 >

     

       181
       181
       +
                   <path

     

       182
       182
       +
                     stroke-linecap="round"

     

       183
       183
       +
                     stroke-linejoin="round"

     

       184
       184
       +
                     stroke-width="2"

     

       185
       185
       +
                     d="M6 18L18 6M6 6l12 12"

     

       186
       186
       +
                   />

     

       187
       187
       +
                 </svg>

     

       188
       188
       +
               </div>

     

       189
       189
       +
             );

     

       190
       190
       +
         }

     

       191
       191
       +
       }

     

       192
       192
       +
       

     

       193
       193
       +
       function getStepClasses(status: StepStatus) {

     

       194
       194
       +
         const baseClasses =

     

       195
       195
       +
           "flex items-center space-x-3 p-4 rounded-lg transition-colors duration-200";

     

       196
       196
       +
         switch (status) {

     

       197
       197
       +
           case "pending":

     

       198
       198
       +
             return `${baseClasses} bg-gray-50 dark:bg-gray-800`;

     

       199
       199
       +
           case "in-progress":

     

       200
       200
       +
             return `${baseClasses} bg-blue-50 dark:bg-blue-900`;

     

       201
       201
       +
           case "verifying":

     

       202
       202
       +
             return `${baseClasses} bg-yellow-50 dark:bg-yellow-900`;

     

       203
       203
       +
           case "completed":

     

       204
       204
       +
             return `${baseClasses} bg-green-50 dark:bg-green-900`;

     

       205
       205
       +
           case "error":

     

       206
       206
       +
             return `${baseClasses} bg-red-50 dark:bg-red-900`;

     

       207
       207
       +
         }

     

       208
       208
       +
       }

+33 -9

deno.json

···

       2
       2
        
         "tasks": {

     

       3
       3
        
           "check": "deno fmt --check . && deno lint . && deno check **/*.ts && deno check **/*.tsx",

     

       4
       4
        
           "dev": "deno run -A --env --watch=static/,routes/ dev.ts",

     

       5
       5
       -
           "build": "deno run -A --unstable-otel dev.ts build",

     

       6
       6
       -
           "start": "deno run -A --unstable-otel main.ts",

     

       5
       5
       +
           "build": "deno run -A dev.ts build",

     

       6
       6
       +
           "start": "deno run -A main.ts",

     

       7
       7
        
           "update": "deno run -A -r jsr:@fresh/update ."

     

       8
       8
        
         },

     

       9
       9
        
         "lint": {

     

       10
       10
        
           "rules": {

     

       11
       11
       -
             "tags": ["fresh", "recommended"]

     

       11
       11
       +
             "tags": [

     

       12
       12
       +
               "fresh",

     

       13
       13
       +
               "recommended"

     

       14
       14
       +
             ]

     

       12
       15
        
           }

     

       13
       16
        
         },

     

       14
       14
       -
         "exclude": ["**/_fresh/*"],

     

       17
       17
       +
         "exclude": [

     

       18
       18
       +
           "**/_fresh/*"

     

       19
       19
       +
         ],

     

       15
       20
        
         "imports": {

     

       16
       21
        
           "@atproto/api": "npm:@atproto/api@^0.15.6",

     

       17
       22
        
           "@bigmoves/atproto-oauth-client": "jsr:@bigmoves/atproto-oauth-client@^0.2.0",

     
···

       21
       26
        
           "posthog-js": "npm:posthog-js@1.120.0",

     

       22
       27
        
           "preact": "npm:preact@^10.26.6",

     

       23
       28
        
           "@preact/signals": "npm:@preact/signals@^2.0.4",

     

       24
       24
       -
           "tailwindcss": "npm:tailwindcss@^3.4.3"

     

       29
       29
       +
           "tailwindcss": "npm:tailwindcss@^3.4.3",

     

       30
       30
       +
           "@atproto/crypto": "npm:@atproto/crypto@^0.4.4",

     

       31
       31
       +
           "@did-plc/lib": "npm:@did-plc/lib@^0.0.4"

     

       25
       32
        
         },

     

       26
       33
        
         "compilerOptions": {

     

       27
       27
       -
           "lib": ["dom", "dom.asynciterable", "dom.iterable", "deno.ns"],

     

       34
       34
       +
           "lib": [

     

       35
       35
       +
             "dom",

     

       36
       36
       +
             "dom.asynciterable",

     

       37
       37
       +
             "dom.iterable",

     

       38
       38
       +
             "deno.ns"

     

       39
       39
       +
           ],

     

       28
       40
        
           "jsx": "precompile",

     

       29
       41
        
           "jsxImportSource": "preact",

     

       30
       30
       -
           "jsxPrecompileSkipElements": ["a", "img", "source", "body", "html", "head"],

     

       31
       31
       -
           "types": ["node"]

     

       42
       42
       +
           "jsxPrecompileSkipElements": [

     

       43
       43
       +
             "a",

     

       44
       44
       +
             "img",

     

       45
       45
       +
             "source",

     

       46
       46
       +
             "body",

     

       47
       47
       +
             "html",

     

       48
       48
       +
             "head"

     

       49
       49
       +
           ],

     

       50
       50
       +
           "types": [

     

       51
       51
       +
             "node"

     

       52
       52
       +
           ]

     

       32
       53
        
         },

     

       33
       33
       -
         "unstable": ["kv", "otel"]

     

       54
       54
       +
         "unstable": [

     

       55
       55
       +
           "kv",

     

       56
       56
       +
           "otel"

     

       57
       57
       +
         ]

     

       34
       58
        
       }

+284 -1

deno.lock

···

       33
       33
        
           "npm:@atproto/api@*": "0.15.6",

     

       34
       34
        
           "npm:@atproto/api@~0.15.6": "0.15.6",

     

       35
       35
        
           "npm:@atproto/crypto@*": "0.4.4",

     

       36
       36
       +
           "npm:@atproto/crypto@~0.4.4": "0.4.4",

     

       36
       37
        
           "npm:@atproto/identity@*": "0.4.8",

     

       37
       38
        
           "npm:@atproto/jwk@0.1.4": "0.1.4",

     

       38
       39
        
           "npm:@atproto/oauth-client@~0.3.13": "0.3.16",

     

       39
       40
        
           "npm:@atproto/oauth-types@~0.2.4": "0.2.7",

     

       40
       41
        
           "npm:@atproto/syntax@*": "0.4.0",

     

       41
       42
        
           "npm:@atproto/xrpc@*": "0.7.0",

     

       43
       43
       +
           "npm:@did-plc/lib@^0.0.4": "0.0.4",

     

       42
       44
        
           "npm:@lucide/lab@*": "0.1.2",

     

       43
       45
        
           "npm:@opentelemetry/api@^1.9.0": "1.9.0",

     

       44
       46
        
           "npm:@preact/signals@^1.2.3": "1.3.2_preact@10.26.6",

     
···

       293
       295
        
               "zod"

     

       294
       296
        
             ]

     

       295
       297
        
           },

     

       298
       298
       +
           "@atproto/common@0.1.1": {

     

       299
       299
       +
             "integrity": "sha512-GYwot5wF/z8iYGSPjrLHuratLc0CVgovmwfJss7+BUOB6y2/Vw8+1Vw0n9DDI0gb5vmx3UI8z0uJgC8aa8yuJg==",

     

       300
       300
       +
             "dependencies": [

     

       301
       301
       +
               "@ipld/dag-cbor",

     

       302
       302
       +
               "multiformats@9.9.0",

     

       303
       303
       +
               "pino",

     

       304
       304
       +
               "zod"

     

       305
       305
       +
             ]

     

       306
       306
       +
           },

     

       307
       307
       +
           "@atproto/crypto@0.1.0": {

     

       308
       308
       +
             "integrity": "sha512-9xgFEPtsCiJEPt9o3HtJT30IdFTGw5cQRSJVIy5CFhqBA4vDLcdXiRDLCjkzHEVbtNCsHUW6CrlfOgbeLPcmcg==",

     

       309
       309
       +
             "dependencies": [

     

       310
       310
       +
               "@noble/secp256k1",

     

       311
       311
       +
               "big-integer",

     

       312
       312
       +
               "multiformats@9.9.0",

     

       313
       313
       +
               "one-webcrypto",

     

       314
       314
       +
               "uint8arrays@3.0.0"

     

       315
       315
       +
             ]

     

       316
       316
       +
           },

     

       296
       317
        
           "@atproto/crypto@0.4.4": {

     

       297
       318
        
             "integrity": "sha512-Yq9+crJ7WQl7sxStVpHgie5Z51R05etaK9DLWYG/7bR5T4bhdcIgF6IfklLShtZwLYdVVj+K15s0BqW9a8PSDA==",

     

       298
       319
        
             "dependencies": [

     
···

       311
       332
        
             "integrity": "sha512-Z0sLnJ87SeNdAifT+rqpgE1Rc3layMMW25gfWNo4u40RGuRODbdfAZlTwBSU2r+Vk45hU+iE+xeQspfednCEnA==",

     

       312
       333
        
             "dependencies": [

     

       313
       334
        
               "@atproto/common-web",

     

       314
       314
       -
               "@atproto/crypto"

     

       335
       335
       +
               "@atproto/crypto@0.4.4"

     

       315
       336
        
             ]

     

       316
       337
        
           },

     

       317
       338
        
           "@atproto/jwk@0.1.4": {

     
···

       369
       390
        
             "integrity": "sha512-SfhP9dGx2qclaScFDb58Jnrmim5nk4geZXCqg6sB0I/KZhZEkr9iIx1hLCp+sxkIfEsmEJjeWO4B0rjUIJW5cw==",

     

       370
       391
        
             "dependencies": [

     

       371
       392
        
               "@atproto/lexicon",

     

       393
       393
       +
               "zod"

     

       394
       394
       +
             ]

     

       395
       395
       +
           },

     

       396
       396
       +
           "@did-plc/lib@0.0.4": {

     

       397
       397
       +
             "integrity": "sha512-Omeawq3b8G/c/5CtkTtzovSOnWuvIuCI4GTJNrt1AmCskwEQV7zbX5d6km1mjJNbE0gHuQPTVqZxLVqetNbfwA==",

     

       398
       398
       +
             "dependencies": [

     

       399
       399
       +
               "@atproto/common",

     

       400
       400
       +
               "@atproto/crypto@0.1.0",

     

       401
       401
       +
               "@ipld/dag-cbor",

     

       402
       402
       +
               "axios",

     

       403
       403
       +
               "multiformats@9.9.0",

     

       404
       404
       +
               "uint8arrays@3.0.0",

     

       372
       405
        
               "zod"

     

       373
       406
        
             ]

     

       374
       407
        
           },

     
···

       492
       525
        
             "os": ["win32"],

     

       493
       526
        
             "cpu": ["x64"]

     

       494
       527
        
           },

     

       528
       528
       +
           "@ipld/dag-cbor@7.0.3": {

     

       529
       529
       +
             "integrity": "sha512-1VVh2huHsuohdXC1bGJNE8WR72slZ9XE2T3wbBBq31dm7ZBatmKLLxrB+XAqafxfRFjv08RZmj/W/ZqaM13AuA==",

     

       530
       530
       +
             "dependencies": [

     

       531
       531
       +
               "cborg",

     

       532
       532
       +
               "multiformats@9.9.0"

     

       533
       533
       +
             ]

     

       534
       534
       +
           },

     

       495
       535
        
           "@isaacs/cliui@8.0.2": {

     

       496
       536
        
             "integrity": "sha512-O8jcjabXaleOG9DQ0+ARXWZBTfnP4WNAqzuiJK7ll44AmxGKv/J2M4TPjxjY3znBCfvBXFzucm1twdyFybFqEA==",

     

       497
       537
        
             "dependencies": [

     
···

       538
       578
        
           },

     

       539
       579
        
           "@noble/hashes@1.8.0": {

     

       540
       580
        
             "integrity": "sha512-jCs9ldd7NwzpgXDIf6P3+NrHh9/sD6CQdxHyjQI+h/6rDNo88ypBxxz45UDuZHz9r3tNz7N/VInSVoVdtXEI4A=="

     

       581
       581
       +
           },

     

       582
       582
       +
           "@noble/secp256k1@1.7.2": {

     

       583
       583
       +
             "integrity": "sha512-/qzwYl5eFLH8OWIecQWM31qld2g1NfjgylK+TNhqtaUKP37Nm+Y+z30Fjhw0Ct8p9yCQEm2N3W/AckdIb3SMcQ=="

     

       541
       584
        
           },

     

       542
       585
        
           "@nodelib/fs.scandir@2.1.5": {

     

       543
       586
        
             "integrity": "sha512-vq24Bq3ym5HEQm2NKCr3yXDwjc7vTsEThRDnkp2DK9p1uqLR+DHurm/NOTo0KG7HYHU7eppKZj3MyqYuMBf62g==",

     
···

       588
       631
        
               "undici-types"

     

       589
       632
        
             ]

     

       590
       633
        
           },

     

       634
       634
       +
           "abort-controller@3.0.0": {

     

       635
       635
       +
             "integrity": "sha512-h8lQ8tacZYnR3vNQTgibj+tODHI5/+l06Au2Pcriv/Gmet0eaj4TwWH41sO9wnHDiQsEj19q0drzdWdeAHtweg==",

     

       636
       636
       +
             "dependencies": [

     

       637
       637
       +
               "event-target-shim"

     

       638
       638
       +
             ]

     

       639
       639
       +
           },

     

       591
       640
        
           "ansi-regex@5.0.1": {

     

       592
       641
        
             "integrity": "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ=="

     

       593
       642
        
           },

     
···

       616
       665
        
           "arg@5.0.2": {

     

       617
       666
        
             "integrity": "sha512-PYjyFOLKQ9y57JvQ6QLo8dAgNqswh8M1RMJYdQduT6xbWSgK36P/Z/v+p888pM69jMMfS8Xd8F6I1kQ/I9HUGg=="

     

       618
       667
        
           },

     

       668
       668
       +
           "asynckit@0.4.0": {

     

       669
       669
       +
             "integrity": "sha512-Oei9OH4tRh0YqU3GxhX79dM/mwVgvbZJaSNaRk+bshkj0S5cfHcgYakreBjrHwatXKbz+IoIdYLxrKim2MjW0Q=="

     

       670
       670
       +
           },

     

       671
       671
       +
           "atomic-sleep@1.0.0": {

     

       672
       672
       +
             "integrity": "sha512-kNOjDqAh7px0XWNI+4QbzoiR/nTkHAWNud2uvnJquD1/x5a7EQZMJT0AczqK0Qn67oY/TTQ1LbUKajZpp3I9tQ=="

     

       673
       673
       +
           },

     

       619
       674
        
           "autoprefixer@10.4.17_postcss@8.4.35": {

     

       620
       675
        
             "integrity": "sha512-/cpVNRLSfhOtcGflT13P2794gVSgmPgTR+erw5ifnMLZb0UnSlkK4tquLmkd3BhA+nLo5tX8Cu0upUsGKvKbmg==",

     

       621
       676
        
             "dependencies": [

     
···

       632
       687
        
           "await-lock@2.2.2": {

     

       633
       688
        
             "integrity": "sha512-aDczADvlvTGajTDjcjpJMqRkOF6Qdz3YbPZm/PyW6tKPkx2hlYBzxMhEywM/tU72HrVZjgl5VCdRuMlA7pZ8Gw=="

     

       634
       689
        
           },

     

       690
       690
       +
           "axios@1.10.0": {

     

       691
       691
       +
             "integrity": "sha512-/1xYAC4MP/HEG+3duIhFr4ZQXR4sQXOIe+o6sdqzeykGLx6Upp/1p8MHqhINOvGeP7xyNHe7tsiJByc4SSVUxw==",

     

       692
       692
       +
             "dependencies": [

     

       693
       693
       +
               "follow-redirects",

     

       694
       694
       +
               "form-data",

     

       695
       695
       +
               "proxy-from-env"

     

       696
       696
       +
             ]

     

       697
       697
       +
           },

     

       635
       698
        
           "balanced-match@1.0.2": {

     

       636
       699
        
             "integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw=="

     

       700
       700
       +
           },

     

       701
       701
       +
           "base64-js@1.5.1": {

     

       702
       702
       +
             "integrity": "sha512-AKpaYlHn8t4SVbOHCy+b5+KKgvR4vrsD8vbvrbiQJps7fKDTkjkDry6ji0rUJjC0kzbNePLwzxq8iypo41qeWA=="

     

       703
       703
       +
           },

     

       704
       704
       +
           "big-integer@1.6.52": {

     

       705
       705
       +
             "integrity": "sha512-QxD8cf2eVqJOOz63z6JIN9BzvVs/dlySa5HGSBH5xtR8dPteIRQnBxxKqkNTiT6jbDTF6jAfrd4oMcND9RGbQg=="

     

       637
       706
        
           },

     

       638
       707
        
           "binary-extensions@2.3.0": {

     

       639
       708
        
             "integrity": "sha512-Ceh+7ox5qe7LJuLHoY0feh3pHuUDHAcRUeyL2VYghZwfpkNIy/+8Ocg0a3UuSoYzavmylwuLWQOf3hl0jjMMIw=="

     
···

       663
       732
        
             ],

     

       664
       733
        
             "bin": true

     

       665
       734
        
           },

     

       735
       735
       +
           "buffer@6.0.3": {

     

       736
       736
       +
             "integrity": "sha512-FTiCpNxtwiZZHEZbcbTIcZjERVICn9yq/pDFkTl95/AxzD1naBctN7YO68riM/gLSDY7sdrMby8hofADYuuqOA==",

     

       737
       737
       +
             "dependencies": [

     

       738
       738
       +
               "base64-js",

     

       739
       739
       +
               "ieee754"

     

       740
       740
       +
             ]

     

       741
       741
       +
           },

     

       742
       742
       +
           "call-bind-apply-helpers@1.0.2": {

     

       743
       743
       +
             "integrity": "sha512-Sp1ablJ0ivDkSzjcaJdxEunN5/XvksFJ2sMBFfq6x0ryhQV/2b/KwFe21cMpmHtPOSij8K99/wSfoEuTObmuMQ==",

     

       744
       744
       +
             "dependencies": [

     

       745
       745
       +
               "es-errors",

     

       746
       746
       +
               "function-bind"

     

       747
       747
       +
             ]

     

       748
       748
       +
           },

     

       666
       749
        
           "camelcase-css@2.0.1": {

     

       667
       750
        
             "integrity": "sha512-QOSvevhslijgYwRx6Rv7zKdMF8lbRmx+uQGx2+vDc+KI/eBnsy9kit5aj23AgGu3pa4t9AgwbnXWqS+iOY+2aA=="

     

       668
       751
        
           },

     
···

       677
       760
        
           },

     

       678
       761
        
           "caniuse-lite@1.0.30001717": {

     

       679
       762
        
             "integrity": "sha512-auPpttCq6BDEG8ZAuHJIplGw6GODhjw+/11e7IjpnYCxZcW/ONgPs0KVBJ0d1bY3e2+7PRe5RCLyP+PfwVgkYw=="

     

       763
       763
       +
           },

     

       764
       764
       +
           "cborg@1.10.2": {

     

       765
       765
       +
             "integrity": "sha512-b3tFPA9pUr2zCUiCfRd2+wok2/LBSNUMKOuRRok+WlvvAgEt/PlbgPTsZUcwCOs53IJvLgTp0eotwtosE6njug==",

     

       766
       766
       +
             "bin": true

     

       680
       767
        
           },

     

       681
       768
        
           "chokidar@3.6.0": {

     

       682
       769
        
             "integrity": "sha512-7VT13fmjotKpGipCW9JEQAusEPE+Ei8nl6/g4FBAmIm0GOOLMua9NDDo/DWp0ZAxCr3cPq5ZpBqmPAQgDda2Pw==",

     
···

       705
       792
        
           "colord@2.9.3": {

     

       706
       793
        
             "integrity": "sha512-jeC1axXpnb0/2nn/Y1LPuLdgXBLH7aDcHu4KEKfqw3CUhX7ZpfBSlPKyqXE6btIgEzfWtrX3/tyBCaCvXvMkOw=="

     

       707
       794
        
           },

     

       795
       795
       +
           "combined-stream@1.0.8": {

     

       796
       796
       +
             "integrity": "sha512-FQN4MRfuJeHf7cBbBMJFXhKSDq+2kAArBlmRBvcvFE5BB1HZKXtSFASDhdlz9zOYwxh8lDdnvmMOe/+5cdoEdg==",

     

       797
       797
       +
             "dependencies": [

     

       798
       798
       +
               "delayed-stream"

     

       799
       799
       +
             ]

     

       800
       800
       +
           },

     

       708
       801
        
           "commander@4.1.1": {

     

       709
       802
        
             "integrity": "sha512-NOKm8xhkzAjzFx8B2v5OAHT+u5pRQc2UCa2Vq9jYL/31o2wi9mxBA7LIFs3sV5VSC49z6pEhfbMULvShKj26WA=="

     

       710
       803
        
           },

     
···

       819
       912
        
               "css-tree@2.2.1"

     

       820
       913
        
             ]

     

       821
       914
        
           },

     

       915
       915
       +
           "delayed-stream@1.0.0": {

     

       916
       916
       +
             "integrity": "sha512-ZySD7Nf91aLB0RxL4KGrKHBXl7Eds1DAmEdcoVawXnLD7SDhpNgtuII2aAkg7a7QS41jxPSZ17p4VdGnMHk3MQ=="

     

       917
       917
       +
           },

     

       822
       918
        
           "didyoumean@1.2.2": {

     

       823
       919
        
             "integrity": "sha512-gxtyfqMg7GKyhQmb056K7M3xszy/myH8w+B4RT+QXBQsvAOdc3XymqDDPHx1BgPgsdAA5SIifona89YtRATDzw=="

     

       824
       920
        
           },

     
···

       850
       946
        
               "domhandler"

     

       851
       947
        
             ]

     

       852
       948
        
           },

     

       949
       949
       +
           "dunder-proto@1.0.1": {

     

       950
       950
       +
             "integrity": "sha512-KIN/nDJBQRcXw0MLVhZE9iQHmG68qAVIBg9CqmUYjmQIhgij9U5MFvrqkUL5FbtyyzZuOeOt0zdeRe4UY7ct+A==",

     

       951
       951
       +
             "dependencies": [

     

       952
       952
       +
               "call-bind-apply-helpers",

     

       953
       953
       +
               "es-errors",

     

       954
       954
       +
               "gopd"

     

       955
       955
       +
             ]

     

       956
       956
       +
           },

     

       853
       957
        
           "eastasianwidth@0.2.0": {

     

       854
       958
        
             "integrity": "sha512-I88TYZWc9XiYHRQ4/3c5rjjfgkjhLyW2luGIheGERbNQ6OY7yTybanSpDXZa8y7VUP9YmDcYa+eyq4ca7iLqWA=="

     

       855
       959
        
           },

     
···

       865
       969
        
           "entities@4.5.0": {

     

       866
       970
        
             "integrity": "sha512-V0hjH4dGPh9Ao5p0MoRY6BVqtwCjhz6vI5LT8AJ55H+4g9/4vbHx1I54fS0XuclLhDHArPQCiMjDxjaL8fPxhw=="

     

       867
       971
        
           },

     

       972
       972
       +
           "es-define-property@1.0.1": {

     

       973
       973
       +
             "integrity": "sha512-e3nRfgfUZ4rNGL232gUgX06QNyyez04KdjFrF+LTRoOXmrOgFKDg4BCdsjW8EnT69eqdYGmRpJwiPVYNrCaW3g=="

     

       974
       974
       +
           },

     

       975
       975
       +
           "es-errors@1.3.0": {

     

       976
       976
       +
             "integrity": "sha512-Zf5H2Kxt2xjTvbJvP2ZWLEICxA6j+hAmMzIlypy4xcBg1vKVnx89Wy0GbS+kf5cwCVFFzdCFh2XSCFNULS6csw=="

     

       977
       977
       +
           },

     

       978
       978
       +
           "es-object-atoms@1.1.1": {

     

       979
       979
       +
             "integrity": "sha512-FGgH2h8zKNim9ljj7dankFPcICIK9Cp5bm+c2gQSYePhpaG5+esrLODihIorn+Pe6FGJzWhXQotPv73jTaldXA==",

     

       980
       980
       +
             "dependencies": [

     

       981
       981
       +
               "es-errors"

     

       982
       982
       +
             ]

     

       983
       983
       +
           },

     

       984
       984
       +
           "es-set-tostringtag@2.1.0": {

     

       985
       985
       +
             "integrity": "sha512-j6vWzfrGVfyXxge+O0x5sh6cvxAog0a/4Rdd2K36zCMV5eJ+/+tOAngRO8cODMNWbVRdVlmGZQL2YS3yR8bIUA==",

     

       986
       986
       +
             "dependencies": [

     

       987
       987
       +
               "es-errors",

     

       988
       988
       +
               "get-intrinsic",

     

       989
       989
       +
               "has-tostringtag",

     

       990
       990
       +
               "hasown"

     

       991
       991
       +
             ]

     

       992
       992
       +
           },

     

       868
       993
        
           "esbuild-wasm@0.23.1": {

     

       869
       994
        
             "integrity": "sha512-L3vn7ctvBrtScRfoB0zG1eOCiV4xYvpLYWfe6PDZuV+iDFDm4Mt3xeLIDllG8cDHQ8clUouK3XekulE+cxgkgw==",

     

       870
       995
        
             "bin": true

     
···

       903
       1028
        
           "escalade@3.2.0": {

     

       904
       1029
        
             "integrity": "sha512-WUj2qlxaQtO4g6Pq5c29GTcWGDyd8itL8zTlipgECz3JesAiiOKotd8JU6otB3PACgG6xkJUyVhboMS+bje/jA=="

     

       905
       1030
        
           },

     

       1031
       1031
       +
           "event-target-shim@5.0.1": {

     

       1032
       1032
       +
             "integrity": "sha512-i/2XbnSz/uxRCU6+NdVJgKWDTM427+MqYbkQzD321DuCQJUqOuJKIA0IM2+W2xtYHdKOmZ4dR6fExsd4SXL+WQ=="

     

       1033
       1033
       +
           },

     

       1034
       1034
       +
           "events@3.3.0": {

     

       1035
       1035
       +
             "integrity": "sha512-mQw+2fkQbALzQ7V0MY0IqdnXNOeTtP4r0lN9z7AAawCXgqea7bDii20AYrIBrFd/Hx0M2Ocz6S111CaFkUcb0Q=="

     

       1036
       1036
       +
           },

     

       906
       1037
        
           "fast-glob@3.3.3": {

     

       907
       1038
        
             "integrity": "sha512-7MptL8U0cqcFdzIzwOTHoilX9x5BrNqye7Z/LuC7kCMRio1EMSyqRK3BEAUD7sXRq4iT4AzTVuZdhgQ2TCvYLg==",

     

       908
       1039
        
             "dependencies": [

     
···

       913
       1044
        
               "micromatch"

     

       914
       1045
        
             ]

     

       915
       1046
        
           },

     

       1047
       1047
       +
           "fast-redact@3.5.0": {

     

       1048
       1048
       +
             "integrity": "sha512-dwsoQlS7h9hMeYUq1W++23NDcBLV4KqONnITDV9DjfS3q1SgDGVrBdvvTLUotWtPSD7asWDV9/CmsZPy8Hf70A=="

     

       1049
       1049
       +
           },

     

       916
       1050
        
           "fastq@1.19.1": {

     

       917
       1051
        
             "integrity": "sha512-GwLTyxkCXjXbxqIhTsMI2Nui8huMPtnxg7krajPJAjnEG/iiOS7i+zCtWGZR9G0NBKbXKh6X9m9UIsYX/N6vvQ==",

     

       918
       1052
        
             "dependencies": [

     
···

       928
       1062
        
               "to-regex-range"

     

       929
       1063
        
             ]

     

       930
       1064
        
           },

     

       1065
       1065
       +
           "follow-redirects@1.15.9": {

     

       1066
       1066
       +
             "integrity": "sha512-gew4GsXizNgdoRyqmyfMHyAmXsZDk6mHkSxZFCzW9gwlbtOW44CDtYavM+y+72qD/Vq2l550kMF52DT8fOLJqQ=="

     

       1067
       1067
       +
           },

     

       931
       1068
        
           "foreground-child@3.3.1": {

     

       932
       1069
        
             "integrity": "sha512-gIXjKqtFuWEgzFRJA9WCQeSJLZDjgJUOMCMzxtvFq/37KojM1BFGufqsCy0r4qSQmYLsZYMeyRqzIWOMup03sw==",

     

       933
       1070
        
             "dependencies": [

     
···

       935
       1072
        
               "signal-exit"

     

       936
       1073
        
             ]

     

       937
       1074
        
           },

     

       1075
       1075
       +
           "form-data@4.0.3": {

     

       1076
       1076
       +
             "integrity": "sha512-qsITQPfmvMOSAdeyZ+12I1c+CKSstAFAwu+97zrnWAbIr5u8wfsExUzCesVLC8NgHuRUqNN4Zy6UPWUTRGslcA==",

     

       1077
       1077
       +
             "dependencies": [

     

       1078
       1078
       +
               "asynckit",

     

       1079
       1079
       +
               "combined-stream",

     

       1080
       1080
       +
               "es-set-tostringtag",

     

       1081
       1081
       +
               "hasown",

     

       1082
       1082
       +
               "mime-types"

     

       1083
       1083
       +
             ]

     

       1084
       1084
       +
           },

     

       938
       1085
        
           "fraction.js@4.3.7": {

     

       939
       1086
        
             "integrity": "sha512-ZsDfxO51wGAXREY55a7la9LScWpwv9RxIrYABrlvOFBlH/ShPnrtsXeuUIfXKKOVicNxQ+o8JTbJvjS4M89yew=="

     

       940
       1087
        
           },

     
···

       946
       1093
        
           "function-bind@1.1.2": {

     

       947
       1094
        
             "integrity": "sha512-7XHNxH7qX9xG5mIwxkhumTox/MIRNcOgDrxWsMt2pAr23WHp6MrRlN7FBSFpCpr+oVO0F744iUgR82nJMfG2SA=="

     

       948
       1095
        
           },

     

       1096
       1096
       +
           "get-intrinsic@1.3.0": {

     

       1097
       1097
       +
             "integrity": "sha512-9fSjSaos/fRIVIp+xSJlE6lfwhES7LNtKaCBIamHsjr2na1BiABJPo0mOjjz8GJDURarmCPGqaiVg5mfjb98CQ==",

     

       1098
       1098
       +
             "dependencies": [

     

       1099
       1099
       +
               "call-bind-apply-helpers",

     

       1100
       1100
       +
               "es-define-property",

     

       1101
       1101
       +
               "es-errors",

     

       1102
       1102
       +
               "es-object-atoms",

     

       1103
       1103
       +
               "function-bind",

     

       1104
       1104
       +
               "get-proto",

     

       1105
       1105
       +
               "gopd",

     

       1106
       1106
       +
               "has-symbols",

     

       1107
       1107
       +
               "hasown",

     

       1108
       1108
       +
               "math-intrinsics"

     

       1109
       1109
       +
             ]

     

       1110
       1110
       +
           },

     

       1111
       1111
       +
           "get-proto@1.0.1": {

     

       1112
       1112
       +
             "integrity": "sha512-sTSfBjoXBp89JvIKIefqw7U2CCebsc74kiY6awiGogKtoSGbgjYE/G/+l9sF3MWFPNc9IcoOC4ODfKHfxFmp0g==",

     

       1113
       1113
       +
             "dependencies": [

     

       1114
       1114
       +
               "dunder-proto",

     

       1115
       1115
       +
               "es-object-atoms"

     

       1116
       1116
       +
             ]

     

       1117
       1117
       +
           },

     

       949
       1118
        
           "glob-parent@5.1.2": {

     

       950
       1119
        
             "integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==",

     

       951
       1120
        
             "dependencies": [

     
···

       970
       1139
        
             ],

     

       971
       1140
        
             "bin": true

     

       972
       1141
        
           },

     

       1142
       1142
       +
           "gopd@1.2.0": {

     

       1143
       1143
       +
             "integrity": "sha512-ZUKRh6/kUFoAiTAtTYPZJ3hw9wNxx+BIBOijnlG9PnrJsCcSjs1wyyD6vJpaYtgnzDrKYRSqf3OO6Rfa93xsRg=="

     

       1144
       1144
       +
           },

     

       973
       1145
        
           "graphemer@1.4.0": {

     

       974
       1146
        
             "integrity": "sha512-EtKwoO6kxCL9WO5xipiHTZlSzBm7WLT627TqC/uVRd0HKmq8NXyebnNYxDoBi7wt8eTWrUrKXCOVaFq9x1kgag=="

     

       975
       1147
        
           },

     

       1148
       1148
       +
           "has-symbols@1.1.0": {

     

       1149
       1149
       +
             "integrity": "sha512-1cDNdwJ2Jaohmb3sg4OmKaMBwuC48sYni5HUw2DvsC8LjGTLK9h+eb1X6RyuOHe4hT0ULCW68iomhjUoKUqlPQ=="

     

       1150
       1150
       +
           },

     

       1151
       1151
       +
           "has-tostringtag@1.0.2": {

     

       1152
       1152
       +
             "integrity": "sha512-NqADB8VjPFLM2V0VvHUewwwsw0ZWBaIdgo+ieHtK3hasLz4qeCRjYcqfB6AQrBggRKppKF8L52/VqdVsO47Dlw==",

     

       1153
       1153
       +
             "dependencies": [

     

       1154
       1154
       +
               "has-symbols"

     

       1155
       1155
       +
             ]

     

       1156
       1156
       +
           },

     

       976
       1157
        
           "hasown@2.0.2": {

     

       977
       1158
        
             "integrity": "sha512-0hJU9SCPvmMzIBdZFqNPXWa6dqh7WdH0cII9y+CyS8rG3nL48Bclra9HmKhVVUHyPWNH5Y7xDwAB7bfgSjkUMQ==",

     

       978
       1159
        
             "dependencies": [

     

       979
       1160
        
               "function-bind"

     

       980
       1161
        
             ]

     

       1162
       1162
       +
           },

     

       1163
       1163
       +
           "ieee754@1.2.1": {

     

       1164
       1164
       +
             "integrity": "sha512-dcyqhDvX1C46lXZcVqCpK+FtMRQVdIMN6/Df5js2zouUsqG7I6sFxitIC+7KYK29KdXOLHdu9zL4sFnoVQnqaA=="

     

       981
       1165
        
           },

     

       982
       1166
        
           "ipaddr.js@2.2.0": {

     

       983
       1167
        
             "integrity": "sha512-Ag3wB2o37wslZS19hZqorUnrnzSkpOVy+IiiDEiTqNubEYpYuHWIf6K4psgN2ZWKExS4xhVCrRVfb/wfW8fWJA=="

     
···

       1063
       1247
        
               "preact@10.26.6"

     

       1064
       1248
        
             ]

     

       1065
       1249
        
           },

     

       1250
       1250
       +
           "math-intrinsics@1.1.0": {

     

       1251
       1251
       +
             "integrity": "sha512-/IXtbwEk5HTPyEwyKX6hGkYXxM9nbj64B+ilVJnC/R6B0pH5G4V3b0pVbL7DBj4tkhBAppbQUlf6F6Xl9LHu1g=="

     

       1252
       1252
       +
           },

     

       1066
       1253
        
           "mdn-data@2.0.28": {

     

       1067
       1254
        
             "integrity": "sha512-aylIc7Z9y4yzHYAJNuESG3hfhC+0Ibp/MAMiaOZgNv4pmEdFyfZhhhny4MNiAfWdBQ1RQ2mfDWmM1x8SvGyp8g=="

     

       1068
       1255
        
           },

     
···

       1079
       1266
        
               "picomatch"

     

       1080
       1267
        
             ]

     

       1081
       1268
        
           },

     

       1269
       1269
       +
           "mime-db@1.52.0": {

     

       1270
       1270
       +
             "integrity": "sha512-sPU4uV7dYlvtWJxwwxHD0PuihVNiE7TyAbQ5SWxDCB9mUYvOgroQOwYQQOKPJ8CIbE+1ETVlOoK1UC2nU3gYvg=="

     

       1271
       1271
       +
           },

     

       1272
       1272
       +
           "mime-types@2.1.35": {

     

       1273
       1273
       +
             "integrity": "sha512-ZDY+bPm5zTTF+YpCrAU9nK0UgICYPT0QtT1NZWFv4s++TNkcgVaT0g6+4R2uI4MjQjzysHB1zxuWL50hzaeXiw==",

     

       1274
       1274
       +
             "dependencies": [

     

       1275
       1275
       +
               "mime-db"

     

       1276
       1276
       +
             ]

     

       1277
       1277
       +
           },

     

       1082
       1278
        
           "minimatch@9.0.5": {

     

       1083
       1279
        
             "integrity": "sha512-G6T0ZX48xgozx7587koeX9Ys2NYy6Gmv//P89sEte9V9whIapMNF4idKxnW2QtCcLiTWlb/wfCabAtAFWhhBow==",

     

       1084
       1280
        
             "dependencies": [

     
···

       1127
       1323
        
           "object-hash@3.0.0": {

     

       1128
       1324
        
             "integrity": "sha512-RSn9F68PjH9HqtltsSnqYC1XXoWe9Bju5+213R98cNGttag9q9yAOTzdbsqvIa7aNm5WffBZFpWYr2aWrklWAw=="

     

       1129
       1325
        
           },

     

       1326
       1326
       +
           "on-exit-leak-free@2.1.2": {

     

       1327
       1327
       +
             "integrity": "sha512-0eJJY6hXLGf1udHwfNftBqH+g73EU4B504nZeKpz1sYRKafAghwxEJunB2O7rDZkL4PGfsMVnTXZ2EjibbqcsA=="

     

       1328
       1328
       +
           },

     

       1329
       1329
       +
           "one-webcrypto@1.0.3": {

     

       1330
       1330
       +
             "integrity": "sha512-fu9ywBVBPx0gS9K0etIROTiCkvI5S1TDjFsYFb3rC1ewFxeOqsbzq7aIMBHsYfrTHBcGXJaONXXjTl8B01cW1Q=="

     

       1331
       1331
       +
           },

     

       1130
       1332
        
           "package-json-from-dist@1.0.1": {

     

       1131
       1333
        
             "integrity": "sha512-UEZIS3/by4OC8vL3P2dTXRETpebLI2NiI5vIrjaD/5UtrkFX/tNbwjTSRAGC/+7CAo2pIcBaRgWmcBBHcsaCIw=="

     

       1132
       1334
        
           },

     
···

       1152
       1354
        
           "pify@2.3.0": {

     

       1153
       1355
        
             "integrity": "sha512-udgsAY+fTnvv7kI7aaxbqwWNb0AHiB0qBO89PZKPkoTmGOgdbrHDKD+0B2X4uTfJ/FT1R09r9gTsjUjNJotuog=="

     

       1154
       1356
        
           },

     

       1357
       1357
       +
           "pino-abstract-transport@1.2.0": {

     

       1358
       1358
       +
             "integrity": "sha512-Guhh8EZfPCfH+PMXAb6rKOjGQEoy0xlAIn+irODG5kgfYV+BQ0rGYYWTIel3P5mmyXqkYkPmdIkywsn6QKUR1Q==",

     

       1359
       1359
       +
             "dependencies": [

     

       1360
       1360
       +
               "readable-stream",

     

       1361
       1361
       +
               "split2"

     

       1362
       1362
       +
             ]

     

       1363
       1363
       +
           },

     

       1364
       1364
       +
           "pino-std-serializers@6.2.2": {

     

       1365
       1365
       +
             "integrity": "sha512-cHjPPsE+vhj/tnhCy/wiMh3M3z3h/j15zHQX+S9GkTBgqJuTuJzYJ4gUyACLhDaJ7kk9ba9iRDmbH2tJU03OiA=="

     

       1366
       1366
       +
           },

     

       1367
       1367
       +
           "pino@8.21.0": {

     

       1368
       1368
       +
             "integrity": "sha512-ip4qdzjkAyDDZklUaZkcRFb2iA118H9SgRh8yzTkSQK8HilsOJF7rSY8HoW5+I0M46AZgX/pxbprf2vvzQCE0Q==",

     

       1369
       1369
       +
             "dependencies": [

     

       1370
       1370
       +
               "atomic-sleep",

     

       1371
       1371
       +
               "fast-redact",

     

       1372
       1372
       +
               "on-exit-leak-free",

     

       1373
       1373
       +
               "pino-abstract-transport",

     

       1374
       1374
       +
               "pino-std-serializers",

     

       1375
       1375
       +
               "process-warning",

     

       1376
       1376
       +
               "quick-format-unescaped",

     

       1377
       1377
       +
               "real-require",

     

       1378
       1378
       +
               "safe-stable-stringify",

     

       1379
       1379
       +
               "sonic-boom",

     

       1380
       1380
       +
               "thread-stream"

     

       1381
       1381
       +
             ],

     

       1382
       1382
       +
             "bin": true

     

       1383
       1383
       +
           },

     

       1155
       1384
        
           "pirates@4.0.7": {

     

       1156
       1385
        
             "integrity": "sha512-TfySrs/5nm8fQJDcBDuUng3VOUKsd7S+zqvbOTiGXHfxX4wK31ard+hoNuvkicM/2YFzlpDgABOevKSsB4G/FA=="

     

       1157
       1386
        
           },

     
···

       1451
       1680
        
           "preact@10.26.7": {

     

       1452
       1681
        
             "integrity": "sha512-43xS+QYc1X1IPbw03faSgY6I6OYWcLrJRv3hU0+qMOfh/XCHcP0MX2CVjNARYR2cC/guu975sta4OcjlczxD7g=="

     

       1453
       1682
        
           },

     

       1683
       1683
       +
           "process-warning@3.0.0": {

     

       1684
       1684
       +
             "integrity": "sha512-mqn0kFRl0EoqhnL0GQ0veqFHyIN1yig9RHh/InzORTUiZHFRAur+aMtRkELNwGs9aNwKS6tg/An4NYBPGwvtzQ=="

     

       1685
       1685
       +
           },

     

       1686
       1686
       +
           "process@0.11.10": {

     

       1687
       1687
       +
             "integrity": "sha512-cdGef/drWFoydD1JsMzuFf8100nZl+GT+yacc2bEced5f9Rjk4z+WtFUTBu9PhOi9j/jfmBPu0mMEY4wIdAF8A=="

     

       1688
       1688
       +
           },

     

       1689
       1689
       +
           "proxy-from-env@1.1.0": {

     

       1690
       1690
       +
             "integrity": "sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg=="

     

       1691
       1691
       +
           },

     

       1454
       1692
        
           "psl@1.15.0": {

     

       1455
       1693
        
             "integrity": "sha512-JZd3gMVBAVQkSs6HdNZo9Sdo0LNcQeMNP3CozBJb3JYC/QUYZTnKxP+f8oWRX4rHP5EurWxqAHTSwUCjlNKa1w==",

     

       1456
       1694
        
             "dependencies": [

     
···

       1463
       1701
        
           "queue-microtask@1.2.3": {

     

       1464
       1702
        
             "integrity": "sha512-NuaNSa6flKT5JaSYQzJok04JzTL1CA6aGhv5rfLW3PgqA+M2ChpZQnAC8h8i4ZFkBS8X5RqkDBHA7r4hej3K9A=="

     

       1465
       1703
        
           },

     

       1704
       1704
       +
           "quick-format-unescaped@4.0.4": {

     

       1705
       1705
       +
             "integrity": "sha512-tYC1Q1hgyRuHgloV/YXs2w15unPVh8qfu/qCTfhTYamaw7fyhumKa2yGpdSo87vY32rIclj+4fWYQXUMs9EHvg=="

     

       1706
       1706
       +
           },

     

       1466
       1707
        
           "read-cache@1.0.0": {

     

       1467
       1708
        
             "integrity": "sha512-Owdv/Ft7IjOgm/i0xvNDZ1LrRANRfew4b2prF3OWMQLxLfu3bS8FVhCsrSCMK4lR56Y9ya+AThoTpDCTxCmpRA==",

     

       1468
       1709
        
             "dependencies": [

     

       1469
       1710
        
               "pify"

     

       1470
       1711
        
             ]

     

       1471
       1712
        
           },

     

       1713
       1713
       +
           "readable-stream@4.7.0": {

     

       1714
       1714
       +
             "integrity": "sha512-oIGGmcpTLwPga8Bn6/Z75SVaH1z5dUut2ibSyAMVhmUggWpmDn2dapB0n7f8nwaSiRtepAsfJyfXIO5DCVAODg==",

     

       1715
       1715
       +
             "dependencies": [

     

       1716
       1716
       +
               "abort-controller",

     

       1717
       1717
       +
               "buffer",

     

       1718
       1718
       +
               "events",

     

       1719
       1719
       +
               "process",

     

       1720
       1720
       +
               "string_decoder"

     

       1721
       1721
       +
             ]

     

       1722
       1722
       +
           },

     

       1472
       1723
        
           "readdirp@3.6.0": {

     

       1473
       1724
        
             "integrity": "sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==",

     

       1474
       1725
        
             "dependencies": [

     

       1475
       1726
        
               "picomatch"

     

       1476
       1727
        
             ]

     

       1728
       1728
       +
           },

     

       1729
       1729
       +
           "real-require@0.2.0": {

     

       1730
       1730
       +
             "integrity": "sha512-57frrGM/OCTLqLOAh0mhVA9VBMHd+9U7Zb2THMGdBUoZVOtGbJzjxsYGDJ3A9AYYCP4hn6y1TVbaOfzWtm5GFg=="

     

       1477
       1731
        
           },

     

       1478
       1732
        
           "resolve@1.22.10": {

     

       1479
       1733
        
             "integrity": "sha512-NPRy+/ncIMeDlTAsuqwKIiferiawhefFJtkNSW0qZJEqMEb+qBt/77B/jGeeek+F0uOeN05CDa6HXbbIgtVX4w==",

     
···

       1493
       1747
        
               "queue-microtask"

     

       1494
       1748
        
             ]

     

       1495
       1749
        
           },

     

       1750
       1750
       +
           "safe-buffer@5.2.1": {

     

       1751
       1751
       +
             "integrity": "sha512-rp3So07KcdmmKbGvgaNxQSJr7bGVSVk5S9Eq1F+ppbRo70+YeaDxkw5Dd8NPN+GD6bjnYm2VuPuCXmpuYvmCXQ=="

     

       1752
       1752
       +
           },

     

       1753
       1753
       +
           "safe-stable-stringify@2.5.0": {

     

       1754
       1754
       +
             "integrity": "sha512-b3rppTKm9T+PsVCBEOUR46GWI7fdOs00VKZ1+9c1EWDaDMvjQc6tUwuFyIprgGgTcWoVHSKrU8H31ZHA2e0RHA=="

     

       1755
       1755
       +
           },

     

       1496
       1756
        
           "shebang-command@2.0.0": {

     

       1497
       1757
        
             "integrity": "sha512-kHxr2zZpYtdmrN1qDjrrX/Z1rR1kG8Dx+gkpK1G4eXmvXswmcE1hTWBWYUzlraYw1/yZp6YuDY77YtvbN0dmDA==",

     

       1498
       1758
        
             "dependencies": [

     
···

       1504
       1764
        
           },

     

       1505
       1765
        
           "signal-exit@4.1.0": {

     

       1506
       1766
        
             "integrity": "sha512-bzyZ1e88w9O1iNJbKnOlvYTrWPDl46O1bG0D3XInv+9tkPrxrN8jUUTiFlDkkmKWgn1M6CfIA13SuGqOa9Korw=="

     

       1767
       1767
       +
           },

     

       1768
       1768
       +
           "sonic-boom@3.8.1": {

     

       1769
       1769
       +
             "integrity": "sha512-y4Z8LCDBuum+PBP3lSV7RHrXscqksve/bi0as7mhwVnBW+/wUqKT/2Kb7um8yqcFy0duYbbPxzt89Zy2nOCaxg==",

     

       1770
       1770
       +
             "dependencies": [

     

       1771
       1771
       +
               "atomic-sleep"

     

       1772
       1772
       +
             ]

     

       1507
       1773
        
           },

     

       1508
       1774
        
           "source-map-js@1.2.1": {

     

       1509
       1775
        
             "integrity": "sha512-UXWMKhLOwVKb728IUtQPXxfYU+usdybtUrK/8uGE8CQMvrhOpwvzDBwj0QhSL7MQc7vIsISBG8VQ8+IDQxpfQA=="

     

       1510
       1776
        
           },

     

       1777
       1777
       +
           "split2@4.2.0": {

     

       1778
       1778
       +
             "integrity": "sha512-UcjcJOWknrNkF6PLX83qcHM6KHgVKNkV62Y8a5uYDVv9ydGQVwAHMKqHdJje1VTWpljG0WYpCDhrCdAOYH4TWg=="

     

       1779
       1779
       +
           },

     

       1511
       1780
        
           "string-width@4.2.3": {

     

       1512
       1781
        
             "integrity": "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==",

     

       1513
       1782
        
             "dependencies": [

     
···

       1522
       1791
        
               "eastasianwidth",

     

       1523
       1792
        
               "emoji-regex@9.2.2",

     

       1524
       1793
        
               "strip-ansi@7.1.0"

     

       1794
       1794
       +
             ]

     

       1795
       1795
       +
           },

     

       1796
       1796
       +
           "string_decoder@1.3.0": {

     

       1797
       1797
       +
             "integrity": "sha512-hkRX8U1WjJFd8LsDJ2yQ/wWWxaopEsABU1XfkM8A+j0+85JAGppt16cr1Whg6KIbb4okU6Mql6BOj+uup/wKeA==",

     

       1798
       1798
       +
             "dependencies": [

     

       1799
       1799
       +
               "safe-buffer"

     

       1525
       1800
        
             ]

     

       1526
       1801
        
           },

     

       1527
       1802
        
           "strip-ansi@6.0.1": {

     
···

       1613
       1888
        
               "any-promise"

     

       1614
       1889
        
             ]

     

       1615
       1890
        
           },

     

       1891
       1891
       +
           "thread-stream@2.7.0": {

     

       1892
       1892
       +
             "integrity": "sha512-qQiRWsU/wvNolI6tbbCKd9iKaTnCXsTwVxhhKM6nctPdujTyztjlbUkUTUymidWcMnZ5pWR0ej4a0tjsW021vw==",

     

       1893
       1893
       +
             "dependencies": [

     

       1894
       1894
       +
               "real-require"

     

       1895
       1895
       +
             ]

     

       1896
       1896
       +
           },

     

       1616
       1897
        
           "tlds@1.258.0": {

     

       1617
       1898
        
             "integrity": "sha512-XGhStWuOlBA5D8QnyN2xtgB2cUOdJ3ztisne1DYVWMcVH29qh8eQIpRmP3HnuJLdgyzG0HpdGzRMu1lm/Oictw==",

     

       1618
       1899
        
             "bin": true

     
···

       1709
       1990
        
             "jsr:@fresh/plugin-tailwind@^0.0.1-alpha.7",

     

       1710
       1991
        
             "jsr:@knotbin/posthog-fresh@~0.1.3",

     

       1711
       1992
        
             "npm:@atproto/api@~0.15.6",

     

       1993
       1993
       +
             "npm:@atproto/crypto@~0.4.4",

     

       1994
       1994
       +
             "npm:@did-plc/lib@^0.0.4",

     

       1712
       1995
        
             "npm:@preact/signals@^2.0.4",

     

       1713
       1996
        
             "npm:posthog-js@1.120.0",

     

       1714
       1997
        
             "npm:preact@^10.26.6",

islands/CredLogin.tsx

···

       1
       1
        
       import { useState } from "preact/hooks";

     

       2
       2
        
       import { JSX } from "preact";

     

       3
       3
        
       

     

       4
       4
       +
       /**

     

       5
       5
       +
        * The credential login form.

     

       6
       6
       +
        * @returns The credential login form

     

       7
       7
       +
        * @component

     

       8
       8
       +
        */

     

       4
       9
        
       export default function CredLogin() {

     

       5
       10
        
         const [handle, setHandle] = useState("");

     

       6
       11
        
         const [password, setPassword] = useState("");

+1134

islands/DidPlcProgress.tsx

···

       1
       1
       +
       import { useState } from "preact/hooks";

     

       2
       2
       +
       import { Link } from "../components/Link.tsx";

     

       3
       3
       +
       

     

       4
       4
       +
       interface PlcUpdateStep {

     

       5
       5
       +
         name: string;

     

       6
       6
       +
         status: "pending" | "in-progress" | "verifying" | "completed" | "error";

     

       7
       7
       +
         error?: string;

     

       8
       8
       +
       }

     

       9
       9
       +
       

     

       10
       10
       +
       interface KeyJson {

     

       11
       11
       +
         publicKeyDid: string;

     

       12
       12
       +
         [key: string]: unknown;

     

       13
       13
       +
       }

     

       14
       14
       +
       

     

       15
       15
       +
       // Content chunks for the description

     

       16
       16
       +
       const contentChunks = [

     

       17
       17
       +
         {

     

       18
       18
       +
           title: "Welcome to Key Management",

     

       19
       19
       +
           subtitle: "BOARDING PASS - SECTION A",

     

       20
       20
       +
           content: (

     

       21
       21
       +
             <>

     

       22
       22
       +
               <div class="passenger-info text-slate-600 dark:text-slate-300 font-mono text-sm mb-4">

     

       23
       23
       +
                 GATE: KEY-01 • SEAT: DID-1A

     

       24
       24
       +
               </div>

     

       25
       25
       +
               <p class="text-slate-700 dark:text-slate-300 mb-4">

     

       26
       26
       +
                 This tool helps you add a new rotation key to your{" "}

     

       27
       27
       +
                 <Link

     

       28
       28
       +
                   href="https://web.plc.directory/"

     

       29
       29
       +
                   isExternal

     

       30
       30
       +
                   class="text-blue-600 dark:text-blue-400"

     

       31
       31
       +
                 >

     

       32
       32
       +
                   PLC (Public Ledger of Credentials)

     

       33
       33
       +
                 </Link>

     

       34
       34
       +
                 . Having control of a rotation key gives you sovereignty over your DID

     

       35
       35
       +
                 (Decentralized Identifier).

     

       36
       36
       +
               </p>

     

       37
       37
       +
             </>

     

       38
       38
       +
           ),

     

       39
       39
       +
         },

     

       40
       40
       +
         {

     

       41
       41
       +
           title: "Key Benefits",

     

       42
       42
       +
           subtitle: "BOARDING PASS - SECTION B",

     

       43
       43
       +
           content: (

     

       44
       44
       +
             <>

     

       45
       45
       +
               <div class="passenger-info text-slate-600 dark:text-slate-300 font-mono text-sm mb-4">

     

       46
       46
       +
                 GATE: KEY-02 • SEAT: DID-1B

     

       47
       47
       +
               </div>

     

       48
       48
       +
               <div class="space-y-4">

     

       49
       49
       +
                 <div class="p-3 bg-white dark:bg-slate-800 rounded-lg border border-slate-200 dark:border-slate-700">

     

       50
       50
       +
                   <h4 class="font-mono font-bold text-amber-500 dark:text-amber-400 mb-2">

     

       51
       51
       +
                     PROVIDER MOBILITY ✈️

     

       52
       52
       +
                   </h4>

     

       53
       53
       +
                   <p class="text-slate-700 dark:text-slate-300">

     

       54
       54
       +
                     Change your PDS without losing your identity, protecting you if

     

       55
       55
       +
                     your provider becomes hostile.

     

       56
       56
       +
                   </p>

     

       57
       57
       +
                 </div>

     

       58
       58
       +
                 <div class="p-3 bg-white dark:bg-slate-800 rounded-lg border border-slate-200 dark:border-slate-700">

     

       59
       59
       +
                   <h4 class="font-mono font-bold text-amber-500 dark:text-amber-400 mb-2">

     

       60
       60
       +
                     IDENTITY CONTROL ✨

     

       61
       61
       +
                   </h4>

     

       62
       62
       +
                   <p class="text-slate-700 dark:text-slate-300">

     

       63
       63
       +
                     Modify your DID document independently of your provider.

     

       64
       64
       +
                   </p>

     

       65
       65
       +
                 </div>

     

       66
       66
       +
                 <div class="p-3 bg-white dark:bg-slate-800 rounded-lg border border-slate-200 dark:border-slate-700">

     

       67
       67
       +
                   <p class="text-slate-700 dark:text-slate-300">

     

       68
       68
       +
                     💡 It's good practice to have a rotation key so you can move to a

     

       69
       69
       +
                     different provider if you need to.

     

       70
       70
       +
                   </p>

     

       71
       71
       +
                 </div>

     

       72
       72
       +
               </div>

     

       73
       73
       +
             </>

     

       74
       74
       +
           ),

     

       75
       75
       +
         },

     

       76
       76
       +
         {

     

       77
       77
       +
           title: "⚠️ CRITICAL SECURITY WARNING",

     

       78
       78
       +
           subtitle: "BOARDING PASS - SECTION C",

     

       79
       79
       +
           content: (

     

       80
       80
       +
             <>

     

       81
       81
       +
               <div class="passenger-info text-slate-600 dark:text-slate-300 font-mono text-sm mb-4">

     

       82
       82
       +
                 GATE: KEY-03 • SEAT: DID-1C

     

       83
       83
       +
               </div>

     

       84
       84
       +
               <div class="p-4 bg-red-50 dark:bg-red-900 rounded-lg border-2 border-red-500 dark:border-red-700 mb-4">

     

       85
       85
       +
                 <div class="flex items-center mb-3">

     

       86
       86
       +
                   <span class="text-2xl mr-2">⚠️</span>

     

       87
       87
       +
                   <h4 class="font-mono font-bold text-red-700 dark:text-red-400 text-lg">

     

       88
       88
       +
                     NON-REVOCABLE KEY WARNING

     

       89
       89
       +
                   </h4>

     

       90
       90
       +
                 </div>

     

       91
       91
       +
                 <div class="space-y-3 text-red-700 dark:text-red-300">

     

       92
       92
       +
                   <p class="font-bold">

     

       93
       93
       +
                     This rotation key CANNOT BE DISABLED OR DELETED once added:

     

       94
       94
       +
                   </p>

     

       95
       95
       +
                   <ul class="list-disc pl-5 space-y-2">

     

       96
       96
       +
                     <li>

     

       97
       97
       +
                       If compromised, the attacker can take complete control of your

     

       98
       98
       +
                       account and identity

     

       99
       99
       +
                     </li>

     

       100
       100
       +
                     <li>

     

       101
       101
       +
                       Malicious actors with this key have COMPLETE CONTROL of your

     

       102
       102
       +
                       account and identity

     

       103
       103
       +
                     </li>

     

       104
       104
       +
                     <li>

     

       105
       105
       +
                       Store securely, like a password (e.g. <strong>DO NOT</strong>

     

       106
       106
       +
                       {" "}

     

       107
       107
       +
                       keep it in Notes or any easily accessible app on an unlocked

     

       108
       108
       +
                       device).

     

       109
       109
       +
                     </li>

     

       110
       110
       +
                   </ul>

     

       111
       111
       +
                 </div>

     

       112
       112
       +
               </div>

     

       113
       113
       +
               <div class="p-3 bg-white dark:bg-slate-800 rounded-lg border border-slate-200 dark:border-slate-700">

     

       114
       114
       +
                 <p class="text-slate-700 dark:text-slate-300">

     

       115
       115
       +
                   💡 We recommend adding a custom rotation key but recommend{" "}

     

       116
       116
       +
                   <strong class="italic">against</strong>{" "}

     

       117
       117
       +
                   having more than one custom rotation key, as more than one increases

     

       118
       118
       +
                   risk.

     

       119
       119
       +
                 </p>

     

       120
       120
       +
               </div>

     

       121
       121
       +
             </>

     

       122
       122
       +
           ),

     

       123
       123
       +
         },

     

       124
       124
       +
         {

     

       125
       125
       +
           title: "Technical Overview",

     

       126
       126
       +
           subtitle: "BOARDING PASS - SECTION C",

     

       127
       127
       +
           content: (

     

       128
       128
       +
             <>

     

       129
       129
       +
               <div class="passenger-info text-slate-600 dark:text-slate-300 font-mono text-sm mb-4">

     

       130
       130
       +
                 GATE: KEY-03 • SEAT: DID-1C

     

       131
       131
       +
               </div>

     

       132
       132
       +
               <div class="p-4 bg-white dark:bg-slate-800 rounded-lg border border-slate-200 dark:border-slate-700">

     

       133
       133
       +
                 <div class="flex items-center mb-3">

     

       134
       134
       +
                   <span class="text-lg mr-2">📝</span>

     

       135
       135
       +
                   <h4 class="font-mono font-bold text-amber-500 dark:text-amber-400">

     

       136
       136
       +
                     TECHNICAL DETAILS

     

       137
       137
       +
                   </h4>

     

       138
       138
       +
                 </div>

     

       139
       139
       +
                 <p class="text-slate-700 dark:text-slate-300">

     

       140
       140
       +
                   The rotation key is a did:key that will be added to your PLC

     

       141
       141
       +
                   document's rotationKeys array. This process uses the AT Protocol's

     

       142
       142
       +
                   PLC operations to update your DID document.

     

       143
       143
       +
                   <Link

     

       144
       144
       +
                     href="https://web.plc.directory/"

     

       145
       145
       +
                     class="block ml-1 text-blue-600 dark:text-blue-400"

     

       146
       146
       +
                     isExternal

     

       147
       147
       +
                   >

     

       148
       148
       +
                     Learn more about did:plc

     

       149
       149
       +
                   </Link>

     

       150
       150
       +
                 </p>

     

       151
       151
       +
               </div>

     

       152
       152
       +
             </>

     

       153
       153
       +
           ),

     

       154
       154
       +
         },

     

       155
       155
       +
       ];

     

       156
       156
       +
       

     

       157
       157
       +
       export default function PlcUpdateProgress() {

     

       158
       158
       +
         const [hasStarted, setHasStarted] = useState(false);

     

       159
       159
       +
         const [currentChunkIndex, setCurrentChunkIndex] = useState(0);

     

       160
       160
       +
         const [steps, setSteps] = useState<PlcUpdateStep[]>([

     

       161
       161
       +
           { name: "Generate Rotation Key", status: "pending" },

     

       162
       162
       +
           { name: "Start PLC update", status: "pending" },

     

       163
       163
       +
           { name: "Complete PLC update", status: "pending" },

     

       164
       164
       +
         ]);

     

       165
       165
       +
         const [generatedKey, setGeneratedKey] = useState<string>("");

     

       166
       166
       +
         const [keyJson, setKeyJson] = useState<KeyJson | null>(null);

     

       167
       167
       +
         const [emailToken, setEmailToken] = useState<string>("");

     

       168
       168
       +
         const [hasDownloadedKey, setHasDownloadedKey] = useState(false);

     

       169
       169
       +
         const [downloadedKeyId, setDownloadedKeyId] = useState<string | null>(null);

     

       170
       170
       +
       

     

       171
       171
       +
         const updateStepStatus = (

     

       172
       172
       +
           index: number,

     

       173
       173
       +
           status: PlcUpdateStep["status"],

     

       174
       174
       +
           error?: string,

     

       175
       175
       +
         ) => {

     

       176
       176
       +
           console.log(

     

       177
       177
       +
             `Updating step ${index} to ${status}${

     

       178
       178
       +
               error ? ` with error: ${error}` : ""

     

       179
       179
       +
             }`,

     

       180
       180
       +
           );

     

       181
       181
       +
           setSteps((prevSteps) =>

     

       182
       182
       +
             prevSteps.map((step, i) =>

     

       183
       183
       +
               i === index

     

       184
       184
       +
                 ? { ...step, status, error }

     

       185
       185
       +
                 : i > index

     

       186
       186
       +
                 ? { ...step, status: "pending", error: undefined }

     

       187
       187
       +
                 : step

     

       188
       188
       +
             )

     

       189
       189
       +
           );

     

       190
       190
       +
         };

     

       191
       191
       +
       

     

       192
       192
       +
         const handleStart = () => {

     

       193
       193
       +
           setHasStarted(true);

     

       194
       194
       +
           // Automatically start the first step

     

       195
       195
       +
           setTimeout(() => {

     

       196
       196
       +
             handleGenerateKey();

     

       197
       197
       +
           }, 100);

     

       198
       198
       +
         };

     

       199
       199
       +
       

     

       200
       200
       +
         const getStepDisplayName = (step: PlcUpdateStep, index: number) => {

     

       201
       201
       +
           if (step.status === "completed") {

     

       202
       202
       +
             switch (index) {

     

       203
       203
       +
               case 0:

     

       204
       204
       +
                 return "Rotation Key Generated";

     

       205
       205
       +
               case 1:

     

       206
       206
       +
                 return "PLC Operation Requested";

     

       207
       207
       +
               case 2:

     

       208
       208
       +
                 return "PLC Update Completed";

     

       209
       209
       +
             }

     

       210
       210
       +
           }

     

       211
       211
       +
       

     

       212
       212
       +
           if (step.status === "in-progress") {

     

       213
       213
       +
             switch (index) {

     

       214
       214
       +
               case 0:

     

       215
       215
       +
                 return "Generating Rotation Key...";

     

       216
       216
       +
               case 1:

     

       217
       217
       +
                 return "Requesting PLC Operation Token...";

     

       218
       218
       +
               case 2:

     

       219
       219
       +
                 return step.name ===

     

       220
       220
       +
                     "Enter the code sent to your email to complete PLC update"

     

       221
       221
       +
                   ? step.name

     

       222
       222
       +
                   : "Completing PLC Update...";

     

       223
       223
       +
             }

     

       224
       224
       +
           }

     

       225
       225
       +
       

     

       226
       226
       +
           if (step.status === "verifying") {

     

       227
       227
       +
             switch (index) {

     

       228
       228
       +
               case 0:

     

       229
       229
       +
                 return "Verifying Rotation Key Generation...";

     

       230
       230
       +
               case 1:

     

       231
       231
       +
                 return "Verifying PLC Operation Token Request...";

     

       232
       232
       +
               case 2:

     

       233
       233
       +
                 return "Verifying PLC Update Completion...";

     

       234
       234
       +
             }

     

       235
       235
       +
           }

     

       236
       236
       +
       

     

       237
       237
       +
           return step.name;

     

       238
       238
       +
         };

     

       239
       239
       +
       

     

       240
       240
       +
         const handleStartPlcUpdate = async (keyToUse?: string) => {

     

       241
       241
       +
           const key = keyToUse || generatedKey;

     

       242
       242
       +
       

     

       243
       243
       +
           // Debug logging

     

       244
       244
       +
           console.log("=== PLC Update Debug ===");

     

       245
       245
       +
           console.log("Current state:", {

     

       246
       246
       +
             keyToUse,

     

       247
       247
       +
             generatedKey,

     

       248
       248
       +
             key,

     

       249
       249
       +
             hasKeyJson: !!keyJson,

     

       250
       250
       +
             keyJsonId: keyJson?.publicKeyDid,

     

       251
       251
       +
             hasDownloadedKey,

     

       252
       252
       +
             downloadedKeyId,

     

       253
       253
       +
             steps: steps.map((s) => ({ name: s.name, status: s.status })),

     

       254
       254
       +
           });

     

       255
       255
       +
       

     

       256
       256
       +
           if (!key) {

     

       257
       257
       +
             console.log("No key generated yet");

     

       258
       258
       +
             updateStepStatus(1, "error", "No key generated yet");

     

       259
       259
       +
             return;

     

       260
       260
       +
           }

     

       261
       261
       +
       

     

       262
       262
       +
           if (!keyJson || keyJson.publicKeyDid !== key) {

     

       263
       263
       +
             console.log("Key mismatch or missing:", {

     

       264
       264
       +
               hasKeyJson: !!keyJson,

     

       265
       265
       +
               keyJsonId: keyJson?.publicKeyDid,

     

       266
       266
       +
               expectedKey: key,

     

       267
       267
       +
             });

     

       268
       268
       +
             updateStepStatus(

     

       269
       269
       +
               1,

     

       270
       270
       +
               "error",

     

       271
       271
       +
               "Please ensure you have the correct key loaded",

     

       272
       272
       +
             );

     

       273
       273
       +
             return;

     

       274
       274
       +
           }

     

       275
       275
       +
       

     

       276
       276
       +
           updateStepStatus(1, "in-progress");

     

       277
       277
       +
           try {

     

       278
       278
       +
             // First request the token

     

       279
       279
       +
             console.log("Requesting PLC token...");

     

       280
       280
       +
             const tokenRes = await fetch("/api/plc/token", {

     

       281
       281
       +
               method: "GET",

     

       282
       282
       +
             });

     

       283
       283
       +
             const tokenText = await tokenRes.text();

     

       284
       284
       +
             console.log("Token response:", tokenText);

     

       285
       285
       +
       

     

       286
       286
       +
             if (!tokenRes.ok) {

     

       287
       287
       +
               try {

     

       288
       288
       +
                 const json = JSON.parse(tokenText);

     

       289
       289
       +
                 throw new Error(json.message || "Failed to request PLC token");

     

       290
       290
       +
               } catch {

     

       291
       291
       +
                 throw new Error(tokenText || "Failed to request PLC token");

     

       292
       292
       +
               }

     

       293
       293
       +
             }

     

       294
       294
       +
       

     

       295
       295
       +
             let data;

     

       296
       296
       +
             try {

     

       297
       297
       +
               data = JSON.parse(tokenText);

     

       298
       298
       +
               if (!data.success) {

     

       299
       299
       +
                 throw new Error(data.message || "Failed to request token");

     

       300
       300
       +
               }

     

       301
       301
       +
             } catch {

     

       302
       302
       +
               throw new Error("Invalid response from server");

     

       303
       303
       +
             }

     

       304
       304
       +
       

     

       305
       305
       +
             console.log("Token request successful, updating UI...");

     

       306
       306
       +
             // Update step name to prompt for token

     

       307
       307
       +
             setSteps((prevSteps) =>

     

       308
       308
       +
               prevSteps.map((step, i) =>

     

       309
       309
       +
                 i === 1

     

       310
       310
       +
                   ? {

     

       311
       311
       +
                     ...step,

     

       312
       312
       +
                     name: "Enter the code sent to your email to complete PLC update",

     

       313
       313
       +
                     status: "in-progress",

     

       314
       314
       +
                   }

     

       315
       315
       +
                   : step

     

       316
       316
       +
               )

     

       317
       317
       +
             );

     

       318
       318
       +
           } catch (error) {

     

       319
       319
       +
             console.error("Token request failed:", error);

     

       320
       320
       +
             updateStepStatus(

     

       321
       321
       +
               1,

     

       322
       322
       +
               "error",

     

       323
       323
       +
               error instanceof Error ? error.message : String(error),

     

       324
       324
       +
             );

     

       325
       325
       +
           }

     

       326
       326
       +
         };

     

       327
       327
       +
       

     

       328
       328
       +
         const handleTokenSubmit = async () => {

     

       329
       329
       +
           console.log("=== Token Submit Debug ===");

     

       330
       330
       +
           console.log("Current state:", {

     

       331
       331
       +
             emailToken,

     

       332
       332
       +
             generatedKey,

     

       333
       333
       +
             keyJsonId: keyJson?.publicKeyDid,

     

       334
       334
       +
             steps: steps.map((s) => ({ name: s.name, status: s.status })),

     

       335
       335
       +
           });

     

       336
       336
       +
       

     

       337
       337
       +
           if (!emailToken) {

     

       338
       338
       +
             console.log("No token provided");

     

       339
       339
       +
             updateStepStatus(1, "error", "Please enter the email token");

     

       340
       340
       +
             return;

     

       341
       341
       +
           }

     

       342
       342
       +
       

     

       343
       343
       +
           if (!keyJson || !keyJson.publicKeyDid) {

     

       344
       344
       +
             console.log("Missing key data");

     

       345
       345
       +
             updateStepStatus(1, "error", "Key data is missing, please try again");

     

       346
       346
       +
             return;

     

       347
       347
       +
           }

     

       348
       348
       +
       

     

       349
       349
       +
           // Prevent duplicate submissions

     

       350
       350
       +
           if (steps[1].status === "completed" || steps[2].status === "completed") {

     

       351
       351
       +
             console.log("Update already completed, preventing duplicate submission");

     

       352
       352
       +
             return;

     

       353
       353
       +
           }

     

       354
       354
       +
       

     

       355
       355
       +
           updateStepStatus(1, "completed");

     

       356
       356
       +
           try {

     

       357
       357
       +
             updateStepStatus(2, "in-progress");

     

       358
       358
       +
             console.log("Submitting update request with token...");

     

       359
       359
       +
             // Send the update request with both key and token

     

       360
       360
       +
             const res = await fetch("/api/plc/update", {

     

       361
       361
       +
               method: "POST",

     

       362
       362
       +
               headers: { "Content-Type": "application/json" },

     

       363
       363
       +
               body: JSON.stringify({

     

       364
       364
       +
                 key: keyJson.publicKeyDid,

     

       365
       365
       +
                 token: emailToken,

     

       366
       366
       +
               }),

     

       367
       367
       +
             });

     

       368
       368
       +
             const text = await res.text();

     

       369
       369
       +
             console.log("Update response:", text);

     

       370
       370
       +
       

     

       371
       371
       +
             let data;

     

       372
       372
       +
             try {

     

       373
       373
       +
               data = JSON.parse(text);

     

       374
       374
       +
             } catch {

     

       375
       375
       +
               throw new Error("Invalid response from server");

     

       376
       376
       +
             }

     

       377
       377
       +
       

     

       378
       378
       +
             // Check for error responses

     

       379
       379
       +
             if (!res.ok || !data.success) {

     

       380
       380
       +
               const errorMessage = data.message || "Failed to complete PLC update";

     

       381
       381
       +
               console.error("Update failed:", errorMessage);

     

       382
       382
       +
               throw new Error(errorMessage);

     

       383
       383
       +
             }

     

       384
       384
       +
       

     

       385
       385
       +
             // Only proceed if we have a successful response

     

       386
       386
       +
             console.log("Update completed successfully!");

     

       387
       387
       +
       

     

       388
       388
       +
             // Add a delay before marking steps as completed for better UX

     

       389
       389
       +
             updateStepStatus(2, "verifying");

     

       390
       390
       +
       

     

       391
       391
       +
             const verifyRes = await fetch("/api/plc/verify", {

     

       392
       392
       +
               method: "POST",

     

       393
       393
       +
               headers: { "Content-Type": "application/json" },

     

       394
       394
       +
               body: JSON.stringify({

     

       395
       395
       +
                 key: keyJson.publicKeyDid,

     

       396
       396
       +
               }),

     

       397
       397
       +
             });

     

       398
       398
       +
       

     

       399
       399
       +
             const verifyText = await verifyRes.text();

     

       400
       400
       +
             console.log("Verification response:", verifyText);

     

       401
       401
       +
       

     

       402
       402
       +
             let verifyData;

     

       403
       403
       +
             try {

     

       404
       404
       +
               verifyData = JSON.parse(verifyText);

     

       405
       405
       +
             } catch {

     

       406
       406
       +
               throw new Error("Invalid verification response from server");

     

       407
       407
       +
             }

     

       408
       408
       +
       

     

       409
       409
       +
             if (!verifyRes.ok || !verifyData.success) {

     

       410
       410
       +
               const errorMessage = verifyData.message ||

     

       411
       411
       +
                 "Failed to verify PLC update";

     

       412
       412
       +
               console.error("Verification failed:", errorMessage);

     

       413
       413
       +
               throw new Error(errorMessage);

     

       414
       414
       +
             }

     

       415
       415
       +
       

     

       416
       416
       +
             console.log("Verification successful, marking steps as completed");

     

       417
       417
       +
             updateStepStatus(2, "completed");

     

       418
       418
       +
           } catch (error) {

     

       419
       419
       +
             console.error("Update failed:", error);

     

       420
       420
       +
             // Reset the steps to error state

     

       421
       421
       +
             updateStepStatus(

     

       422
       422
       +
               1,

     

       423
       423
       +
               "error",

     

       424
       424
       +
               error instanceof Error ? error.message : String(error),

     

       425
       425
       +
             );

     

       426
       426
       +
             updateStepStatus(2, "pending"); // Reset the final step

     

       427
       427
       +
       

     

       428
       428
       +
             // If token is invalid, we should clear it so user can try again

     

       429
       429
       +
             if (

     

       430
       430
       +
               error instanceof Error &&

     

       431
       431
       +
               error.message.toLowerCase().includes("token is invalid")

     

       432
       432
       +
             ) {

     

       433
       433
       +
               setEmailToken("");

     

       434
       434
       +
             }

     

       435
       435
       +
           }

     

       436
       436
       +
         };

     

       437
       437
       +
       

     

       438
       438
       +
         const handleDownload = () => {

     

       439
       439
       +
           console.log("=== Download Debug ===");

     

       440
       440
       +
           console.log("Download started with:", {

     

       441
       441
       +
             hasKeyJson: !!keyJson,

     

       442
       442
       +
             keyJsonId: keyJson?.publicKeyDid,

     

       443
       443
       +
           });

     

       444
       444
       +
       

     

       445
       445
       +
           if (!keyJson) {

     

       446
       446
       +
             console.error("No key JSON to download");

     

       447
       447
       +
             return;

     

       448
       448
       +
           }

     

       449
       449
       +
       

     

       450
       450
       +
           try {

     

       451
       451
       +
             const jsonString = JSON.stringify(keyJson, null, 2);

     

       452
       452
       +
             const blob = new Blob([jsonString], {

     

       453
       453
       +
               type: "application/json",

     

       454
       454
       +
             });

     

       455
       455
       +
             const url = URL.createObjectURL(blob);

     

       456
       456
       +
             const a = document.createElement("a");

     

       457
       457
       +
             a.href = url;

     

       458
       458
       +
             a.download = `plc-key-${keyJson.publicKeyDid || "unknown"}.json`;

     

       459
       459
       +
             a.style.display = "none";

     

       460
       460
       +
             document.body.appendChild(a);

     

       461
       461
       +
             a.click();

     

       462
       462
       +
             document.body.removeChild(a);

     

       463
       463
       +
             URL.revokeObjectURL(url);

     

       464
       464
       +
       

     

       465
       465
       +
             console.log("Download completed, proceeding to next step...");

     

       466
       466
       +
             setHasDownloadedKey(true);

     

       467
       467
       +
             setDownloadedKeyId(keyJson.publicKeyDid);

     

       468
       468
       +
       

     

       469
       469
       +
             // Automatically proceed to the next step after successful download

     

       470
       470
       +
             setTimeout(() => {

     

       471
       471
       +
               console.log("Auto-proceeding with key:", keyJson.publicKeyDid);

     

       472
       472
       +
               handleStartPlcUpdate(keyJson.publicKeyDid);

     

       473
       473
       +
             }, 1000);

     

       474
       474
       +
           } catch (error) {

     

       475
       475
       +
             console.error("Download failed:", error);

     

       476
       476
       +
           }

     

       477
       477
       +
         };

     

       478
       478
       +
       

     

       479
       479
       +
         const handleGenerateKey = async () => {

     

       480
       480
       +
           console.log("=== Generate Key Debug ===");

     

       481
       481
       +
           updateStepStatus(0, "in-progress");

     

       482
       482
       +
           setKeyJson(null);

     

       483
       483
       +
           setGeneratedKey("");

     

       484
       484
       +
           setHasDownloadedKey(false);

     

       485
       485
       +
           setDownloadedKeyId(null);

     

       486
       486
       +
       

     

       487
       487
       +
           try {

     

       488
       488
       +
             console.log("Requesting new key...");

     

       489
       489
       +
             const res = await fetch("/api/plc/keys");

     

       490
       490
       +
             const text = await res.text();

     

       491
       491
       +
             console.log("Key generation response:", text);

     

       492
       492
       +
       

     

       493
       493
       +
             if (!res.ok) {

     

       494
       494
       +
               try {

     

       495
       495
       +
                 const json = JSON.parse(text);

     

       496
       496
       +
                 throw new Error(json.message || "Failed to generate key");

     

       497
       497
       +
               } catch {

     

       498
       498
       +
                 throw new Error(text || "Failed to generate key");

     

       499
       499
       +
               }

     

       500
       500
       +
             }

     

       501
       501
       +
       

     

       502
       502
       +
             let data;

     

       503
       503
       +
             try {

     

       504
       504
       +
               data = JSON.parse(text);

     

       505
       505
       +
             } catch {

     

       506
       506
       +
               throw new Error("Invalid response from /api/plc/keys");

     

       507
       507
       +
             }

     

       508
       508
       +
       

     

       509
       509
       +
             if (!data.publicKeyDid || !data.privateKeyHex) {

     

       510
       510
       +
               throw new Error("Key generation failed: missing key data");

     

       511
       511
       +
             }

     

       512
       512
       +
       

     

       513
       513
       +
             console.log("Key generated successfully:", {

     

       514
       514
       +
               keyId: data.publicKeyDid,

     

       515
       515
       +
             });

     

       516
       516
       +
       

     

       517
       517
       +
             setGeneratedKey(data.publicKeyDid);

     

       518
       518
       +
             setKeyJson(data);

     

       519
       519
       +
             updateStepStatus(0, "completed");

     

       520
       520
       +
           } catch (error) {

     

       521
       521
       +
             console.error("Key generation failed:", error);

     

       522
       522
       +
             updateStepStatus(

     

       523
       523
       +
               0,

     

       524
       524
       +
               "error",

     

       525
       525
       +
               error instanceof Error ? error.message : String(error),

     

       526
       526
       +
             );

     

       527
       527
       +
           }

     

       528
       528
       +
         };

     

       529
       529
       +
       

     

       530
       530
       +
         const getStepIcon = (status: PlcUpdateStep["status"]) => {

     

       531
       531
       +
           switch (status) {

     

       532
       532
       +
             case "pending":

     

       533
       533
       +
               return (

     

       534
       534
       +
                 <div class="w-8 h-8 rounded-full border-2 border-gray-300 dark:border-gray-600 flex items-center justify-center">

     

       535
       535
       +
                   <div class="w-3 h-3 rounded-full bg-gray-300 dark:bg-gray-600" />

     

       536
       536
       +
                 </div>

     

       537
       537
       +
               );

     

       538
       538
       +
             case "in-progress":

     

       539
       539
       +
               return (

     

       540
       540
       +
                 <div class="w-8 h-8 rounded-full border-2 border-blue-500 border-t-transparent animate-spin flex items-center justify-center">

     

       541
       541
       +
                   <div class="w-3 h-3 rounded-full bg-blue-500" />

     

       542
       542
       +
                 </div>

     

       543
       543
       +
               );

     

       544
       544
       +
             case "verifying":

     

       545
       545
       +
               return (

     

       546
       546
       +
                 <div class="w-8 h-8 rounded-full border-2 border-yellow-500 border-t-transparent animate-spin flex items-center justify-center">

     

       547
       547
       +
                   <div class="w-3 h-3 rounded-full bg-yellow-500" />

     

       548
       548
       +
                 </div>

     

       549
       549
       +
               );

     

       550
       550
       +
             case "completed":

     

       551
       551
       +
               return (

     

       552
       552
       +
                 <div class="w-8 h-8 rounded-full bg-green-500 flex items-center justify-center">

     

       553
       553
       +
                   <svg

     

       554
       554
       +
                     class="w-5 h-5 text-white"

     

       555
       555
       +
                     fill="none"

     

       556
       556
       +
                     stroke="currentColor"

     

       557
       557
       +
                     viewBox="0 0 24 24"

     

       558
       558
       +
                   >

     

       559
       559
       +
                     <path

     

       560
       560
       +
                       stroke-linecap="round"

     

       561
       561
       +
                       stroke-linejoin="round"

     

       562
       562
       +
                       stroke-width="2"

     

       563
       563
       +
                       d="M5 13l4 4L19 7"

     

       564
       564
       +
                     />

     

       565
       565
       +
                   </svg>

     

       566
       566
       +
                 </div>

     

       567
       567
       +
               );

     

       568
       568
       +
             case "error":

     

       569
       569
       +
               return (

     

       570
       570
       +
                 <div class="w-8 h-8 rounded-full bg-red-500 flex items-center justify-center">

     

       571
       571
       +
                   <svg

     

       572
       572
       +
                     class="w-5 h-5 text-white"

     

       573
       573
       +
                     fill="none"

     

       574
       574
       +
                     stroke="currentColor"

     

       575
       575
       +
                     viewBox="0 0 24 24"

     

       576
       576
       +
                   >

     

       577
       577
       +
                     <path

     

       578
       578
       +
                       stroke-linecap="round"

     

       579
       579
       +
                       stroke-linejoin="round"

     

       580
       580
       +
                       stroke-width="2"

     

       581
       581
       +
                       d="M6 18L18 6M6 6l12 12"

     

       582
       582
       +
                     />

     

       583
       583
       +
                   </svg>

     

       584
       584
       +
                 </div>

     

       585
       585
       +
               );

     

       586
       586
       +
           }

     

       587
       587
       +
         };

     

       588
       588
       +
       

     

       589
       589
       +
         const getStepClasses = (status: PlcUpdateStep["status"]) => {

     

       590
       590
       +
           const baseClasses =

     

       591
       591
       +
             "flex items-center space-x-3 p-4 rounded-lg transition-colors duration-200";

     

       592
       592
       +
           switch (status) {

     

       593
       593
       +
             case "pending":

     

       594
       594
       +
               return `${baseClasses} bg-gray-50 dark:bg-gray-800`;

     

       595
       595
       +
             case "in-progress":

     

       596
       596
       +
               return `${baseClasses} bg-blue-50 dark:bg-blue-900`;

     

       597
       597
       +
             case "verifying":

     

       598
       598
       +
               return `${baseClasses} bg-yellow-50 dark:bg-yellow-900`;

     

       599
       599
       +
             case "completed":

     

       600
       600
       +
               return `${baseClasses} bg-green-50 dark:bg-green-900`;

     

       601
       601
       +
             case "error":

     

       602
       602
       +
               return `${baseClasses} bg-red-50 dark:bg-red-900`;

     

       603
       603
       +
           }

     

       604
       604
       +
         };

     

       605
       605
       +
       

     

       606
       606
       +
         const requestNewToken = async () => {

     

       607
       607
       +
           try {

     

       608
       608
       +
             console.log("Requesting new token...");

     

       609
       609
       +
             const res = await fetch("/api/plc/token", {

     

       610
       610
       +
               method: "GET",

     

       611
       611
       +
             });

     

       612
       612
       +
             const text = await res.text();

     

       613
       613
       +
             console.log("Token request response:", text);

     

       614
       614
       +
       

     

       615
       615
       +
             if (!res.ok) {

     

       616
       616
       +
               throw new Error(text || "Failed to request new token");

     

       617
       617
       +
             }

     

       618
       618
       +
       

     

       619
       619
       +
             let data;

     

       620
       620
       +
             try {

     

       621
       621
       +
               data = JSON.parse(text);

     

       622
       622
       +
               if (!data.success) {

     

       623
       623
       +
                 throw new Error(data.message || "Failed to request token");

     

       624
       624
       +
               }

     

       625
       625
       +
             } catch {

     

       626
       626
       +
               throw new Error("Invalid response from server");

     

       627
       627
       +
             }

     

       628
       628
       +
       

     

       629
       629
       +
             // Clear any existing error and token

     

       630
       630
       +
             setEmailToken("");

     

       631
       631
       +
             updateStepStatus(1, "in-progress");

     

       632
       632
       +
             updateStepStatus(2, "pending");

     

       633
       633
       +
           } catch (error) {

     

       634
       634
       +
             console.error("Failed to request new token:", error);

     

       635
       635
       +
             updateStepStatus(

     

       636
       636
       +
               1,

     

       637
       637
       +
               "error",

     

       638
       638
       +
               error instanceof Error ? error.message : String(error),

     

       639
       639
       +
             );

     

       640
       640
       +
           }

     

       641
       641
       +
         };

     

       642
       642
       +
       

     

       643
       643
       +
         if (!hasStarted) {

     

       644
       644
       +
           return (

     

       645
       645
       +
             <div class="space-y-6">

     

       646
       646
       +
               <div class="ticket bg-white dark:bg-slate-800 p-6 relative">

     

       647
       647
       +
                 <div class="boarding-label text-amber-500 dark:text-amber-400 font-mono font-bold tracking-wider text-sm mb-2">

     

       648
       648
       +
                   {contentChunks[currentChunkIndex].subtitle}

     

       649
       649
       +
                 </div>

     

       650
       650
       +
       

     

       651
       651
       +
                 <div class="flex justify-between items-start mb-4">

     

       652
       652
       +
                   <h3 class="text-2xl font-mono text-slate-800 dark:text-slate-200">

     

       653
       653
       +
                     {contentChunks[currentChunkIndex].title}

     

       654
       654
       +
                   </h3>

     

       655
       655
       +
                 </div>

     

       656
       656
       +
       

     

       657
       657
       +
                 {/* Main Description */}

     

       658
       658
       +
                 <div class="mb-6">{contentChunks[currentChunkIndex].content}</div>

     

       659
       659
       +
       

     

       660
       660
       +
                 {/* Navigation */}

     

       661
       661
       +
                 <div class="mt-8 border-t border-dashed border-slate-200 dark:border-slate-700 pt-4">

     

       662
       662
       +
                   <div class="flex justify-between items-center">

     

       663
       663
       +
                     <button

     

       664
       664
       +
                       type="button"

     

       665
       665
       +
                       onClick={() =>

     

       666
       666
       +
                         setCurrentChunkIndex((prev) => Math.max(0, prev - 1))}

     

       667
       667
       +
                       class={`px-4 py-2 font-mono text-slate-600 dark:text-slate-400 hover:text-slate-800 dark:hover:text-slate-200 transition-colors duration-200 flex items-center space-x-2 ${

     

       668
       668
       +
                         currentChunkIndex === 0 ? "invisible" : ""

     

       669
       669
       +
                       }`}

     

       670
       670
       +
                     >

     

       671
       671
       +
                       <svg

     

       672
       672
       +
                         class="w-5 h-5 rotate-180"

     

       673
       673
       +
                         fill="none"

     

       674
       674
       +
                         stroke="currentColor"

     

       675
       675
       +
                         viewBox="0 0 24 24"

     

       676
       676
       +
                       >

     

       677
       677
       +
                         <path

     

       678
       678
       +
                           stroke-linecap="round"

     

       679
       679
       +
                           stroke-linejoin="round"

     

       680
       680
       +
                           stroke-width="2"

     

       681
       681
       +
                           d="M9 5l7 7-7 7"

     

       682
       682
       +
                         />

     

       683
       683
       +
                       </svg>

     

       684
       684
       +
                       <span>Previous Gate</span>

     

       685
       685
       +
                     </button>

     

       686
       686
       +
       

     

       687
       687
       +
                     {currentChunkIndex === contentChunks.length - 1

     

       688
       688
       +
                       ? (

     

       689
       689
       +
                         <button

     

       690
       690
       +
                           type="button"

     

       691
       691
       +
                           onClick={handleStart}

     

       692
       692
       +
                           class="px-6 py-2 bg-amber-500 hover:bg-amber-600 text-white font-mono rounded-md transition-colors duration-200 flex items-center space-x-2"

     

       693
       693
       +
                         >

     

       694
       694
       +
                           <span>Begin Key Generation</span>

     

       695
       695
       +
                           <svg

     

       696
       696
       +
                             class="w-5 h-5"

     

       697
       697
       +
                             fill="none"

     

       698
       698
       +
                             stroke="currentColor"

     

       699
       699
       +
                             viewBox="0 0 24 24"

     

       700
       700
       +
                           >

     

       701
       701
       +
                             <path

     

       702
       702
       +
                               stroke-linecap="round"

     

       703
       703
       +
                               stroke-linejoin="round"

     

       704
       704
       +
                               stroke-width="2"

     

       705
       705
       +
                               d="M9 5l7 7-7 7"

     

       706
       706
       +
                             />

     

       707
       707
       +
                           </svg>

     

       708
       708
       +
                         </button>

     

       709
       709
       +
                       )

     

       710
       710
       +
                       : (

     

       711
       711
       +
                         <button

     

       712
       712
       +
                           type="button"

     

       713
       713
       +
                           onClick={() =>

     

       714
       714
       +
                             setCurrentChunkIndex((prev) =>

     

       715
       715
       +
                               Math.min(contentChunks.length - 1, prev + 1)

     

       716
       716
       +
                             )}

     

       717
       717
       +
                           class="px-4 py-2 font-mono text-slate-600 dark:text-slate-400 hover:text-slate-800 dark:hover:text-slate-200 transition-colors duration-200 flex items-center space-x-2"

     

       718
       718
       +
                         >

     

       719
       719
       +
                           <span>Next Gate</span>

     

       720
       720
       +
                           <svg

     

       721
       721
       +
                             class="w-5 h-5"

     

       722
       722
       +
                             fill="none"

     

       723
       723
       +
                             stroke="currentColor"

     

       724
       724
       +
                             viewBox="0 0 24 24"

     

       725
       725
       +
                           >

     

       726
       726
       +
                             <path

     

       727
       727
       +
                               stroke-linecap="round"

     

       728
       728
       +
                               stroke-linejoin="round"

     

       729
       729
       +
                               stroke-width="2"

     

       730
       730
       +
                               d="M9 5l7 7-7 7"

     

       731
       731
       +
                             />

     

       732
       732
       +
                           </svg>

     

       733
       733
       +
                         </button>

     

       734
       734
       +
                       )}

     

       735
       735
       +
                   </div>

     

       736
       736
       +
       

     

       737
       737
       +
                   {/* Progress Dots */}

     

       738
       738
       +
                   <div class="flex justify-center space-x-3 mt-4">

     

       739
       739
       +
                     {contentChunks.map((_, index) => (

     

       740
       740
       +
                       <div

     

       741
       741
       +
                         key={index}

     

       742
       742
       +
                         class={`h-1.5 w-8 rounded-full transition-colors duration-200 ${

     

       743
       743
       +
                           index === currentChunkIndex

     

       744
       744
       +
                             ? "bg-amber-500"

     

       745
       745
       +
                             : "bg-slate-200 dark:bg-slate-700"

     

       746
       746
       +
                         }`}

     

       747
       747
       +
                       />

     

       748
       748
       +
                     ))}

     

       749
       749
       +
                   </div>

     

       750
       750
       +
                 </div>

     

       751
       751
       +
               </div>

     

       752
       752
       +
             </div>

     

       753
       753
       +
           );

     

       754
       754
       +
         }

     

       755
       755
       +
       

     

       756
       756
       +
         return (

     

       757
       757
       +
           <div class="space-y-8">

     

       758
       758
       +
             {/* Progress Steps */}

     

       759
       759
       +
             <div class="space-y-4">

     

       760
       760
       +
               <div class="flex items-center justify-between">

     

       761
       761
       +
                 <h3 class="text-lg font-medium text-gray-900 dark:text-gray-100">

     

       762
       762
       +
                   Key Generation Progress

     

       763
       763
       +
                 </h3>

     

       764
       764
       +
                 {/* Add a help tooltip */}

     

       765
       765
       +
                 <div class="relative group">

     

       766
       766
       +
                   <button class="text-gray-400 hover:text-gray-500" type="button">

     

       767
       767
       +
                     <svg

     

       768
       768
       +
                       class="w-5 h-5"

     

       769
       769
       +
                       fill="none"

     

       770
       770
       +
                       stroke="currentColor"

     

       771
       771
       +
                       viewBox="0 0 24 24"

     

       772
       772
       +
                     >

     

       773
       773
       +
                       <path

     

       774
       774
       +
                         stroke-linecap="round"

     

       775
       775
       +
                         stroke-linejoin="round"

     

       776
       776
       +
                         stroke-width="2"

     

       777
       777
       +
                         d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"

     

       778
       778
       +
                       />

     

       779
       779
       +
                     </svg>

     

       780
       780
       +
                   </button>

     

       781
       781
       +
                   <div class="absolute right-0 w-64 p-2 mt-2 space-y-1 text-sm bg-white dark:bg-gray-800 rounded-lg shadow-lg border border-gray-200 dark:border-gray-700 hidden group-hover:block z-10">

     

       782
       782
       +
                     <p class="text-gray-600 dark:text-gray-400">

     

       783
       783
       +
                       Follow these steps to securely add a new rotation key to your

     

       784
       784
       +
                       PLC record. Each step requires completion before proceeding.

     

       785
       785
       +
                     </p>

     

       786
       786
       +
                   </div>

     

       787
       787
       +
                 </div>

     

       788
       788
       +
               </div>

     

       789
       789
       +
       

     

       790
       790
       +
               {/* Steps with enhanced visual hierarchy */}

     

       791
       791
       +
               {steps.map((step, index) => (

     

       792
       792
       +
                 <div

     

       793
       793
       +
                   key={step.name}

     

       794
       794
       +
                   class={`${getStepClasses(step.status)} ${

     

       795
       795
       +
                     step.status === "in-progress"

     

       796
       796
       +
                       ? "ring-2 ring-blue-500 ring-opacity-50"

     

       797
       797
       +
                       : ""

     

       798
       798
       +
                   }`}

     

       799
       799
       +
                 >

     

       800
       800
       +
                   <div class="flex-shrink-0">{getStepIcon(step.status)}</div>

     

       801
       801
       +
                   <div class="flex-1 min-w-0">

     

       802
       802
       +
                     <div class="flex items-center justify-between">

     

       803
       803
       +
                       <p

     

       804
       804
       +
                         class={`font-medium ${

     

       805
       805
       +
                           step.status === "error"

     

       806
       806
       +
                             ? "text-red-900 dark:text-red-200"

     

       807
       807
       +
                             : step.status === "completed"

     

       808
       808
       +
                             ? "text-green-900 dark:text-green-200"

     

       809
       809
       +
                             : step.status === "in-progress"

     

       810
       810
       +
                             ? "text-blue-900 dark:text-blue-200"

     

       811
       811
       +
                             : "text-gray-900 dark:text-gray-200"

     

       812
       812
       +
                         }`}

     

       813
       813
       +
                       >

     

       814
       814
       +
                         {getStepDisplayName(step, index)}

     

       815
       815
       +
                       </p>

     

       816
       816
       +
                       {/* Add step number */}

     

       817
       817
       +
                       <span class="text-sm text-gray-500 dark:text-gray-400">

     

       818
       818
       +
                         Step {index + 1} of {steps.length}

     

       819
       819
       +
                       </span>

     

       820
       820
       +
                     </div>

     

       821
       821
       +
       

     

       822
       822
       +
                     {step.error && (

     

       823
       823
       +
                       <div class="mt-2 p-2 bg-red-50 dark:bg-red-900/50 rounded-md">

     

       824
       824
       +
                         <p class="text-sm text-red-600 dark:text-red-400 flex items-center">

     

       825
       825
       +
                           <svg

     

       826
       826
       +
                             class="w-4 h-4 mr-1"

     

       827
       827
       +
                             fill="none"

     

       828
       828
       +
                             stroke="currentColor"

     

       829
       829
       +
                             viewBox="0 0 24 24"

     

       830
       830
       +
                           >

     

       831
       831
       +
                             <path

     

       832
       832
       +
                               stroke-linecap="round"

     

       833
       833
       +
                               stroke-linejoin="round"

     

       834
       834
       +
                               stroke-width="2"

     

       835
       835
       +
                               d="M12 8v4m0 4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"

     

       836
       836
       +
                             />

     

       837
       837
       +
                           </svg>

     

       838
       838
       +
                           {(() => {

     

       839
       839
       +
                             try {

     

       840
       840
       +
                               const err = JSON.parse(step.error);

     

       841
       841
       +
                               return err.message || step.error;

     

       842
       842
       +
                             } catch {

     

       843
       843
       +
                               return step.error;

     

       844
       844
       +
                             }

     

       845
       845
       +
                           })()}

     

       846
       846
       +
                         </p>

     

       847
       847
       +
                       </div>

     

       848
       848
       +
                     )}

     

       849
       849
       +
       

     

       850
       850
       +
                     {/* Key Download Warning */}

     

       851
       851
       +
                     {index === 0 &&

     

       852
       852
       +
                       step.status === "completed" &&

     

       853
       853
       +
                       !hasDownloadedKey && (

     

       854
       854
       +
                       <div class="mt-4 space-y-4">

     

       855
       855
       +
                         <div class="bg-yellow-50 dark:bg-yellow-900/50 p-4 rounded-lg border border-yellow-200 dark:border-yellow-800">

     

       856
       856
       +
                           <div class="flex items-start">

     

       857
       857
       +
                             <div class="flex-shrink-0">

     

       858
       858
       +
                               <svg

     

       859
       859
       +
                                 class="h-5 w-5 text-yellow-400"

     

       860
       860
       +
                                 viewBox="0 0 20 20"

     

       861
       861
       +
                                 fill="currentColor"

     

       862
       862
       +
                               >

     

       863
       863
       +
                                 <path

     

       864
       864
       +
                                   fill-rule="evenodd"

     

       865
       865
       +
                                   d="M8.485 2.495c.673-1.167 2.357-1.167 3.03 0l6.28 10.875c.673 1.167-.17 2.625-1.516 2.625H3.72c-1.347 0-2.189-1.458-1.515-2.625L8.485 2.495zM10 5a.75.75 0 01.75.75v3.5a.75.75 0 01-1.5 0v-3.5A.75.75 0 0110 5zm0 9a1 1 0 100-2 1 1 0 000 2z"

     

       866
       866
       +
                                   clip-rule="evenodd"

     

       867
       867
       +
                                 />

     

       868
       868
       +
                               </svg>

     

       869
       869
       +
                             </div>

     

       870
       870
       +
                             <div class="ml-3">

     

       871
       871
       +
                               <h3 class="text-sm font-medium text-yellow-800 dark:text-yellow-200">

     

       872
       872
       +
                                 Critical Security Step

     

       873
       873
       +
                               </h3>

     

       874
       874
       +
                               <div class="mt-2 text-sm text-yellow-700 dark:text-yellow-300">

     

       875
       875
       +
                                 <p class="mb-2">

     

       876
       876
       +
                                   Your rotation key grants control over your identity:

     

       877
       877
       +
                                 </p>

     

       878
       878
       +
                                 <ul class="list-disc pl-5 space-y-2">

     

       879
       879
       +
                                   <li>

     

       880
       880
       +
                                     <strong>Store Securely:</strong>{" "}

     

       881
       881
       +
                                     Use a password manager

     

       882
       882
       +
                                   </li>

     

       883
       883
       +
                                   <li>

     

       884
       884
       +
                                     <strong>Keep Private:</strong>{" "}

     

       885
       885
       +
                                     Never share with anyone

     

       886
       886
       +
                                   </li>

     

       887
       887
       +
                                   <li>

     

       888
       888
       +
                                     <strong>Backup:</strong> Keep a secure backup copy

     

       889
       889
       +
                                   </li>

     

       890
       890
       +
                                   <li>

     

       891
       891
       +
                                     <strong>Required:</strong>{" "}

     

       892
       892
       +
                                     Needed for future DID modifications

     

       893
       893
       +
                                   </li>

     

       894
       894
       +
                                 </ul>

     

       895
       895
       +
                               </div>

     

       896
       896
       +
                             </div>

     

       897
       897
       +
                           </div>

     

       898
       898
       +
                         </div>

     

       899
       899
       +
       

     

       900
       900
       +
                         <div class="flex items-center justify-between">

     

       901
       901
       +
                           <button

     

       902
       902
       +
                             type="button"

     

       903
       903
       +
                             onClick={handleDownload}

     

       904
       904
       +
                             class="px-4 py-2 bg-green-600 hover:bg-green-700 text-white rounded-md transition-colors duration-200 flex items-center space-x-2"

     

       905
       905
       +
                           >

     

       906
       906
       +
                             <svg

     

       907
       907
       +
                               class="w-5 h-5"

     

       908
       908
       +
                               fill="none"

     

       909
       909
       +
                               stroke="currentColor"

     

       910
       910
       +
                               viewBox="0 0 24 24"

     

       911
       911
       +
                             >

     

       912
       912
       +
                               <path

     

       913
       913
       +
                                 stroke-linecap="round"

     

       914
       914
       +
                                 stroke-linejoin="round"

     

       915
       915
       +
                                 stroke-width="2"

     

       916
       916
       +
                                 d="M4 16v1a3 3 0 003 3h10a3 3 0 003-3v-1m-4-4l-4 4m0 0l-4-4m4 4V4"

     

       917
       917
       +
                               />

     

       918
       918
       +
                             </svg>

     

       919
       919
       +
                             <span>Download Key</span>

     

       920
       920
       +
                           </button>

     

       921
       921
       +
       

     

       922
       922
       +
                           <div class="flex items-center text-sm text-red-600 dark:text-red-400">

     

       923
       923
       +
                             <svg

     

       924
       924
       +
                               class="w-4 h-4 mr-1"

     

       925
       925
       +
                               fill="none"

     

       926
       926
       +
                               stroke="currentColor"

     

       927
       927
       +
                               viewBox="0 0 24 24"

     

       928
       928
       +
                             >

     

       929
       929
       +
                               <path

     

       930
       930
       +
                                 stroke-linecap="round"

     

       931
       931
       +
                                 stroke-linejoin="round"

     

       932
       932
       +
                                 stroke-width="2"

     

       933
       933
       +
                                 d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z"

     

       934
       934
       +
                               />

     

       935
       935
       +
                             </svg>

     

       936
       936
       +
                             Download required to proceed

     

       937
       937
       +
                           </div>

     

       938
       938
       +
                         </div>

     

       939
       939
       +
                       </div>

     

       940
       940
       +
                     )}

     

       941
       941
       +
       

     

       942
       942
       +
                     {/* Email Code Input */}

     

       943
       943
       +
                     {index === 1 &&

     

       944
       944
       +
                       (step.status === "in-progress" ||

     

       945
       945
       +
                         step.status === "verifying") &&

     

       946
       946
       +
                       step.name ===

     

       947
       947
       +
                         "Enter the code sent to your email to complete PLC update" &&

     

       948
       948
       +
                       (

     

       949
       949
       +
                         <div class="mt-4 space-y-4">

     

       950
       950
       +
                           <div class="bg-blue-50 dark:bg-blue-900/50 p-4 rounded-lg">

     

       951
       951
       +
                             <p class="text-sm text-blue-800 dark:text-blue-200 mb-3">

     

       952
       952
       +
                               Check your email for the verification code to complete

     

       953
       953
       +
                               the PLC update:

     

       954
       954
       +
                             </p>

     

       955
       955
       +
                             <div class="flex space-x-2">

     

       956
       956
       +
                               <div class="flex-1 relative">

     

       957
       957
       +
                                 <input

     

       958
       958
       +
                                   type="text"

     

       959
       959
       +
                                   value={emailToken}

     

       960
       960
       +
                                   onChange={(e) =>

     

       961
       961
       +
                                     setEmailToken(e.currentTarget.value)}

     

       962
       962
       +
                                   placeholder="Enter verification code"

     

       963
       963
       +
                                   class="w-full rounded-md border-gray-300 shadow-sm focus:border-blue-500 focus:ring-blue-500 dark:border-gray-600 dark:bg-gray-700 dark:text-white dark:focus:border-blue-400 dark:focus:ring-blue-400"

     

       964
       964
       +
                                 />

     

       965
       965
       +
                               </div>

     

       966
       966
       +
                               <button

     

       967
       967
       +
                                 type="button"

     

       968
       968
       +
                                 onClick={handleTokenSubmit}

     

       969
       969
       +
                                 disabled={!emailToken || step.status === "verifying"}

     

       970
       970
       +
                                 class="px-4 py-2 border border-transparent rounded-md shadow-sm text-sm font-medium text-white bg-blue-600 hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500 transition-colors duration-200 disabled:opacity-50 disabled:cursor-not-allowed flex items-center space-x-2"

     

       971
       971
       +
                               >

     

       972
       972
       +
                                 <span>

     

       973
       973
       +
                                   {step.status === "verifying"

     

       974
       974
       +
                                     ? "Verifying..."

     

       975
       975
       +
                                     : "Verify"}

     

       976
       976
       +
                                 </span>

     

       977
       977
       +
                                 <svg

     

       978
       978
       +
                                   class="w-4 h-4"

     

       979
       979
       +
                                   fill="none"

     

       980
       980
       +
                                   stroke="currentColor"

     

       981
       981
       +
                                   viewBox="0 0 24 24"

     

       982
       982
       +
                                 >

     

       983
       983
       +
                                   <path

     

       984
       984
       +
                                     stroke-linecap="round"

     

       985
       985
       +
                                     stroke-linejoin="round"

     

       986
       986
       +
                                     stroke-width="2"

     

       987
       987
       +
                                     d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z"

     

       988
       988
       +
                                   />

     

       989
       989
       +
                                 </svg>

     

       990
       990
       +
                               </button>

     

       991
       991
       +
                             </div>

     

       992
       992
       +
                             {step.error && (

     

       993
       993
       +
                               <div class="mt-2 p-2 bg-red-50 dark:bg-red-900/50 rounded-md">

     

       994
       994
       +
                                 <p class="text-sm text-red-600 dark:text-red-400 flex items-center">

     

       995
       995
       +
                                   <svg

     

       996
       996
       +
                                     class="w-4 h-4 mr-1"

     

       997
       997
       +
                                     fill="none"

     

       998
       998
       +
                                     stroke="currentColor"

     

       999
       999
       +
                                     viewBox="0 0 24 24"

     

       1000
       1000
       +
                                   >

     

       1001
       1001
       +
                                     <path

     

       1002
       1002
       +
                                       stroke-linecap="round"

     

       1003
       1003
       +
                                       stroke-linejoin="round"

     

       1004
       1004
       +
                                       stroke-width="2"

     

       1005
       1005
       +
                                       d="M12 8v4m0 4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"

     

       1006
       1006
       +
                                     />

     

       1007
       1007
       +
                                   </svg>

     

       1008
       1008
       +
                                   {step.error}

     

       1009
       1009
       +
                                 </p>

     

       1010
       1010
       +
                                 {step.error

     

       1011
       1011
       +
                                   .toLowerCase()

     

       1012
       1012
       +
                                   .includes("token is invalid") && (

     

       1013
       1013
       +
                                   <div class="mt-2">

     

       1014
       1014
       +
                                     <p class="text-sm text-red-500 dark:text-red-300 mb-2">

     

       1015
       1015
       +
                                       The verification code may have expired. Request

     

       1016
       1016
       +
                                       a new code to try again.

     

       1017
       1017
       +
                                     </p>

     

       1018
       1018
       +
                                     <button

     

       1019
       1019
       +
                                       type="button"

     

       1020
       1020
       +
                                       onClick={requestNewToken}

     

       1021
       1021
       +
                                       class="text-sm px-3 py-1 bg-red-100 hover:bg-red-200 dark:bg-red-800 dark:hover:bg-red-700 text-red-700 dark:text-red-200 rounded-md transition-colors duration-200 flex items-center space-x-1"

     

       1022
       1022
       +
                                     >

     

       1023
       1023
       +
                                       <svg

     

       1024
       1024
       +
                                         class="w-4 h-4"

     

       1025
       1025
       +
                                         fill="none"

     

       1026
       1026
       +
                                         stroke="currentColor"

     

       1027
       1027
       +
                                         viewBox="0 0 24 24"

     

       1028
       1028
       +
                                       >

     

       1029
       1029
       +
                                         <path

     

       1030
       1030
       +
                                           stroke-linecap="round"

     

       1031
       1031
       +
                                           stroke-linejoin="round"

     

       1032
       1032
       +
                                           stroke-width="2"

     

       1033
       1033
       +
                                           d="M4 4v5h.582m15.356 2A8.001 8.001 0 004.582 9m0 0H9m11 11v-5h-.581m0 0a8.003 8.003 0 01-15.357-2m15.357 2H15"

     

       1034
       1034
       +
                                         />

     

       1035
       1035
       +
                                       </svg>

     

       1036
       1036
       +
                                       <span>Request New Code</span>

     

       1037
       1037
       +
                                     </button>

     

       1038
       1038
       +
                                   </div>

     

       1039
       1039
       +
                                 )}

     

       1040
       1040
       +
                               </div>

     

       1041
       1041
       +
                             )}

     

       1042
       1042
       +
                           </div>

     

       1043
       1043
       +
                         </div>

     

       1044
       1044
       +
                       )}

     

       1045
       1045
       +
                   </div>

     

       1046
       1046
       +
                 </div>

     

       1047
       1047
       +
               ))}

     

       1048
       1048
       +
             </div>

     

       1049
       1049
       +
       

     

       1050
       1050
       +
             {/* Success Message */}

     

       1051
       1051
       +
             {steps[2].status === "completed" && (

     

       1052
       1052
       +
               <div class="p-4 bg-green-50 dark:bg-green-900/50 rounded-lg border-2 border-green-200 dark:border-green-800">

     

       1053
       1053
       +
                 <div class="flex items-center space-x-3 mb-4">

     

       1054
       1054
       +
                   <svg

     

       1055
       1055
       +
                     class="w-6 h-6 text-green-500"

     

       1056
       1056
       +
                     fill="none"

     

       1057
       1057
       +
                     stroke="currentColor"

     

       1058
       1058
       +
                     viewBox="0 0 24 24"

     

       1059
       1059
       +
                   >

     

       1060
       1060
       +
                     <path

     

       1061
       1061
       +
                       stroke-linecap="round"

     

       1062
       1062
       +
                       stroke-linejoin="round"

     

       1063
       1063
       +
                       stroke-width="2"

     

       1064
       1064
       +
                       d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z"

     

       1065
       1065
       +
                     />

     

       1066
       1066
       +
                   </svg>

     

       1067
       1067
       +
                   <h4 class="text-lg font-medium text-green-800 dark:text-green-200">

     

       1068
       1068
       +
                     PLC Update Successful!

     

       1069
       1069
       +
                   </h4>

     

       1070
       1070
       +
                 </div>

     

       1071
       1071
       +
                 <p class="text-sm text-green-700 dark:text-green-300 mb-4">

     

       1072
       1072
       +
                   Your rotation key has been successfully added to your PLC record.

     

       1073
       1073
       +
                   You can now use this key for future DID modifications.

     

       1074
       1074
       +
                 </p>

     

       1075
       1075
       +
                 <div class="flex space-x-4">

     

       1076
       1076
       +
                   <button

     

       1077
       1077
       +
                     type="button"

     

       1078
       1078
       +
                     onClick={async () => {

     

       1079
       1079
       +
                       try {

     

       1080
       1080
       +
                         const response = await fetch("/api/logout", {

     

       1081
       1081
       +
                           method: "POST",

     

       1082
       1082
       +
                           credentials: "include",

     

       1083
       1083
       +
                         });

     

       1084
       1084
       +
                         if (!response.ok) {

     

       1085
       1085
       +
                           throw new Error("Logout failed");

     

       1086
       1086
       +
                         }

     

       1087
       1087
       +
                         globalThis.location.href = "/";

     

       1088
       1088
       +
                       } catch (error) {

     

       1089
       1089
       +
                         console.error("Failed to logout:", error);

     

       1090
       1090
       +
                       }

     

       1091
       1091
       +
                     }}

     

       1092
       1092
       +
                     class="px-4 py-2 bg-green-600 hover:bg-green-700 text-white rounded-md transition-colors duration-200 flex items-center space-x-2"

     

       1093
       1093
       +
                   >

     

       1094
       1094
       +
                     <svg

     

       1095
       1095
       +
                       class="w-5 h-5"

     

       1096
       1096
       +
                       fill="none"

     

       1097
       1097
       +
                       stroke="currentColor"

     

       1098
       1098
       +
                       viewBox="0 0 24 24"

     

       1099
       1099
       +
                     >

     

       1100
       1100
       +
                       <path

     

       1101
       1101
       +
                         stroke-linecap="round"

     

       1102
       1102
       +
                         stroke-linejoin="round"

     

       1103
       1103
       +
                         stroke-width="2"

     

       1104
       1104
       +
                         d="M17 16l4-4m0 0l-4-4m4 4H7m6 4v1a3 3 0 01-3 3H6a3 3 0 01-3-3V7a3 3 0 013-3h4a3 3 0 013 3v1"

     

       1105
       1105
       +
                       />

     

       1106
       1106
       +
                     </svg>

     

       1107
       1107
       +
                     <span>Sign Out</span>

     

       1108
       1108
       +
                   </button>

     

       1109
       1109
       +
                   <a

     

       1110
       1110
       +
                     href="https://ko-fi.com/knotbin"

     

       1111
       1111
       +
                     target="_blank"

     

       1112
       1112
       +
                     class="px-4 py-2 bg-green-600 hover:bg-green-700 text-white rounded-md transition-colors duration-200 flex items-center space-x-2"

     

       1113
       1113
       +
                   >

     

       1114
       1114
       +
                     <svg

     

       1115
       1115
       +
                       class="w-5 h-5"

     

       1116
       1116
       +
                       fill="none"

     

       1117
       1117
       +
                       stroke="currentColor"

     

       1118
       1118
       +
                       viewBox="0 0 24 24"

     

       1119
       1119
       +
                     >

     

       1120
       1120
       +
                       <path

     

       1121
       1121
       +
                         stroke-linecap="round"

     

       1122
       1122
       +
                         stroke-linejoin="round"

     

       1123
       1123
       +
                         stroke-width="2"

     

       1124
       1124
       +
                         d="M4.318 6.318a4.5 4.5 0 000 6.364L12 20.364l7.682-7.682a4.5 4.5 0 00-6.364-6.364L12 7.636l-1.318-1.318a4.5 4.5 0 00-6.364 0z"

     

       1125
       1125
       +
                       />

     

       1126
       1126
       +
                     </svg>

     

       1127
       1127
       +
                     <span>Support Us</span>

     

       1128
       1128
       +
                   </a>

     

       1129
       1129
       +
                 </div>

     

       1130
       1130
       +
               </div>

     

       1131
       1131
       +
             )}

     

       1132
       1132
       +
           </div>

     

       1133
       1133
       +
         );

     

       1134
       1134
       +
       }

islands/HandleInput.tsx

···

       1
       1
        
       import { useState } from "preact/hooks";

     

       2
       2
        
       import { JSX } from "preact";

     

       3
       3
        
       

     

       4
       4
       +
       /**

     

       5
       5
       +
        * The OAuth handle input form.

     

       6
       6
       +
        * @returns The handle input form

     

       7
       7
       +
        * @component

     

       8
       8
       +
        */

     

       4
       9
        
       export default function HandleInput() {

     

       5
       10
        
         const [handle, setHandle] = useState("");

     

       6
       11
        
         const [error, setError] = useState<string | null>(null);

+60 -34

islands/Header.tsx

···

       2
       2
        
       import { IS_BROWSER } from "fresh/runtime";

     

       3
       3
        
       import { Button } from "../components/Button.tsx";

     

       4
       4
        
       

     

       5
       5
       +
       /**

     

       6
       6
       +
        * The user interface.

     

       7
       7
       +
        * @type {User}

     

       8
       8
       +
        */

     

       5
       9
        
       interface User {

     

       6
       10
        
         did: string;

     

       7
       11
        
         handle?: string;

     

       8
       12
        
       }

     

       9
       13
        
       

     

       14
       14
       +
       /**

     

       15
       15
       +
        * Truncate text to a maximum length.

     

       16
       16
       +
        * @param text - The text to truncate

     

       17
       17
       +
        * @param maxLength - The maximum length

     

       18
       18
       +
        * @returns The truncated text

     

       19
       19
       +
        */

     

       10
       20
        
       function truncateText(text: string, maxLength: number) {

     

       11
       21
        
         if (text.length <= maxLength) return text;

     

       12
       22
        
         let truncated = text.slice(0, maxLength);

     
···

       17
       27
        
         return truncated + "...";

     

       18
       28
        
       }

     

       19
       29
        
       

     

       30
       30
       +
       /**

     

       31
       31
       +
        * The header component.

     

       32
       32
       +
        * @returns The header component

     

       33
       33
       +
        * @component

     

       34
       34
       +
        */

     

       20
       35
        
       export default function Header() {

     

       21
       36
        
         const [user, setUser] = useState<User | null>(null);

     

       22
       37
        
         const [showDropdown, setShowDropdown] = useState(false);

     
···

       82
       97
        
                 />

     

       83
       98
        
       

     

       84
       99
        
                 <div className="flex items-center gap-3">

     

       100
       100
       +
                   {/* Ticket booth (did:plc update) */}

     

       101
       101
       +
                   <Button

     

       102
       102
       +
                     href="/ticket-booth"

     

       103
       103
       +
                     color="amber"

     

       104
       104
       +
                     icon="/icons/ticket_bold.svg"

     

       105
       105
       +
                     iconAlt="Ticket"

     

       106
       106
       +
                     label="TICKET BOOTH"

     

       107
       107
       +
                   />

     

       108
       108
       +
       

     

       85
       109
        
                   {/* Departures (Migration) */}

     

       86
       110
        
                   <Button

     

       87
       111
        
                     href="/migrate"

     
···

       93
       117
        
       

     

       94
       118
        
                   {/* Check-in (Login/Profile) */}

     

       95
       119
        
                   <div className="relative">

     

       96
       96
       -
                     {user?.did ? (

     

       97
       97
       -
                       <div className="relative">

     

       120
       120
       +
                     {user?.did

     

       121
       121
       +
                       ? (

     

       122
       122
       +
                         <div className="relative">

     

       123
       123
       +
                           <Button

     

       124
       124
       +
                             color="amber"

     

       125
       125
       +
                             icon="/icons/account.svg"

     

       126
       126
       +
                             iconAlt="Check-in"

     

       127
       127
       +
                             label="CHECKED IN"

     

       128
       128
       +
                             onClick={() => setShowDropdown(!showDropdown)}

     

       129
       129
       +
                           />

     

       130
       130
       +
                           {showDropdown && (

     

       131
       131
       +
                             <div className="absolute right-0 mt-2 w-64 bg-white dark:bg-slate-800 rounded-lg shadow-lg p-4 border border-slate-200 dark:border-slate-700">

     

       132
       132
       +
                               <div className="text-sm font-mono mb-2 pb-2 border-b border-slate-900/10">

     

       133
       133
       +
                                 <div title={user.handle || "Anonymous"}>

     

       134
       134
       +
                                   {truncateText(user.handle || "Anonymous", 20)}

     

       135
       135
       +
                                 </div>

     

       136
       136
       +
                                 <div className="text-xs opacity-75" title={user.did}>

     

       137
       137
       +
                                   {truncateText(user.did, 25)}

     

       138
       138
       +
                                 </div>

     

       139
       139
       +
                               </div>

     

       140
       140
       +
                               <button

     

       141
       141
       +
                                 type="button"

     

       142
       142
       +
                                 onClick={handleLogout}

     

       143
       143
       +
                                 className="text-sm font-mono text-slate-900 hover:text-slate-700 w-full text-left transition-colors"

     

       144
       144
       +
                               >

     

       145
       145
       +
                                 Sign Out

     

       146
       146
       +
                               </button>

     

       147
       147
       +
                             </div>

     

       148
       148
       +
                           )}

     

       149
       149
       +
                         </div>

     

       150
       150
       +
                       )

     

       151
       151
       +
                       : (

     

       98
       152
        
                         <Button

     

       153
       153
       +
                           href="/login"

     

       99
       154
        
                           color="amber"

     

       100
       100
       -
                           icon="/icons/ticket_bold.svg"

     

       155
       155
       +
                           icon="/icons/account.svg"

     

       101
       156
        
                           iconAlt="Check-in"

     

       102
       102
       -
                           label="CHECKED IN"

     

       103
       103
       -
                           onClick={() => setShowDropdown(!showDropdown)}

     

       157
       157
       +
                           label="CHECK-IN"

     

       104
       158
        
                         />

     

       105
       105
       -
                         {showDropdown && (

     

       106
       106
       -
                           <div className="absolute right-0 mt-2 w-64 bg-white dark:bg-slate-800 rounded-lg shadow-lg p-4 border border-slate-200 dark:border-slate-700">

     

       107
       107
       -
                             <div className="text-sm font-mono mb-2 pb-2 border-b border-slate-900/10">

     

       108
       108
       -
                               <div title={user.handle || "Anonymous"}>

     

       109
       109
       -
                                 {truncateText(user.handle || "Anonymous", 20)}

     

       110
       110
       -
                               </div>

     

       111
       111
       -
                               <div className="text-xs opacity-75" title={user.did}>

     

       112
       112
       -
                                 {truncateText(user.did, 25)}

     

       113
       113
       -
                               </div>

     

       114
       114
       -
                             </div>

     

       115
       115
       -
                             <button

     

       116
       116
       -
                               type="button"

     

       117
       117
       -
                               onClick={handleLogout}

     

       118
       118
       -
                               className="text-sm font-mono text-slate-900 hover:text-slate-700 w-full text-left transition-colors"

     

       119
       119
       -
                             >

     

       120
       120
       -
                               Sign Out

     

       121
       121
       -
                             </button>

     

       122
       122
       -
                           </div>

     

       123
       123
       -
                         )}

     

       124
       124
       -
                       </div>

     

       125
       125
       -
                     ) : (

     

       126
       126
       -
                       <Button

     

       127
       127
       -
                         href="/login"

     

       128
       128
       -
                         color="amber"

     

       129
       129
       -
                         icon="/icons/ticket_bold.svg"

     

       130
       130
       -
                         iconAlt="Check-in"

     

       131
       131
       -
                         label="CHECK-IN"

     

       132
       132
       -
                       />

     

       133
       133
       -
                     )}

     

       159
       159
       +
                       )}

     

       134
       160
        
                   </div>

     

       135
       161
        
                 </div>

     

       136
       162
        
               </div>

+37

islands/LoginButton.tsx

···

       1
       1
       +
       import { useEffect, useState } from "preact/hooks";

     

       2
       2
       +
       import { Button } from "../components/Button.tsx";

     

       3
       3
       +
       

     

       4
       4
       +
       export default function LoginButton() {

     

       5
       5
       +
         const [isMobile, setIsMobile] = useState(true); // Default to mobile for SSR

     

       6
       6
       +
       

     

       7
       7
       +
         useEffect(() => {

     

       8
       8
       +
           const checkMobile = () => {

     

       9
       9
       +
             setIsMobile(globalThis.innerWidth < 640);

     

       10
       10
       +
           };

     

       11
       11
       +
       

     

       12
       12
       +
           // Check on mount

     

       13
       13
       +
           checkMobile();

     

       14
       14
       +
       

     

       15
       15
       +
           // Listen for resize events

     

       16
       16
       +
           globalThis.addEventListener("resize", checkMobile);

     

       17
       17
       +
           return () => globalThis.removeEventListener("resize", checkMobile);

     

       18
       18
       +
         }, []);

     

       19
       19
       +
       

     

       20
       20
       +
         return (

     

       21
       21
       +
           <div class="mt-6 sm:mt-8 text-center w-fit mx-auto">

     

       22
       22
       +
             <Button

     

       23
       23
       +
               href={isMobile ? undefined : "/login"}

     

       24
       24
       +
               color="blue"

     

       25
       25
       +
               label={isMobile ? "MOBILE NOT SUPPORTED" : "GET STARTED"}

     

       26
       26
       +
               className={isMobile

     

       27
       27
       +
                 ? "opacity-50 cursor-not-allowed"

     

       28
       28
       +
                 : "opacity-100 cursor-pointer"}

     

       29
       29
       +
               onClick={(e: MouseEvent) => {

     

       30
       30
       +
                 if (isMobile) {

     

       31
       31
       +
                   e.preventDefault();

     

       32
       32
       +
                 }

     

       33
       33
       +
               }}

     

       34
       34
       +
             />

     

       35
       35
       +
           </div>

     

       36
       36
       +
         );

     

       37
       37
       +
       }

+22 -15

islands/LoginSelector.tsx

···

       1
       1
       -
       import { useState } from "preact/hooks"

     

       2
       2
       -
       import HandleInput from "./HandleInput.tsx"

     

       3
       3
       -
       import CredLogin from "./CredLogin.tsx"

     

       1
       1
       +
       import { useState } from "preact/hooks";

     

       2
       2
       +
       import HandleInput from "./HandleInput.tsx";

     

       3
       3
       +
       import CredLogin from "./CredLogin.tsx";

     

       4
       4
        
       

     

       5
       5
       +
       /**

     

       6
       6
       +
        * The login method selector for OAuth or Credential.

     

       7
       7
       +
        * @returns The login method selector

     

       8
       8
       +
        * @component

     

       9
       9
       +
        */

     

       5
       10
        
       export default function LoginMethodSelector() {

     

       6
       6
       -
         const [loginMethod, setLoginMethod] = useState<'oauth' | 'password'>('password')

     

       11
       11
       +
         const [loginMethod, setLoginMethod] = useState<"oauth" | "password">(

     

       12
       12
       +
           "password",

     

       13
       13
       +
         );

     

       7
       14
        
       

     

       8
       15
        
         return (

     

       9
       16
        
           <div className="flex flex-col gap-8">

     
···

       13
       20
        
               <div className="flex gap-4 mb-6">

     

       14
       21
        
                 <button

     

       15
       22
        
                   type="button"

     

       16
       16
       -
                   onClick={() => setLoginMethod('oauth')}

     

       23
       23
       +
                   onClick={() => setLoginMethod("oauth")}

     

       17
       24
        
                   className={`flex-1 px-4 py-2 rounded-md transition-colors ${

     

       18
       18
       -
                     loginMethod === 'oauth'

     

       19
       19
       -
                       ? 'bg-blue-500 text-white'

     

       20
       20
       -
                       : 'bg-gray-100 dark:bg-gray-700 text-gray-700 dark:text-gray-300'

     

       25
       25
       +
                     loginMethod === "oauth"

     

       26
       26
       +
                       ? "bg-blue-500 text-white"

     

       27
       27
       +
                       : "bg-gray-100 dark:bg-gray-700 text-gray-700 dark:text-gray-300"

     

       21
       28
        
                   }`}

     

       22
       29
        
                 >

     

       23
       30
        
                   OAuth

     

       24
       31
        
                 </button>

     

       25
       32
        
                 <button

     

       26
       33
        
                   type="button"

     

       27
       27
       -
                   onClick={() => setLoginMethod('password')}

     

       34
       34
       +
                   onClick={() => setLoginMethod("password")}

     

       28
       35
        
                   className={`flex-1 px-4 py-2 rounded-md transition-colors ${

     

       29
       29
       -
                     loginMethod === 'password'

     

       30
       30
       -
                       ? 'bg-blue-500 text-white'

     

       31
       31
       -
                       : 'bg-gray-100 dark:bg-gray-700 text-gray-700 dark:text-gray-300'

     

       36
       36
       +
                     loginMethod === "password"

     

       37
       37
       +
                       ? "bg-blue-500 text-white"

     

       38
       38
       +
                       : "bg-gray-100 dark:bg-gray-700 text-gray-700 dark:text-gray-300"

     

       32
       39
        
                   }`}

     

       33
       40
        
                 >

     

       34
       41
        
                   Credential

     

       35
       42
        
                 </button>

     

       36
       43
        
               </div>

     

       37
       44
        
       

     

       38
       38
       -
               {loginMethod === 'oauth' && (

     

       45
       45
       +
               {loginMethod === "oauth" && (

     

       39
       46
        
                 <div className="mb-4 p-3 bg-amber-50 dark:bg-amber-900/30 text-amber-800 dark:text-amber-200 rounded-md text-sm">

     

       40
       47
        
                   Note: OAuth login cannot be used for migrations.

     

       41
       48
        
                 </div>

     

       42
       49
        
               )}

     

       43
       50
        
       

     

       44
       44
       -
               {loginMethod === 'oauth' ? <HandleInput /> : <CredLogin />}

     

       51
       51
       +
               {loginMethod === "oauth" ? <HandleInput /> : <CredLogin />}

     

       45
       52
        
       

     

       46
       53
        
               <div className="mt-4 text-center">

     

       47
       54
        
                 <a

     
···

       53
       60
        
               </div>

     

       54
       61
        
             </div>

     

       55
       62
        
           </div>

     

       56
       56
       -
         )

     

       63
       63
       +
         );

     

       57
       64
        
       }

+132 -493

islands/MigrationProgress.tsx

···

       1
       1
        
       import { useEffect, useState } from "preact/hooks";

     

       2
       2
       +
       import { MigrationStateInfo } from "../lib/migration-types.ts";

     

       3
       3
       +
       import AccountCreationStep from "./migration-steps/AccountCreationStep.tsx";

     

       4
       4
       +
       import DataMigrationStep from "./migration-steps/DataMigrationStep.tsx";

     

       5
       5
       +
       import IdentityMigrationStep from "./migration-steps/IdentityMigrationStep.tsx";

     

       6
       6
       +
       import FinalizationStep from "./migration-steps/FinalizationStep.tsx";

     

       7
       7
       +
       import MigrationCompletion from "../components/MigrationCompletion.tsx";

     

       2
       8
        
       

     

       9
       9
       +
       /**

     

       10
       10
       +
        * The migration progress props.

     

       11
       11
       +
        * @type {MigrationProgressProps}

     

       12
       12
       +
        */

     

       3
       13
        
       interface MigrationProgressProps {

     

       4
       14
        
         service: string;

     

       5
       15
        
         handle: string;

     
···

       8
       18
        
         invite?: string;

     

       9
       19
        
       }

     

       10
       20
        
       

     

       11
       11
       -
       interface MigrationStep {

     

       12
       12
       -
         name: string;

     

       13
       13
       -
         status: "pending" | "in-progress" | "verifying" | "completed" | "error";

     

       14
       14
       -
         error?: string;

     

       15
       15
       -
       }

     

       16
       16
       -
       

     

       21
       21
       +
       /**

     

       22
       22
       +
        * The migration progress component.

     

       23
       23
       +
        * @param props - The migration progress props

     

       24
       24
       +
        * @returns The migration progress component

     

       25
       25
       +
        * @component

     

       26
       26
       +
        */

     

       17
       27
        
       export default function MigrationProgress(props: MigrationProgressProps) {

     

       18
       18
       -
         const [token, setToken] = useState("");

     

       28
       28
       +
         const [migrationState, setMigrationState] = useState<

     

       29
       29
       +
           MigrationStateInfo | null

     

       30
       30
       +
         >(null);

     

       31
       31
       +
         const [currentStep, setCurrentStep] = useState(0);

     

       32
       32
       +
         const [completedSteps, setCompletedSteps] = useState<Set<number>>(new Set());

     

       33
       33
       +
         const [hasError, setHasError] = useState(false);

     

       19
       34
        
       

     

       20
       20
       -
         const [steps, setSteps] = useState<MigrationStep[]>([

     

       21
       21
       -
           { name: "Create Account", status: "pending" },

     

       22
       22
       -
           { name: "Migrate Data", status: "pending" },

     

       23
       23
       -
           { name: "Migrate Identity", status: "pending" },

     

       24
       24
       -
           { name: "Finalize Migration", status: "pending" },

     

       25
       25
       -
         ]);

     

       26
       26
       -
       

     

       27
       27
       -
         const updateStepStatus = (

     

       28
       28
       -
           index: number,

     

       29
       29
       -
           status: MigrationStep["status"],

     

       30
       30
       -
           error?: string,

     

       31
       31
       -
         ) => {

     

       32
       32
       -
           console.log(

     

       33
       33
       -
             `Updating step ${index} to ${status}${

     

       34
       34
       -
               error ? ` with error: ${error}` : ""

     

       35
       35
       -
             }`,

     

       36
       36
       -
           );

     

       37
       37
       -
           setSteps((prevSteps) =>

     

       38
       38
       -
             prevSteps.map((step, i) =>

     

       39
       39
       -
               i === index

     

       40
       40
       -
                 ? { ...step, status, error }

     

       41
       41
       -
                 : i > index

     

       42
       42
       -
                 ? { ...step, status: "pending", error: undefined }

     

       43
       43
       -
                 : step

     

       44
       44
       -
             )

     

       45
       45
       -
           );

     

       35
       35
       +
         const credentials = {

     

       36
       36
       +
           service: props.service,

     

       37
       37
       +
           handle: props.handle,

     

       38
       38
       +
           email: props.email,

     

       39
       39
       +
           password: props.password,

     

       40
       40
       +
           invite: props.invite,

     

       46
       41
        
         };

     

       47
       42
        
       

     

       48
       43
        
         const validateParams = () => {

     

       49
       44
        
           if (!props.service?.trim()) {

     

       50
       50
       -
             updateStepStatus(0, "error", "Missing service URL");

     

       45
       45
       +
             setHasError(true);

     

       51
       46
        
             return false;

     

       52
       47
        
           }

     

       53
       48
        
           if (!props.handle?.trim()) {

     

       54
       54
       -
             updateStepStatus(0, "error", "Missing handle");

     

       49
       49
       +
             setHasError(true);

     

       55
       50
        
             return false;

     

       56
       51
        
           }

     

       57
       52
        
           if (!props.email?.trim()) {

     

       58
       58
       -
             updateStepStatus(0, "error", "Missing email");

     

       53
       53
       +
             setHasError(true);

     

       59
       54
        
             return false;

     

       60
       55
        
           }

     

       61
       56
        
           if (!props.password?.trim()) {

     

       62
       62
       -
             updateStepStatus(0, "error", "Missing password");

     

       57
       57
       +
             setHasError(true);

     

       63
       58
        
             return false;

     

       64
       59
        
           }

     

       65
       60
        
           return true;

     
···

       74
       69
        
             invite: props.invite,

     

       75
       70
        
           });

     

       76
       71
        
       

     

       77
       77
       -
           if (!validateParams()) {

     

       78
       78
       -
             console.log("Parameter validation failed");

     

       79
       79
       -
             return;

     

       80
       80
       -
           }

     

       81
       81
       -
       

     

       82
       82
       -
           startMigration().catch((error) => {

     

       83
       83
       -
             console.error("Unhandled migration error:", error);

     

       84
       84
       -
             updateStepStatus(

     

       85
       85
       -
               0,

     

       86
       86
       -
               "error",

     

       87
       87
       -
               error instanceof Error ? error.message : String(error),

     

       88
       88
       -
             );

     

       89
       89
       -
           });

     

       90
       90
       -
         }, []);

     

       91
       91
       -
       

     

       92
       92
       -
         const getStepDisplayName = (step: MigrationStep, index: number) => {

     

       93
       93
       -
           if (step.status === "completed") {

     

       94
       94
       -
             switch (index) {

     

       95
       95
       -
               case 0: return "Account Created";

     

       96
       96
       -
               case 1: return "Data Migrated";

     

       97
       97
       -
               case 2: return "Identity Migrated";

     

       98
       98
       -
               case 3: return "Migration Finalized";

     

       99
       99
       -
             }

     

       100
       100
       -
           }

     

       101
       101
       -
           

     

       102
       102
       -
           if (step.status === "in-progress") {

     

       103
       103
       -
             switch (index) {

     

       104
       104
       -
               case 0: return "Creating your new account...";

     

       105
       105
       -
               case 1: return "Migrating your data...";

     

       106
       106
       -
               case 2: return step.name === "Enter the token sent to your email to complete identity migration" 

     

       107
       107
       -
                 ? step.name 

     

       108
       108
       -
                 : "Migrating your identity...";

     

       109
       109
       -
               case 3: return "Finalizing migration...";

     

       110
       110
       -
             }

     

       111
       111
       -
           }

     

       112
       112
       -
       

     

       113
       113
       -
           if (step.status === "verifying") {

     

       114
       114
       -
             switch (index) {

     

       115
       115
       -
               case 0: return "Verifying account creation...";

     

       116
       116
       -
               case 1: return "Verifying data migration...";

     

       117
       117
       -
               case 2: return "Verifying identity migration...";

     

       118
       118
       -
               case 3: return "Verifying migration completion...";

     

       119
       119
       -
             }

     

       120
       120
       -
           }

     

       121
       121
       -
           

     

       122
       122
       -
           return step.name;

     

       123
       123
       -
         };

     

       124
       124
       -
       

     

       125
       125
       -
         const startMigration = async () => {

     

       126
       126
       -
           try {

     

       127
       127
       -
             // Step 1: Create Account

     

       128
       128
       -
             updateStepStatus(0, "in-progress");

     

       129
       129
       -
             console.log("Starting account creation...");

     

       130
       130
       -
       

     

       72
       72
       +
           // Check migration state first

     

       73
       73
       +
           const checkMigrationState = async () => {

     

       131
       74
        
             try {

     

       132
       132
       -
               const createRes = await fetch("/api/migrate/create", {

     

       133
       133
       -
                 method: "POST",

     

       134
       134
       -
                 headers: { "Content-Type": "application/json" },

     

       135
       135
       -
                 body: JSON.stringify({

     

       136
       136
       -
                   service: props.service,

     

       137
       137
       -
                   handle: props.handle,

     

       138
       138
       -
                   password: props.password,

     

       139
       139
       -
                   email: props.email,

     

       140
       140
       -
                   ...(props.invite ? { invite: props.invite } : {}),

     

       141
       141
       -
                 }),

     

       142
       142
       -
               });

     

       75
       75
       +
               const migrationResponse = await fetch("/api/migration-state");

     

       76
       76
       +
               if (migrationResponse.ok) {

     

       77
       77
       +
                 const migrationData = await migrationResponse.json();

     

       78
       78
       +
                 setMigrationState(migrationData);

     

       143
       79
        
       

     

       144
       144
       -
               console.log("Create account response status:", createRes.status);

     

       145
       145
       -
               const responseText = await createRes.text();

     

       146
       146
       -
               console.log("Create account response:", responseText);

     

       147
       147
       -
       

     

       148
       148
       -
               if (!createRes.ok) {

     

       149
       149
       -
                 try {

     

       150
       150
       -
                   const json = JSON.parse(responseText);

     

       151
       151
       -
                   throw new Error(json.message || "Failed to create account");

     

       152
       152
       -
                 } catch {

     

       153
       153
       -
                   throw new Error(responseText || "Failed to create account");

     

       80
       80
       +
                 if (!migrationData.allowMigration) {

     

       81
       81
       +
                   setHasError(true);

     

       82
       82
       +
                   return;

     

       154
       83
        
                 }

     

       155
       84
        
               }

     

       156
       156
       -
       

     

       157
       157
       -
               try {

     

       158
       158
       -
                 const jsonData = JSON.parse(responseText);

     

       159
       159
       -
                 if (!jsonData.success) {

     

       160
       160
       -
                   throw new Error(jsonData.message || "Account creation failed");

     

       161
       161
       -
                 }

     

       162
       162
       -
               } catch (e) {

     

       163
       163
       -
                 console.log("Response is not JSON or lacks success field:", e);

     

       164
       164
       -
               }

     

       165
       165
       -
       

     

       166
       166
       -
               updateStepStatus(0, "verifying");

     

       167
       167
       -
               const verified = await verifyStep(0);

     

       168
       168
       -
               if (!verified) {

     

       169
       169
       -
                 throw new Error("Account creation verification failed");

     

       170
       170
       -
               }

     

       171
       85
        
             } catch (error) {

     

       172
       172
       -
               updateStepStatus(

     

       173
       173
       -
                 0,

     

       174
       174
       -
                 "error",

     

       175
       175
       -
                 error instanceof Error ? error.message : String(error),

     

       176
       176
       -
               );

     

       177
       177
       -
               throw error;

     

       86
       86
       +
               console.error("Failed to check migration state:", error);

     

       87
       87
       +
               setHasError(true);

     

       88
       88
       +
               return;

     

       178
       89
        
             }

     

       179
       90
        
       

     

       180
       180
       -
             // Step 2: Migrate Data

     

       181
       181
       -
             updateStepStatus(1, "in-progress");

     

       182
       182
       -
             console.log("Starting data migration...");

     

       183
       183
       -
       

     

       184
       184
       -
             try {

     

       185
       185
       -
               const dataRes = await fetch("/api/migrate/data", {

     

       186
       186
       -
                 method: "POST",

     

       187
       187
       -
                 headers: { "Content-Type": "application/json" },

     

       188
       188
       -
               });

     

       189
       189
       -
       

     

       190
       190
       -
               console.log("Data migration response status:", dataRes.status);

     

       191
       191
       -
               const dataText = await dataRes.text();

     

       192
       192
       -
               console.log("Data migration response:", dataText);

     

       193
       193
       -
       

     

       194
       194
       -
               if (!dataRes.ok) {

     

       195
       195
       -
                 try {

     

       196
       196
       -
                   const json = JSON.parse(dataText);

     

       197
       197
       -
                   throw new Error(json.message || "Failed to migrate data");

     

       198
       198
       -
                 } catch {

     

       199
       199
       -
                   throw new Error(dataText || "Failed to migrate data");

     

       200
       200
       -
                 }

     

       201
       201
       -
               }

     

       202
       202
       -
       

     

       203
       203
       -
               try {

     

       204
       204
       -
                 const jsonData = JSON.parse(dataText);

     

       205
       205
       -
                 if (!jsonData.success) {

     

       206
       206
       -
                   throw new Error(jsonData.message || "Data migration failed");

     

       207
       207
       -
                 }

     

       208
       208
       -
                 console.log("Data migration successful:", jsonData);

     

       209
       209
       -
               } catch (e) {

     

       210
       210
       -
                 console.error("Failed to parse data migration response:", e);

     

       211
       211
       -
                 throw new Error("Invalid response from server during data migration");

     

       212
       212
       -
               }

     

       213
       213
       -
       

     

       214
       214
       -
               updateStepStatus(1, "verifying");

     

       215
       215
       -
               const verified = await verifyStep(1);

     

       216
       216
       -
               if (!verified) {

     

       217
       217
       -
                 throw new Error("Data migration verification failed");

     

       218
       218
       -
               }

     

       219
       219
       -
             } catch (error) {

     

       220
       220
       -
               updateStepStatus(

     

       221
       221
       -
                 1,

     

       222
       222
       -
                 "error",

     

       223
       223
       -
                 error instanceof Error ? error.message : String(error),

     

       224
       224
       -
               );

     

       225
       225
       -
               throw error;

     

       91
       91
       +
             if (!validateParams()) {

     

       92
       92
       +
               console.log("Parameter validation failed");

     

       93
       93
       +
               return;

     

       226
       94
        
             }

     

       227
       95
        
       

     

       228
       228
       -
             // Step 3: Request Identity Migration

     

       229
       229
       -
             updateStepStatus(2, "in-progress");

     

       230
       230
       -
             console.log("Requesting identity migration...");

     

       231
       231
       -
       

     

       232
       232
       -
             try {

     

       233
       233
       -
               const requestRes = await fetch("/api/migrate/identity/request", {

     

       234
       234
       -
                 method: "POST",

     

       235
       235
       -
                 headers: { "Content-Type": "application/json" },

     

       236
       236
       -
               });

     

       96
       96
       +
             // Start with the first step

     

       97
       97
       +
             setCurrentStep(0);

     

       98
       98
       +
           };

     

       237
       99
        
       

     

       238
       238
       -
               console.log("Identity request response status:", requestRes.status);

     

       239
       239
       -
               const requestText = await requestRes.text();

     

       240
       240
       -
               console.log("Identity request response:", requestText);

     

       100
       100
       +
           checkMigrationState();

     

       101
       101
       +
         }, []);

     

       241
       102
        
       

     

       242
       242
       -
               if (!requestRes.ok) {

     

       243
       243
       -
                 try {

     

       244
       244
       -
                   const json = JSON.parse(requestText);

     

       245
       245
       -
                   throw new Error(json.message || "Failed to request identity migration");

     

       246
       246
       -
                 } catch {

     

       247
       247
       -
                   throw new Error(requestText || "Failed to request identity migration");

     

       248
       248
       -
                 }

     

       249
       249
       -
               }

     

       103
       103
       +
         const handleStepComplete = (stepIndex: number) => {

     

       104
       104
       +
           console.log(`Step ${stepIndex} completed`);

     

       105
       105
       +
           setCompletedSteps((prev) => new Set([...prev, stepIndex]));

     

       250
       106
        
       

     

       251
       251
       -
               try {

     

       252
       252
       -
                 const jsonData = JSON.parse(requestText);

     

       253
       253
       -
                 if (!jsonData.success) {

     

       254
       254
       -
                   throw new Error(

     

       255
       255
       -
                     jsonData.message || "Identity migration request failed",

     

       256
       256
       -
                   );

     

       257
       257
       -
                 }

     

       258
       258
       -
                 console.log("Identity migration requested successfully");

     

       259
       259
       -
                 

     

       260
       260
       -
                 // Update step name to prompt for token

     

       261
       261
       -
                 setSteps(prevSteps =>

     

       262
       262
       -
                   prevSteps.map((step, i) =>

     

       263
       263
       -
                     i === 2

     

       264
       264
       -
                       ? { ...step, name: "Enter the token sent to your email to complete identity migration" }

     

       265
       265
       -
                       : step

     

       266
       266
       -
                   )

     

       267
       267
       -
                 );

     

       268
       268
       -
                 // Don't continue with migration - wait for token input

     

       269
       269
       -
                 return;

     

       270
       270
       -
               } catch (e) {

     

       271
       271
       -
                 console.error("Failed to parse identity request response:", e);

     

       272
       272
       -
                 throw new Error(

     

       273
       273
       -
                   "Invalid response from server during identity request",

     

       274
       274
       -
                 );

     

       275
       275
       -
               }

     

       276
       276
       -
             } catch (error) {

     

       277
       277
       -
               updateStepStatus(

     

       278
       278
       -
                 2,

     

       279
       279
       -
                 "error",

     

       280
       280
       -
                 error instanceof Error ? error.message : String(error),

     

       281
       281
       -
               );

     

       282
       282
       -
               throw error;

     

       283
       283
       -
             }

     

       284
       284
       -
           } catch (error) {

     

       285
       285
       -
             console.error("Migration error in try/catch:", error);

     

       107
       107
       +
           // Move to next step if not the last one

     

       108
       108
       +
           if (stepIndex < 3) {

     

       109
       109
       +
             setCurrentStep(stepIndex + 1);

     

       286
       110
        
           }

     

       287
       111
        
         };

     

       288
       112
        
       

     

       289
       289
       -
         const handleIdentityMigration = async () => {

     

       290
       290
       -
           if (!token) return;

     

       291
       291
       -
       

     

       292
       292
       -
           try {

     

       293
       293
       -
             const identityRes = await fetch(

     

       294
       294
       -
               `/api/migrate/identity/sign?token=${encodeURIComponent(token)}`,

     

       295
       295
       -
               {

     

       296
       296
       -
                 method: "POST",

     

       297
       297
       -
                 headers: { "Content-Type": "application/json" },

     

       298
       298
       -
               },

     

       299
       299
       -
             );

     

       300
       300
       -
       

     

       301
       301
       -
             const identityData = await identityRes.text();

     

       302
       302
       -
             if (!identityRes.ok) {

     

       303
       303
       -
               try {

     

       304
       304
       -
                 const json = JSON.parse(identityData);

     

       305
       305
       -
                 throw new Error(json.message || "Failed to complete identity migration");

     

       306
       306
       -
               } catch {

     

       307
       307
       -
                 throw new Error(identityData || "Failed to complete identity migration");

     

       308
       308
       -
               }

     

       309
       309
       -
             }

     

       310
       310
       -
       

     

       311
       311
       -
             let data;

     

       312
       312
       -
             try {

     

       313
       313
       -
               data = JSON.parse(identityData);

     

       314
       314
       -
               if (!data.success) {

     

       315
       315
       -
                 throw new Error(data.message || "Identity migration failed");

     

       316
       316
       -
               }

     

       317
       317
       -
             } catch {

     

       318
       318
       -
               throw new Error("Invalid response from server");

     

       319
       319
       -
             }

     

       320
       320
       -
       

     

       321
       321
       -
       

     

       322
       322
       -
             updateStepStatus(2, "verifying");

     

       323
       323
       -
             const verified = await verifyStep(2);

     

       324
       324
       -
             if (!verified) {

     

       325
       325
       -
               throw new Error("Identity migration verification failed");

     

       326
       326
       -
             }

     

       327
       327
       -
       

     

       328
       328
       -
             // Step 4: Finalize Migration

     

       329
       329
       -
             updateStepStatus(3, "in-progress");

     

       330
       330
       -
             try {

     

       331
       331
       -
               const finalizeRes = await fetch("/api/migrate/finalize", {

     

       332
       332
       -
                 method: "POST",

     

       333
       333
       -
                 headers: { "Content-Type": "application/json" },

     

       334
       334
       -
               });

     

       335
       335
       -
       

     

       336
       336
       -
               const finalizeData = await finalizeRes.text();

     

       337
       337
       -
               if (!finalizeRes.ok) {

     

       338
       338
       -
                 try {

     

       339
       339
       -
                   const json = JSON.parse(finalizeData);

     

       340
       340
       -
                   throw new Error(json.message || "Failed to finalize migration");

     

       341
       341
       -
                 } catch {

     

       342
       342
       -
                   throw new Error(finalizeData || "Failed to finalize migration");

     

       343
       343
       -
                 }

     

       344
       344
       -
               }

     

       345
       345
       -
       

     

       346
       346
       -
               try {

     

       347
       347
       -
                 const jsonData = JSON.parse(finalizeData);

     

       348
       348
       -
                 if (!jsonData.success) {

     

       349
       349
       -
                   throw new Error(jsonData.message || "Finalization failed");

     

       350
       350
       -
                 }

     

       351
       351
       -
               } catch {

     

       352
       352
       -
                 throw new Error("Invalid response from server during finalization");

     

       353
       353
       -
               }

     

       354
       354
       -
       

     

       355
       355
       -
               updateStepStatus(3, "verifying");

     

       356
       356
       -
               const verified = await verifyStep(3);

     

       357
       357
       -
               if (!verified) {

     

       358
       358
       -
                 throw new Error("Migration finalization verification failed");

     

       359
       359
       -
               }

     

       360
       360
       -
             } catch (error) {

     

       361
       361
       -
               updateStepStatus(

     

       362
       362
       -
                 3,

     

       363
       363
       -
                 "error",

     

       364
       364
       -
                 error instanceof Error ? error.message : String(error),

     

       365
       365
       -
               );

     

       366
       366
       -
               throw error;

     

       367
       367
       -
             }

     

       368
       368
       -
           } catch (error) {

     

       369
       369
       -
             console.error("Identity migration error:", error);

     

       370
       370
       -
             updateStepStatus(

     

       371
       371
       -
               2,

     

       372
       372
       -
               "error",

     

       373
       373
       -
               error instanceof Error ? error.message : String(error),

     

       374
       374
       -
             );

     

       375
       375
       -
           }

     

       113
       113
       +
         const handleStepError = (

     

       114
       114
       +
           stepIndex: number,

     

       115
       115
       +
           error: string,

     

       116
       116
       +
           isVerificationError?: boolean,

     

       117
       117
       +
         ) => {

     

       118
       118
       +
           console.error(`Step ${stepIndex} error:`, error, { isVerificationError });

     

       119
       119
       +
           // Errors are handled within each step component

     

       376
       120
        
         };

     

       377
       121
        
       

     

       378
       378
       -
         const getStepIcon = (status: MigrationStep["status"]) => {

     

       379
       379
       -
           switch (status) {

     

       380
       380
       -
             case "pending":

     

       381
       381
       -
               return (

     

       382
       382
       -
                 <div class="w-8 h-8 rounded-full border-2 border-gray-300 dark:border-gray-600 flex items-center justify-center">

     

       383
       383
       -
                   <div class="w-3 h-3 rounded-full bg-gray-300 dark:bg-gray-600" />

     

       384
       384
       -
                 </div>

     

       385
       385
       -
               );

     

       386
       386
       -
             case "in-progress":

     

       387
       387
       -
               return (

     

       388
       388
       -
                 <div class="w-8 h-8 rounded-full border-2 border-blue-500 border-t-transparent animate-spin flex items-center justify-center">

     

       389
       389
       -
                   <div class="w-3 h-3 rounded-full bg-blue-500" />

     

       390
       390
       -
                 </div>

     

       391
       391
       -
               );

     

       392
       392
       -
             case "verifying":

     

       393
       393
       -
               return (

     

       394
       394
       -
                 <div class="w-8 h-8 rounded-full border-2 border-yellow-500 border-t-transparent animate-spin flex items-center justify-center">

     

       395
       395
       -
                   <div class="w-3 h-3 rounded-full bg-yellow-500" />

     

       396
       396
       -
                 </div>

     

       397
       397
       -
               );

     

       398
       398
       -
             case "completed":

     

       399
       399
       -
               return (

     

       400
       400
       -
                 <div class="w-8 h-8 rounded-full bg-green-500 flex items-center justify-center">

     

       401
       401
       -
                   <svg

     

       402
       402
       -
                     class="w-5 h-5 text-white"

     

       403
       403
       -
                     fill="none"

     

       404
       404
       -
                     stroke="currentColor"

     

       405
       405
       -
                     viewBox="0 0 24 24"

     

       406
       406
       -
                   >

     

       407
       407
       -
                     <path

     

       408
       408
       -
                       stroke-linecap="round"

     

       409
       409
       -
                       stroke-linejoin="round"

     

       410
       410
       -
                       stroke-width="2"

     

       411
       411
       -
                       d="M5 13l4 4L19 7"

     

       412
       412
       -
                     />

     

       413
       413
       -
                   </svg>

     

       414
       414
       -
                 </div>

     

       415
       415
       -
               );

     

       416
       416
       -
             case "error":

     

       417
       417
       -
               return (

     

       418
       418
       -
                 <div class="w-8 h-8 rounded-full bg-red-500 flex items-center justify-center">

     

       419
       419
       -
                   <svg

     

       420
       420
       -
                     class="w-5 h-5 text-white"

     

       421
       421
       -
                     fill="none"

     

       422
       422
       -
                     stroke="currentColor"

     

       423
       423
       -
                     viewBox="0 0 24 24"

     

       424
       424
       -
                   >

     

       425
       425
       -
                     <path

     

       426
       426
       -
                       stroke-linecap="round"

     

       427
       427
       -
                       stroke-linejoin="round"

     

       428
       428
       -
                       stroke-width="2"

     

       429
       429
       -
                       d="M6 18L18 6M6 6l12 12"

     

       430
       430
       -
                     />

     

       431
       431
       -
                   </svg>

     

       432
       432
       -
                 </div>

     

       433
       433
       -
               );

     

       434
       434
       -
           }

     

       122
       122
       +
         const isStepActive = (stepIndex: number) => {

     

       123
       123
       +
           return currentStep === stepIndex && !hasError;

     

       435
       124
        
         };

     

       436
       125
        
       

     

       437
       437
       -
         const getStepClasses = (status: MigrationStep["status"]) => {

     

       438
       438
       -
           const baseClasses =

     

       439
       439
       -
             "flex items-center space-x-3 p-4 rounded-lg transition-colors duration-200";

     

       440
       440
       -
           switch (status) {

     

       441
       441
       -
             case "pending":

     

       442
       442
       -
               return `${baseClasses} bg-gray-50 dark:bg-gray-800`;

     

       443
       443
       -
             case "in-progress":

     

       444
       444
       -
               return `${baseClasses} bg-blue-50 dark:bg-blue-900`;

     

       445
       445
       -
             case "verifying":

     

       446
       446
       -
               return `${baseClasses} bg-yellow-50 dark:bg-yellow-900`;

     

       447
       447
       -
             case "completed":

     

       448
       448
       -
               return `${baseClasses} bg-green-50 dark:bg-green-900`;

     

       449
       449
       -
             case "error":

     

       450
       450
       -
               return `${baseClasses} bg-red-50 dark:bg-red-900`;

     

       451
       451
       -
           }

     

       126
       126
       +
         const _isStepCompleted = (stepIndex: number) => {

     

       127
       127
       +
           return completedSteps.has(stepIndex);

     

       452
       128
        
         };

     

       453
       129
        
       

     

       454
       454
       -
         // Helper to verify a step after completion

     

       455
       455
       -
         const verifyStep = async (stepNum: number) => {

     

       456
       456
       -
           updateStepStatus(stepNum, "verifying");

     

       457
       457
       -
           try {

     

       458
       458
       -
             const res = await fetch(`/api/migrate/status?step=${stepNum + 1}`);

     

       459
       459
       -
             const data = await res.json();

     

       460
       460
       -
             if (data.ready) {

     

       461
       461
       -
               updateStepStatus(stepNum, "completed");

     

       462
       462
       -
               return true;

     

       463
       463
       -
             } else {

     

       464
       464
       -
               updateStepStatus(stepNum, "error", data.reason || "Verification failed");

     

       465
       465
       -
               return false;

     

       466
       466
       -
             }

     

       467
       467
       -
           } catch (e) {

     

       468
       468
       -
             updateStepStatus(stepNum, "error", e instanceof Error ? e.message : String(e));

     

       469
       469
       -
             return false;

     

       470
       470
       -
           }

     

       471
       471
       -
         };

     

       130
       130
       +
         const allStepsCompleted = completedSteps.size === 4;

     

       472
       131
        
       

     

       473
       132
        
         return (

     

       474
       133
        
           <div class="space-y-8">

     

       475
       475
       -
             <div class="space-y-4">

     

       476
       476
       -
               {steps.map((step, index) => (

     

       477
       477
       -
                 <div key={step.name} class={getStepClasses(step.status)}>

     

       478
       478
       -
                   {getStepIcon(step.status)}

     

       479
       479
       -
                   <div class="flex-1">

     

       480
       480
       -
                     <p

     

       481
       481
       -
                       class={`font-medium ${

     

       482
       482
       -
                         step.status === "error"

     

       483
       483
       -
                           ? "text-red-900 dark:text-red-200"

     

       484
       484
       -
                           : step.status === "completed"

     

       485
       485
       -
                           ? "text-green-900 dark:text-green-200"

     

       486
       486
       -
                           : step.status === "in-progress"

     

       487
       487
       -
                           ? "text-blue-900 dark:text-blue-200"

     

       488
       488
       -
                           : "text-gray-900 dark:text-gray-200"

     

       489
       489
       -
                       }`}

     

       490
       490
       -
                     >

     

       491
       491
       -
                       {getStepDisplayName(step, index)}

     

       492
       492
       -
                     </p>

     

       493
       493
       -
                     {step.error && (

     

       494
       494
       -
                       <p class="text-sm text-red-600 dark:text-red-400 mt-1">

     

       495
       495
       -
                         {(() => {

     

       496
       496
       -
                           try {

     

       497
       497
       -
                             const err = JSON.parse(step.error);

     

       498
       498
       -
                             return err.message || step.error;

     

       499
       499
       -
                           } catch {

     

       500
       500
       -
                             return step.error;

     

       501
       501
       -
                           }

     

       502
       502
       -
                         })()}

     

       503
       503
       -
                       </p>

     

       504
       504
       -
                     )}

     

       505
       505
       -
                     {index === 2 && step.status === "in-progress" &&

     

       506
       506
       -
                       step.name === "Enter the token sent to your email to complete identity migration" && (

     

       507
       507
       -
                         <div class="mt-4 space-y-4">

     

       508
       508
       -
                           <p class="text-sm text-blue-800 dark:text-blue-200">

     

       509
       509
       -
                             Please check your email for the migration token and enter it below:

     

       510
       510
       -
                           </p>

     

       511
       511
       -
                           <div class="flex space-x-2">

     

       512
       512
       -
                             <input

     

       513
       513
       -
                               type="text"

     

       514
       514
       -
                               value={token}

     

       515
       515
       -
                               onChange={(e) => setToken(e.currentTarget.value)}

     

       516
       516
       -
                               placeholder="Enter token"

     

       517
       517
       -
                               class="flex-1 rounded-md border-gray-300 shadow-sm focus:border-blue-500 focus:ring-blue-500 dark:border-gray-600 dark:bg-gray-700 dark:text-white dark:focus:border-blue-400 dark:focus:ring-blue-400"

     

       518
       518
       -
                             />

     

       519
       519
       -
                             <button

     

       520
       520
       -
                               type="button"

     

       521
       521
       -
                               onClick={handleIdentityMigration}

     

       522
       522
       -
                               class="px-4 py-2 border border-transparent rounded-md shadow-sm text-sm font-medium text-white bg-blue-600 hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500 transition-colors duration-200"

     

       523
       523
       -
                             >

     

       524
       524
       -
                               Submit Token

     

       525
       525
       -
                             </button>

     

       526
       526
       -
                           </div>

     

       527
       527
       -
                         </div>

     

       528
       528
       -
                       )

     

       529
       529
       -
                     }

     

       134
       134
       +
             {/* Migration state alert */}

     

       135
       135
       +
             {migrationState && !migrationState.allowMigration && (

     

       136
       136
       +
               <div

     

       137
       137
       +
                 class={`p-4 rounded-lg border ${

     

       138
       138
       +
                   migrationState.state === "maintenance"

     

       139
       139
       +
                     ? "bg-yellow-50 border-yellow-200 text-yellow-800 dark:bg-yellow-900/20 dark:border-yellow-800 dark:text-yellow-200"

     

       140
       140
       +
                     : "bg-red-50 border-red-200 text-red-800 dark:bg-red-900/20 dark:border-red-800 dark:text-red-200"

     

       141
       141
       +
                 }`}

     

       142
       142
       +
               >

     

       143
       143
       +
                 <div class="flex items-center">

     

       144
       144
       +
                   <div

     

       145
       145
       +
                     class={`mr-3 ${

     

       146
       146
       +
                       migrationState.state === "maintenance"

     

       147
       147
       +
                         ? "text-yellow-600 dark:text-yellow-400"

     

       148
       148
       +
                         : "text-red-600 dark:text-red-400"

     

       149
       149
       +
                     }`}

     

       150
       150
       +
                   >

     

       151
       151
       +
                     {migrationState.state === "maintenance" ? "⚠️" : "🚫"}

     

       152
       152
       +
                   </div>

     

       153
       153
       +
                   <div>

     

       154
       154
       +
                     <h3 class="font-semibold mb-1">

     

       155
       155
       +
                       {migrationState.state === "maintenance"

     

       156
       156
       +
                         ? "Maintenance Mode"

     

       157
       157
       +
                         : "Service Unavailable"}

     

       158
       158
       +
                     </h3>

     

       159
       159
       +
                     <p class="text-sm">{migrationState.message}</p>

     

       530
       160
        
                   </div>

     

       531
       161
        
                 </div>

     

       532
       532
       -
               ))}

     

       533
       533
       -
             </div>

     

       534
       534
       -
       

     

       535
       535
       -
             {steps[3].status === "completed" && (

     

       536
       536
       -
               <div class="p-4 bg-green-50 dark:bg-green-900 rounded-lg border-2 border-green-200 dark:border-green-800">

     

       537
       537
       -
                 <p class="text-sm text-green-800 dark:text-green-200">

     

       538
       538
       -
                   Migration completed successfully! You can now close this page.

     

       539
       539
       -
                 </p>

     

       540
       540
       -
                 <button

     

       541
       541
       -
                   onClick={async () => {

     

       542
       542
       -
                     try {

     

       543
       543
       -
                       const response = await fetch("/api/logout", {

     

       544
       544
       -
                         method: "POST",

     

       545
       545
       -
                         credentials: "include",

     

       546
       546
       -
                       });

     

       547
       547
       -
                       if (!response.ok) {

     

       548
       548
       -
                         throw new Error("Logout failed");

     

       549
       549
       -
                       }

     

       550
       550
       -
                       globalThis.location.href = "/";

     

       551
       551
       -
                     } catch (error) {

     

       552
       552
       -
                       console.error("Failed to logout:", error);

     

       553
       553
       -
                     }

     

       554
       554
       -
                   }}

     

       555
       555
       -
                   class="mt-4 px-4 py-2 bg-green-600 hover:bg-green-700 text-white rounded-md transition-colors duration-200"

     

       556
       556
       -
                 >

     

       557
       557
       -
                   Sign Out

     

       558
       558
       -
                 </button>

     

       559
       162
        
               </div>

     

       560
       163
        
             )}

     

       164
       164
       +
       

     

       165
       165
       +
             <div class="space-y-4">

     

       166
       166
       +
               <AccountCreationStep

     

       167
       167
       +
                 credentials={credentials}

     

       168
       168
       +
                 onStepComplete={() => handleStepComplete(0)}

     

       169
       169
       +
                 onStepError={(error, isVerificationError) =>

     

       170
       170
       +
                   handleStepError(0, error, isVerificationError)}

     

       171
       171
       +
                 isActive={isStepActive(0)}

     

       172
       172
       +
               />

     

       173
       173
       +
       

     

       174
       174
       +
               <DataMigrationStep

     

       175
       175
       +
                 credentials={credentials}

     

       176
       176
       +
                 onStepComplete={() => handleStepComplete(1)}

     

       177
       177
       +
                 onStepError={(error, isVerificationError) =>

     

       178
       178
       +
                   handleStepError(1, error, isVerificationError)}

     

       179
       179
       +
                 isActive={isStepActive(1)}

     

       180
       180
       +
               />

     

       181
       181
       +
       

     

       182
       182
       +
               <IdentityMigrationStep

     

       183
       183
       +
                 credentials={credentials}

     

       184
       184
       +
                 onStepComplete={() => handleStepComplete(2)}

     

       185
       185
       +
                 onStepError={(error, isVerificationError) =>

     

       186
       186
       +
                   handleStepError(2, error, isVerificationError)}

     

       187
       187
       +
                 isActive={isStepActive(2)}

     

       188
       188
       +
               />

     

       189
       189
       +
       

     

       190
       190
       +
               <FinalizationStep

     

       191
       191
       +
                 credentials={credentials}

     

       192
       192
       +
                 onStepComplete={() => handleStepComplete(3)}

     

       193
       193
       +
                 onStepError={(error, isVerificationError) =>

     

       194
       194
       +
                   handleStepError(3, error, isVerificationError)}

     

       195
       195
       +
                 isActive={isStepActive(3)}

     

       196
       196
       +
               />

     

       197
       197
       +
             </div>

     

       198
       198
       +
       

     

       199
       199
       +
             <MigrationCompletion isVisible={allStepsCompleted} />

     

       561
       200
        
           </div>

     

       562
       201
        
         );

     

       563
       202
        
       }

+358 -76

islands/MigrationSetup.tsx

···

       1
       1
       -
       import { useState, useEffect } from "preact/hooks";

     

       1
       1
       +
       import { useEffect, useState } from "preact/hooks";

     

       2
       2
        
       import { IS_BROWSER } from "fresh/runtime";

     

       3
       3
        
       

     

       4
       4
       +
       /**

     

       5
       5
       +
        * The migration setup props.

     

       6
       6
       +
        * @type {MigrationSetupProps}

     

       7
       7
       +
        */

     

       4
       8
        
       interface MigrationSetupProps {

     

       5
       9
        
         service?: string | null;

     

       6
       10
        
         handle?: string | null;

     
···

       8
       12
        
         invite?: string | null;

     

       9
       13
        
       }

     

       10
       14
        
       

     

       15
       15
       +
       /**

     

       16
       16
       +
        * The server description.

     

       17
       17
       +
        * @type {ServerDescription}

     

       18
       18
       +
        */

     

       11
       19
        
       interface ServerDescription {

     

       12
       20
        
         inviteCodeRequired: boolean;

     

       13
       21
        
         availableUserDomains: string[];

     

       14
       22
        
       }

     

       15
       23
        
       

     

       24
       24
       +
       /**

     

       25
       25
       +
        * The user passport.

     

       26
       26
       +
        * @type {UserPassport}

     

       27
       27
       +
        */

     

       16
       28
        
       interface UserPassport {

     

       17
       29
        
         did: string;

     

       18
       30
        
         handle: string;

     
···

       20
       32
        
         createdAt?: string;

     

       21
       33
        
       }

     

       22
       34
        
       

     

       35
       35
       +
       /**

     

       36
       36
       +
        * The migration state info.

     

       37
       37
       +
        * @type {MigrationStateInfo}

     

       38
       38
       +
        */

     

       39
       39
       +
       interface MigrationStateInfo {

     

       40
       40
       +
         state: "up" | "issue" | "maintenance";

     

       41
       41
       +
         message: string;

     

       42
       42
       +
         allowMigration: boolean;

     

       43
       43
       +
       }

     

       44
       44
       +
       

     

       45
       45
       +
       /**

     

       46
       46
       +
        * The migration setup component.

     

       47
       47
       +
        * @param props - The migration setup props

     

       48
       48
       +
        * @returns The migration setup component

     

       49
       49
       +
        * @component

     

       50
       50
       +
        */

     

       23
       51
        
       export default function MigrationSetup(props: MigrationSetupProps) {

     

       24
       52
        
         const [service, setService] = useState(props.service || "");

     

       25
       53
        
         const [handlePrefix, setHandlePrefix] = useState(

     
···

       36
       64
        
         const [showConfirmation, setShowConfirmation] = useState(false);

     

       37
       65
        
         const [confirmationText, setConfirmationText] = useState("");

     

       38
       66
        
         const [passport, setPassport] = useState<UserPassport | null>(null);

     

       67
       67
       +
         const [migrationState, setMigrationState] = useState<

     

       68
       68
       +
           MigrationStateInfo | null

     

       69
       69
       +
         >(null);

     

       39
       70
        
       

     

       40
       71
        
         const ensureServiceUrl = (url: string): string => {

     

       41
       72
        
           if (!url) return url;

     
···

       52
       83
        
         useEffect(() => {

     

       53
       84
        
           if (!IS_BROWSER) return;

     

       54
       85
        
       

     

       55
       55
       -
           const fetchPassport = async () => {

     

       86
       86
       +
           const fetchInitialData = async () => {

     

       56
       87
        
             try {

     

       88
       88
       +
               // Check migration state first

     

       89
       89
       +
               const migrationResponse = await fetch("/api/migration-state");

     

       90
       90
       +
               if (migrationResponse.ok) {

     

       91
       91
       +
                 const migrationData = await migrationResponse.json();

     

       92
       92
       +
                 setMigrationState(migrationData);

     

       93
       93
       +
               }

     

       94
       94
       +
       

     

       95
       95
       +
               // Fetch user passport

     

       57
       96
        
               const response = await fetch("/api/me", {

     

       58
       97
        
                 credentials: "include",

     

       59
       98
        
               });

     
···

       63
       102
        
               const userData = await response.json();

     

       64
       103
        
               if (userData) {

     

       65
       104
        
                 // Get PDS URL from the current service

     

       66
       66
       -
                 const pdsResponse = await fetch(`/api/resolve-pds?did=${userData.did}`);

     

       105
       105
       +
                 const pdsResponse = await fetch(

     

       106
       106
       +
                   `/api/resolve-pds?did=${userData.did}`,

     

       107
       107
       +
                 );

     

       67
       108
        
                 const pdsData = await pdsResponse.json();

     

       68
       68
       -
                 

     

       109
       109
       +
       

     

       69
       110
        
                 setPassport({

     

       70
       111
        
                   did: userData.did,

     

       71
       112
        
                   handle: userData.handle,

     

       72
       113
        
                   pds: pdsData.pds || "Unknown",

     

       73
       73
       -
                   createdAt: new Date().toISOString() // TODO: Get actual creation date from API

     

       114
       114
       +
                   createdAt: new Date().toISOString(), // TODO: Get actual creation date from API

     

       74
       115
        
                 });

     

       75
       116
        
               }

     

       76
       117
        
             } catch (error) {

     

       77
       77
       -
               console.error("Failed to fetch passport:", error);

     

       118
       118
       +
               console.error("Failed to fetch initial data:", error);

     

       78
       119
        
             }

     

       79
       120
        
           };

     

       80
       121
        
       

     

       81
       81
       -
           fetchPassport();

     

       122
       122
       +
           fetchInitialData();

     

       82
       123
        
         }, []);

     

       83
       124
        
       

     

       84
       125
        
         const checkServerDescription = async (serviceUrl: string) => {

     
···

       126
       167
        
         const handleSubmit = (e: Event) => {

     

       127
       168
        
           e.preventDefault();

     

       128
       169
        
       

     

       170
       170
       +
           // Check migration state first

     

       171
       171
       +
           if (migrationState && !migrationState.allowMigration) {

     

       172
       172
       +
             setError(migrationState.message);

     

       173
       173
       +
             return;

     

       174
       174
       +
           }

     

       175
       175
       +
       

     

       129
       176
        
           if (!service || !handlePrefix || !email || !password) {

     

       130
       177
        
             setError("Please fill in all required fields");

     

       131
       178
        
             return;

     
···

       140
       187
        
         };

     

       141
       188
        
       

     

       142
       189
        
         const handleConfirmation = () => {

     

       190
       190
       +
           // Double-check migration state before proceeding

     

       191
       191
       +
           if (migrationState && !migrationState.allowMigration) {

     

       192
       192
       +
             setError(migrationState.message);

     

       193
       193
       +
             return;

     

       194
       194
       +
           }

     

       195
       195
       +
       

     

       143
       196
        
           if (confirmationText !== "MIGRATE") {

     

       144
       197
        
             setError("Please type 'MIGRATE' to confirm");

     

       145
       198
        
             return;

     
···

       168
       221
        
           <div class="max-w-2xl mx-auto p-6 bg-gradient-to-b from-blue-50 to-white dark:from-gray-800 dark:to-gray-900 rounded-lg shadow-xl relative overflow-hidden">

     

       169
       222
        
             {/* Decorative airport elements */}

     

       170
       223
        
             <div class="absolute top-0 left-0 w-full h-1 bg-blue-500"></div>

     

       171
       171
       -
             <div class="absolute top-2 left-4 text-blue-500 text-sm font-mono">TERMINAL 1</div>

     

       172
       172
       -
             <div class="absolute top-2 right-4 text-blue-500 text-sm font-mono">GATE M1</div>

     

       224
       224
       +
             <div class="absolute top-2 left-4 text-blue-500 text-sm font-mono">

     

       225
       225
       +
               TERMINAL 1

     

       226
       226
       +
             </div>

     

       227
       227
       +
             <div class="absolute top-2 right-4 text-blue-500 text-sm font-mono">

     

       228
       228
       +
               GATE M1

     

       229
       229
       +
             </div>

     

       230
       230
       +
       

     

       231
       231
       +
             {/* Migration state alert */}

     

       232
       232
       +
             {migrationState && !migrationState.allowMigration && (

     

       233
       233
       +
               <div

     

       234
       234
       +
                 class={`mb-6 mt-4 p-4 rounded-lg border ${

     

       235
       235
       +
                   migrationState.state === "maintenance"

     

       236
       236
       +
                     ? "bg-yellow-50 border-yellow-200 text-yellow-800 dark:bg-yellow-900/20 dark:border-yellow-800 dark:text-yellow-200"

     

       237
       237
       +
                     : "bg-red-50 border-red-200 text-red-800 dark:bg-red-900/20 dark:border-red-800 dark:text-red-200"

     

       238
       238
       +
                 }`}

     

       239
       239
       +
               >

     

       240
       240
       +
                 <div class="flex items-center">

     

       241
       241
       +
                   <div

     

       242
       242
       +
                     class={`mr-3 ${

     

       243
       243
       +
                       migrationState.state === "maintenance"

     

       244
       244
       +
                         ? "text-yellow-600 dark:text-yellow-400"

     

       245
       245
       +
                         : "text-red-600 dark:text-red-400"

     

       246
       246
       +
                     }`}

     

       247
       247
       +
                   >

     

       248
       248
       +
                     {migrationState.state === "maintenance" ? "⚠️" : "🚫"}

     

       249
       249
       +
                   </div>

     

       250
       250
       +
                   <div>

     

       251
       251
       +
                     <h3 class="font-semibold mb-1">

     

       252
       252
       +
                       {migrationState.state === "maintenance"

     

       253
       253
       +
                         ? "Maintenance Mode"

     

       254
       254
       +
                         : "Service Unavailable"}

     

       255
       255
       +
                     </h3>

     

       256
       256
       +
                     <p class="text-sm">{migrationState.message}</p>

     

       257
       257
       +
                   </div>

     

       258
       258
       +
                 </div>

     

       259
       259
       +
               </div>

     

       260
       260
       +
             )}

     

       173
       261
        
       

     

       174
       262
        
             <div class="text-center mb-8 relative">

     

       175
       175
       -
               <p class="text-gray-600 dark:text-gray-400 mt-4">Please complete your migration check-in</p>

     

       176
       176
       -
               <div class="mt-2 text-sm text-gray-500 dark:text-gray-400 font-mono">FLIGHT: MIG-2024</div>

     

       263
       263
       +
               <p class="text-gray-600 dark:text-gray-400 mt-4">

     

       264
       264
       +
                 Please complete your migration check-in

     

       265
       265
       +
               </p>

     

       266
       266
       +
               <div class="mt-2 text-sm text-gray-500 dark:text-gray-400 font-mono">

     

       267
       267
       +
                 FLIGHT: MIG-2024

     

       268
       268
       +
               </div>

     

       177
       269
        
             </div>

     

       178
       270
        
       

     

       179
       271
        
             {/* Passport Section */}

     

       180
       272
        
             {passport && (

     

       181
       273
        
               <div class="mb-8 bg-white dark:bg-gray-800 rounded-lg shadow-md p-6 border border-gray-200 dark:border-gray-700">

     

       182
       274
        
                 <div class="flex items-center justify-between mb-4">

     

       183
       183
       -
                   <h3 class="text-lg font-semibold text-gray-900 dark:text-white">Current Passport</h3>

     

       184
       184
       -
                   <div class="text-xs text-gray-500 dark:text-gray-400 font-mono">ISSUED: {new Date().toLocaleDateString()}</div>

     

       275
       275
       +
                   <h3 class="text-lg font-semibold text-gray-900 dark:text-white">

     

       276
       276
       +
                     Current Passport

     

       277
       277
       +
                   </h3>

     

       278
       278
       +
                   <div class="text-xs text-gray-500 dark:text-gray-400 font-mono">

     

       279
       279
       +
                     ISSUED: {new Date().toLocaleDateString()}

     

       280
       280
       +
                   </div>

     

       185
       281
        
                 </div>

     

       186
       282
        
                 <div class="grid grid-cols-2 gap-4 text-sm">

     

       187
       283
        
                   <div>

     

       188
       284
        
                     <div class="text-gray-500 dark:text-gray-400 mb-1">Handle</div>

     

       189
       189
       -
                     <div class="font-mono text-gray-900 dark:text-white">{passport.handle}</div>

     

       285
       285
       +
                     <div class="font-mono text-gray-900 dark:text-white">

     

       286
       286
       +
                       {passport.handle}

     

       287
       287
       +
                     </div>

     

       190
       288
        
                   </div>

     

       191
       289
        
                   <div>

     

       192
       290
        
                     <div class="text-gray-500 dark:text-gray-400 mb-1">DID</div>

     

       193
       193
       -
                     <div class="font-mono text-gray-900 dark:text-white break-all">{passport.did}</div>

     

       291
       291
       +
                     <div class="font-mono text-gray-900 dark:text-white break-all">

     

       292
       292
       +
                       {passport.did}

     

       293
       293
       +
                     </div>

     

       194
       294
        
                   </div>

     

       195
       295
        
                   <div>

     

       196
       196
       -
                     <div class="text-gray-500 dark:text-gray-400 mb-1">Citizen of PDS</div>

     

       197
       197
       -
                     <div class="font-mono text-gray-900 dark:text-white break-all">{passport.pds}</div>

     

       296
       296
       +
                     <div class="text-gray-500 dark:text-gray-400 mb-1">

     

       297
       297
       +
                       Citizen of PDS

     

       298
       298
       +
                     </div>

     

       299
       299
       +
                     <div class="font-mono text-gray-900 dark:text-white break-all">

     

       300
       300
       +
                       {passport.pds}

     

       301
       301
       +
                     </div>

     

       198
       302
        
                   </div>

     

       199
       303
        
                   <div>

     

       200
       200
       -
                     <div class="text-gray-500 dark:text-gray-400 mb-1">Account Age</div>

     

       304
       304
       +
                     <div class="text-gray-500 dark:text-gray-400 mb-1">

     

       305
       305
       +
                       Account Age

     

       306
       306
       +
                     </div>

     

       201
       307
        
                     <div class="font-mono text-gray-900 dark:text-white">

     

       202
       202
       -
                       {passport.createdAt ? new Date(passport.createdAt).toLocaleDateString() : "Unknown"}

     

       308
       308
       +
                       {passport.createdAt

     

       309
       309
       +
                         ? new Date(passport.createdAt).toLocaleDateString()

     

       310
       310
       +
                         : "Unknown"}

     

       203
       311
        
                     </div>

     

       204
       312
        
                   </div>

     

       205
       313
        
                 </div>

     
···

       208
       316
        
       

     

       209
       317
        
             <form onSubmit={handleSubmit} class="space-y-6">

     

       210
       318
        
               {error && (

     

       211
       211
       -
                 <div class="bg-red-50 dark:bg-red-900 rounded-lg">

     

       319
       319
       +
                 <div class="bg-red-50 dark:bg-red-900 rounded-lg ">

     

       212
       320
        
                   <p class="text-red-800 dark:text-red-200 flex items-center">

     

       213
       213
       -
                     <svg class="w-5 h-5 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">

     

       214
       214
       -
                       <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z"></path>

     

       321
       321
       +
                     <svg

     

       322
       322
       +
                       class="w-5 h-5 mr-2"

     

       323
       323
       +
                       fill="none"

     

       324
       324
       +
                       stroke="currentColor"

     

       325
       325
       +
                       viewBox="0 0 24 24"

     

       326
       326
       +
                     >

     

       327
       327
       +
                       <path

     

       328
       328
       +
                         stroke-linecap="round"

     

       329
       329
       +
                         stroke-linejoin="round"

     

       330
       330
       +
                         stroke-width="2"

     

       331
       331
       +
                         d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z"

     

       332
       332
       +
                       >

     

       333
       333
       +
                       </path>

     

       215
       334
        
                     </svg>

     

       216
       335
        
                     {error}

     

       217
       336
        
                   </p>

     
···

       222
       341
        
                 <div>

     

       223
       342
        
                   <label class="block text-sm font-medium text-gray-700 dark:text-gray-300">

     

       224
       343
        
                     Destination Server

     

       225
       225
       -
                     <span class="text-xs text-gray-500 ml-1">(Final Destination)</span>

     

       344
       344
       +
                     <span class="text-xs text-gray-500 ml-1">

     

       345
       345
       +
                       (Final Destination)

     

       346
       346
       +
                     </span>

     

       226
       347
        
                   </label>

     

       227
       348
        
                   <div class="relative">

     

       228
       349
        
                     <input

     
···

       235
       356
        
                       class="mt-1 block w-full rounded-md bg-white dark:bg-gray-700 shadow-sm focus:ring-2 focus:ring-blue-500 focus:ring-opacity-50 dark:text-white disabled:opacity-50 disabled:cursor-not-allowed pl-10"

     

       236
       357
        
                     />

     

       237
       358
        
                     <div class="absolute inset-y-0 left-0 pl-3 flex items-center pointer-events-none">

     

       238
       238
       -
                       <svg class="h-5 w-5 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">

     

       239
       239
       -
                         <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 12a9 9 0 01-9 9m9-9a9 9 0 00-9-9m9 9H3m9 9a9 9 0 01-9-9m9 9c1.657 0 3-4.03 3-9s-1.343-9-3-9m0 18c-1.657 0-3-4.03-3-9s1.343-9 3-9m-9 9a9 9 0 019-9"></path>

     

       359
       359
       +
                       <svg

     

       360
       360
       +
                         class="h-5 w-5 text-gray-400"

     

       361
       361
       +
                         fill="none"

     

       362
       362
       +
                         stroke="currentColor"

     

       363
       363
       +
                         viewBox="0 0 24 24"

     

       364
       364
       +
                       >

     

       365
       365
       +
                         <path

     

       366
       366
       +
                           stroke-linecap="round"

     

       367
       367
       +
                           stroke-linejoin="round"

     

       368
       368
       +
                           stroke-width="2"

     

       369
       369
       +
                           d="M21 12a9 9 0 01-9 9m9-9a9 9 0 00-9-9m9 9H3m9 9a9 9 0 01-9-9m9 9c1.657 0 3-4.03 3-9s-1.343-9-3-9m0 18c-1.657 0-3-4.03-3-9s1.343-9 3-9m-9 9a9 9 0 019-9"

     

       370
       370
       +
                         >

     

       371
       371
       +
                         </path>

     

       240
       372
        
                       </svg>

     

       241
       373
        
                     </div>

     

       242
       374
        
                   </div>

     

       243
       375
        
                   {isLoading && (

     

       244
       376
        
                     <p class="mt-1 text-sm text-gray-500 dark:text-gray-400 flex items-center">

     

       245
       245
       -
                       <svg class="animate-spin -ml-1 mr-2 h-4 w-4 text-blue-500" fill="none" viewBox="0 0 24 24">

     

       246
       246
       -
                         <circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"></circle>

     

       247
       247
       -
                         <path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"></path>

     

       377
       377
       +
                       <svg

     

       378
       378
       +
                         class="animate-spin -ml-1 mr-2 h-4 w-4 text-blue-500"

     

       379
       379
       +
                         fill="none"

     

       380
       380
       +
                         viewBox="0 0 24 24"

     

       381
       381
       +
                       >

     

       382
       382
       +
                         <circle

     

       383
       383
       +
                           class="opacity-25"

     

       384
       384
       +
                           cx="12"

     

       385
       385
       +
                           cy="12"

     

       386
       386
       +
                           r="10"

     

       387
       387
       +
                           stroke="currentColor"

     

       388
       388
       +
                           stroke-width="4"

     

       389
       389
       +
                         >

     

       390
       390
       +
                         </circle>

     

       391
       391
       +
                         <path

     

       392
       392
       +
                           class="opacity-75"

     

       393
       393
       +
                           fill="currentColor"

     

       394
       394
       +
                           d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"

     

       395
       395
       +
                         >

     

       396
       396
       +
                         </path>

     

       248
       397
        
                       </svg>

     

       249
       398
        
                       Verifying destination server...

     

       250
       399
        
                     </p>

     
···

       255
       404
        
                   <label class="block text-sm font-medium text-gray-700 dark:text-gray-300">

     

       256
       405
        
                     New Account Handle

     

       257
       406
        
                     <span class="text-xs text-gray-500 ml-1">(Passport ID)</span>

     

       407
       407
       +
                     <div class="inline-block relative group ml-2">

     

       408
       408
       +
                       <svg

     

       409
       409
       +
                         class="w-4 h-4 text-gray-400 hover:text-gray-600 dark:hover:text-gray-300 cursor-help"

     

       410
       410
       +
                         fill="currentColor"

     

       411
       411
       +
                         viewBox="0 0 20 20"

     

       412
       412
       +
                       >

     

       413
       413
       +
                         <path

     

       414
       414
       +
                           fill-rule="evenodd"

     

       415
       415
       +
                           d="M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-8-3a1 1 0 00-.867.5 1 1 0 11-1.731-1A3 3 0 0113 8a3.001 3.001 0 01-2 2.83V11a1 1 0 11-2 0v-1a1 1 0 011-1 1 1 0 100-2zm0 8a1 1 0 100-2 1 1 0 000 2z"

     

       416
       416
       +
                           clip-rule="evenodd"

     

       417
       417
       +
                         />

     

       418
       418
       +
                       </svg>

     

       419
       419
       +
                       <div class="absolute bottom-full left-1/2 transform -translate-x-1/2 mb-2 px-3 py-2 bg-gray-900 text-white text-sm rounded-lg opacity-0 group-hover:opacity-100 transition-opacity duration-200 pointer-events-none whitespace-nowrap z-10">

     

       420
       420
       +
                         You can change your handle to a custom domain later

     

       421
       421
       +
                         <div class="absolute top-full left-1/2 transform -translate-x-1/2 border-4 border-transparent border-t-gray-900">

     

       422
       422
       +
                         </div>

     

       423
       423
       +
                       </div>

     

       424
       424
       +
                     </div>

     

       258
       425
        
                   </label>

     

       259
       426
        
                   <div class="mt-1 relative w-full">

     

       260
       427
        
                     <div class="flex rounded-md shadow-sm w-full">

     
···

       266
       433
        
                           placeholder="username"

     

       267
       434
        
                           required

     

       268
       435
        
                           class="w-full rounded-md bg-white dark:bg-gray-700 shadow-sm focus:ring-2 focus:ring-blue-500 focus:ring-opacity-50 dark:text-white pl-10 pr-32"

     

       269
       269
       -
                           style={{ fontFamily: 'inherit' }}

     

       436
       436
       +
                           style={{ fontFamily: "inherit" }}

     

       270
       437
        
                         />

     

       271
       438
        
                         <div class="absolute inset-y-0 left-0 pl-3 flex items-center pointer-events-none">

     

       272
       272
       -
                           <svg class="h-5 w-5 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">

     

       273
       273
       -
                             <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M16 7a4 4 0 11-8 0 4 4 0 018 0zM12 14a7 7 0 00-7 7h14a7 7 0 00-7-7z"></path>

     

       439
       439
       +
                           <svg

     

       440
       440
       +
                             class="h-5 w-5 text-gray-400"

     

       441
       441
       +
                             fill="none"

     

       442
       442
       +
                             stroke="currentColor"

     

       443
       443
       +
                             viewBox="0 0 24 24"

     

       444
       444
       +
                           >

     

       445
       445
       +
                             <path

     

       446
       446
       +
                               stroke-linecap="round"

     

       447
       447
       +
                               stroke-linejoin="round"

     

       448
       448
       +
                               stroke-width="2"

     

       449
       449
       +
                               d="M16 7a4 4 0 11-8 0 4 4 0 018 0zM12 14a7 7 0 00-7 7h14a7 7 0 00-7-7z"

     

       450
       450
       +
                             >

     

       451
       451
       +
                             </path>

     

       274
       452
        
                           </svg>

     

       275
       453
        
                         </div>

     

       276
       454
        
                         {/* Suffix for domain ending */}

     

       277
       277
       -
                         {availableDomains.length > 0 ? (

     

       278
       278
       -
                           availableDomains.length === 1 ? (

     

       455
       455
       +
                         {availableDomains.length > 0

     

       456
       456
       +
                           ? (

     

       457
       457
       +
                             availableDomains.length === 1

     

       458
       458
       +
                               ? (

     

       459
       459
       +
                                 <span class="absolute inset-y-0 right-0 flex items-center pr-3 text-gray-400 select-none pointer-events-none font-mono text-base">

     

       460
       460
       +
                                   {availableDomains[0]}

     

       461
       461
       +
                                 </span>

     

       462
       462
       +
                               )

     

       463
       463
       +
                               : (

     

       464
       464
       +
                                 <span class="absolute inset-y-0 right-0 flex items-center pr-1">

     

       465
       465
       +
                                   <select

     

       466
       466
       +
                                     value={selectedDomain}

     

       467
       467
       +
                                     onChange={(e) =>

     

       468
       468
       +
                                       setSelectedDomain(e.currentTarget.value)}

     

       469
       469
       +
                                     class="bg-transparent text-gray-400 font-mono text-base focus:outline-none focus:ring-0 border-0 pr-2"

     

       470
       470
       +
                                     style={{ appearance: "none" }}

     

       471
       471
       +
                                   >

     

       472
       472
       +
                                     {availableDomains.map((domain) => (

     

       473
       473
       +
                                       <option key={domain} value={domain}>

     

       474
       474
       +
                                         {domain}

     

       475
       475
       +
                                       </option>

     

       476
       476
       +
                                     ))}

     

       477
       477
       +
                                   </select>

     

       478
       478
       +
                                 </span>

     

       479
       479
       +
                               )

     

       480
       480
       +
                           )

     

       481
       481
       +
                           : (

     

       279
       482
        
                             <span class="absolute inset-y-0 right-0 flex items-center pr-3 text-gray-400 select-none pointer-events-none font-mono text-base">

     

       280
       280
       -
                               {availableDomains[0]}

     

       483
       483
       +
                               .example.com

     

       281
       484
        
                             </span>

     

       282
       282
       -
                           ) : (

     

       283
       283
       -
                             <span class="absolute inset-y-0 right-0 flex items-center pr-1">

     

       284
       284
       -
                               <select

     

       285
       285
       -
                                 value={selectedDomain}

     

       286
       286
       -
                                 onChange={(e) => setSelectedDomain(e.currentTarget.value)}

     

       287
       287
       -
                                 class="bg-transparent text-gray-400 font-mono text-base focus:outline-none focus:ring-0 border-0 pr-2"

     

       288
       288
       -
                                 style={{ appearance: 'none' }}

     

       289
       289
       -
                               >

     

       290
       290
       -
                                 {availableDomains.map((domain) => (

     

       291
       291
       -
                                   <option key={domain} value={domain}>{domain}</option>

     

       292
       292
       -
                                 ))}

     

       293
       293
       -
                               </select>

     

       294
       294
       -
                             </span>

     

       295
       295
       -
                           )

     

       296
       296
       -
                         ) : (

     

       297
       297
       -
                           <span class="absolute inset-y-0 right-0 flex items-center pr-3 text-gray-400 select-none pointer-events-none font-mono text-base">

     

       298
       298
       -
                             .example.com

     

       299
       299
       -
                           </span>

     

       300
       300
       -
                         )}

     

       485
       485
       +
                           )}

     

       301
       486
        
                       </div>

     

       302
       487
        
                     </div>

     

       303
       488
        
                   </div>

     
···

       306
       491
        
                 <div>

     

       307
       492
        
                   <label class="block text-sm font-medium text-gray-700 dark:text-gray-300">

     

       308
       493
        
                     Email

     

       309
       309
       -
                     <span class="text-xs text-gray-500 ml-1">(Emergency Contact)</span>

     

       494
       494
       +
                     <span class="text-xs text-gray-500 ml-1">

     

       495
       495
       +
                       (Emergency Contact)

     

       496
       496
       +
                     </span>

     

       310
       497
        
                   </label>

     

       311
       498
        
                   <div class="relative">

     

       312
       499
        
                     <input

     
···

       317
       504
        
                       class="mt-1 block w-full rounded-md bg-white dark:bg-gray-700 shadow-sm focus:ring-2 focus:ring-blue-500 focus:ring-opacity-50 dark:text-white pl-10"

     

       318
       505
        
                     />

     

       319
       506
        
                     <div class="absolute inset-y-0 left-0 pl-3 flex items-center pointer-events-none">

     

       320
       320
       -
                       <svg class="h-5 w-5 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">

     

       321
       321
       -
                         <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z"></path>

     

       507
       507
       +
                       <svg

     

       508
       508
       +
                         class="h-5 w-5 text-gray-400"

     

       509
       509
       +
                         fill="none"

     

       510
       510
       +
                         stroke="currentColor"

     

       511
       511
       +
                         viewBox="0 0 24 24"

     

       512
       512
       +
                       >

     

       513
       513
       +
                         <path

     

       514
       514
       +
                           stroke-linecap="round"

     

       515
       515
       +
                           stroke-linejoin="round"

     

       516
       516
       +
                           stroke-width="2"

     

       517
       517
       +
                           d="M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z"

     

       518
       518
       +
                         >

     

       519
       519
       +
                         </path>

     

       322
       520
        
                       </svg>

     

       323
       521
        
                     </div>

     

       324
       522
        
                   </div>

     
···

       327
       525
        
                 <div>

     

       328
       526
        
                   <label class="block text-sm font-medium text-gray-700 dark:text-gray-300">

     

       329
       527
        
                     New Account Password

     

       330
       330
       -
                     <span class="text-xs text-gray-500 ml-1">(Security Clearance)</span>

     

       528
       528
       +
                     <span class="text-xs text-gray-500 ml-1">

     

       529
       529
       +
                       (Security Clearance)

     

       530
       530
       +
                     </span>

     

       331
       531
        
                   </label>

     

       332
       532
        
                   <div class="relative">

     

       333
       533
        
                     <input

     
···

       338
       538
        
                       class="mt-1 block w-full rounded-md bg-white dark:bg-gray-700 shadow-sm focus:ring-2 focus:ring-blue-500 focus:ring-opacity-50 dark:text-white pl-10"

     

       339
       539
        
                     />

     

       340
       540
        
                     <div class="absolute inset-y-0 left-0 pl-3 flex items-center pointer-events-none">

     

       341
       341
       -
                       <svg class="h-5 w-5 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">

     

       342
       342
       -
                         <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 15v2m-6 4h12a2 2 0 002-2v-6a2 2 0 00-2-2H6a2 2 0 00-2 2v6a2 2 0 002 2zm10-10V7a4 4 0 00-8 0v4h8z"></path>

     

       541
       541
       +
                       <svg

     

       542
       542
       +
                         class="h-5 w-5 text-gray-400"

     

       543
       543
       +
                         fill="none"

     

       544
       544
       +
                         stroke="currentColor"

     

       545
       545
       +
                         viewBox="0 0 24 24"

     

       546
       546
       +
                       >

     

       547
       547
       +
                         <path

     

       548
       548
       +
                           stroke-linecap="round"

     

       549
       549
       +
                           stroke-linejoin="round"

     

       550
       550
       +
                           stroke-width="2"

     

       551
       551
       +
                           d="M12 15v2m-6 4h12a2 2 0 002-2v-6a2 2 0 00-2-2H6a2 2 0 00-2 2v6a2 2 0 002 2zm10-10V7a4 4 0 00-8 0v4h8z"

     

       552
       552
       +
                         >

     

       553
       553
       +
                         </path>

     

       343
       554
        
                       </svg>

     

       344
       555
        
                     </div>

     

       345
       556
        
                   </div>

     
···

       360
       571
        
                         class="mt-1 block w-full rounded-md bg-white dark:bg-gray-700 shadow-sm focus:ring-2 focus:ring-blue-500 focus:ring-opacity-50 dark:text-white pl-10"

     

       361
       572
        
                       />

     

       362
       573
        
                       <div class="absolute inset-y-0 left-0 pl-3 flex items-center pointer-events-none">

     

       363
       363
       -
                         <svg class="h-5 w-5 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">

     

       364
       364
       -
                           <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 5v2m0 4v2m0 4v2M5 5a2 2 0 00-2 2v3a2 2 0 110 4v3a2 2 0 002 2h14a2 2 0 002-2v-3a2 2 0 110-4V7a2 2 0 00-2-2H5z"></path>

     

       574
       574
       +
                         <svg

     

       575
       575
       +
                           class="h-5 w-5 text-gray-400"

     

       576
       576
       +
                           fill="none"

     

       577
       577
       +
                           stroke="currentColor"

     

       578
       578
       +
                           viewBox="0 0 24 24"

     

       579
       579
       +
                         >

     

       580
       580
       +
                           <path

     

       581
       581
       +
                             stroke-linecap="round"

     

       582
       582
       +
                             stroke-linejoin="round"

     

       583
       583
       +
                             stroke-width="2"

     

       584
       584
       +
                             d="M15 5v2m0 4v2m0 4v2M5 5a2 2 0 00-2 2v3a2 2 0 110 4v3a2 2 0 002 2h14a2 2 0 002-2v-3a2 2 0 110-4V7a2 2 0 00-2-2H5z"

     

       585
       585
       +
                           >

     

       586
       586
       +
                           </path>

     

       365
       587
        
                         </svg>

     

       366
       588
        
                       </div>

     

       367
       589
        
                     </div>

     
···

       371
       593
        
       

     

       372
       594
        
               <button

     

       373
       595
        
                 type="submit"

     

       374
       374
       -
                 disabled={isLoading}

     

       596
       596
       +
                 disabled={isLoading ||

     

       597
       597
       +
                   Boolean(migrationState && !migrationState.allowMigration)}

     

       375
       598
        
                 class="w-full flex justify-center items-center py-3 px-4 rounded-md shadow-sm text-sm font-medium text-white bg-blue-600 hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 disabled:opacity-50 disabled:cursor-not-allowed"

     

       376
       599
        
               >

     

       377
       377
       -
                 <svg class="w-5 h-5 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">

     

       378
       378
       -
                   <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path>

     

       600
       600
       +
                 <svg

     

       601
       601
       +
                   class="w-5 h-5 mr-2"

     

       602
       602
       +
                   fill="none"

     

       603
       603
       +
                   stroke="currentColor"

     

       604
       604
       +
                   viewBox="0 0 24 24"

     

       605
       605
       +
                 >

     

       606
       606
       +
                   <path

     

       607
       607
       +
                     stroke-linecap="round"

     

       608
       608
       +
                     stroke-linejoin="round"

     

       609
       609
       +
                     stroke-width="2"

     

       610
       610
       +
                     d="M5 13l4 4L19 7"

     

       611
       611
       +
                   >

     

       612
       612
       +
                   </path>

     

       379
       613
        
                 </svg>

     

       380
       614
        
                 Proceed to Check-in

     

       381
       615
        
               </button>

     
···

       385
       619
        
               <div class="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center p-4 z-50">

     

       386
       620
        
                 <div

     

       387
       621
        
                   class="bg-white dark:bg-gray-800 rounded-xl p-8 max-w-md w-full shadow-2xl border-0 relative animate-popin"

     

       388
       388
       -
                   style={{ boxShadow: '0 8px 32px 0 rgba(255, 0, 0, 0.15), 0 1.5px 8px 0 rgba(0,0,0,0.10)' }}

     

       622
       622
       +
                   style={{

     

       623
       623
       +
                     boxShadow:

     

       624
       624
       +
                       "0 8px 32px 0 rgba(255, 0, 0, 0.15), 0 1.5px 8px 0 rgba(0,0,0,0.10)",

     

       625
       625
       +
                   }}

     

       389
       626
        
                 >

     

       390
       627
        
                   <div class="absolute -top-8 left-1/2 -translate-x-1/2">

     

       391
       628
        
                     <div class="bg-red-500 rounded-full p-3 shadow-lg animate-bounce-short">

     

       392
       392
       -
                       <svg class="w-8 h-8 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">

     

       393
       393
       -
                         <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z" />

     

       629
       629
       +
                       <svg

     

       630
       630
       +
                         class="w-8 h-8 text-white"

     

       631
       631
       +
                         fill="none"

     

       632
       632
       +
                         stroke="currentColor"

     

       633
       633
       +
                         viewBox="0 0 24 24"

     

       634
       634
       +
                       >

     

       635
       635
       +
                         <path

     

       636
       636
       +
                           stroke-linecap="round"

     

       637
       637
       +
                           stroke-linejoin="round"

     

       638
       638
       +
                           stroke-width="2"

     

       639
       639
       +
                           d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z"

     

       640
       640
       +
                         />

     

       394
       641
        
                       </svg>

     

       395
       642
        
                     </div>

     

       396
       643
        
                   </div>

     

       397
       644
        
                   <div class="text-center mb-4 mt-6">

     

       398
       398
       -
                     <h3 class="text-2xl font-bold text-red-600 mb-2 tracking-wide">Final Boarding Call</h3>

     

       645
       645
       +
                     <h3 class="text-2xl font-bold text-red-600 mb-2 tracking-wide">

     

       646
       646
       +
                       Final Boarding Call

     

       647
       647
       +
                     </h3>

     

       399
       648
        
                     <p class="text-gray-700 dark:text-gray-300 mb-2 text-base">

     

       400
       400
       -
                       <span class="font-semibold text-red-500">Warning:</span> This migration process can be <strong>irreversible</strong>.<br />Airport is in <strong>alpha</strong> currently, and we don't recommend it for main accounts. Migrate at your own risk. We reccomend backing up your data before proceeding.

     

       649
       649
       +
                       <span class="font-semibold text-red-500">Warning:</span>{" "}

     

       650
       650
       +
                       This migration is <strong>irreversible</strong>{" "}

     

       651
       651
       +
                       if coming from Bluesky servers.<br />Bluesky does not recommend

     

       652
       652
       +
                       it for main accounts. Migrate at your own risk. We reccomend

     

       653
       653
       +
                       backing up your data before proceeding.

     

       401
       654
        
                     </p>

     

       402
       655
        
                     <p class="text-gray-700 dark:text-gray-300 mb-4 text-base">

     

       403
       403
       -
                       Please type <span class="font-mono font-bold text-blue-600">MIGRATE</span> below to confirm and proceed.

     

       656
       656
       +
                       Please type{" "}

     

       657
       657
       +
                       <span class="font-mono font-bold text-blue-600">MIGRATE</span>

     

       658
       658
       +
                       {" "}

     

       659
       659
       +
                       below to confirm and proceed.

     

       404
       660
        
                     </p>

     

       405
       661
        
                   </div>

     

       406
       662
        
                   <div class="relative">

     
···

       419
       675
        
                       class="px-4 py-2 text-gray-700 dark:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-700 rounded-md flex items-center transition"

     

       420
       676
        
                       type="button"

     

       421
       677
        
                     >

     

       422
       422
       -
                       <svg class="w-5 h-5 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">

     

       423
       423
       -
                         <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"></path>

     

       678
       678
       +
                       <svg

     

       679
       679
       +
                         class="w-5 h-5 mr-2"

     

       680
       680
       +
                         fill="none"

     

       681
       681
       +
                         stroke="currentColor"

     

       682
       682
       +
                         viewBox="0 0 24 24"

     

       683
       683
       +
                       >

     

       684
       684
       +
                         <path

     

       685
       685
       +
                           stroke-linecap="round"

     

       686
       686
       +
                           stroke-linejoin="round"

     

       687
       687
       +
                           stroke-width="2"

     

       688
       688
       +
                           d="M6 18L18 6M6 6l12 12"

     

       689
       689
       +
                         >

     

       690
       690
       +
                         </path>

     

       424
       691
        
                       </svg>

     

       425
       692
        
                       Cancel

     

       426
       693
        
                     </button>

     

       427
       694
        
                     <button

     

       428
       695
        
                       onClick={handleConfirmation}

     

       429
       429
       -
                       class={`px-4 py-2 rounded-md flex items-center transition font-semibold ${confirmationText.trim().toLowerCase() === 'migrate' ? 'bg-red-600 text-white hover:bg-red-700 cursor-pointer' : 'bg-red-300 text-white cursor-not-allowed'}`}

     

       696
       696
       +
                       class={`px-4 py-2 rounded-md flex items-center transition font-semibold ${

     

       697
       697
       +
                         confirmationText.trim().toLowerCase() === "migrate"

     

       698
       698
       +
                           ? "bg-red-600 text-white hover:bg-red-700 cursor-pointer"

     

       699
       699
       +
                           : "bg-red-300 text-white cursor-not-allowed"

     

       700
       700
       +
                       }`}

     

       430
       701
        
                       type="button"

     

       431
       431
       -
                       disabled={confirmationText.trim().toLowerCase() !== 'migrate'}

     

       702
       702
       +
                       disabled={confirmationText.trim().toLowerCase() !== "migrate"}

     

       432
       703
        
                     >

     

       433
       433
       -
                       <svg class="w-5 h-5 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">

     

       434
       434
       -
                         <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path>

     

       704
       704
       +
                       <svg

     

       705
       705
       +
                         class="w-5 h-5 mr-2"

     

       706
       706
       +
                         fill="none"

     

       707
       707
       +
                         stroke="currentColor"

     

       708
       708
       +
                         viewBox="0 0 24 24"

     

       709
       709
       +
                       >

     

       710
       710
       +
                         <path

     

       711
       711
       +
                           stroke-linecap="round"

     

       712
       712
       +
                           stroke-linejoin="round"

     

       713
       713
       +
                           stroke-width="2"

     

       714
       714
       +
                           d="M5 13l4 4L19 7"

     

       715
       715
       +
                         >

     

       716
       716
       +
                         </path>

     

       435
       717
        
                       </svg>

     

       436
       718
        
                       Confirm Migration

     

       437
       719
        
                     </button>

+10

islands/OAuthCallback.tsx

···

       1
       1
        
       import { useEffect, useState } from "preact/hooks";

     

       2
       2
        
       import { IS_BROWSER } from "fresh/runtime";

     

       3
       3
        
       

     

       4
       4
       +
       /**

     

       5
       5
       +
        * The OAuth callback props.

     

       6
       6
       +
        * @type {OAuthCallbackProps}

     

       7
       7
       +
        */

     

       4
       8
        
       interface OAuthCallbackProps {

     

       5
       9
        
         error?: string;

     

       6
       10
        
       }

     

       7
       11
        
       

     

       12
       12
       +
       /**

     

       13
       13
       +
        * The OAuth callback component.

     

       14
       14
       +
        * @param props - The OAuth callback props

     

       15
       15
       +
        * @returns The OAuth callback component

     

       16
       16
       +
        * @component

     

       17
       17
       +
        */

     

       8
       18
        
       export default function OAuthCallback(

     

       9
       19
        
         { error: initialError }: OAuthCallbackProps,

     

       10
       20
        
       ) {

+17 -8

islands/SocialLinks.tsx

···

       1
       1
        
       import { useEffect, useState } from "preact/hooks";

     

       2
       2
       -
       import * as Icon from 'npm:preact-feather';

     

       2
       2
       +
       import * as Icon from "npm:preact-feather";

     

       3
       3
        
       

     

       4
       4
       +
       /**

     

       5
       5
       +
        * The GitHub repository.

     

       6
       6
       +
        * @type {GitHubRepo}

     

       7
       7
       +
        */

     

       4
       8
        
       interface GitHubRepo {

     

       5
       9
        
         stargazers_count: number;

     

       6
       10
        
       }

     

       7
       11
        
       

     

       12
       12
       +
       /**

     

       13
       13
       +
        * The social links component.

     

       14
       14
       +
        * @returns The social links component

     

       15
       15
       +
        * @component

     

       16
       16
       +
        */

     

       8
       17
        
       export default function SocialLinks() {

     

       9
       18
        
         const [starCount, setStarCount] = useState<number | null>(null);

     

       10
       19
        
       

     

       11
       20
        
         useEffect(() => {

     

       12
       12
       -
           const CACHE_KEY = 'github_stars';

     

       21
       21
       +
           const CACHE_KEY = "github_stars";

     

       13
       22
        
           const CACHE_DURATION = 15 * 60 * 1000; // 15 minutes in milliseconds

     

       14
       23
        
       

     

       15
       24
        
           const fetchRepoInfo = async () => {

     

       16
       25
        
             try {

     

       17
       17
       -
               const response = await fetch("https://api.github.com/repos/knotbin/airport");

     

       26
       26
       +
               const response = await fetch(

     

       27
       27
       +
                 "https://api.github.com/repos/knotbin/airport",

     

       28
       28
       +
               );

     

       18
       29
        
               const data: GitHubRepo = await response.json();

     

       19
       30
        
               const cacheData = {

     

       20
       31
        
                 count: data.stargazers_count,

     

       21
       21
       -
                 timestamp: Date.now()

     

       32
       32
       +
                 timestamp: Date.now(),

     

       22
       33
        
               };

     

       23
       34
        
               localStorage.setItem(CACHE_KEY, JSON.stringify(cacheData));

     

       24
       35
        
               setStarCount(data.stargazers_count);

     
···

       69
       80
        
                 stroke-linejoin="round"

     

       70
       81
        
                 xmlns="http://www.w3.org/2000/svg"

     

       71
       82
        
               >

     

       72
       72
       -
                 <path

     

       73
       73
       -
                   d="M55.491 15.172c29.35 22.035 60.917 66.712 72.509 90.686 11.592-23.974 43.159-68.651 72.509-90.686C221.686-.727 256-13.028 256 26.116c0 7.818-4.482 65.674-7.111 75.068-9.138 32.654-42.436 40.983-72.057 35.942 51.775 8.812 64.946 38 36.501 67.187-54.021 55.433-77.644-13.908-83.696-31.676-1.11-3.257-1.63-4.78-1.637-3.485-.008-1.296-.527.228-1.637 3.485-6.052 17.768-29.675 87.11-83.696 31.676-28.445-29.187-15.274-58.375 36.5-67.187-29.62 5.041-62.918-3.288-72.056-35.942C4.482 91.79 0 33.934 0 26.116 0-13.028 34.314-.727 55.491 15.172Z"

     

       74
       74
       -
                 />

     

       83
       83
       +
                 <path d="M55.491 15.172c29.35 22.035 60.917 66.712 72.509 90.686 11.592-23.974 43.159-68.651 72.509-90.686C221.686-.727 256-13.028 256 26.116c0 7.818-4.482 65.674-7.111 75.068-9.138 32.654-42.436 40.983-72.057 35.942 51.775 8.812 64.946 38 36.501 67.187-54.021 55.433-77.644-13.908-83.696-31.676-1.11-3.257-1.63-4.78-1.637-3.485-.008-1.296-.527.228-1.637 3.485-6.052 17.768-29.675 87.11-83.696 31.676-28.445-29.187-15.274-58.375 36.5-67.187-29.62 5.041-62.918-3.288-72.056-35.942C4.482 91.79 0 33.934 0 26.116 0-13.028 34.314-.727 55.491 15.172Z" />

     

       75
       84
        
               </svg>

     

       76
       85
        
             </a>

     

       77
       86
        
             <a

     
···

       93
       102
        
             </a>

     

       94
       103
        
           </div>

     

       95
       104
        
         );

     

       96
       96
       -
       } 
     

       105
       105
       +
       }

+20 -3

islands/Ticket.tsx

···

       1
       1
        
       import { useEffect, useState } from "preact/hooks";

     

       2
       2
        
       import { IS_BROWSER } from "fresh/runtime";

     

       3
       3
       +
       import { Link } from "../components/Link.tsx";

     

       3
       4
        
       

     

       5
       5
       +
       /**

     

       6
       6
       +
        * The user interface for the ticket component.

     

       7
       7
       +
        * @type {User}

     

       8
       8
       +
        */

     

       4
       9
        
       interface User {

     

       5
       10
        
         did: string;

     

       6
       11
        
         handle?: string;

     

       7
       12
        
       }

     

       8
       13
        
       

     

       14
       14
       +
       /**

     

       15
       15
       +
        * The ticket component for the landing page.

     

       16
       16
       +
        * @returns The ticket component

     

       17
       17
       +
        * @component

     

       18
       18
       +
        */

     

       9
       19
        
       export default function Ticket() {

     

       10
       20
        
         const [user, setUser] = useState<User | null>(null);

     

       11
       21
        
       

     
···

       63
       73
        
               </p>

     

       64
       74
        
               <p>

     

       65
       75
        
                 Think you might need to migrate in the future but your PDS might be

     

       66
       66
       -
                 hostile or offline? No worries! Soon you'll be able to go to the

     

       67
       67
       -
                 ticket booth and get a PLC key to use for account recovery in the

     

       68
       68
       -
                 future. You can also go to baggage claim (take the air shuttle to

     

       76
       76
       +
                 hostile or offline? No worries! You can go to the{" "}

     

       77
       77
       +
                 <Link

     

       78
       78
       +
                   href="/ticket-booth"

     

       79
       79
       +
                   isExternal

     

       80
       80
       +
                   class="text-blue-600 dark:text-blue-400"

     

       81
       81
       +
                 >

     

       82
       82
       +
                   ticket booth

     

       83
       83
       +
                 </Link>{" "}

     

       84
       84
       +
                 and get a PLC key to use for account recovery in the future. Soon

     

       85
       85
       +
                 you'll also be able to go to baggage claim (take the air shuttle to

     

       69
       86
        
                 terminal four) and get a downloadable backup of all your current PDS

     

       70
       87
        
                 data in case that were to happen.

     

       71
       88
        
               </p>

+151

islands/migration-steps/AccountCreationStep.tsx

···

       1
       1
       +
       import { useEffect, useState } from "preact/hooks";

     

       2
       2
       +
       import { MigrationStep } from "../../components/MigrationStep.tsx";

     

       3
       3
       +
       import {

     

       4
       4
       +
         parseApiResponse,

     

       5
       5
       +
         StepCommonProps,

     

       6
       6
       +
         verifyMigrationStep,

     

       7
       7
       +
       } from "../../lib/migration-types.ts";

     

       8
       8
       +
       

     

       9
       9
       +
       interface AccountCreationStepProps extends StepCommonProps {

     

       10
       10
       +
         isActive: boolean;

     

       11
       11
       +
       }

     

       12
       12
       +
       

     

       13
       13
       +
       export default function AccountCreationStep({

     

       14
       14
       +
         credentials,

     

       15
       15
       +
         onStepComplete,

     

       16
       16
       +
         onStepError,

     

       17
       17
       +
         isActive,

     

       18
       18
       +
       }: AccountCreationStepProps) {

     

       19
       19
       +
         const [status, setStatus] = useState<

     

       20
       20
       +
           "pending" | "in-progress" | "verifying" | "completed" | "error"

     

       21
       21
       +
         >("pending");

     

       22
       22
       +
         const [error, setError] = useState<string>();

     

       23
       23
       +
         const [retryCount, setRetryCount] = useState(0);

     

       24
       24
       +
         const [showContinueAnyway, setShowContinueAnyway] = useState(false);

     

       25
       25
       +
       

     

       26
       26
       +
         useEffect(() => {

     

       27
       27
       +
           if (isActive && status === "pending") {

     

       28
       28
       +
             startAccountCreation();

     

       29
       29
       +
           }

     

       30
       30
       +
         }, [isActive]);

     

       31
       31
       +
       

     

       32
       32
       +
         const startAccountCreation = async () => {

     

       33
       33
       +
           setStatus("in-progress");

     

       34
       34
       +
           setError(undefined);

     

       35
       35
       +
       

     

       36
       36
       +
           try {

     

       37
       37
       +
             const createRes = await fetch("/api/migrate/create", {

     

       38
       38
       +
               method: "POST",

     

       39
       39
       +
               headers: { "Content-Type": "application/json" },

     

       40
       40
       +
               body: JSON.stringify({

     

       41
       41
       +
                 service: credentials.service,

     

       42
       42
       +
                 handle: credentials.handle,

     

       43
       43
       +
                 password: credentials.password,

     

       44
       44
       +
                 email: credentials.email,

     

       45
       45
       +
                 ...(credentials.invite ? { invite: credentials.invite } : {}),

     

       46
       46
       +
               }),

     

       47
       47
       +
             });

     

       48
       48
       +
       

     

       49
       49
       +
             const responseText = await createRes.text();

     

       50
       50
       +
       

     

       51
       51
       +
             if (!createRes.ok) {

     

       52
       52
       +
               const parsed = parseApiResponse(responseText);

     

       53
       53
       +
               throw new Error(parsed.message || "Failed to create account");

     

       54
       54
       +
             }

     

       55
       55
       +
       

     

       56
       56
       +
             const parsed = parseApiResponse(responseText);

     

       57
       57
       +
             if (!parsed.success) {

     

       58
       58
       +
               throw new Error(parsed.message || "Account creation failed");

     

       59
       59
       +
             }

     

       60
       60
       +
       

     

       61
       61
       +
             // Verify the account creation

     

       62
       62
       +
             await verifyAccountCreation();

     

       63
       63
       +
           } catch (error) {

     

       64
       64
       +
             const errorMessage = error instanceof Error

     

       65
       65
       +
               ? error.message

     

       66
       66
       +
               : String(error);

     

       67
       67
       +
             setError(errorMessage);

     

       68
       68
       +
             setStatus("error");

     

       69
       69
       +
             onStepError(errorMessage);

     

       70
       70
       +
           }

     

       71
       71
       +
         };

     

       72
       72
       +
       

     

       73
       73
       +
         const verifyAccountCreation = async () => {

     

       74
       74
       +
           setStatus("verifying");

     

       75
       75
       +
       

     

       76
       76
       +
           try {

     

       77
       77
       +
             const result = await verifyMigrationStep(1);

     

       78
       78
       +
       

     

       79
       79
       +
             if (result.ready) {

     

       80
       80
       +
               setStatus("completed");

     

       81
       81
       +
               setRetryCount(0);

     

       82
       82
       +
               setShowContinueAnyway(false);

     

       83
       83
       +
               onStepComplete();

     

       84
       84
       +
             } else {

     

       85
       85
       +
               const statusDetails = {

     

       86
       86
       +
                 activated: result.activated,

     

       87
       87
       +
                 validDid: result.validDid,

     

       88
       88
       +
               };

     

       89
       89
       +
               const errorMessage = `${

     

       90
       90
       +
                 result.reason || "Verification failed"

     

       91
       91
       +
               }\nStatus details: ${JSON.stringify(statusDetails, null, 2)}`;

     

       92
       92
       +
       

     

       93
       93
       +
               setRetryCount((prev) => prev + 1);

     

       94
       94
       +
               if (retryCount >= 1) {

     

       95
       95
       +
                 setShowContinueAnyway(true);

     

       96
       96
       +
               }

     

       97
       97
       +
       

     

       98
       98
       +
               setError(errorMessage);

     

       99
       99
       +
               setStatus("error");

     

       100
       100
       +
               onStepError(errorMessage, true);

     

       101
       101
       +
             }

     

       102
       102
       +
           } catch (error) {

     

       103
       103
       +
             const errorMessage = error instanceof Error

     

       104
       104
       +
               ? error.message

     

       105
       105
       +
               : String(error);

     

       106
       106
       +
             setRetryCount((prev) => prev + 1);

     

       107
       107
       +
             if (retryCount >= 1) {

     

       108
       108
       +
               setShowContinueAnyway(true);

     

       109
       109
       +
             }

     

       110
       110
       +
       

     

       111
       111
       +
             setError(errorMessage);

     

       112
       112
       +
             setStatus("error");

     

       113
       113
       +
             onStepError(errorMessage, true);

     

       114
       114
       +
           }

     

       115
       115
       +
         };

     

       116
       116
       +
       

     

       117
       117
       +
         const retryVerification = async () => {

     

       118
       118
       +
           await verifyAccountCreation();

     

       119
       119
       +
         };

     

       120
       120
       +
       

     

       121
       121
       +
         const continueAnyway = () => {

     

       122
       122
       +
           setStatus("completed");

     

       123
       123
       +
           setShowContinueAnyway(false);

     

       124
       124
       +
           onStepComplete();

     

       125
       125
       +
         };

     

       126
       126
       +
       

     

       127
       127
       +
         return (

     

       128
       128
       +
           <MigrationStep

     

       129
       129
       +
             name="Create Account"

     

       130
       130
       +
             status={status}

     

       131
       131
       +
             error={error}

     

       132
       132
       +
             isVerificationError={status === "error" &&

     

       133
       133
       +
               error?.includes("Verification failed")}

     

       134
       134
       +
             index={0}

     

       135
       135
       +
             onRetryVerification={retryVerification}

     

       136
       136
       +
           >

     

       137
       137
       +
             {status === "error" && showContinueAnyway && (

     

       138
       138
       +
               <div class="flex space-x-2 mt-2">

     

       139
       139
       +
                 <button

     

       140
       140
       +
                   type="button"

     

       141
       141
       +
                   onClick={continueAnyway}

     

       142
       142
       +
                   class="px-3 py-1 text-xs bg-white border border-gray-300 text-gray-700 hover:bg-gray-100 rounded transition-colors duration-200

     

       143
       143
       +
                          dark:bg-gray-800 dark:border-gray-600 dark:text-gray-200 dark:hover:bg-gray-700"

     

       144
       144
       +
                 >

     

       145
       145
       +
                   Continue Anyway

     

       146
       146
       +
                 </button>

     

       147
       147
       +
               </div>

     

       148
       148
       +
             )}

     

       149
       149
       +
           </MigrationStep>

     

       150
       150
       +
         );

     

       151
       151
       +
       }

+172

islands/migration-steps/DataMigrationStep.tsx

···

       1
       1
       +
       import { useEffect, useState } from "preact/hooks";

     

       2
       2
       +
       import { MigrationStep } from "../../components/MigrationStep.tsx";

     

       3
       3
       +
       import {

     

       4
       4
       +
         parseApiResponse,

     

       5
       5
       +
         StepCommonProps,

     

       6
       6
       +
         verifyMigrationStep,

     

       7
       7
       +
       } from "../../lib/migration-types.ts";

     

       8
       8
       +
       

     

       9
       9
       +
       interface DataMigrationStepProps extends StepCommonProps {

     

       10
       10
       +
         isActive: boolean;

     

       11
       11
       +
       }

     

       12
       12
       +
       

     

       13
       13
       +
       export default function DataMigrationStep({

     

       14
       14
       +
         credentials: _credentials,

     

       15
       15
       +
         onStepComplete,

     

       16
       16
       +
         onStepError,

     

       17
       17
       +
         isActive,

     

       18
       18
       +
       }: DataMigrationStepProps) {

     

       19
       19
       +
         const [status, setStatus] = useState<

     

       20
       20
       +
           "pending" | "in-progress" | "verifying" | "completed" | "error"

     

       21
       21
       +
         >("pending");

     

       22
       22
       +
         const [error, setError] = useState<string>();

     

       23
       23
       +
         const [retryCount, setRetryCount] = useState(0);

     

       24
       24
       +
         const [showContinueAnyway, setShowContinueAnyway] = useState(false);

     

       25
       25
       +
       

     

       26
       26
       +
         useEffect(() => {

     

       27
       27
       +
           if (isActive && status === "pending") {

     

       28
       28
       +
             startDataMigration();

     

       29
       29
       +
           }

     

       30
       30
       +
         }, [isActive]);

     

       31
       31
       +
       

     

       32
       32
       +
         const startDataMigration = async () => {

     

       33
       33
       +
           setStatus("in-progress");

     

       34
       34
       +
           setError(undefined);

     

       35
       35
       +
       

     

       36
       36
       +
           try {

     

       37
       37
       +
             // Step 1: Migrate Repo

     

       38
       38
       +
             const repoRes = await fetch("/api/migrate/data/repo", {

     

       39
       39
       +
               method: "POST",

     

       40
       40
       +
               headers: { "Content-Type": "application/json" },

     

       41
       41
       +
             });

     

       42
       42
       +
       

     

       43
       43
       +
             const repoText = await repoRes.text();

     

       44
       44
       +
       

     

       45
       45
       +
             if (!repoRes.ok) {

     

       46
       46
       +
               const parsed = parseApiResponse(repoText);

     

       47
       47
       +
               throw new Error(parsed.message || "Failed to migrate repo");

     

       48
       48
       +
             }

     

       49
       49
       +
       

     

       50
       50
       +
             // Step 2: Migrate Blobs

     

       51
       51
       +
             const blobsRes = await fetch("/api/migrate/data/blobs", {

     

       52
       52
       +
               method: "POST",

     

       53
       53
       +
               headers: { "Content-Type": "application/json" },

     

       54
       54
       +
             });

     

       55
       55
       +
       

     

       56
       56
       +
             const blobsText = await blobsRes.text();

     

       57
       57
       +
       

     

       58
       58
       +
             if (!blobsRes.ok) {

     

       59
       59
       +
               const parsed = parseApiResponse(blobsText);

     

       60
       60
       +
               throw new Error(parsed.message || "Failed to migrate blobs");

     

       61
       61
       +
             }

     

       62
       62
       +
       

     

       63
       63
       +
             // Step 3: Migrate Preferences

     

       64
       64
       +
             const prefsRes = await fetch("/api/migrate/data/prefs", {

     

       65
       65
       +
               method: "POST",

     

       66
       66
       +
               headers: { "Content-Type": "application/json" },

     

       67
       67
       +
             });

     

       68
       68
       +
       

     

       69
       69
       +
             const prefsText = await prefsRes.text();

     

       70
       70
       +
       

     

       71
       71
       +
             if (!prefsRes.ok) {

     

       72
       72
       +
               const parsed = parseApiResponse(prefsText);

     

       73
       73
       +
               throw new Error(parsed.message || "Failed to migrate preferences");

     

       74
       74
       +
             }

     

       75
       75
       +
       

     

       76
       76
       +
             // Verify the data migration

     

       77
       77
       +
             await verifyDataMigration();

     

       78
       78
       +
           } catch (error) {

     

       79
       79
       +
             const errorMessage = error instanceof Error

     

       80
       80
       +
               ? error.message

     

       81
       81
       +
               : String(error);

     

       82
       82
       +
             setError(errorMessage);

     

       83
       83
       +
             setStatus("error");

     

       84
       84
       +
             onStepError(errorMessage);

     

       85
       85
       +
           }

     

       86
       86
       +
         };

     

       87
       87
       +
       

     

       88
       88
       +
         const verifyDataMigration = async () => {

     

       89
       89
       +
           setStatus("verifying");

     

       90
       90
       +
       

     

       91
       91
       +
           try {

     

       92
       92
       +
             const result = await verifyMigrationStep(2);

     

       93
       93
       +
       

     

       94
       94
       +
             if (result.ready) {

     

       95
       95
       +
               setStatus("completed");

     

       96
       96
       +
               setRetryCount(0);

     

       97
       97
       +
               setShowContinueAnyway(false);

     

       98
       98
       +
               onStepComplete();

     

       99
       99
       +
             } else {

     

       100
       100
       +
               const statusDetails = {

     

       101
       101
       +
                 repoCommit: result.repoCommit,

     

       102
       102
       +
                 repoRev: result.repoRev,

     

       103
       103
       +
                 repoBlocks: result.repoBlocks,

     

       104
       104
       +
                 expectedRecords: result.expectedRecords,

     

       105
       105
       +
                 indexedRecords: result.indexedRecords,

     

       106
       106
       +
                 privateStateValues: result.privateStateValues,

     

       107
       107
       +
                 expectedBlobs: result.expectedBlobs,

     

       108
       108
       +
                 importedBlobs: result.importedBlobs,

     

       109
       109
       +
               };

     

       110
       110
       +
               const errorMessage = `${

     

       111
       111
       +
                 result.reason || "Verification failed"

     

       112
       112
       +
               }\nStatus details: ${JSON.stringify(statusDetails, null, 2)}`;

     

       113
       113
       +
       

     

       114
       114
       +
               setRetryCount((prev) => prev + 1);

     

       115
       115
       +
               if (retryCount >= 1) {

     

       116
       116
       +
                 setShowContinueAnyway(true);

     

       117
       117
       +
               }

     

       118
       118
       +
       

     

       119
       119
       +
               setError(errorMessage);

     

       120
       120
       +
               setStatus("error");

     

       121
       121
       +
               onStepError(errorMessage, true);

     

       122
       122
       +
             }

     

       123
       123
       +
           } catch (error) {

     

       124
       124
       +
             const errorMessage = error instanceof Error

     

       125
       125
       +
               ? error.message

     

       126
       126
       +
               : String(error);

     

       127
       127
       +
             setRetryCount((prev) => prev + 1);

     

       128
       128
       +
             if (retryCount >= 1) {

     

       129
       129
       +
               setShowContinueAnyway(true);

     

       130
       130
       +
             }

     

       131
       131
       +
       

     

       132
       132
       +
             setError(errorMessage);

     

       133
       133
       +
             setStatus("error");

     

       134
       134
       +
             onStepError(errorMessage, true);

     

       135
       135
       +
           }

     

       136
       136
       +
         };

     

       137
       137
       +
       

     

       138
       138
       +
         const retryVerification = async () => {

     

       139
       139
       +
           await verifyDataMigration();

     

       140
       140
       +
         };

     

       141
       141
       +
       

     

       142
       142
       +
         const continueAnyway = () => {

     

       143
       143
       +
           setStatus("completed");

     

       144
       144
       +
           setShowContinueAnyway(false);

     

       145
       145
       +
           onStepComplete();

     

       146
       146
       +
         };

     

       147
       147
       +
       

     

       148
       148
       +
         return (

     

       149
       149
       +
           <MigrationStep

     

       150
       150
       +
             name="Migrate Data"

     

       151
       151
       +
             status={status}

     

       152
       152
       +
             error={error}

     

       153
       153
       +
             isVerificationError={status === "error" &&

     

       154
       154
       +
               error?.includes("Verification failed")}

     

       155
       155
       +
             index={1}

     

       156
       156
       +
             onRetryVerification={retryVerification}

     

       157
       157
       +
           >

     

       158
       158
       +
             {status === "error" && showContinueAnyway && (

     

       159
       159
       +
               <div class="flex space-x-2 mt-2">

     

       160
       160
       +
                 <button

     

       161
       161
       +
                   type="button"

     

       162
       162
       +
                   onClick={continueAnyway}

     

       163
       163
       +
                   class="px-3 py-1 text-xs bg-white border border-gray-300 text-gray-700 hover:bg-gray-100 rounded transition-colors duration-200

     

       164
       164
       +
                          dark:bg-gray-800 dark:border-gray-600 dark:text-gray-200 dark:hover:bg-gray-700"

     

       165
       165
       +
                 >

     

       166
       166
       +
                   Continue Anyway

     

       167
       167
       +
                 </button>

     

       168
       168
       +
               </div>

     

       169
       169
       +
             )}

     

       170
       170
       +
           </MigrationStep>

     

       171
       171
       +
         );

     

       172
       172
       +
       }

+143

islands/migration-steps/FinalizationStep.tsx

···

       1
       1
       +
       import { useEffect, useState } from "preact/hooks";

     

       2
       2
       +
       import { MigrationStep } from "../../components/MigrationStep.tsx";

     

       3
       3
       +
       import {

     

       4
       4
       +
         parseApiResponse,

     

       5
       5
       +
         StepCommonProps,

     

       6
       6
       +
         verifyMigrationStep,

     

       7
       7
       +
       } from "../../lib/migration-types.ts";

     

       8
       8
       +
       

     

       9
       9
       +
       interface FinalizationStepProps extends StepCommonProps {

     

       10
       10
       +
         isActive: boolean;

     

       11
       11
       +
       }

     

       12
       12
       +
       

     

       13
       13
       +
       export default function FinalizationStep({

     

       14
       14
       +
         credentials: _credentials,

     

       15
       15
       +
         onStepComplete,

     

       16
       16
       +
         onStepError,

     

       17
       17
       +
         isActive,

     

       18
       18
       +
       }: FinalizationStepProps) {

     

       19
       19
       +
         const [status, setStatus] = useState<

     

       20
       20
       +
           "pending" | "in-progress" | "verifying" | "completed" | "error"

     

       21
       21
       +
         >("pending");

     

       22
       22
       +
         const [error, setError] = useState<string>();

     

       23
       23
       +
         const [retryCount, setRetryCount] = useState(0);

     

       24
       24
       +
         const [showContinueAnyway, setShowContinueAnyway] = useState(false);

     

       25
       25
       +
       

     

       26
       26
       +
         useEffect(() => {

     

       27
       27
       +
           if (isActive && status === "pending") {

     

       28
       28
       +
             startFinalization();

     

       29
       29
       +
           }

     

       30
       30
       +
         }, [isActive]);

     

       31
       31
       +
       

     

       32
       32
       +
         const startFinalization = async () => {

     

       33
       33
       +
           setStatus("in-progress");

     

       34
       34
       +
           setError(undefined);

     

       35
       35
       +
       

     

       36
       36
       +
           try {

     

       37
       37
       +
             const finalizeRes = await fetch("/api/migrate/finalize", {

     

       38
       38
       +
               method: "POST",

     

       39
       39
       +
               headers: { "Content-Type": "application/json" },

     

       40
       40
       +
             });

     

       41
       41
       +
       

     

       42
       42
       +
             const finalizeData = await finalizeRes.text();

     

       43
       43
       +
             if (!finalizeRes.ok) {

     

       44
       44
       +
               const parsed = parseApiResponse(finalizeData);

     

       45
       45
       +
               throw new Error(parsed.message || "Failed to finalize migration");

     

       46
       46
       +
             }

     

       47
       47
       +
       

     

       48
       48
       +
             const parsed = parseApiResponse(finalizeData);

     

       49
       49
       +
             if (!parsed.success) {

     

       50
       50
       +
               throw new Error(parsed.message || "Finalization failed");

     

       51
       51
       +
             }

     

       52
       52
       +
       

     

       53
       53
       +
             // Verify the finalization

     

       54
       54
       +
             await verifyFinalization();

     

       55
       55
       +
           } catch (error) {

     

       56
       56
       +
             const errorMessage = error instanceof Error

     

       57
       57
       +
               ? error.message

     

       58
       58
       +
               : String(error);

     

       59
       59
       +
             setError(errorMessage);

     

       60
       60
       +
             setStatus("error");

     

       61
       61
       +
             onStepError(errorMessage);

     

       62
       62
       +
           }

     

       63
       63
       +
         };

     

       64
       64
       +
       

     

       65
       65
       +
         const verifyFinalization = async () => {

     

       66
       66
       +
           setStatus("verifying");

     

       67
       67
       +
       

     

       68
       68
       +
           try {

     

       69
       69
       +
             const result = await verifyMigrationStep(4);

     

       70
       70
       +
       

     

       71
       71
       +
             if (result.ready) {

     

       72
       72
       +
               setStatus("completed");

     

       73
       73
       +
               setRetryCount(0);

     

       74
       74
       +
               setShowContinueAnyway(false);

     

       75
       75
       +
               onStepComplete();

     

       76
       76
       +
             } else {

     

       77
       77
       +
               const statusDetails = {

     

       78
       78
       +
                 activated: result.activated,

     

       79
       79
       +
                 validDid: result.validDid,

     

       80
       80
       +
               };

     

       81
       81
       +
               const errorMessage = `${

     

       82
       82
       +
                 result.reason || "Verification failed"

     

       83
       83
       +
               }\nStatus details: ${JSON.stringify(statusDetails, null, 2)}`;

     

       84
       84
       +
       

     

       85
       85
       +
               setRetryCount((prev) => prev + 1);

     

       86
       86
       +
               if (retryCount >= 1) {

     

       87
       87
       +
                 setShowContinueAnyway(true);

     

       88
       88
       +
               }

     

       89
       89
       +
       

     

       90
       90
       +
               setError(errorMessage);

     

       91
       91
       +
               setStatus("error");

     

       92
       92
       +
               onStepError(errorMessage, true);

     

       93
       93
       +
             }

     

       94
       94
       +
           } catch (error) {

     

       95
       95
       +
             const errorMessage = error instanceof Error

     

       96
       96
       +
               ? error.message

     

       97
       97
       +
               : String(error);

     

       98
       98
       +
             setRetryCount((prev) => prev + 1);

     

       99
       99
       +
             if (retryCount >= 1) {

     

       100
       100
       +
               setShowContinueAnyway(true);

     

       101
       101
       +
             }

     

       102
       102
       +
       

     

       103
       103
       +
             setError(errorMessage);

     

       104
       104
       +
             setStatus("error");

     

       105
       105
       +
             onStepError(errorMessage, true);

     

       106
       106
       +
           }

     

       107
       107
       +
         };

     

       108
       108
       +
       

     

       109
       109
       +
         const retryVerification = async () => {

     

       110
       110
       +
           await verifyFinalization();

     

       111
       111
       +
         };

     

       112
       112
       +
       

     

       113
       113
       +
         const continueAnyway = () => {

     

       114
       114
       +
           setStatus("completed");

     

       115
       115
       +
           setShowContinueAnyway(false);

     

       116
       116
       +
           onStepComplete();

     

       117
       117
       +
         };

     

       118
       118
       +
       

     

       119
       119
       +
         return (

     

       120
       120
       +
           <MigrationStep

     

       121
       121
       +
             name="Finalize Migration"

     

       122
       122
       +
             status={status}

     

       123
       123
       +
             error={error}

     

       124
       124
       +
             isVerificationError={status === "error" &&

     

       125
       125
       +
               error?.includes("Verification failed")}

     

       126
       126
       +
             index={3}

     

       127
       127
       +
             onRetryVerification={retryVerification}

     

       128
       128
       +
           >

     

       129
       129
       +
             {status === "error" && showContinueAnyway && (

     

       130
       130
       +
               <div class="flex space-x-2 mt-2">

     

       131
       131
       +
                 <button

     

       132
       132
       +
                   type="button"

     

       133
       133
       +
                   onClick={continueAnyway}

     

       134
       134
       +
                   class="px-3 py-1 text-xs bg-white border border-gray-300 text-gray-700 hover:bg-gray-100 rounded transition-colors duration-200

     

       135
       135
       +
                          dark:bg-gray-800 dark:border-gray-600 dark:text-gray-200 dark:hover:bg-gray-700"

     

       136
       136
       +
                 >

     

       137
       137
       +
                   Continue Anyway

     

       138
       138
       +
                 </button>

     

       139
       139
       +
               </div>

     

       140
       140
       +
             )}

     

       141
       141
       +
           </MigrationStep>

     

       142
       142
       +
         );

     

       143
       143
       +
       }

+294

islands/migration-steps/IdentityMigrationStep.tsx

···

       1
       1
       +
       import { useEffect, useRef, useState } from "preact/hooks";

     

       2
       2
       +
       import { MigrationStep } from "../../components/MigrationStep.tsx";

     

       3
       3
       +
       import {

     

       4
       4
       +
         parseApiResponse,

     

       5
       5
       +
         StepCommonProps,

     

       6
       6
       +
         verifyMigrationStep,

     

       7
       7
       +
       } from "../../lib/migration-types.ts";

     

       8
       8
       +
       

     

       9
       9
       +
       interface IdentityMigrationStepProps extends StepCommonProps {

     

       10
       10
       +
         isActive: boolean;

     

       11
       11
       +
       }

     

       12
       12
       +
       

     

       13
       13
       +
       export default function IdentityMigrationStep({

     

       14
       14
       +
         credentials: _credentials,

     

       15
       15
       +
         onStepComplete,

     

       16
       16
       +
         onStepError,

     

       17
       17
       +
         isActive,

     

       18
       18
       +
       }: IdentityMigrationStepProps) {

     

       19
       19
       +
         const [status, setStatus] = useState<

     

       20
       20
       +
           "pending" | "in-progress" | "verifying" | "completed" | "error"

     

       21
       21
       +
         >("pending");

     

       22
       22
       +
         const [error, setError] = useState<string>();

     

       23
       23
       +
         const [retryCount, setRetryCount] = useState(0);

     

       24
       24
       +
         const [showContinueAnyway, setShowContinueAnyway] = useState(false);

     

       25
       25
       +
         const [token, setToken] = useState("");

     

       26
       26
       +
         const [identityRequestSent, setIdentityRequestSent] = useState(false);

     

       27
       27
       +
         const [identityRequestCooldown, setIdentityRequestCooldown] = useState(0);

     

       28
       28
       +
         const [cooldownInterval, setCooldownInterval] = useState<number | null>(null);

     

       29
       29
       +
         const [stepName, setStepName] = useState("Migrate Identity");

     

       30
       30
       +
         const identityRequestInProgressRef = useRef(false);

     

       31
       31
       +
       

     

       32
       32
       +
         // Clean up interval on unmount

     

       33
       33
       +
         useEffect(() => {

     

       34
       34
       +
           return () => {

     

       35
       35
       +
             if (cooldownInterval !== null) {

     

       36
       36
       +
               clearInterval(cooldownInterval);

     

       37
       37
       +
             }

     

       38
       38
       +
           };

     

       39
       39
       +
         }, [cooldownInterval]);

     

       40
       40
       +
       

     

       41
       41
       +
         useEffect(() => {

     

       42
       42
       +
           if (isActive && status === "pending") {

     

       43
       43
       +
             startIdentityMigration();

     

       44
       44
       +
           }

     

       45
       45
       +
         }, [isActive]);

     

       46
       46
       +
       

     

       47
       47
       +
         const startIdentityMigration = async () => {

     

       48
       48
       +
           // Prevent multiple concurrent calls

     

       49
       49
       +
           if (identityRequestInProgressRef.current) {

     

       50
       50
       +
             return;

     

       51
       51
       +
           }

     

       52
       52
       +
       

     

       53
       53
       +
           identityRequestInProgressRef.current = true;

     

       54
       54
       +
           setStatus("in-progress");

     

       55
       55
       +
           setError(undefined);

     

       56
       56
       +
       

     

       57
       57
       +
           // Don't send duplicate requests

     

       58
       58
       +
           if (identityRequestSent) {

     

       59
       59
       +
             setStepName(

     

       60
       60
       +
               "Enter the token sent to your email to complete identity migration",

     

       61
       61
       +
             );

     

       62
       62
       +
             setTimeout(() => {

     

       63
       63
       +
               identityRequestInProgressRef.current = false;

     

       64
       64
       +
             }, 1000);

     

       65
       65
       +
             return;

     

       66
       66
       +
           }

     

       67
       67
       +
       

     

       68
       68
       +
           try {

     

       69
       69
       +
             const requestRes = await fetch("/api/migrate/identity/request", {

     

       70
       70
       +
               method: "POST",

     

       71
       71
       +
               headers: { "Content-Type": "application/json" },

     

       72
       72
       +
             });

     

       73
       73
       +
       

     

       74
       74
       +
             const requestText = await requestRes.text();

     

       75
       75
       +
       

     

       76
       76
       +
             if (!requestRes.ok) {

     

       77
       77
       +
               const parsed = parseApiResponse(requestText);

     

       78
       78
       +
               throw new Error(

     

       79
       79
       +
                 parsed.message || "Failed to request identity migration",

     

       80
       80
       +
               );

     

       81
       81
       +
             }

     

       82
       82
       +
       

     

       83
       83
       +
             const parsed = parseApiResponse(requestText);

     

       84
       84
       +
             if (!parsed.success) {

     

       85
       85
       +
               throw new Error(parsed.message || "Identity migration request failed");

     

       86
       86
       +
             }

     

       87
       87
       +
       

     

       88
       88
       +
             // Mark request as sent

     

       89
       89
       +
             setIdentityRequestSent(true);

     

       90
       90
       +
       

     

       91
       91
       +
             // Handle rate limiting

     

       92
       92
       +
             const jsonData = JSON.parse(requestText);

     

       93
       93
       +
             if (jsonData.rateLimited && jsonData.cooldownRemaining) {

     

       94
       94
       +
               setIdentityRequestCooldown(jsonData.cooldownRemaining);

     

       95
       95
       +
       

     

       96
       96
       +
               // Clear any existing interval

     

       97
       97
       +
               if (cooldownInterval !== null) {

     

       98
       98
       +
                 clearInterval(cooldownInterval);

     

       99
       99
       +
               }

     

       100
       100
       +
       

     

       101
       101
       +
               // Set up countdown timer

     

       102
       102
       +
               const intervalId = setInterval(() => {

     

       103
       103
       +
                 setIdentityRequestCooldown((prev) => {

     

       104
       104
       +
                   if (prev <= 1) {

     

       105
       105
       +
                     clearInterval(intervalId);

     

       106
       106
       +
                     setCooldownInterval(null);

     

       107
       107
       +
                     return 0;

     

       108
       108
       +
                   }

     

       109
       109
       +
                   return prev - 1;

     

       110
       110
       +
                 });

     

       111
       111
       +
               }, 1000);

     

       112
       112
       +
       

     

       113
       113
       +
               setCooldownInterval(intervalId);

     

       114
       114
       +
             }

     

       115
       115
       +
       

     

       116
       116
       +
             // Update step name to prompt for token

     

       117
       117
       +
             setStepName(

     

       118
       118
       +
               identityRequestCooldown > 0

     

       119
       119
       +
                 ? `Please wait ${identityRequestCooldown}s before requesting another code`

     

       120
       120
       +
                 : "Enter the token sent to your email to complete identity migration",

     

       121
       121
       +
             );

     

       122
       122
       +
           } catch (error) {

     

       123
       123
       +
             const errorMessage = error instanceof Error

     

       124
       124
       +
               ? error.message

     

       125
       125
       +
               : String(error);

     

       126
       126
       +
             // Don't mark as error if it was due to rate limiting

     

       127
       127
       +
             if (identityRequestCooldown > 0) {

     

       128
       128
       +
               setStatus("in-progress");

     

       129
       129
       +
             } else {

     

       130
       130
       +
               setError(errorMessage);

     

       131
       131
       +
               setStatus("error");

     

       132
       132
       +
               onStepError(errorMessage);

     

       133
       133
       +
             }

     

       134
       134
       +
           } finally {

     

       135
       135
       +
             setTimeout(() => {

     

       136
       136
       +
               identityRequestInProgressRef.current = false;

     

       137
       137
       +
             }, 1000);

     

       138
       138
       +
           }

     

       139
       139
       +
         };

     

       140
       140
       +
       

     

       141
       141
       +
         const handleIdentityMigration = async () => {

     

       142
       142
       +
           if (!token) return;

     

       143
       143
       +
       

     

       144
       144
       +
           try {

     

       145
       145
       +
             const identityRes = await fetch(

     

       146
       146
       +
               `/api/migrate/identity/sign?token=${encodeURIComponent(token)}`,

     

       147
       147
       +
               {

     

       148
       148
       +
                 method: "POST",

     

       149
       149
       +
                 headers: { "Content-Type": "application/json" },

     

       150
       150
       +
               },

     

       151
       151
       +
             );

     

       152
       152
       +
       

     

       153
       153
       +
             const identityData = await identityRes.text();

     

       154
       154
       +
             if (!identityRes.ok) {

     

       155
       155
       +
               const parsed = parseApiResponse(identityData);

     

       156
       156
       +
               throw new Error(

     

       157
       157
       +
                 parsed.message || "Failed to complete identity migration",

     

       158
       158
       +
               );

     

       159
       159
       +
             }

     

       160
       160
       +
       

     

       161
       161
       +
             const parsed = parseApiResponse(identityData);

     

       162
       162
       +
             if (!parsed.success) {

     

       163
       163
       +
               throw new Error(parsed.message || "Identity migration failed");

     

       164
       164
       +
             }

     

       165
       165
       +
       

     

       166
       166
       +
             // Verify the identity migration

     

       167
       167
       +
             await verifyIdentityMigration();

     

       168
       168
       +
           } catch (error) {

     

       169
       169
       +
             const errorMessage = error instanceof Error

     

       170
       170
       +
               ? error.message

     

       171
       171
       +
               : String(error);

     

       172
       172
       +
             setError(errorMessage);

     

       173
       173
       +
             setStatus("error");

     

       174
       174
       +
             onStepError(errorMessage);

     

       175
       175
       +
           }

     

       176
       176
       +
         };

     

       177
       177
       +
       

     

       178
       178
       +
         const verifyIdentityMigration = async () => {

     

       179
       179
       +
           setStatus("verifying");

     

       180
       180
       +
       

     

       181
       181
       +
           try {

     

       182
       182
       +
             const result = await verifyMigrationStep(3);

     

       183
       183
       +
       

     

       184
       184
       +
             if (result.ready) {

     

       185
       185
       +
               setStatus("completed");

     

       186
       186
       +
               setRetryCount(0);

     

       187
       187
       +
               setShowContinueAnyway(false);

     

       188
       188
       +
               onStepComplete();

     

       189
       189
       +
             } else {

     

       190
       190
       +
               const statusDetails = {

     

       191
       191
       +
                 activated: result.activated,

     

       192
       192
       +
                 validDid: result.validDid,

     

       193
       193
       +
               };

     

       194
       194
       +
               const errorMessage = `${

     

       195
       195
       +
                 result.reason || "Verification failed"

     

       196
       196
       +
               }\nStatus details: ${JSON.stringify(statusDetails, null, 2)}`;

     

       197
       197
       +
       

     

       198
       198
       +
               setRetryCount((prev) => prev + 1);

     

       199
       199
       +
               if (retryCount >= 1) {

     

       200
       200
       +
                 setShowContinueAnyway(true);

     

       201
       201
       +
               }

     

       202
       202
       +
       

     

       203
       203
       +
               setError(errorMessage);

     

       204
       204
       +
               setStatus("error");

     

       205
       205
       +
               onStepError(errorMessage, true);

     

       206
       206
       +
             }

     

       207
       207
       +
           } catch (error) {

     

       208
       208
       +
             const errorMessage = error instanceof Error

     

       209
       209
       +
               ? error.message

     

       210
       210
       +
               : String(error);

     

       211
       211
       +
             setRetryCount((prev) => prev + 1);

     

       212
       212
       +
             if (retryCount >= 1) {

     

       213
       213
       +
               setShowContinueAnyway(true);

     

       214
       214
       +
             }

     

       215
       215
       +
       

     

       216
       216
       +
             setError(errorMessage);

     

       217
       217
       +
             setStatus("error");

     

       218
       218
       +
             onStepError(errorMessage, true);

     

       219
       219
       +
           }

     

       220
       220
       +
         };

     

       221
       221
       +
       

     

       222
       222
       +
         const retryVerification = async () => {

     

       223
       223
       +
           await verifyIdentityMigration();

     

       224
       224
       +
         };

     

       225
       225
       +
       

     

       226
       226
       +
         const continueAnyway = () => {

     

       227
       227
       +
           setStatus("completed");

     

       228
       228
       +
           setShowContinueAnyway(false);

     

       229
       229
       +
           onStepComplete();

     

       230
       230
       +
         };

     

       231
       231
       +
       

     

       232
       232
       +
         return (

     

       233
       233
       +
           <MigrationStep

     

       234
       234
       +
             name={stepName}

     

       235
       235
       +
             status={status}

     

       236
       236
       +
             error={error}

     

       237
       237
       +
             isVerificationError={status === "error" &&

     

       238
       238
       +
               error?.includes("Verification failed")}

     

       239
       239
       +
             index={2}

     

       240
       240
       +
             onRetryVerification={retryVerification}

     

       241
       241
       +
           >

     

       242
       242
       +
             {status === "error" && showContinueAnyway && (

     

       243
       243
       +
               <div class="flex space-x-2 mt-2">

     

       244
       244
       +
                 <button

     

       245
       245
       +
                   type="button"

     

       246
       246
       +
                   onClick={continueAnyway}

     

       247
       247
       +
                   class="px-3 py-1 text-xs bg-white border border-gray-300 text-gray-700 hover:bg-gray-100 rounded transition-colors duration-200

     

       248
       248
       +
                          dark:bg-gray-800 dark:border-gray-600 dark:text-gray-200 dark:hover:bg-gray-700"

     

       249
       249
       +
                 >

     

       250
       250
       +
                   Continue Anyway

     

       251
       251
       +
                 </button>

     

       252
       252
       +
               </div>

     

       253
       253
       +
             )}

     

       254
       254
       +
       

     

       255
       255
       +
             {(status === "in-progress" || identityRequestSent) &&

     

       256
       256
       +
               stepName.includes("Enter the token sent to your email") &&

     

       257
       257
       +
               (identityRequestCooldown > 0

     

       258
       258
       +
                 ? (

     

       259
       259
       +
                   <div class="mt-4">

     

       260
       260
       +
                     <p class="text-sm text-amber-600 dark:text-amber-400">

     

       261
       261
       +
                       <span class="font-medium">Rate limit:</span> Please wait{" "}

     

       262
       262
       +
                       {identityRequestCooldown}{" "}

     

       263
       263
       +
                       seconds before requesting another code. Check your email inbox

     

       264
       264
       +
                       and spam folder for a previously sent code.

     

       265
       265
       +
                     </p>

     

       266
       266
       +
                   </div>

     

       267
       267
       +
                 )

     

       268
       268
       +
                 : (

     

       269
       269
       +
                   <div class="mt-4 space-y-4">

     

       270
       270
       +
                     <p class="text-sm text-blue-800 dark:text-blue-200">

     

       271
       271
       +
                       Please check your email for the migration token and enter it

     

       272
       272
       +
                       below:

     

       273
       273
       +
                     </p>

     

       274
       274
       +
                     <div class="flex space-x-2">

     

       275
       275
       +
                       <input

     

       276
       276
       +
                         type="text"

     

       277
       277
       +
                         value={token}

     

       278
       278
       +
                         onChange={(e) => setToken(e.currentTarget.value)}

     

       279
       279
       +
                         placeholder="Enter token"

     

       280
       280
       +
                         class="flex-1 rounded-md border-gray-300 shadow-sm focus:border-blue-500 focus:ring-blue-500 dark:border-gray-600 dark:bg-gray-700 dark:text-white dark:focus:border-blue-400 dark:focus:ring-blue-400"

     

       281
       281
       +
                       />

     

       282
       282
       +
                       <button

     

       283
       283
       +
                         type="button"

     

       284
       284
       +
                         onClick={handleIdentityMigration}

     

       285
       285
       +
                         class="px-4 py-2 border border-transparent rounded-md shadow-sm text-sm font-medium text-white bg-blue-600 hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500 transition-colors duration-200"

     

       286
       286
       +
                       >

     

       287
       287
       +
                         Submit Token

     

       288
       288
       +
                       </button>

     

       289
       289
       +
                     </div>

     

       290
       290
       +
                   </div>

     

       291
       291
       +
                 ))}

     

       292
       292
       +
           </MigrationStep>

     

       293
       293
       +
         );

     

       294
       294
       +
       }

lib/check-dids.ts

···

       1
       1
       +
       import { getSession } from "./sessions.ts";

     

       2
       2
       +
       

     

       3
       3
       +
       export async function checkDidsMatch(req: Request): Promise<boolean> {

     

       4
       4
       +
         const oldSession = await getSession(req, undefined, false);

     

       5
       5
       +
         const newSession = await getSession(req, undefined, true);

     

       6
       6
       +
         return oldSession.did === newSession.did;

     

       7
       7
       +
       }

+54 -28

lib/cred/sessions.ts

···

       1
       1
        
       import { Agent } from "npm:@atproto/api";

     

       2
       2
        
       import { getIronSession, SessionOptions } from "npm:iron-session";

     

       3
       3
       -
       import { CredentialSession, createSessionOptions } from "../types.ts";

     

       3
       3
       +
       import { createSessionOptions, CredentialSession } from "../types.ts";

     

       4
       4
        
       

     

       5
       5
        
       let migrationSessionOptions: SessionOptions;

     

       6
       6
        
       let credentialSessionOptions: SessionOptions;

     

       7
       7
        
       

     

       8
       8
       +
       /**

     

       9
       9
       +
        * Get the session options for the given request.

     

       10
       10
       +
        * @param isMigration - Whether to get the migration session options

     

       11
       11
       +
        * @returns The session options

     

       12
       12
       +
        */

     

       8
       13
        
       async function getOptions(isMigration: boolean) {

     

       9
       14
        
         if (isMigration) {

     

       10
       15
        
           if (!migrationSessionOptions) {

     
···

       12
       17
        
           }

     

       13
       18
        
           return migrationSessionOptions;

     

       14
       19
        
         }

     

       15
       15
       -
         

     

       20
       20
       +
       

     

       16
       21
        
         if (!credentialSessionOptions) {

     

       17
       22
        
           credentialSessionOptions = await createSessionOptions("cred_sid");

     

       18
       23
        
         }

     

       19
       24
        
         return credentialSessionOptions;

     

       20
       25
        
       }

     

       21
       26
        
       

     

       27
       27
       +
       /**

     

       28
       28
       +
        * Get the credential session for the given request.

     

       29
       29
       +
        * @param req - The request object

     

       30
       30
       +
        * @param res - The response object

     

       31
       31
       +
        * @param isMigration - Whether to get the migration session

     

       32
       32
       +
        * @returns The credential session

     

       33
       33
       +
        */

     

       22
       34
        
       export async function getCredentialSession(

     

       23
       35
        
         req: Request,

     

       24
       36
        
         res: Response = new Response(),

     

       25
       25
       -
         isMigration: boolean = false

     

       37
       37
       +
         isMigration: boolean = false,

     

       26
       38
        
       ) {

     

       27
       39
        
         const options = await getOptions(isMigration);

     

       28
       28
       -
         return getIronSession<CredentialSession>(

     

       29
       29
       -
           req,

     

       30
       30
       -
           res,

     

       31
       31
       -
           options,

     

       32
       32
       -
         );

     

       40
       40
       +
         return getIronSession<CredentialSession>(req, res, options);

     

       33
       41
        
       }

     

       34
       42
        
       

     

       43
       43
       +
       /**

     

       44
       44
       +
        * Get the credential agent for the given request.

     

       45
       45
       +
        * @param req - The request object

     

       46
       46
       +
        * @param res - The response object

     

       47
       47
       +
        * @param isMigration - Whether to get the migration session

     

       48
       48
       +
        * @returns The credential agent

     

       49
       49
       +
        */

     

       35
       50
        
       export async function getCredentialAgent(

     

       36
       51
        
         req: Request,

     

       37
       52
        
         res: Response = new Response(),

     

       38
       53
        
         isMigration: boolean = false,

     

       39
       54
        
       ) {

     

       40
       40
       -
         const session = await getCredentialSession(

     

       41
       41
       -
           req,

     

       42
       42
       -
           res,

     

       43
       43
       -
           isMigration

     

       44
       44
       -
         );

     

       45
       45
       -
         if (!session.did || !session.service || !session.handle || !session.password) {

     

       55
       55
       +
         const session = await getCredentialSession(req, res, isMigration);

     

       56
       56
       +
         if (

     

       57
       57
       +
           !session.did ||

     

       58
       58
       +
           !session.service ||

     

       59
       59
       +
           !session.handle ||

     

       60
       60
       +
           !session.password

     

       61
       61
       +
         ) {

     

       46
       62
        
           return null;

     

       47
       63
        
         }

     

       48
       64
        
       

     
···

       76
       92
        
         }

     

       77
       93
        
       }

     

       78
       94
        
       

     

       95
       95
       +
       /**

     

       96
       96
       +
        * Set the credential session for the given request.

     

       97
       97
       +
        * @param req - The request object

     

       98
       98
       +
        * @param res - The response object

     

       99
       99
       +
        * @param data - The credential session data

     

       100
       100
       +
        * @param isMigration - Whether to set the migration session

     

       101
       101
       +
        * @returns The credential session

     

       102
       102
       +
        */

     

       79
       103
        
       export async function setCredentialSession(

     

       80
       104
        
         req: Request,

     

       81
       105
        
         res: Response,

     

       82
       106
        
         data: CredentialSession,

     

       83
       107
        
         isMigration: boolean = false,

     

       84
       108
        
       ) {

     

       85
       85
       -
         const session = await getCredentialSession(

     

       86
       86
       -
           req,

     

       87
       87
       -
           res,

     

       88
       88
       -
           isMigration

     

       89
       89
       -
         );

     

       109
       109
       +
         const session = await getCredentialSession(req, res, isMigration);

     

       90
       110
        
         session.did = data.did;

     

       91
       111
        
         session.handle = data.handle;

     

       92
       112
        
         session.service = data.service;

     
···

       95
       115
        
         return session;

     

       96
       116
        
       }

     

       97
       117
        
       

     

       118
       118
       +
       /**

     

       119
       119
       +
        * Get the credential session agent for the given request.

     

       120
       120
       +
        * @param req - The request object

     

       121
       121
       +
        * @param res - The response object

     

       122
       122
       +
        * @param isMigration - Whether to get the migration session

     

       123
       123
       +
        * @returns The credential session agent

     

       124
       124
       +
        */

     

       98
       125
        
       export async function getCredentialSessionAgent(

     

       99
       126
        
         req: Request,

     

       100
       127
        
         res: Response = new Response(),

     

       101
       128
        
         isMigration: boolean = false,

     

       102
       129
        
       ) {

     

       103
       103
       -
         const session = await getCredentialSession(

     

       104
       104
       -
           req,

     

       105
       105
       -
           res,

     

       106
       106
       -
           isMigration

     

       107
       107
       -
         );

     

       130
       130
       +
         const session = await getCredentialSession(req, res, isMigration);

     

       108
       131
        
       

     

       109
       132
        
         console.log("Session state:", {

     

       110
       133
        
           hasDid: !!session.did,

     
···

       113
       136
        
           hasPassword: !!session.password,

     

       114
       137
        
           hasAccessJwt: !!session.accessJwt,

     

       115
       138
        
           service: session.service,

     

       116
       116
       -
           handle: session.handle

     

       139
       139
       +
           handle: session.handle,

     

       117
       140
        
         });

     

       118
       141
        
       

     

       119
       142
        
         if (

     

       120
       120
       -
           !session.did || !session.service || !session.handle || !session.password

     

       143
       143
       +
           !session.did ||

     

       144
       144
       +
           !session.service ||

     

       145
       145
       +
           !session.handle ||

     

       146
       146
       +
           !session.password

     

       121
       147
        
         ) {

     

       122
       148
        
           console.log("Missing required session fields");

     

       123
       149
        
           return null;

     
···

       136
       162
        
               const sessionInfo = await agent.com.atproto.server.getSession();

     

       137
       163
        
               console.log("Stored JWT is valid, session info:", {

     

       138
       164
        
                 did: sessionInfo.data.did,

     

       139
       139
       -
                 handle: sessionInfo.data.handle

     

       165
       165
       +
                 handle: sessionInfo.data.handle,

     

       140
       166
        
               });

     

       141
       167
        
               return agent;

     

       142
       168
        
             } catch (err) {

     
···

       156
       182
        
             console.log("Session created successfully:", {

     

       157
       183
        
               did: sessionRes.data.did,

     

       158
       184
        
               handle: sessionRes.data.handle,

     

       159
       159
       -
               hasAccessJwt: !!sessionRes.data.accessJwt

     

       185
       185
       +
               hasAccessJwt: !!sessionRes.data.accessJwt,

     

       160
       186
        
             });

     

       161
       187
        
       

     

       162
       188
        
             // Store the new token

+35 -2

lib/id-resolver.ts

···

       8
       8
        
         pds: string;

     

       9
       9
        
       }

     

       10
       10
        
       

     

       11
       11
       +
       interface DidService {

     

       12
       12
       +
         id: string;

     

       13
       13
       +
         type: string;

     

       14
       14
       +
         serviceEndpoint: string;

     

       15
       15
       +
       }

     

       16
       16
       +
       

     

       17
       17
       +
       /**

     

       18
       18
       +
        * ID resolver instance.

     

       19
       19
       +
        */

     

       11
       20
        
       const idResolver = createIdResolver();

     

       12
       21
        
       export const resolver = createBidirectionalResolver(idResolver);

     

       13
       22
        
       

     

       23
       23
       +
       /**

     

       24
       24
       +
        * Create the ID resolver.

     

       25
       25
       +
        * @returns The ID resolver

     

       26
       26
       +
        */

     

       14
       27
        
       export function createIdResolver() {

     

       15
       28
        
         return new IdResolver();

     

       16
       29
        
       }

     

       17
       30
        
       

     

       31
       31
       +
       /**

     

       32
       32
       +
        * The bidirectional resolver.

     

       33
       33
       +
        * @interface

     

       34
       34
       +
        */

     

       18
       35
        
       export interface BidirectionalResolver {

     

       19
       36
        
         resolveDidToHandle(did: string): Promise<string>;

     

       20
       37
        
         resolveDidsToHandles(dids: string[]): Promise<Record<string, string>>;

     

       21
       38
        
         resolveDidToPdsUrl(did: string): Promise<string | undefined>;

     

       22
       39
        
       }

     

       23
       40
        
       

     

       41
       41
       +
       /**

     

       42
       42
       +
        * Create the bidirectional resolver.

     

       43
       43
       +
        * @param resolver - The ID resolver

     

       44
       44
       +
        * @returns The bidirectional resolver

     

       45
       45
       +
        */

     

       24
       46
        
       export function createBidirectionalResolver(resolver: IdResolver) {

     

       25
       47
        
         return {

     

       26
       48
        
           async resolveDidToHandle(did: string): Promise<string> {

     
···

       33
       55
        
           },

     

       34
       56
        
       

     

       35
       57
        
           async resolveHandleToDid(handle: string) {

     

       36
       36
       -
             return await resolver.handle.resolve(handle) as Did

     

       58
       58
       +
             return await resolver.handle.resolve(handle) as Did;

     

       37
       59
        
           },

     

       38
       60
        
       

     

       39
       61
        
           async resolveDidToPdsUrl(did: string): Promise<string | undefined> {

     

       40
       62
        
             try {

     

       63
       63
       +
               // First try the standard resolution

     

       41
       64
        
               const didDoc = await resolver.did.resolveAtprotoData(

     

       42
       65
        
                 did,

     

       43
       66
        
               ) as AtprotoData;

     

       44
       44
       -
               return didDoc.pds;

     

       67
       67
       +
               if (didDoc.pds) {

     

       68
       68
       +
                 return didDoc.pds;

     

       69
       69
       +
               } else {

     

       70
       70
       +
                 const forcedDidDoc = await resolver.did.resolveAtprotoData(

     

       71
       71
       +
                   did,

     

       72
       72
       +
                   true,

     

       73
       73
       +
                 );

     

       74
       74
       +
                 if (forcedDidDoc.pds) {

     

       75
       75
       +
                   return forcedDidDoc.pds;

     

       76
       76
       +
                 }

     

       77
       77
       +
               }

     

       45
       78
        
             } catch (err) {

     

       46
       79
        
               console.error("Error resolving PDS URL:", err);

     

       47
       80
        
               return undefined;

+73

lib/migration-state.ts

···

       1
       1
       +
       /**

     

       2
       2
       +
        * Migration state types and utilities for controlling migration availability.

     

       3
       3
       +
        */

     

       4
       4
       +
       

     

       5
       5
       +
       export type MigrationState = "up" | "issue" | "maintenance";

     

       6
       6
       +
       

     

       7
       7
       +
       export interface MigrationStateInfo {

     

       8
       8
       +
         state: MigrationState;

     

       9
       9
       +
         message: string;

     

       10
       10
       +
         allowMigration: boolean;

     

       11
       11
       +
       }

     

       12
       12
       +
       

     

       13
       13
       +
       /**

     

       14
       14
       +
        * Get the current migration state from environment variables.

     

       15
       15
       +
        * @returns The migration state information

     

       16
       16
       +
        */

     

       17
       17
       +
       export function getMigrationState(): MigrationStateInfo {

     

       18
       18
       +
         const state = (Deno.env.get("MIGRATION_STATE") || "up")

     

       19
       19
       +
           .toLowerCase() as MigrationState;

     

       20
       20
       +
       

     

       21
       21
       +
         switch (state) {

     

       22
       22
       +
           case "issue":

     

       23
       23
       +
             return {

     

       24
       24
       +
               state: "issue",

     

       25
       25
       +
               message:

     

       26
       26
       +
                 "Migration services are temporarily unavailable as we investigate an issue. Please try again later.",

     

       27
       27
       +
               allowMigration: false,

     

       28
       28
       +
             };

     

       29
       29
       +
       

     

       30
       30
       +
           case "maintenance":

     

       31
       31
       +
             return {

     

       32
       32
       +
               state: "maintenance",

     

       33
       33
       +
               message:

     

       34
       34
       +
                 "Migration services are temporarily unavailable for maintenance. Please try again later.",

     

       35
       35
       +
               allowMigration: false,

     

       36
       36
       +
             };

     

       37
       37
       +
       

     

       38
       38
       +
           case "up":

     

       39
       39
       +
           default:

     

       40
       40
       +
             return {

     

       41
       41
       +
               state: "up",

     

       42
       42
       +
               message: "Migration services are operational.",

     

       43
       43
       +
               allowMigration: true,

     

       44
       44
       +
             };

     

       45
       45
       +
         }

     

       46
       46
       +
       }

     

       47
       47
       +
       

     

       48
       48
       +
       /**

     

       49
       49
       +
        * Check if migrations are currently allowed.

     

       50
       50
       +
        * @returns True if migrations are allowed, false otherwise

     

       51
       51
       +
        */

     

       52
       52
       +
       export function isMigrationAllowed(): boolean {

     

       53
       53
       +
         return getMigrationState().allowMigration;

     

       54
       54
       +
       }

     

       55
       55
       +
       

     

       56
       56
       +
       /**

     

       57
       57
       +
        * Get a user-friendly message for the current migration state.

     

       58
       58
       +
        * @returns The message to display to users

     

       59
       59
       +
        */

     

       60
       60
       +
       export function getMigrationStateMessage(): string {

     

       61
       61
       +
         return getMigrationState().message;

     

       62
       62
       +
       }

     

       63
       63
       +
       

     

       64
       64
       +
       /**

     

       65
       65
       +
        * Throw an error if migrations are not allowed.

     

       66
       66
       +
        * Used in API endpoints to prevent migration operations when disabled.

     

       67
       67
       +
        */

     

       68
       68
       +
       export function assertMigrationAllowed(): void {

     

       69
       69
       +
         const stateInfo = getMigrationState();

     

       70
       70
       +
         if (!stateInfo.allowMigration) {

     

       71
       71
       +
           throw new Error(stateInfo.message);

     

       72
       72
       +
         }

     

       73
       73
       +
       }

+63

lib/migration-types.ts

···

       1
       1
       +
       /**

     

       2
       2
       +
        * Shared types for migration components

     

       3
       3
       +
        */

     

       4
       4
       +
       

     

       5
       5
       +
       export interface MigrationStateInfo {

     

       6
       6
       +
         state: "up" | "issue" | "maintenance";

     

       7
       7
       +
         message: string;

     

       8
       8
       +
         allowMigration: boolean;

     

       9
       9
       +
       }

     

       10
       10
       +
       

     

       11
       11
       +
       export interface MigrationCredentials {

     

       12
       12
       +
         service: string;

     

       13
       13
       +
         handle: string;

     

       14
       14
       +
         email: string;

     

       15
       15
       +
         password: string;

     

       16
       16
       +
         invite?: string;

     

       17
       17
       +
       }

     

       18
       18
       +
       

     

       19
       19
       +
       export interface StepCommonProps {

     

       20
       20
       +
         credentials: MigrationCredentials;

     

       21
       21
       +
         onStepComplete: () => void;

     

       22
       22
       +
         onStepError: (error: string, isVerificationError?: boolean) => void;

     

       23
       23
       +
       }

     

       24
       24
       +
       

     

       25
       25
       +
       export interface VerificationResult {

     

       26
       26
       +
         ready: boolean;

     

       27
       27
       +
         reason?: string;

     

       28
       28
       +
         activated?: boolean;

     

       29
       29
       +
         validDid?: boolean;

     

       30
       30
       +
         repoCommit?: boolean;

     

       31
       31
       +
         repoRev?: boolean;

     

       32
       32
       +
         repoBlocks?: number;

     

       33
       33
       +
         expectedRecords?: number;

     

       34
       34
       +
         indexedRecords?: number;

     

       35
       35
       +
         privateStateValues?: number;

     

       36
       36
       +
         expectedBlobs?: number;

     

       37
       37
       +
         importedBlobs?: number;

     

       38
       38
       +
       }

     

       39
       39
       +
       

     

       40
       40
       +
       /**

     

       41
       41
       +
        * Helper function to verify a migration step

     

       42
       42
       +
        */

     

       43
       43
       +
       export async function verifyMigrationStep(

     

       44
       44
       +
         stepNum: number,

     

       45
       45
       +
       ): Promise<VerificationResult> {

     

       46
       46
       +
         const res = await fetch(`/api/migrate/status?step=${stepNum}`);

     

       47
       47
       +
         const data = await res.json();

     

       48
       48
       +
         return data;

     

       49
       49
       +
       }

     

       50
       50
       +
       

     

       51
       51
       +
       /**

     

       52
       52
       +
        * Helper function to handle API responses with proper error parsing

     

       53
       53
       +
        */

     

       54
       54
       +
       export function parseApiResponse(

     

       55
       55
       +
         responseText: string,

     

       56
       56
       +
       ): { success: boolean; message?: string } {

     

       57
       57
       +
         try {

     

       58
       58
       +
           const json = JSON.parse(responseText);

     

       59
       59
       +
           return { success: json.success !== false, message: json.message };

     

       60
       60
       +
         } catch {

     

       61
       61
       +
           return { success: responseText.trim() !== "", message: responseText };

     

       62
       62
       +
         }

     

       63
       63
       +
       }

lib/oauth/client.ts

···

       1
       1
        
       import { AtprotoOAuthClient } from "@bigmoves/atproto-oauth-client";

     

       2
       2
        
       import { SessionStore, StateStore } from "../storage.ts";

     

       3
       3
        
       

     

       4
       4
       +
       /**

     

       5
       5
       +
        * Create the OAuth client.

     

       6
       6
       +
        * @param db - The Deno KV instance for the database

     

       7
       7
       +
        * @returns The OAuth client

     

       8
       8
       +
        */

     

       4
       9
        
       export const createClient = (db: Deno.Kv) => {

     

       5
       10
        
         if (Deno.env.get("NODE_ENV") == "production" && !Deno.env.get("PUBLIC_URL")) {

     

       6
       11
        
           throw new Error("PUBLIC_URL is not set");

+17 -2

lib/oauth/sessions.ts

···

       1
       1
        
       import { Agent } from "npm:@atproto/api";

     

       2
       2
        
       import { getIronSession, SessionOptions } from "npm:iron-session";

     

       3
       3
        
       import { oauthClient } from "./client.ts";

     

       4
       4
       -
       import { OauthSession, createSessionOptions } from "../types.ts";

     

       4
       4
       +
       import { createSessionOptions, OauthSession } from "../types.ts";

     

       5
       5
        
       

     

       6
       6
        
       let oauthSessionOptions: SessionOptions;

     

       7
       7
        
       

     

       8
       8
       +
       /**

     

       9
       9
       +
        * Get the OAuth session options.

     

       10
       10
       +
        * @returns The OAuth session options

     

       11
       11
       +
        */

     

       8
       12
        
       async function getOptions() {

     

       9
       13
        
         if (!oauthSessionOptions) {

     

       10
       14
        
           oauthSessionOptions = await createSessionOptions("oauth_sid");

     
···

       12
       16
        
         return oauthSessionOptions;

     

       13
       17
        
       }

     

       14
       18
        
       

     

       19
       19
       +
       /**

     

       20
       20
       +
        * Get the OAuth session agent for the given request.

     

       21
       21
       +
        * @param req - The request object

     

       22
       22
       +
        * @returns The OAuth session agent

     

       23
       23
       +
        */

     

       15
       24
        
       export async function getOauthSessionAgent(

     

       16
       16
       -
         req: Request

     

       25
       25
       +
         req: Request,

     

       17
       26
        
       ) {

     

       18
       27
        
         try {

     

       19
       28
        
           console.log("Getting OAuth session...");

     
···

       47
       56
        
         }

     

       48
       57
        
       }

     

       49
       58
        
       

     

       59
       59
       +
       /**

     

       60
       60
       +
        * Get the OAuth session for the given request.

     

       61
       61
       +
        * @param req - The request object

     

       62
       62
       +
        * @param res - The response object

     

       63
       63
       +
        * @returns The OAuth session

     

       64
       64
       +
        */

     

       50
       65
        
       export async function getOauthSession(

     

       51
       66
        
         req: Request,

     

       52
       67
        
         res: Response = new Response(),

+49 -10

lib/sessions.ts

···

       1
       1
        
       import { Agent } from "npm:@atproto/api";

     

       2
       2
       -
       import { OauthSession, CredentialSession } from "./types.ts";

     

       3
       3
       -
       import { getCredentialSession, getCredentialSessionAgent } from "./cred/sessions.ts";

     

       2
       2
       +
       import { CredentialSession, OauthSession } from "./types.ts";

     

       3
       3
       +
       import {

     

       4
       4
       +
         getCredentialSession,

     

       5
       5
       +
         getCredentialSessionAgent,

     

       6
       6
       +
       } from "./cred/sessions.ts";

     

       4
       7
        
       import { getOauthSession, getOauthSessionAgent } from "./oauth/sessions.ts";

     

       5
       8
        
       import { IronSession } from "npm:iron-session";

     

       6
       9
        
       

     

       10
       10
       +
       /**

     

       11
       11
       +
        * Get the session for the given request.

     

       12
       12
       +
        * @param req - The request object

     

       13
       13
       +
        * @param res - The response object

     

       14
       14
       +
        * @param isMigration - Whether to get the migration session

     

       15
       15
       +
        * @returns The session

     

       16
       16
       +
        */

     

       7
       17
        
       export async function getSession(

     

       8
       18
        
         req: Request,

     

       9
       19
        
         res: Response = new Response(),

     

       10
       10
       -
         isMigration: boolean = false

     

       20
       20
       +
         isMigration: boolean = false,

     

       11
       21
        
       ): Promise<IronSession<OauthSession | CredentialSession>> {

     

       12
       22
        
         if (isMigration) {

     

       13
       23
        
           return await getCredentialSession(req, res, true);

     
···

       16
       26
        
         const credentialSession = await getCredentialSession(req, res);

     

       17
       27
        
       

     

       18
       28
        
         if (oauthSession.did) {

     

       19
       19
       -
           console.log("Oauth session found")

     

       29
       29
       +
           console.log("Oauth session found");

     

       20
       30
        
           return oauthSession;

     

       21
       31
        
         }

     

       22
       32
        
         if (credentialSession.did) {

     
···

       26
       36
        
         throw new Error("No session found");

     

       27
       37
        
       }

     

       28
       38
        
       

     

       39
       39
       +
       /**

     

       40
       40
       +
        * Get the session agent for the given request.

     

       41
       41
       +
        * @param req - The request object

     

       42
       42
       +
        * @param res - The response object

     

       43
       43
       +
        * @param isMigration - Whether to get the migration session

     

       44
       44
       +
        * @returns The session agent

     

       45
       45
       +
        */

     

       29
       46
        
       export async function getSessionAgent(

     

       30
       47
        
         req: Request,

     

       31
       48
        
         res: Response = new Response(),

     

       32
       32
       -
         isMigration: boolean = false

     

       49
       49
       +
         isMigration: boolean = false,

     

       33
       50
        
       ): Promise<Agent | null> {

     

       34
       51
        
         if (isMigration) {

     

       35
       52
        
           return await getCredentialSessionAgent(req, res, isMigration);

     

       36
       53
        
         }

     

       37
       54
        
       

     

       38
       55
        
         const oauthAgent = await getOauthSessionAgent(req);

     

       39
       39
       -
         const credentialAgent = await getCredentialSessionAgent(req, res, isMigration);

     

       56
       56
       +
         const credentialAgent = await getCredentialSessionAgent(

     

       57
       57
       +
           req,

     

       58
       58
       +
           res,

     

       59
       59
       +
           isMigration,

     

       60
       60
       +
         );

     

       40
       61
        
       

     

       41
       62
        
         if (oauthAgent) {

     

       42
       63
        
           return oauthAgent;

     
···

       49
       70
        
         return null;

     

       50
       71
        
       }

     

       51
       72
        
       

     

       52
       52
       -
       export async function destroyAllSessions(req: Request) {

     

       53
       53
       -
         const oauthSession = await getOauthSession(req);

     

       54
       54
       -
         const credentialSession = await getCredentialSession(req);

     

       55
       55
       -
         const migrationSession = await getCredentialSession(req, new Response(), true);

     

       73
       73
       +
       /**

     

       74
       74
       +
        * Destroy all sessions for the given request.

     

       75
       75
       +
        * @param req - The request object

     

       76
       76
       +
        * @param res - The response object

     

       77
       77
       +
        */

     

       78
       78
       +
       export async function destroyAllSessions(

     

       79
       79
       +
         req: Request,

     

       80
       80
       +
         res?: Response,

     

       81
       81
       +
       ): Promise<Response> {

     

       82
       82
       +
         const response = res || new Response();

     

       83
       83
       +
         const oauthSession = await getOauthSession(req, response);

     

       84
       84
       +
         const credentialSession = await getCredentialSession(req, res);

     

       85
       85
       +
         const migrationSession = await getCredentialSession(

     

       86
       86
       +
           req,

     

       87
       87
       +
           res,

     

       88
       88
       +
           true,

     

       89
       89
       +
         );

     

       56
       90
        
       

     

       57
       91
        
         if (oauthSession.did) {

     

       58
       92
        
           oauthSession.destroy();

     
···

       61
       95
        
           credentialSession.destroy();

     

       62
       96
        
         }

     

       63
       97
        
         if (migrationSession.did) {

     

       98
       98
       +
           console.log("DESTROYING MIGRATION SESSION", migrationSession);

     

       64
       99
        
           migrationSession.destroy();

     

       100
       100
       +
         } else {

     

       101
       101
       +
           console.log("MIGRATION SESSION NOT FOUND", migrationSession);

     

       65
       102
        
         }

     

       103
       103
       +
       

     

       104
       104
       +
         return response;

     

       66
       105
        
       }

+9 -1

lib/storage.ts

···

       3
       3
        
         NodeSavedSessionStore,

     

       4
       4
        
         NodeSavedState,

     

       5
       5
        
         NodeSavedStateStore,

     

       6
       6
       -
       } from "jsr:@bigmoves/atproto-oauth-client";

     

       6
       6
       +
       } from "@bigmoves/atproto-oauth-client";

     

       7
       7
        
       

     

       8
       8
       +
       /**

     

       9
       9
       +
        * The state store for sessions.

     

       10
       10
       +
        * @implements {NodeSavedStateStore}

     

       11
       11
       +
        */

     

       8
       12
        
       export class StateStore implements NodeSavedStateStore {

     

       9
       13
        
         constructor(private db: Deno.Kv) {}

     

       10
       14
        
         async get(key: string): Promise<NodeSavedState | undefined> {

     
···

       19
       23
        
         }

     

       20
       24
        
       }

     

       21
       25
        
       

     

       26
       26
       +
       /**

     

       27
       27
       +
        * The session store for sessions.

     

       28
       28
       +
        * @implements {NodeSavedSessionStore}

     

       29
       29
       +
        */

     

       22
       30
        
       export class SessionStore implements NodeSavedSessionStore {

     

       23
       31
        
         constructor(private db: Deno.Kv) {}

     

       24
       32
        
         async get(key: string): Promise<NodeSavedSession | undefined> {

+56 -27

lib/types.ts

···

       1
       1
        
       import { SessionOptions as BaseSessionOptions } from "npm:iron-session";

     

       2
       2
        
       

     

       3
       3
       +
       /**

     

       4
       4
       +
        * The session options.

     

       5
       5
       +
        * @type {SessionOptions}

     

       6
       6
       +
        * @implements {BaseSessionOptions}

     

       7
       7
       +
        */

     

       3
       8
        
       interface SessionOptions extends BaseSessionOptions {

     

       4
       9
        
         lockFn?: (key: string) => Promise<() => Promise<void>>;

     

       5
       10
        
       }

     

       6
       11
        
       

     

       7
       7
       -
       // Helper function to create a lock using Deno KV

     

       8
       8
       -
       async function createLock(key: string, db: Deno.Kv): Promise<() => Promise<void>> {

     

       12
       12
       +
       /**

     

       13
       13
       +
        * Create a lock using Deno KV.

     

       14
       14
       +
        * @param key - The key to lock

     

       15
       15
       +
        * @param db - The Deno KV instance for the database

     

       16
       16
       +
        * @returns The unlock function

     

       17
       17
       +
        */

     

       18
       18
       +
       async function createLock(

     

       19
       19
       +
         key: string,

     

       20
       20
       +
         db: Deno.Kv,

     

       21
       21
       +
       ): Promise<() => Promise<void>> {

     

       9
       22
        
         const lockKey = ["session_lock", key];

     

       10
       23
        
         const lockValue = Date.now();

     

       11
       11
       -
         

     

       24
       24
       +
       

     

       12
       25
        
         // Try to acquire lock

     

       13
       26
        
         const result = await db.atomic()

     

       14
       14
       -
           .check({ key: lockKey, versionstamp: null })  // Only if key doesn't exist

     

       15
       15
       -
           .set(lockKey, lockValue, { expireIn: 5000 })  // 5 second TTL

     

       27
       27
       +
           .check({ key: lockKey, versionstamp: null }) // Only if key doesn't exist

     

       28
       28
       +
           .set(lockKey, lockValue, { expireIn: 5000 }) // 5 second TTL

     

       16
       29
        
           .commit();

     

       17
       30
        
       

     

       18
       31
        
         if (!result.ok) {

     
···

       25
       38
        
         };

     

       26
       39
        
       }

     

       27
       40
        
       

     

       41
       41
       +
       /**

     

       42
       42
       +
        * The OAuth session.

     

       43
       43
       +
        * @type {OauthSession}

     

       44
       44
       +
        */

     

       28
       45
        
       export interface OauthSession {

     

       29
       29
       -
         did: string

     

       46
       46
       +
         did: string;

     

       30
       47
        
       }

     

       31
       48
        
       

     

       49
       49
       +
       /**

     

       50
       50
       +
        * The credential session.

     

       51
       51
       +
        * @type {CredentialSession}

     

       52
       52
       +
        */

     

       32
       53
        
       export interface CredentialSession {

     

       33
       54
        
         did: string;

     

       34
       55
        
         handle: string;

     
···

       45
       66
        
       

     

       46
       67
        
       let db: Deno.Kv;

     

       47
       68
        
       

     

       48
       48
       -
       export const createSessionOptions = async (cookieName: string): Promise<SessionOptions> =>  {

     

       49
       49
       -
           const cookieSecret = Deno.env.get("COOKIE_SECRET");

     

       50
       50
       -
           if (!cookieSecret) {

     

       51
       51
       -
               throw new Error("COOKIE_SECRET is not set");

     

       52
       52
       -
           }

     

       69
       69
       +
       /**

     

       70
       70
       +
        * Create the session options.

     

       71
       71
       +
        * @param cookieName - The name of the iron session cookie

     

       72
       72
       +
        * @returns The session options for iron session

     

       73
       73
       +
        */

     

       74
       74
       +
       export const createSessionOptions = async (

     

       75
       75
       +
         cookieName: string,

     

       76
       76
       +
       ): Promise<SessionOptions> => {

     

       77
       77
       +
         const cookieSecret = Deno.env.get("COOKIE_SECRET");

     

       78
       78
       +
         if (!cookieSecret) {

     

       79
       79
       +
           throw new Error("COOKIE_SECRET is not set");

     

       80
       80
       +
         }

     

       53
       81
        
       

     

       54
       54
       -
           if (!db) {

     

       55
       55
       -
             db = await Deno.openKv();

     

       56
       56
       -
           }

     

       82
       82
       +
         if (!db) {

     

       83
       83
       +
           db = await Deno.openKv();

     

       84
       84
       +
         }

     

       57
       85
        
       

     

       58
       58
       -
           return {

     

       59
       59
       -
               cookieName: cookieName,

     

       60
       60
       -
               password: cookieSecret,

     

       61
       61
       -
               cookieOptions: {

     

       62
       62
       -
                   secure: Deno.env.get("NODE_ENV") === "production" || Deno.env.get("NODE_ENV") === "staging",

     

       63
       63
       -
                   httpOnly: true,

     

       64
       64
       -
                   sameSite: "lax",

     

       65
       65
       -
                   path: "/",

     

       66
       66
       -
                   domain: undefined,

     

       67
       67
       -
               },

     

       68
       68
       -
               lockFn: (key: string) => createLock(key, db)

     

       69
       69
       -
           }

     

       70
       70
       -
       };
     

       86
       86
       +
         return {

     

       87
       87
       +
           cookieName: cookieName,

     

       88
       88
       +
           password: cookieSecret,

     

       89
       89
       +
           cookieOptions: {

     

       90
       90
       +
             secure: Deno.env.get("NODE_ENV") === "production" ||

     

       91
       91
       +
               Deno.env.get("NODE_ENV") === "staging",

     

       92
       92
       +
             httpOnly: true,

     

       93
       93
       +
             sameSite: "lax",

     

       94
       94
       +
             path: "/",

     

       95
       95
       +
             domain: undefined,

     

       96
       96
       +
           },

     

       97
       97
       +
           lockFn: (key: string) => createLock(key, db),

     

       98
       98
       +
         };

     

       99
       99
       +
       };

+5 -5

routes/_error.tsx

···

       1
       1
       -
       import { PageProps, HttpError } from "fresh";

     

       1
       1
       +
       import { HttpError, PageProps } from "fresh";

     

       2
       2
        
       import posthog from "posthog-js";

     

       3
       3
        
       

     

       4
       4
        
       export default function ErrorPage(props: PageProps) {

     

       5
       5
        
         const error = props.error; // Contains the thrown Error or HTTPError

     

       6
       6
        
         if (error instanceof HttpError) {

     

       7
       7
       -
           posthog.default.capture('error', {

     

       7
       7
       +
           posthog.default.capture("error", {

     

       8
       8
        
             error: error.message,

     

       9
       9
        
             status: error.status,

     

       10
       10
        
           });

     
···

       32
       32
        
                           FLIGHT NOT FOUND

     

       33
       33
        
                         </p>

     

       34
       34
        
                         <p class="text-lg sm:text-xl text-slate-600 dark:text-white/70 max-w-2xl">

     

       35
       35
       -
                           We couldn't locate the destination you're looking for. Please

     

       36
       36
       -
                           check your flight number and try again.

     

       35
       35
       +
                           We couldn't locate the destination you're looking for.

     

       36
       36
       +
                           Please check your flight number and try again.

     

       37
       37
        
                         </p>

     

       38
       38
        
                         <div class="mt-8">

     

       39
       39
        
                           <a

     
···

       48
       48
        
                   </div>

     

       49
       49
        
                 </div>

     

       50
       50
        
               </>

     

       51
       51
       -
             )

     

       51
       51
       +
             );

     

       52
       52
        
           }

     

       53
       53
        
         }

     

       54
       54

+134

routes/about.tsx

···

       1
       1
       +
       import { Button } from "../components/Button.tsx";

     

       2
       2
       +
       

     

       3
       3
       +
       export default function About() {

     

       4
       4
       +
         return (

     

       5
       5
       +
           <>

     

       6
       6
       +
             <div class="px-2 sm:px-4 py-4 sm:py-8 mx-auto">

     

       7
       7
       +
               <div class="max-w-screen-lg mx-auto flex flex-col items-center justify-center">

     

       8
       8
       +
                 <div class="prose dark:prose-invert max-w-none w-full mb-0">

     

       9
       9
       +
                   <h1 class="text-3xl font-bold text-center mb-8">

     

       10
       10
       +
                     About AT Protocol

     

       11
       11
       +
                   </h1>

     

       12
       12
       +
       

     

       13
       13
       +
                   <div class="space-y-6">

     

       14
       14
       +
                     <section>

     

       15
       15
       +
                       <h2 class="text-2xl font-semibold mb-4">

     

       16
       16
       +
                         What is AT Protocol?

     

       17
       17
       +
                       </h2>

     

       18
       18
       +
                       <p class="text-gray-600 dark:text-gray-300">

     

       19
       19
       +
                         AT Protocol (Authenticated Transfer Protocol) is the

     

       20
       20
       +
                         foundation of Bluesky and other social apps like

     

       21
       21
       +
                         <a href="https://tangled.sh">Tangled</a>,

     

       22
       22
       +
                         <a href="https://spark.com">Spark</a>, and more. Unlike

     

       23
       23
       +
                         traditional social platforms that lock your data and identity

     

       24
       24
       +
                         to a single service, AT Protocol gives you complete control

     

       25
       25
       +
                         over your digital presence. Think of it as an open standard

     

       26
       26
       +
                         for social networking, similar to how email works across

     

       27
       27
       +
                         different providers.

     

       28
       28
       +
                       </p>

     

       29
       29
       +
                     </section>

     

       30
       30
       +
       

     

       31
       31
       +
                     <section>

     

       32
       32
       +
                       <h2 class="text-2xl font-semibold mb-4">Key Features</h2>

     

       33
       33
       +
                       <ul class="list-disc pl-6 space-y-4 text-gray-600 dark:text-gray-300">

     

       34
       34
       +
                         <li>

     

       35
       35
       +
                           <strong>PDS Servers:</strong>{" "}

     

       36
       36
       +
                           PDS servers are where your data is stored. They can be run

     

       37
       37
       +
                           by anyone, and they are very lightweight, allowing you to

     

       38
       38
       +
                           choose which one to use or run your own. PDS servers just

     

       39
       39
       +
                           store your data, meaning you don't have to switch PDS

     

       40
       40
       +
                           servers to use a different app or service. You can have one

     

       41
       41
       +
                           PDS while using many different apps and services with the

     

       42
       42
       +
                           same account.

     

       43
       43
       +
                         </li>

     

       44
       44
       +
                         <li>

     

       45
       45
       +
                           <strong>Decentralized Identity:</strong>{" "}

     

       46
       46
       +
                           Your account is tied to a DID (Decentralized Identifier)

     

       47
       47
       +
                           rather than your handle/username. This means you can move

     

       48
       48
       +
                           your entire account, including your followers and content,

     

       49
       49
       +
                           to any PDS by changing where your DID points. It's also the

     

       50
       50
       +
                           reason you can use any domain as your handle, because your

     

       51
       51
       +
                           identity is not tied to your handle. Your handle can change,

     

       52
       52
       +
                           but your DID will always remain the same.

     

       53
       53
       +
                         </li>

     

       54
       54
       +
                         <li>

     

       55
       55
       +
                           <strong>Portable Content:</strong>{" "}

     

       56
       56
       +
                           All your posts, likes, and other social data are stored in

     

       57
       57
       +
                           your Personal Data Server (PDS). You can switch PDS

     

       58
       58
       +
                           providers without losing any content or connections.

     

       59
       59
       +
                         </li>

     

       60
       60
       +
                         <li>

     

       61
       61
       +
                           <strong>Architecture:</strong>{" "}

     

       62
       62
       +
                           The protocol uses a three-tier architecture: Personal Data

     

       63
       63
       +
                           Servers (PDS) store your content, relays broadcast a stream

     

       64
       64
       +
                           of all events on all PDSes, and AppViews process and serve

     

       65
       65
       +
                           that stream into content for users. This means when you make

     

       66
       66
       +
                           a post, the content is stored on your PDS, picked up by

     

       67
       67
       +
                           relays, and AppViews listen to those relays to deliver that

     

       68
       68
       +
                           post to all users.

     

       69
       69
       +
                         </li>

     

       70
       70
       +
                         <li>

     

       71
       71
       +
                           <strong>Algorithmic Choice:</strong>{" "}

     

       72
       72
       +
                           You're not locked into a single algorithm for your feed.

     

       73
       73
       +
                           Different services can offer different ways of curating

     

       74
       74
       +
                           content, and you can choose which one you prefer. Bluesky

     

       75
       75
       +
                           offers a way to make custom feeds, but even if it didn't,

     

       76
       76
       +
                           different apps could still offer their own algorithms for

     

       77
       77
       +
                           curating content.

     

       78
       78
       +
                         </li>

     

       79
       79
       +
                       </ul>

     

       80
       80
       +
                     </section>

     

       81
       81
       +
       

     

       82
       82
       +
                     <section>

     

       83
       83
       +
                       <h2 class="text-2xl font-semibold mb-4">Learn More</h2>

     

       84
       84
       +
                       <div class="space-y-4">

     

       85
       85
       +
                         <p class="text-gray-600 dark:text-gray-300">

     

       86
       86
       +
                           Want to dive deeper into AT Protocol? Check out these

     

       87
       87
       +
                           resources:

     

       88
       88
       +
                         </p>

     

       89
       89
       +
                         <ul class="list-none space-y-2">

     

       90
       90
       +
                           <li>

     

       91
       91
       +
                             <a

     

       92
       92
       +
                               href="https://atproto.com"

     

       93
       93
       +
                               class="text-blue-500 hover:underline"

     

       94
       94
       +
                             >

     

       95
       95
       +
                               Official AT Protocol Docs

     

       96
       96
       +
                             </a>{" "}

     

       97
       97
       +
                             - The main source for protocol specs and information

     

       98
       98
       +
                           </li>

     

       99
       99
       +
                           <li>

     

       100
       100
       +
                             <a

     

       101
       101
       +
                               href="https://github.com/bluesky-social/atproto"

     

       102
       102
       +
                               class="text-blue-500 hover:underline"

     

       103
       103
       +
                             >

     

       104
       104
       +
                               GitHub Repository

     

       105
       105
       +
                             </a>{" "}

     

       106
       106
       +
                             - View the protocol implementation

     

       107
       107
       +
                           </li>

     

       108
       108
       +
                           <li>

     

       109
       109
       +
                             <a

     

       110
       110
       +
                               href="https://atproto.wiki"

     

       111
       111
       +
                               class="text-blue-500 hover:underline"

     

       112
       112
       +
                             >

     

       113
       113
       +
                               AT Protocol Wiki

     

       114
       114
       +
                             </a>{" "}

     

       115
       115
       +
                             - Community-driven documentation and resources

     

       116
       116
       +
                           </li>

     

       117
       117
       +
                         </ul>

     

       118
       118
       +
                       </div>

     

       119
       119
       +
                     </section>

     

       120
       120
       +
                   </div>

     

       121
       121
       +
       

     

       122
       122
       +
                   <div class="mt-8 text-center">

     

       123
       123
       +
                     <Button

     

       124
       124
       +
                       href="/"

     

       125
       125
       +
                       color="blue"

     

       126
       126
       +
                       label="Back to Home"

     

       127
       127
       +
                     />

     

       128
       128
       +
                   </div>

     

       129
       129
       +
                 </div>

     

       130
       130
       +
               </div>

     

       131
       131
       +
             </div>

     

       132
       132
       +
           </>

     

       133
       133
       +
         );

     

       134
       134
       +
       }

+66 -41

routes/api/cred/login.ts

···

       3
       3
        
       import { define } from "../../../utils.ts";

     

       4
       4
        
       import { Agent } from "npm:@atproto/api";

     

       5
       5
        
       

     

       6
       6
       +
       /**

     

       7
       7
       +
        * Handle credential login

     

       8
       8
       +
        * Save iron session to cookies

     

       9
       9
       +
        * Save credential session state to database

     

       10
       10
       +
        * @param ctx - The context object containing the request and response

     

       11
       11
       +
        * @returns A response object with the login result

     

       12
       12
       +
        */

     

       6
       13
        
       export const handler = define.handlers({

     

       7
       14
        
         async POST(ctx) {

     

       8
       15
        
           try {

     
···

       10
       17
        
             const { handle, password } = body;

     

       11
       18
        
       

     

       12
       19
        
             if (!handle || !password) {

     

       13
       13
       -
               return new Response(JSON.stringify({

     

       14
       14
       -
                 success: false,

     

       15
       15
       -
                 message: "Handle and password are required"

     

       16
       16
       -
               }), {

     

       17
       17
       -
                 status: 400,

     

       18
       18
       -
                 headers: { "Content-Type": "application/json" }

     

       19
       19
       -
               });

     

       20
       20
       +
               return new Response(

     

       21
       21
       +
                 JSON.stringify({

     

       22
       22
       +
                   success: false,

     

       23
       23
       +
                   message: "Handle and password are required",

     

       24
       24
       +
                 }),

     

       25
       25
       +
                 {

     

       26
       26
       +
                   status: 400,

     

       27
       27
       +
                   headers: { "Content-Type": "application/json" },

     

       28
       28
       +
                 }

     

       29
       29
       +
               );

     

       20
       30
        
             }

     

       21
       31
        
       

     

       22
       32
        
             console.log("Resolving handle:", handle);

     

       23
       23
       -
             const did = await resolver.resolveHandleToDid(handle)

     

       24
       24
       -
             const service = await resolver.resolveDidToPdsUrl(did)

     

       33
       33
       +
             const did =

     

       34
       34
       +
               typeof handle == "string" && handle.startsWith("did:")

     

       35
       35
       +
                 ? handle

     

       36
       36
       +
                 : await resolver.resolveHandleToDid(handle);

     

       37
       37
       +
             const service = await resolver.resolveDidToPdsUrl(did);

     

       25
       38
        
             console.log("Resolved service:", service);

     

       26
       39
        
       

     

       27
       40
        
             if (!service) {

     

       28
       28
       -
               return new Response(JSON.stringify({

     

       29
       29
       -
                 success: false,

     

       30
       30
       -
                 message: "Invalid handle"

     

       31
       31
       -
               }), {

     

       32
       32
       -
                 status: 400,

     

       33
       33
       -
               })

     

       41
       41
       +
               return new Response(

     

       42
       42
       +
                 JSON.stringify({

     

       43
       43
       +
                   success: false,

     

       44
       44
       +
                   message: "Invalid handle",

     

       45
       45
       +
                 }),

     

       46
       46
       +
                 {

     

       47
       47
       +
                   status: 400,

     

       48
       48
       +
                 }

     

       49
       49
       +
               );

     

       34
       50
        
             }

     

       35
       51
        
       

     

       36
       52
        
             try {

     
···

       44
       60
        
               console.log("Created ATProto session:", {

     

       45
       61
        
                 did: sessionRes.data.did,

     

       46
       62
        
                 handle: sessionRes.data.handle,

     

       47
       47
       -
                 hasAccessJwt: !!sessionRes.data.accessJwt

     

       63
       63
       +
                 hasAccessJwt: !!sessionRes.data.accessJwt,

     

       48
       64
        
               });

     

       49
       65
        
       

     

       50
       66
        
               // Create response for setting cookies

     

       51
       51
       -
               const response = new Response(JSON.stringify({

     

       52
       52
       -
                 success: true,

     

       53
       53
       -
                 did,

     

       54
       54
       -
                 handle

     

       55
       55
       -
               }), {

     

       56
       56
       -
                 status: 200,

     

       57
       57
       -
                 headers: { "Content-Type": "application/json" }

     

       58
       58
       -
               });

     

       67
       67
       +
               const response = new Response(

     

       68
       68
       +
                 JSON.stringify({

     

       69
       69
       +
                   success: true,

     

       70
       70
       +
                   did,

     

       71
       71
       +
                   handle,

     

       72
       72
       +
                 }),

     

       73
       73
       +
                 {

     

       74
       74
       +
                   status: 200,

     

       75
       75
       +
                   headers: { "Content-Type": "application/json" },

     

       76
       76
       +
                 }

     

       77
       77
       +
               );

     

       59
       78
        
       

     

       60
       79
        
               // Create and save our client session with tokens

     

       61
       80
        
               await setCredentialSession(ctx.req, response, {

     
···

       63
       82
        
                 service,

     

       64
       83
        
                 password,

     

       65
       84
        
                 handle,

     

       66
       66
       -
                 accessJwt: sessionRes.data.accessJwt

     

       85
       85
       +
                 accessJwt: sessionRes.data.accessJwt,

     

       67
       86
        
               });

     

       68
       87
        
       

     

       69
       88
        
               // Log the response headers

     

       70
       89
        
               console.log("Response headers:", {

     

       71
       90
        
                 cookies: response.headers.get("Set-Cookie"),

     

       72
       72
       -
                 allHeaders: Object.fromEntries(response.headers.entries())

     

       91
       91
       +
                 allHeaders: Object.fromEntries(response.headers.entries()),

     

       73
       92
        
               });

     

       74
       93
        
       

     

       75
       94
        
               return response;

     

       76
       95
        
             } catch (err) {

     

       77
       96
        
               const message = err instanceof Error ? err.message : String(err);

     

       78
       97
        
               console.error("Login failed:", message);

     

       79
       79
       -
               return new Response(JSON.stringify({

     

       80
       80
       -
                 success: false,

     

       81
       81
       -
                 message: "Invalid credentials"

     

       82
       82
       -
               }), {

     

       83
       83
       -
                 status: 401,

     

       84
       84
       -
                 headers: { "Content-Type": "application/json" }

     

       85
       85
       -
               });

     

       98
       98
       +
               return new Response(

     

       99
       99
       +
                 JSON.stringify({

     

       100
       100
       +
                   success: false,

     

       101
       101
       +
                   message: "Invalid credentials",

     

       102
       102
       +
                 }),

     

       103
       103
       +
                 {

     

       104
       104
       +
                   status: 401,

     

       105
       105
       +
                   headers: { "Content-Type": "application/json" },

     

       106
       106
       +
                 }

     

       107
       107
       +
               );

     

       86
       108
        
             }

     

       87
       109
        
           } catch (error) {

     

       88
       110
        
             const message = error instanceof Error ? error.message : String(error);

     

       89
       111
        
             console.error("Login error:", message);

     

       90
       90
       -
             return new Response(JSON.stringify({

     

       91
       91
       -
               success: false,

     

       92
       92
       -
               message: error instanceof Error ? error.message : "An error occurred"

     

       93
       93
       -
             }), {

     

       94
       94
       -
               status: 500,

     

       95
       95
       -
               headers: { "Content-Type": "application/json" }

     

       96
       96
       -
             });

     

       112
       112
       +
             return new Response(

     

       113
       113
       +
               JSON.stringify({

     

       114
       114
       +
                 success: false,

     

       115
       115
       +
                 message: error instanceof Error ? error.message : "An error occurred",

     

       116
       116
       +
               }),

     

       117
       117
       +
               {

     

       118
       118
       +
                 status: 500,

     

       119
       119
       +
                 headers: { "Content-Type": "application/json" },

     

       120
       120
       +
               }

     

       121
       121
       +
             );

     

       97
       122
        
           }

     

       98
       98
       -
         }

     

       123
       123
       +
         },

     

       99
       124
        
       });

+4 -4

routes/api/logout.ts

···

       1
       1
       -
       import { getSession, destroyAllSessions } from "../../lib/sessions.ts";

     

       1
       1
       +
       import { destroyAllSessions, getSession } from "../../lib/sessions.ts";

     

       2
       2
        
       import { oauthClient } from "../../lib/oauth/client.ts";

     

       3
       3
        
       import { define } from "../../utils.ts";

     

       4
       4
        
       

     
···

       13
       13
        
             if (session.did) {

     

       14
       14
        
               // Try to revoke both types of sessions - the one that doesn't exist will just no-op

     

       15
       15
        
               await Promise.all([

     

       16
       16
       -
                 oauthClient.revoke(session.did).catch(console.error)

     

       16
       16
       +
                 oauthClient.revoke(session.did).catch(console.error),

     

       17
       17
        
               ]);

     

       18
       18
        
               // Then destroy the iron session

     

       19
       19
        
               session.destroy();

     

       20
       20
        
             }

     

       21
       21
        
       

     

       22
       22
        
             // Destroy all sessions including migration session

     

       23
       23
       -
             await destroyAllSessions(req);

     

       23
       23
       +
             const result = await destroyAllSessions(req, response);

     

       24
       24
        
       

     

       25
       25
       -
             return response;

     

       25
       25
       +
             return result;

     

       26
       26
        
           } catch (error: unknown) {

     

       27
       27
        
             const err = error instanceof Error ? error : new Error(String(error));

     

       28
       28
        
             console.error("Logout failed:", err.message);

+12 -9

routes/api/me.ts

···

       8
       8
        
           const res = new Response();

     

       9
       9
        
       

     

       10
       10
        
           try {

     

       11
       11
       -
             console.log("[/api/me] Request headers:", Object.fromEntries(req.headers.entries()));

     

       11
       11
       +
             console.log(

     

       12
       12
       +
               "[/api/me] Request headers:",

     

       13
       13
       +
               Object.fromEntries(req.headers.entries()),

     

       14
       14
       +
             );

     

       12
       15
        
       

     

       13
       16
        
             const agent = await getSessionAgent(req, res);

     

       14
       17
        
             if (!agent) {

     
···

       17
       20
        
                 status: 200,

     

       18
       21
        
                 headers: {

     

       19
       22
        
                   "Content-Type": "application/json",

     

       20
       20
       -
                   "X-Response-Type": "null"

     

       21
       21
       -
                 }

     

       23
       23
       +
                   "X-Response-Type": "null",

     

       24
       24
       +
                 },

     

       22
       25
        
               });

     

       23
       26
        
             }

     

       24
       27
        
       

     
···

       28
       31
        
       

     

       29
       32
        
             const responseData = {

     

       30
       33
        
               did: session.data.did,

     

       31
       31
       -
               handle

     

       34
       34
       +
               handle,

     

       32
       35
        
             };

     

       33
       36
        
       

     

       34
       37
        
             return new Response(JSON.stringify(responseData), {

     

       35
       38
        
               status: 200,

     

       36
       39
        
               headers: {

     

       37
       40
        
                 "Content-Type": "application/json",

     

       38
       38
       -
                 "X-Response-Type": "user"

     

       39
       39
       -
               }

     

       41
       41
       +
                 "X-Response-Type": "user",

     

       42
       42
       +
               },

     

       40
       43
        
             });

     

       41
       44
        
           } catch (err) {

     

       42
       45
        
             const message = err instanceof Error ? err.message : String(err);

     
···

       45
       48
        
               stack: err instanceof Error ? err.stack : undefined,

     

       46
       49
        
               url: req.url,

     

       47
       50
        
               method: req.method,

     

       48
       48
       -
               headers: Object.fromEntries(req.headers.entries())

     

       51
       51
       +
               headers: Object.fromEntries(req.headers.entries()),

     

       49
       52
        
             });

     

       50
       53
        
       

     

       51
       54
        
             return new Response(JSON.stringify(null), {

     
···

       53
       56
        
               headers: {

     

       54
       57
        
                 "Content-Type": "application/json",

     

       55
       58
        
                 "X-Response-Type": "error",

     

       56
       56
       -
                 "X-Error-Message": encodeURIComponent(message)

     

       57
       57
       -
               }

     

       59
       59
       +
                 "X-Error-Message": encodeURIComponent(message),

     

       60
       60
       +
               },

     

       58
       61
        
             });

     

       59
       62
        
           }

     

       60
       63
        
         },

+18 -2

routes/api/migrate/create.ts

···

       2
       2
        
       import { setCredentialSession } from "../../../lib/cred/sessions.ts";

     

       3
       3
        
       import { Agent } from "@atproto/api";

     

       4
       4
        
       import { define } from "../../../utils.ts";

     

       5
       5
       +
       import { assertMigrationAllowed } from "../../../lib/migration-state.ts";

     

       5
       6
        
       

     

       7
       7
       +
       /**

     

       8
       8
       +
        * Handle account creation

     

       9
       9
       +
        * First step of the migration process

     

       10
       10
       +
        * Body must contain:

     

       11
       11
       +
        * - service: The service URL of the new account

     

       12
       12
       +
        * - handle: The handle of the new account

     

       13
       13
       +
        * - password: The password of the new account

     

       14
       14
       +
        * - email: The email of the new account

     

       15
       15
       +
        * - invite: The invite code of the new account (optional depending on the PDS)

     

       16
       16
       +
        * @param ctx - The context object containing the request and response

     

       17
       17
       +
        * @returns A response object with the creation result

     

       18
       18
       +
        */

     

       6
       19
        
       export const handler = define.handlers({

     

       7
       20
        
         async POST(ctx) {

     

       8
       21
        
           const res = new Response();

     

       9
       22
        
           try {

     

       23
       23
       +
             // Check if migrations are currently allowed

     

       24
       24
       +
             assertMigrationAllowed();

     

       25
       25
       +
       

     

       10
       26
        
             const body = await ctx.req.json();

     

       11
       27
        
             const serviceUrl = body.service;

     

       12
       28
        
             const newHandle = body.handle;

     
···

       29
       45
        
               return new Response("Could not create new agent", { status: 400 });

     

       30
       46
        
             }

     

       31
       47
        
       

     

       32
       32
       -
             console.log("getting did")

     

       48
       48
       +
             console.log("getting did");

     

       33
       49
        
             const session = await oldAgent.com.atproto.server.getSession();

     

       34
       50
        
             const accountDid = session.data.did;

     

       35
       35
       -
             console.log("got did")

     

       51
       51
       +
             console.log("got did");

     

       36
       52
        
             const describeRes = await newAgent.com.atproto.server.describeServer();

     

       37
       53
        
             const newServerDid = describeRes.data.did;

     

       38
       54
        
             const inviteRequired = describeRes.data.inviteCodeRequired ?? false;

+359

routes/api/migrate/data/blobs.ts

···

       1
       1
       +
       import { getSessionAgent } from "../../../../lib/sessions.ts";

     

       2
       2
       +
       import { checkDidsMatch } from "../../../../lib/check-dids.ts";

     

       3
       3
       +
       import { define } from "../../../../utils.ts";

     

       4
       4
       +
       import { assertMigrationAllowed } from "../../../../lib/migration-state.ts";

     

       5
       5
       +
       

     

       6
       6
       +
       export const handler = define.handlers({

     

       7
       7
       +
         async POST(ctx) {

     

       8
       8
       +
           const res = new Response();

     

       9
       9
       +
           try {

     

       10
       10
       +
             // Check if migrations are currently allowed

     

       11
       11
       +
             assertMigrationAllowed();

     

       12
       12
       +
       

     

       13
       13
       +
             console.log("Blob migration: Starting session retrieval");

     

       14
       14
       +
             const oldAgent = await getSessionAgent(ctx.req);

     

       15
       15
       +
             console.log("Blob migration: Got old agent:", !!oldAgent);

     

       16
       16
       +
       

     

       17
       17
       +
             const newAgent = await getSessionAgent(ctx.req, res, true);

     

       18
       18
       +
             console.log("Blob migration: Got new agent:", !!newAgent);

     

       19
       19
       +
       

     

       20
       20
       +
             if (!oldAgent) {

     

       21
       21
       +
               return new Response(

     

       22
       22
       +
                 JSON.stringify({

     

       23
       23
       +
                   success: false,

     

       24
       24
       +
                   message: "Unauthorized",

     

       25
       25
       +
                 }),

     

       26
       26
       +
                 {

     

       27
       27
       +
                   status: 401,

     

       28
       28
       +
                   headers: { "Content-Type": "application/json" },

     

       29
       29
       +
                 },

     

       30
       30
       +
               );

     

       31
       31
       +
             }

     

       32
       32
       +
             if (!newAgent) {

     

       33
       33
       +
               return new Response(

     

       34
       34
       +
                 JSON.stringify({

     

       35
       35
       +
                   success: false,

     

       36
       36
       +
                   message: "Migration session not found or invalid",

     

       37
       37
       +
                 }),

     

       38
       38
       +
                 {

     

       39
       39
       +
                   status: 400,

     

       40
       40
       +
                   headers: { "Content-Type": "application/json" },

     

       41
       41
       +
                 },

     

       42
       42
       +
               );

     

       43
       43
       +
             }

     

       44
       44
       +
       

     

       45
       45
       +
             // Verify DIDs match between sessions

     

       46
       46
       +
             const didsMatch = await checkDidsMatch(ctx.req);

     

       47
       47
       +
             if (!didsMatch) {

     

       48
       48
       +
               return new Response(

     

       49
       49
       +
                 JSON.stringify({

     

       50
       50
       +
                   success: false,

     

       51
       51
       +
                   message: "Invalid state, original and target DIDs do not match",

     

       52
       52
       +
                 }),

     

       53
       53
       +
                 {

     

       54
       54
       +
                   status: 400,

     

       55
       55
       +
                   headers: { "Content-Type": "application/json" },

     

       56
       56
       +
                 },

     

       57
       57
       +
               );

     

       58
       58
       +
             }

     

       59
       59
       +
       

     

       60
       60
       +
             // Migrate blobs

     

       61
       61
       +
             const migrationLogs: string[] = [];

     

       62
       62
       +
             const migratedBlobs: string[] = [];

     

       63
       63
       +
             const failedBlobs: string[] = [];

     

       64
       64
       +
             let pageCount = 0;

     

       65
       65
       +
             let blobCursor: string | undefined = undefined;

     

       66
       66
       +
             let totalBlobs = 0;

     

       67
       67
       +
             let processedBlobs = 0;

     

       68
       68
       +
       

     

       69
       69
       +
             const startTime = Date.now();

     

       70
       70
       +
             console.log(`[${new Date().toISOString()}] Starting blob migration...`);

     

       71
       71
       +
             migrationLogs.push(

     

       72
       72
       +
               `[${new Date().toISOString()}] Starting blob migration...`,

     

       73
       73
       +
             );

     

       74
       74
       +
       

     

       75
       75
       +
             // First count total blobs

     

       76
       76
       +
             console.log(`[${new Date().toISOString()}] Starting blob count...`);

     

       77
       77
       +
             migrationLogs.push(

     

       78
       78
       +
               `[${new Date().toISOString()}] Starting blob count...`,

     

       79
       79
       +
             );

     

       80
       80
       +
       

     

       81
       81
       +
             const session = await oldAgent.com.atproto.server.getSession();

     

       82
       82
       +
             const accountDid = session.data.did;

     

       83
       83
       +
       

     

       84
       84
       +
             do {

     

       85
       85
       +
               const pageStartTime = Date.now();

     

       86
       86
       +
               console.log(

     

       87
       87
       +
                 `[${new Date().toISOString()}] Counting blobs on page ${

     

       88
       88
       +
                   pageCount + 1

     

       89
       89
       +
                 }...`,

     

       90
       90
       +
               );

     

       91
       91
       +
               migrationLogs.push(

     

       92
       92
       +
                 `[${new Date().toISOString()}] Counting blobs on page ${

     

       93
       93
       +
                   pageCount + 1

     

       94
       94
       +
                 }...`,

     

       95
       95
       +
               );

     

       96
       96
       +
               const listedBlobs = await oldAgent.com.atproto.sync.listBlobs({

     

       97
       97
       +
                 did: accountDid,

     

       98
       98
       +
                 cursor: blobCursor,

     

       99
       99
       +
               });

     

       100
       100
       +
       

     

       101
       101
       +
               const newBlobs = listedBlobs.data.cids.length;

     

       102
       102
       +
               totalBlobs += newBlobs;

     

       103
       103
       +
               const pageTime = Date.now() - pageStartTime;

     

       104
       104
       +
       

     

       105
       105
       +
               console.log(

     

       106
       106
       +
                 `[${new Date().toISOString()}] Found ${newBlobs} blobs on page ${

     

       107
       107
       +
                   pageCount + 1

     

       108
       108
       +
                 } in ${pageTime / 1000} seconds, total so far: ${totalBlobs}`,

     

       109
       109
       +
               );

     

       110
       110
       +
               migrationLogs.push(

     

       111
       111
       +
                 `[${new Date().toISOString()}] Found ${newBlobs} blobs on page ${

     

       112
       112
       +
                   pageCount + 1

     

       113
       113
       +
                 } in ${pageTime / 1000} seconds, total so far: ${totalBlobs}`,

     

       114
       114
       +
               );

     

       115
       115
       +
       

     

       116
       116
       +
               pageCount++;

     

       117
       117
       +
               blobCursor = listedBlobs.data.cursor;

     

       118
       118
       +
             } while (blobCursor);

     

       119
       119
       +
       

     

       120
       120
       +
             console.log(

     

       121
       121
       +
               `[${new Date().toISOString()}] Total blobs to migrate: ${totalBlobs}`,

     

       122
       122
       +
             );

     

       123
       123
       +
             migrationLogs.push(

     

       124
       124
       +
               `[${new Date().toISOString()}] Total blobs to migrate: ${totalBlobs}`,

     

       125
       125
       +
             );

     

       126
       126
       +
       

     

       127
       127
       +
             // Reset cursor for actual migration

     

       128
       128
       +
             blobCursor = undefined;

     

       129
       129
       +
             pageCount = 0;

     

       130
       130
       +
             processedBlobs = 0;

     

       131
       131
       +
       

     

       132
       132
       +
             do {

     

       133
       133
       +
               const pageStartTime = Date.now();

     

       134
       134
       +
               console.log(

     

       135
       135
       +
                 `[${new Date().toISOString()}] Fetching blob list page ${

     

       136
       136
       +
                   pageCount + 1

     

       137
       137
       +
                 }...`,

     

       138
       138
       +
               );

     

       139
       139
       +
               migrationLogs.push(

     

       140
       140
       +
                 `[${new Date().toISOString()}] Fetching blob list page ${

     

       141
       141
       +
                   pageCount + 1

     

       142
       142
       +
                 }...`,

     

       143
       143
       +
               );

     

       144
       144
       +
       

     

       145
       145
       +
               const listedBlobs = await oldAgent.com.atproto.sync.listBlobs({

     

       146
       146
       +
                 did: accountDid,

     

       147
       147
       +
                 cursor: blobCursor,

     

       148
       148
       +
               });

     

       149
       149
       +
       

     

       150
       150
       +
               const pageTime = Date.now() - pageStartTime;

     

       151
       151
       +
               console.log(

     

       152
       152
       +
                 `[${

     

       153
       153
       +
                   new Date().toISOString()

     

       154
       154
       +
                 }] Found ${listedBlobs.data.cids.length} blobs on page ${

     

       155
       155
       +
                   pageCount + 1

     

       156
       156
       +
                 } in ${pageTime / 1000} seconds`,

     

       157
       157
       +
               );

     

       158
       158
       +
               migrationLogs.push(

     

       159
       159
       +
                 `[${

     

       160
       160
       +
                   new Date().toISOString()

     

       161
       161
       +
                 }] Found ${listedBlobs.data.cids.length} blobs on page ${

     

       162
       162
       +
                   pageCount + 1

     

       163
       163
       +
                 } in ${pageTime / 1000} seconds`,

     

       164
       164
       +
               );

     

       165
       165
       +
       

     

       166
       166
       +
               blobCursor = listedBlobs.data.cursor;

     

       167
       167
       +
       

     

       168
       168
       +
               for (const cid of listedBlobs.data.cids) {

     

       169
       169
       +
                 try {

     

       170
       170
       +
                   const blobStartTime = Date.now();

     

       171
       171
       +
                   console.log(

     

       172
       172
       +
                     `[${

     

       173
       173
       +
                       new Date().toISOString()

     

       174
       174
       +
                     }] Starting migration for blob ${cid} (${

     

       175
       175
       +
                       processedBlobs + 1

     

       176
       176
       +
                     } of ${totalBlobs})...`,

     

       177
       177
       +
                   );

     

       178
       178
       +
                   migrationLogs.push(

     

       179
       179
       +
                     `[${

     

       180
       180
       +
                       new Date().toISOString()

     

       181
       181
       +
                     }] Starting migration for blob ${cid} (${

     

       182
       182
       +
                       processedBlobs + 1

     

       183
       183
       +
                     } of ${totalBlobs})...`,

     

       184
       184
       +
                   );

     

       185
       185
       +
       

     

       186
       186
       +
                   const blobRes = await oldAgent.com.atproto.sync.getBlob({

     

       187
       187
       +
                     did: accountDid,

     

       188
       188
       +
                     cid,

     

       189
       189
       +
                   });

     

       190
       190
       +
       

     

       191
       191
       +
                   const contentLength = blobRes.headers["content-length"];

     

       192
       192
       +
                   if (!contentLength) {

     

       193
       193
       +
                     throw new Error(`Blob ${cid} has no content length`);

     

       194
       194
       +
                   }

     

       195
       195
       +
       

     

       196
       196
       +
                   const size = parseInt(contentLength, 10);

     

       197
       197
       +
                   if (isNaN(size)) {

     

       198
       198
       +
                     throw new Error(

     

       199
       199
       +
                       `Blob ${cid} has invalid content length: ${contentLength}`,

     

       200
       200
       +
                     );

     

       201
       201
       +
                   }

     

       202
       202
       +
       

     

       203
       203
       +
                   const MAX_SIZE = 200 * 1024 * 1024; // 200MB

     

       204
       204
       +
                   if (size > MAX_SIZE) {

     

       205
       205
       +
                     throw new Error(

     

       206
       206
       +
                       `Blob ${cid} exceeds maximum size limit (${size} bytes)`,

     

       207
       207
       +
                     );

     

       208
       208
       +
                   }

     

       209
       209
       +
       

     

       210
       210
       +
                   console.log(

     

       211
       211
       +
                     `[${

     

       212
       212
       +
                       new Date().toISOString()

     

       213
       213
       +
                     }] Downloading blob ${cid} (${size} bytes)...`,

     

       214
       214
       +
                   );

     

       215
       215
       +
                   migrationLogs.push(

     

       216
       216
       +
                     `[${

     

       217
       217
       +
                       new Date().toISOString()

     

       218
       218
       +
                     }] Downloading blob ${cid} (${size} bytes)...`,

     

       219
       219
       +
                   );

     

       220
       220
       +
       

     

       221
       221
       +
                   if (!blobRes.data) {

     

       222
       222
       +
                     throw new Error(

     

       223
       223
       +
                       `Failed to download blob ${cid}: No data received`,

     

       224
       224
       +
                     );

     

       225
       225
       +
                   }

     

       226
       226
       +
       

     

       227
       227
       +
                   console.log(

     

       228
       228
       +
                     `[${

     

       229
       229
       +
                       new Date().toISOString()

     

       230
       230
       +
                     }] Uploading blob ${cid} to new account...`,

     

       231
       231
       +
                   );

     

       232
       232
       +
                   migrationLogs.push(

     

       233
       233
       +
                     `[${

     

       234
       234
       +
                       new Date().toISOString()

     

       235
       235
       +
                     }] Uploading blob ${cid} to new account...`,

     

       236
       236
       +
                   );

     

       237
       237
       +
       

     

       238
       238
       +
                   try {

     

       239
       239
       +
                     await newAgent.com.atproto.repo.uploadBlob(blobRes.data);

     

       240
       240
       +
                     const blobTime = Date.now() - blobStartTime;

     

       241
       241
       +
                     console.log(

     

       242
       242
       +
                       `[${

     

       243
       243
       +
                         new Date().toISOString()

     

       244
       244
       +
                       }] Successfully migrated blob ${cid} in ${

     

       245
       245
       +
                         blobTime / 1000

     

       246
       246
       +
                       } seconds`,

     

       247
       247
       +
                     );

     

       248
       248
       +
                     migrationLogs.push(

     

       249
       249
       +
                       `[${

     

       250
       250
       +
                         new Date().toISOString()

     

       251
       251
       +
                       }] Successfully migrated blob ${cid} in ${

     

       252
       252
       +
                         blobTime / 1000

     

       253
       253
       +
                       } seconds`,

     

       254
       254
       +
                     );

     

       255
       255
       +
                     migratedBlobs.push(cid);

     

       256
       256
       +
                   } catch (uploadError) {

     

       257
       257
       +
                     console.error(

     

       258
       258
       +
                       `[${new Date().toISOString()}] Failed to upload blob ${cid}:`,

     

       259
       259
       +
                       uploadError,

     

       260
       260
       +
                     );

     

       261
       261
       +
                     throw new Error(

     

       262
       262
       +
                       `Upload failed: ${

     

       263
       263
       +
                         uploadError instanceof Error

     

       264
       264
       +
                           ? uploadError.message

     

       265
       265
       +
                           : String(uploadError)

     

       266
       266
       +
                       }`,

     

       267
       267
       +
                     );

     

       268
       268
       +
                   }

     

       269
       269
       +
                 } catch (error) {

     

       270
       270
       +
                   const errorMessage = error instanceof Error

     

       271
       271
       +
                     ? error.message

     

       272
       272
       +
                     : String(error);

     

       273
       273
       +
                   const detailedError = `[${

     

       274
       274
       +
                     new Date().toISOString()

     

       275
       275
       +
                   }] Failed to migrate blob ${cid}: ${errorMessage}`;

     

       276
       276
       +
                   console.error(detailedError);

     

       277
       277
       +
                   console.error("Full error details:", error);

     

       278
       278
       +
                   migrationLogs.push(detailedError);

     

       279
       279
       +
                   failedBlobs.push(cid);

     

       280
       280
       +
                 }

     

       281
       281
       +
       

     

       282
       282
       +
                 processedBlobs++;

     

       283
       283
       +
                 const progressLog = `[${

     

       284
       284
       +
                   new Date().toISOString()

     

       285
       285
       +
                 }] Progress: ${processedBlobs}/${totalBlobs} blobs processed (${

     

       286
       286
       +
                   Math.round((processedBlobs / totalBlobs) * 100)

     

       287
       287
       +
                 }%)`;

     

       288
       288
       +
                 console.log(progressLog);

     

       289
       289
       +
                 migrationLogs.push(progressLog);

     

       290
       290
       +
               }

     

       291
       291
       +
               pageCount++;

     

       292
       292
       +
             } while (blobCursor);

     

       293
       293
       +
       

     

       294
       294
       +
             const totalTime = Date.now() - startTime;

     

       295
       295
       +
             const completionMessage = `[${

     

       296
       296
       +
               new Date().toISOString()

     

       297
       297
       +
             }] Blob migration completed in ${

     

       298
       298
       +
               totalTime / 1000

     

       299
       299
       +
             } seconds: ${migratedBlobs.length} blobs migrated${

     

       300
       300
       +
               failedBlobs.length > 0 ? `, ${failedBlobs.length} failed` : ""

     

       301
       301
       +
             } (${pageCount} pages processed)`;

     

       302
       302
       +
             console.log(completionMessage);

     

       303
       303
       +
             migrationLogs.push(completionMessage);

     

       304
       304
       +
       

     

       305
       305
       +
             return new Response(

     

       306
       306
       +
               JSON.stringify({

     

       307
       307
       +
                 success: true,

     

       308
       308
       +
                 message: failedBlobs.length > 0

     

       309
       309
       +
                   ? `Blob migration completed with ${failedBlobs.length} failed blobs`

     

       310
       310
       +
                   : "Blob migration completed successfully",

     

       311
       311
       +
                 migratedBlobs,

     

       312
       312
       +
                 failedBlobs,

     

       313
       313
       +
                 totalMigrated: migratedBlobs.length,

     

       314
       314
       +
                 totalFailed: failedBlobs.length,

     

       315
       315
       +
                 totalProcessed: processedBlobs,

     

       316
       316
       +
                 totalBlobs,

     

       317
       317
       +
                 logs: migrationLogs,

     

       318
       318
       +
                 timing: {

     

       319
       319
       +
                   totalTime: totalTime / 1000,

     

       320
       320
       +
                 },

     

       321
       321
       +
               }),

     

       322
       322
       +
               {

     

       323
       323
       +
                 status: 200,

     

       324
       324
       +
                 headers: {

     

       325
       325
       +
                   "Content-Type": "application/json",

     

       326
       326
       +
                   ...Object.fromEntries(res.headers),

     

       327
       327
       +
                 },

     

       328
       328
       +
               },

     

       329
       329
       +
             );

     

       330
       330
       +
           } catch (error) {

     

       331
       331
       +
             const message = error instanceof Error ? error.message : String(error);

     

       332
       332
       +
             console.error(

     

       333
       333
       +
               `[${new Date().toISOString()}] Blob migration error:`,

     

       334
       334
       +
               message,

     

       335
       335
       +
             );

     

       336
       336
       +
             console.error("Full error details:", error);

     

       337
       337
       +
             return new Response(

     

       338
       338
       +
               JSON.stringify({

     

       339
       339
       +
                 success: false,

     

       340
       340
       +
                 message: `Blob migration failed: ${message}`,

     

       341
       341
       +
                 error: error instanceof Error

     

       342
       342
       +
                   ? {

     

       343
       343
       +
                     name: error.name,

     

       344
       344
       +
                     message: error.message,

     

       345
       345
       +
                     stack: error.stack,

     

       346
       346
       +
                   }

     

       347
       347
       +
                   : String(error),

     

       348
       348
       +
               }),

     

       349
       349
       +
               {

     

       350
       350
       +
                 status: 500,

     

       351
       351
       +
                 headers: {

     

       352
       352
       +
                   "Content-Type": "application/json",

     

       353
       353
       +
                   ...Object.fromEntries(res.headers),

     

       354
       354
       +
                 },

     

       355
       355
       +
               },

     

       356
       356
       +
             );

     

       357
       357
       +
           }

     

       358
       358
       +
         },

     

       359
       359
       +
       });

+163

routes/api/migrate/data/prefs.ts

···

       1
       1
       +
       import { getSessionAgent } from "../../../../lib/sessions.ts";

     

       2
       2
       +
       import { checkDidsMatch } from "../../../../lib/check-dids.ts";

     

       3
       3
       +
       import { define } from "../../../../utils.ts";

     

       4
       4
       +
       import { assertMigrationAllowed } from "../../../../lib/migration-state.ts";

     

       5
       5
       +
       

     

       6
       6
       +
       export const handler = define.handlers({

     

       7
       7
       +
         async POST(ctx) {

     

       8
       8
       +
           const res = new Response();

     

       9
       9
       +
           try {

     

       10
       10
       +
             // Check if migrations are currently allowed

     

       11
       11
       +
             assertMigrationAllowed();

     

       12
       12
       +
       

     

       13
       13
       +
             console.log("Preferences migration: Starting session retrieval");

     

       14
       14
       +
             const oldAgent = await getSessionAgent(ctx.req);

     

       15
       15
       +
             console.log("Preferences migration: Got old agent:", !!oldAgent);

     

       16
       16
       +
       

     

       17
       17
       +
             const newAgent = await getSessionAgent(ctx.req, res, true);

     

       18
       18
       +
             console.log("Preferences migration: Got new agent:", !!newAgent);

     

       19
       19
       +
       

     

       20
       20
       +
             if (!oldAgent || !newAgent) {

     

       21
       21
       +
               return new Response(

     

       22
       22
       +
                 JSON.stringify({

     

       23
       23
       +
                   success: false,

     

       24
       24
       +
                   message: "Not authenticated",

     

       25
       25
       +
                 }),

     

       26
       26
       +
                 {

     

       27
       27
       +
                   status: 401,

     

       28
       28
       +
                   headers: { "Content-Type": "application/json" },

     

       29
       29
       +
                 },

     

       30
       30
       +
               );

     

       31
       31
       +
             }

     

       32
       32
       +
       

     

       33
       33
       +
             // Verify DIDs match between sessions

     

       34
       34
       +
             const didsMatch = await checkDidsMatch(ctx.req);

     

       35
       35
       +
             if (!didsMatch) {

     

       36
       36
       +
               return new Response(

     

       37
       37
       +
                 JSON.stringify({

     

       38
       38
       +
                   success: false,

     

       39
       39
       +
                   message: "Invalid state, original and target DIDs do not match",

     

       40
       40
       +
                 }),

     

       41
       41
       +
                 {

     

       42
       42
       +
                   status: 400,

     

       43
       43
       +
                   headers: { "Content-Type": "application/json" },

     

       44
       44
       +
                 },

     

       45
       45
       +
               );

     

       46
       46
       +
             }

     

       47
       47
       +
       

     

       48
       48
       +
             // Migrate preferences

     

       49
       49
       +
             const migrationLogs: string[] = [];

     

       50
       50
       +
             const startTime = Date.now();

     

       51
       51
       +
             console.log(

     

       52
       52
       +
               `[${new Date().toISOString()}] Starting preferences migration...`,

     

       53
       53
       +
             );

     

       54
       54
       +
             migrationLogs.push(

     

       55
       55
       +
               `[${new Date().toISOString()}] Starting preferences migration...`,

     

       56
       56
       +
             );

     

       57
       57
       +
       

     

       58
       58
       +
             // Fetch preferences

     

       59
       59
       +
             console.log(

     

       60
       60
       +
               `[${

     

       61
       61
       +
                 new Date().toISOString()

     

       62
       62
       +
               }] Fetching preferences from old account...`,

     

       63
       63
       +
             );

     

       64
       64
       +
             migrationLogs.push(

     

       65
       65
       +
               `[${

     

       66
       66
       +
                 new Date().toISOString()

     

       67
       67
       +
               }] Fetching preferences from old account...`,

     

       68
       68
       +
             );

     

       69
       69
       +
       

     

       70
       70
       +
             const fetchStartTime = Date.now();

     

       71
       71
       +
             const prefs = await oldAgent.app.bsky.actor.getPreferences();

     

       72
       72
       +
             const fetchTime = Date.now() - fetchStartTime;

     

       73
       73
       +
       

     

       74
       74
       +
             console.log(

     

       75
       75
       +
               `[${new Date().toISOString()}] Preferences fetched in ${

     

       76
       76
       +
                 fetchTime / 1000

     

       77
       77
       +
               } seconds`,

     

       78
       78
       +
             );

     

       79
       79
       +
             migrationLogs.push(

     

       80
       80
       +
               `[${new Date().toISOString()}] Preferences fetched in ${

     

       81
       81
       +
                 fetchTime / 1000

     

       82
       82
       +
               } seconds`,

     

       83
       83
       +
             );

     

       84
       84
       +
       

     

       85
       85
       +
             // Update preferences

     

       86
       86
       +
             console.log(

     

       87
       87
       +
               `[${new Date().toISOString()}] Updating preferences on new account...`,

     

       88
       88
       +
             );

     

       89
       89
       +
             migrationLogs.push(

     

       90
       90
       +
               `[${new Date().toISOString()}] Updating preferences on new account...`,

     

       91
       91
       +
             );

     

       92
       92
       +
       

     

       93
       93
       +
             const updateStartTime = Date.now();

     

       94
       94
       +
             await newAgent.app.bsky.actor.putPreferences(prefs.data);

     

       95
       95
       +
             const updateTime = Date.now() - updateStartTime;

     

       96
       96
       +
       

     

       97
       97
       +
             console.log(

     

       98
       98
       +
               `[${new Date().toISOString()}] Preferences updated in ${

     

       99
       99
       +
                 updateTime / 1000

     

       100
       100
       +
               } seconds`,

     

       101
       101
       +
             );

     

       102
       102
       +
             migrationLogs.push(

     

       103
       103
       +
               `[${new Date().toISOString()}] Preferences updated in ${

     

       104
       104
       +
                 updateTime / 1000

     

       105
       105
       +
               } seconds`,

     

       106
       106
       +
             );

     

       107
       107
       +
       

     

       108
       108
       +
             const totalTime = Date.now() - startTime;

     

       109
       109
       +
             const completionMessage = `[${

     

       110
       110
       +
               new Date().toISOString()

     

       111
       111
       +
             }] Preferences migration completed in ${totalTime / 1000} seconds total`;

     

       112
       112
       +
             console.log(completionMessage);

     

       113
       113
       +
             migrationLogs.push(completionMessage);

     

       114
       114
       +
       

     

       115
       115
       +
             return new Response(

     

       116
       116
       +
               JSON.stringify({

     

       117
       117
       +
                 success: true,

     

       118
       118
       +
                 message: "Preferences migration completed successfully",

     

       119
       119
       +
                 logs: migrationLogs,

     

       120
       120
       +
                 timing: {

     

       121
       121
       +
                   fetchTime: fetchTime / 1000,

     

       122
       122
       +
                   updateTime: updateTime / 1000,

     

       123
       123
       +
                   totalTime: totalTime / 1000,

     

       124
       124
       +
                 },

     

       125
       125
       +
               }),

     

       126
       126
       +
               {

     

       127
       127
       +
                 status: 200,

     

       128
       128
       +
                 headers: {

     

       129
       129
       +
                   "Content-Type": "application/json",

     

       130
       130
       +
                   ...Object.fromEntries(res.headers),

     

       131
       131
       +
                 },

     

       132
       132
       +
               },

     

       133
       133
       +
             );

     

       134
       134
       +
           } catch (error) {

     

       135
       135
       +
             const message = error instanceof Error ? error.message : String(error);

     

       136
       136
       +
             console.error(

     

       137
       137
       +
               `[${new Date().toISOString()}] Preferences migration error:`,

     

       138
       138
       +
               message,

     

       139
       139
       +
             );

     

       140
       140
       +
             console.error("Full error details:", error);

     

       141
       141
       +
             return new Response(

     

       142
       142
       +
               JSON.stringify({

     

       143
       143
       +
                 success: false,

     

       144
       144
       +
                 message: `Preferences migration failed: ${message}`,

     

       145
       145
       +
                 error: error instanceof Error

     

       146
       146
       +
                   ? {

     

       147
       147
       +
                     name: error.name,

     

       148
       148
       +
                     message: error.message,

     

       149
       149
       +
                     stack: error.stack,

     

       150
       150
       +
                   }

     

       151
       151
       +
                   : String(error),

     

       152
       152
       +
               }),

     

       153
       153
       +
               {

     

       154
       154
       +
                 status: 500,

     

       155
       155
       +
                 headers: {

     

       156
       156
       +
                   "Content-Type": "application/json",

     

       157
       157
       +
                   ...Object.fromEntries(res.headers),

     

       158
       158
       +
                 },

     

       159
       159
       +
               },

     

       160
       160
       +
             );

     

       161
       161
       +
           }

     

       162
       162
       +
         },

     

       163
       163
       +
       });

+163

routes/api/migrate/data/repo.ts

···

       1
       1
       +
       import { getSessionAgent } from "../../../../lib/sessions.ts";

     

       2
       2
       +
       import { checkDidsMatch } from "../../../../lib/check-dids.ts";

     

       3
       3
       +
       import { define } from "../../../../utils.ts";

     

       4
       4
       +
       import { assertMigrationAllowed } from "../../../../lib/migration-state.ts";

     

       5
       5
       +
       

     

       6
       6
       +
       export const handler = define.handlers({

     

       7
       7
       +
         async POST(ctx) {

     

       8
       8
       +
           const res = new Response();

     

       9
       9
       +
           try {

     

       10
       10
       +
             // Check if migrations are currently allowed

     

       11
       11
       +
             assertMigrationAllowed();

     

       12
       12
       +
       

     

       13
       13
       +
             console.log("Repo migration: Starting session retrieval");

     

       14
       14
       +
             const oldAgent = await getSessionAgent(ctx.req);

     

       15
       15
       +
             console.log("Repo migration: Got old agent:", !!oldAgent);

     

       16
       16
       +
       

     

       17
       17
       +
             const newAgent = await getSessionAgent(ctx.req, res, true);

     

       18
       18
       +
             console.log("Repo migration: Got new agent:", !!newAgent);

     

       19
       19
       +
       

     

       20
       20
       +
             if (!oldAgent || !newAgent) {

     

       21
       21
       +
               return new Response(

     

       22
       22
       +
                 JSON.stringify({

     

       23
       23
       +
                   success: false,

     

       24
       24
       +
                   message: "Not authenticated",

     

       25
       25
       +
                 }),

     

       26
       26
       +
                 {

     

       27
       27
       +
                   status: 401,

     

       28
       28
       +
                   headers: { "Content-Type": "application/json" },

     

       29
       29
       +
                 },

     

       30
       30
       +
               );

     

       31
       31
       +
             }

     

       32
       32
       +
       

     

       33
       33
       +
             // Verify DIDs match between sessions

     

       34
       34
       +
             const didsMatch = await checkDidsMatch(ctx.req);

     

       35
       35
       +
             if (!didsMatch) {

     

       36
       36
       +
               return new Response(

     

       37
       37
       +
                 JSON.stringify({

     

       38
       38
       +
                   success: false,

     

       39
       39
       +
                   message: "Invalid state, original and target DIDs do not match",

     

       40
       40
       +
                 }),

     

       41
       41
       +
                 {

     

       42
       42
       +
                   status: 400,

     

       43
       43
       +
                   headers: { "Content-Type": "application/json" },

     

       44
       44
       +
                 },

     

       45
       45
       +
               );

     

       46
       46
       +
             }

     

       47
       47
       +
       

     

       48
       48
       +
             const session = await oldAgent.com.atproto.server.getSession();

     

       49
       49
       +
             const accountDid = session.data.did;

     

       50
       50
       +
             // Migrate repo data

     

       51
       51
       +
             const migrationLogs: string[] = [];

     

       52
       52
       +
             const startTime = Date.now();

     

       53
       53
       +
             console.log(`[${new Date().toISOString()}] Starting repo migration...`);

     

       54
       54
       +
             migrationLogs.push(

     

       55
       55
       +
               `[${new Date().toISOString()}] Starting repo migration...`,

     

       56
       56
       +
             );

     

       57
       57
       +
       

     

       58
       58
       +
             // Get repo data from old account

     

       59
       59
       +
             console.log(

     

       60
       60
       +
               `[${new Date().toISOString()}] Fetching repo data from old account...`,

     

       61
       61
       +
             );

     

       62
       62
       +
             migrationLogs.push(

     

       63
       63
       +
               `[${new Date().toISOString()}] Fetching repo data from old account...`,

     

       64
       64
       +
             );

     

       65
       65
       +
       

     

       66
       66
       +
             const fetchStartTime = Date.now();

     

       67
       67
       +
             const repoData = await oldAgent.com.atproto.sync.getRepo({

     

       68
       68
       +
               did: accountDid,

     

       69
       69
       +
             });

     

       70
       70
       +
             const fetchTime = Date.now() - fetchStartTime;

     

       71
       71
       +
       

     

       72
       72
       +
             console.log(

     

       73
       73
       +
               `[${new Date().toISOString()}] Repo data fetched in ${

     

       74
       74
       +
                 fetchTime / 1000

     

       75
       75
       +
               } seconds`,

     

       76
       76
       +
             );

     

       77
       77
       +
             migrationLogs.push(

     

       78
       78
       +
               `[${new Date().toISOString()}] Repo data fetched in ${

     

       79
       79
       +
                 fetchTime / 1000

     

       80
       80
       +
               } seconds`,

     

       81
       81
       +
             );

     

       82
       82
       +
       

     

       83
       83
       +
             console.log(

     

       84
       84
       +
               `[${new Date().toISOString()}] Importing repo data to new account...`,

     

       85
       85
       +
             );

     

       86
       86
       +
             migrationLogs.push(

     

       87
       87
       +
               `[${new Date().toISOString()}] Importing repo data to new account...`,

     

       88
       88
       +
             );

     

       89
       89
       +
       

     

       90
       90
       +
             // Import repo data to new account

     

       91
       91
       +
             const importStartTime = Date.now();

     

       92
       92
       +
             await newAgent.com.atproto.repo.importRepo(repoData.data, {

     

       93
       93
       +
               encoding: "application/vnd.ipld.car",

     

       94
       94
       +
             });

     

       95
       95
       +
             const importTime = Date.now() - importStartTime;

     

       96
       96
       +
       

     

       97
       97
       +
             console.log(

     

       98
       98
       +
               `[${new Date().toISOString()}] Repo data imported in ${

     

       99
       99
       +
                 importTime / 1000

     

       100
       100
       +
               } seconds`,

     

       101
       101
       +
             );

     

       102
       102
       +
             migrationLogs.push(

     

       103
       103
       +
               `[${new Date().toISOString()}] Repo data imported in ${

     

       104
       104
       +
                 importTime / 1000

     

       105
       105
       +
               } seconds`,

     

       106
       106
       +
             );

     

       107
       107
       +
       

     

       108
       108
       +
             const totalTime = Date.now() - startTime;

     

       109
       109
       +
             const completionMessage = `[${

     

       110
       110
       +
               new Date().toISOString()

     

       111
       111
       +
             }] Repo migration completed in ${totalTime / 1000} seconds total`;

     

       112
       112
       +
             console.log(completionMessage);

     

       113
       113
       +
             migrationLogs.push(completionMessage);

     

       114
       114
       +
       

     

       115
       115
       +
             return new Response(

     

       116
       116
       +
               JSON.stringify({

     

       117
       117
       +
                 success: true,

     

       118
       118
       +
                 message: "Repo migration completed successfully",

     

       119
       119
       +
                 logs: migrationLogs,

     

       120
       120
       +
                 timing: {

     

       121
       121
       +
                   fetchTime: fetchTime / 1000,

     

       122
       122
       +
                   importTime: importTime / 1000,

     

       123
       123
       +
                   totalTime: totalTime / 1000,

     

       124
       124
       +
                 },

     

       125
       125
       +
               }),

     

       126
       126
       +
               {

     

       127
       127
       +
                 status: 200,

     

       128
       128
       +
                 headers: {

     

       129
       129
       +
                   "Content-Type": "application/json",

     

       130
       130
       +
                   ...Object.fromEntries(res.headers),

     

       131
       131
       +
                 },

     

       132
       132
       +
               },

     

       133
       133
       +
             );

     

       134
       134
       +
           } catch (error) {

     

       135
       135
       +
             const message = error instanceof Error ? error.message : String(error);

     

       136
       136
       +
             console.error(

     

       137
       137
       +
               `[${new Date().toISOString()}] Repo migration error:`,

     

       138
       138
       +
               message,

     

       139
       139
       +
             );

     

       140
       140
       +
             console.error("Full error details:", error);

     

       141
       141
       +
             return new Response(

     

       142
       142
       +
               JSON.stringify({

     

       143
       143
       +
                 success: false,

     

       144
       144
       +
                 message: `Repo migration failed: ${message}`,

     

       145
       145
       +
                 error: error instanceof Error

     

       146
       146
       +
                   ? {

     

       147
       147
       +
                     name: error.name,

     

       148
       148
       +
                     message: error.message,

     

       149
       149
       +
                     stack: error.stack,

     

       150
       150
       +
                   }

     

       151
       151
       +
                   : String(error),

     

       152
       152
       +
               }),

     

       153
       153
       +
               {

     

       154
       154
       +
                 status: 500,

     

       155
       155
       +
                 headers: {

     

       156
       156
       +
                   "Content-Type": "application/json",

     

       157
       157
       +
                   ...Object.fromEntries(res.headers),

     

       158
       158
       +
                 },

     

       159
       159
       +
               },

     

       160
       160
       +
             );

     

       161
       161
       +
           }

     

       162
       162
       +
         },

     

       163
       163
       +
       });

-273

routes/api/migrate/data.ts

···

       1
       1
       -
       import { define } from "../../../utils.ts";

     

       2
       2
       -
       import {

     

       3
       3
       -
         getSessionAgent,

     

       4
       4
       -
       } from "../../../lib/sessions.ts";

     

       5
       5
       -
       import { Agent, ComAtprotoSyncGetBlob } from "npm:@atproto/api";

     

       6
       6
       -
       

     

       7
       7
       -
       // Retry configuration

     

       8
       8
       -
       const MAX_RETRIES = 3;

     

       9
       9
       -
       const INITIAL_RETRY_DELAY = 1000; // 1 second

     

       10
       10
       -
       

     

       11
       11
       -
       interface RetryOptions {

     

       12
       12
       -
         maxRetries?: number;

     

       13
       13
       -
         initialDelay?: number;

     

       14
       14
       -
         onRetry?: (attempt: number, error: Error) => void;

     

       15
       15
       -
       }

     

       16
       16
       -
       

     

       17
       17
       -
       async function withRetry<T>(

     

       18
       18
       -
         operation: () => Promise<T>,

     

       19
       19
       -
         options: RetryOptions = {},

     

       20
       20
       -
       ): Promise<T> {

     

       21
       21
       -
         const maxRetries = options.maxRetries ?? MAX_RETRIES;

     

       22
       22
       -
         const initialDelay = options.initialDelay ?? INITIAL_RETRY_DELAY;

     

       23
       23
       -
       

     

       24
       24
       -
         let lastError: Error | null = null;

     

       25
       25
       -
         for (let attempt = 0; attempt < maxRetries; attempt++) {

     

       26
       26
       -
           try {

     

       27
       27
       -
             return await operation();

     

       28
       28
       -
           } catch (error) {

     

       29
       29
       -
             lastError = error instanceof Error ? error : new Error(String(error));

     

       30
       30
       -
             

     

       31
       31
       -
             // Don't retry on certain errors

     

       32
       32
       -
             if (error instanceof Error) {

     

       33
       33
       -
               // Don't retry on permanent errors like authentication

     

       34
       34
       -
               if (error.message.includes("Unauthorized") || error.message.includes("Invalid token")) {

     

       35
       35
       -
                 throw error;

     

       36
       36
       -
               }

     

       37
       37
       -
             }

     

       38
       38
       -
       

     

       39
       39
       -
             if (attempt < maxRetries - 1) {

     

       40
       40
       -
               const delay = initialDelay * Math.pow(2, attempt);

     

       41
       41
       -
               console.log(`Retry attempt ${attempt + 1}/${maxRetries} after ${delay}ms:`, lastError.message);

     

       42
       42
       -
               if (options.onRetry) {

     

       43
       43
       -
                 options.onRetry(attempt + 1, lastError);

     

       44
       44
       -
               }

     

       45
       45
       -
               await new Promise(resolve => setTimeout(resolve, delay));

     

       46
       46
       -
             }

     

       47
       47
       -
           }

     

       48
       48
       -
         }

     

       49
       49
       -
         throw lastError ?? new Error("Operation failed after retries");

     

       50
       50
       -
       }

     

       51
       51
       -
       

     

       52
       52
       -
       async function handleBlobUpload(

     

       53
       53
       -
         newAgent: Agent,

     

       54
       54
       -
         blobRes: ComAtprotoSyncGetBlob.Response,

     

       55
       55
       -
         cid: string

     

       56
       56
       -
       ) {

     

       57
       57
       -
         try {

     

       58
       58
       -
           const contentLength = parseInt(blobRes.headers["content-length"] || "0", 10);

     

       59
       59
       -
           const contentType = blobRes.headers["content-type"];

     

       60
       60
       -
           

     

       61
       61
       -
           // Check file size before attempting upload

     

       62
       62
       -
           const MAX_SIZE = 95 * 1024 * 1024; // 95MB to be safe

     

       63
       63
       -
           if (contentLength > MAX_SIZE) {

     

       64
       64
       -
             throw new Error(`Blob ${cid} exceeds maximum size limit (${contentLength} bytes)`);

     

       65
       65
       -
           }

     

       66
       66
       -
       

     

       67
       67
       -
           await withRetry(

     

       68
       68
       -
             () => newAgent.com.atproto.repo.uploadBlob(blobRes.data, {

     

       69
       69
       -
               encoding: contentType,

     

       70
       70
       -
             }),

     

       71
       71
       -
             {

     

       72
       72
       -
               maxRetries: 5,

     

       73
       73
       -
               onRetry: (attempt, error) => {

     

       74
       74
       -
                 console.log(`Retrying blob upload for ${cid} (attempt ${attempt}):`, error.message);

     

       75
       75
       -
               },

     

       76
       76
       -
             }

     

       77
       77
       -
           );

     

       78
       78
       -
         } catch (error) {

     

       79
       79
       -
           console.error(`Failed to upload blob ${cid}:`, error);

     

       80
       80
       -
           throw error;

     

       81
       81
       -
         }

     

       82
       82
       -
       }

     

       83
       83
       -
       

     

       84
       84
       -
       export const handler = define.handlers({

     

       85
       85
       -
         async POST(ctx) {

     

       86
       86
       -
           const res = new Response();

     

       87
       87
       -
           try {

     

       88
       88
       -
             console.log("Data migration: Starting session retrieval");

     

       89
       89
       -
             const oldAgent = await getSessionAgent(ctx.req);

     

       90
       90
       -
             console.log("Data migration: Got old agent:", !!oldAgent);

     

       91
       91
       -
       

     

       92
       92
       -
             // Log cookie information

     

       93
       93
       -
             const cookies = ctx.req.headers.get("cookie");

     

       94
       94
       -
             console.log("Data migration: Cookies present:", !!cookies);

     

       95
       95
       -
             console.log("Data migration: Cookie header:", cookies);

     

       96
       96
       -
       

     

       97
       97
       -
             const newAgent = await getSessionAgent(ctx.req, res, true);

     

       98
       98
       -
             console.log("Data migration: Got new agent:", !!newAgent);

     

       99
       99
       -
       

     

       100
       100
       -
             if (!oldAgent) {

     

       101
       101
       -
               return new Response(

     

       102
       102
       -
                 JSON.stringify({

     

       103
       103
       -
                   success: false,

     

       104
       104
       -
                   message: "Unauthorized",

     

       105
       105
       -
                 }),

     

       106
       106
       -
                 {

     

       107
       107
       -
                   status: 401,

     

       108
       108
       -
                   headers: { "Content-Type": "application/json" },

     

       109
       109
       -
                 },

     

       110
       110
       -
               );

     

       111
       111
       -
             }

     

       112
       112
       -
             if (!newAgent) {

     

       113
       113
       -
               return new Response(

     

       114
       114
       -
                 JSON.stringify({

     

       115
       115
       -
                   success: false,

     

       116
       116
       -
                   message: "Migration session not found or invalid",

     

       117
       117
       -
                 }),

     

       118
       118
       -
                 {

     

       119
       119
       -
                   status: 400,

     

       120
       120
       -
                   headers: { "Content-Type": "application/json" },

     

       121
       121
       -
                 },

     

       122
       122
       -
               );

     

       123
       123
       -
             }

     

       124
       124
       -
       

     

       125
       125
       -
             const session = await oldAgent.com.atproto.server.getSession();

     

       126
       126
       -
             const accountDid = session.data.did;

     

       127
       127
       -
       

     

       128
       128
       -
             // Migrate repo data with retries

     

       129
       129
       -
             const repoRes = await withRetry(

     

       130
       130
       -
               () => oldAgent.com.atproto.sync.getRepo({

     

       131
       131
       -
                 did: accountDid,

     

       132
       132
       -
               }),

     

       133
       133
       -
               {

     

       134
       134
       -
                 maxRetries: 5,

     

       135
       135
       -
                 onRetry: (attempt, error) => {

     

       136
       136
       -
                   console.log(`Retrying repo fetch (attempt ${attempt}):`, error.message);

     

       137
       137
       -
                 },

     

       138
       138
       -
               }

     

       139
       139
       -
             );

     

       140
       140
       -
       

     

       141
       141
       -
             await withRetry(

     

       142
       142
       -
               () => newAgent.com.atproto.repo.importRepo(repoRes.data, {

     

       143
       143
       -
                 encoding: "application/vnd.ipld.car",

     

       144
       144
       -
               }),

     

       145
       145
       -
               {

     

       146
       146
       -
                 maxRetries: 5,

     

       147
       147
       -
                 onRetry: (attempt, error) => {

     

       148
       148
       -
                   console.log(`Retrying repo import (attempt ${attempt}):`, error.message);

     

       149
       149
       -
                 },

     

       150
       150
       -
               }

     

       151
       151
       -
             );

     

       152
       152
       -
       

     

       153
       153
       -
             // Migrate blobs with enhanced error handling

     

       154
       154
       -
             let blobCursor: string | undefined = undefined;

     

       155
       155
       -
             const migratedBlobs: string[] = [];

     

       156
       156
       -
             const failedBlobs: Array<{ cid: string; error: string }> = [];

     

       157
       157
       -
       

     

       158
       158
       -
             do {

     

       159
       159
       -
               try {

     

       160
       160
       -
                 const listedBlobs = await withRetry(

     

       161
       161
       -
                   () => oldAgent.com.atproto.sync.listBlobs({

     

       162
       162
       -
                     did: accountDid,

     

       163
       163
       -
                     cursor: blobCursor,

     

       164
       164
       -
                   }),

     

       165
       165
       -
                   {

     

       166
       166
       -
                     maxRetries: 5,

     

       167
       167
       -
                     onRetry: (attempt, error) => {

     

       168
       168
       -
                       console.log(`Retrying blob list fetch (attempt ${attempt}):`, error.message);

     

       169
       169
       -
                     },

     

       170
       170
       -
                   }

     

       171
       171
       -
                 );

     

       172
       172
       -
       

     

       173
       173
       -
                 for (const cid of listedBlobs.data.cids) {

     

       174
       174
       -
                   try {

     

       175
       175
       -
                     const blobRes = await withRetry(

     

       176
       176
       -
                       () => oldAgent.com.atproto.sync.getBlob({

     

       177
       177
       -
                         did: accountDid,

     

       178
       178
       -
                         cid,

     

       179
       179
       -
                       }),

     

       180
       180
       -
                       {

     

       181
       181
       -
                         maxRetries: 5,

     

       182
       182
       -
                         onRetry: (attempt, error) => {

     

       183
       183
       -
                           console.log(`Retrying blob download for ${cid} (attempt ${attempt}):`, error.message);

     

       184
       184
       -
                         },

     

       185
       185
       -
                       }

     

       186
       186
       -
                     );

     

       187
       187
       -
       

     

       188
       188
       -
                     await handleBlobUpload(newAgent, blobRes, cid);

     

       189
       189
       -
                     migratedBlobs.push(cid);

     

       190
       190
       -
                     console.log(`Successfully migrated blob: ${cid}`);

     

       191
       191
       -
                   } catch (error) {

     

       192
       192
       -
                     console.error(`Failed to migrate blob ${cid}:`, error);

     

       193
       193
       -
                     failedBlobs.push({

     

       194
       194
       -
                       cid,

     

       195
       195
       -
                       error: error instanceof Error ? error.message : String(error),

     

       196
       196
       -
                     });

     

       197
       197
       -
                   }

     

       198
       198
       -
                 }

     

       199
       199
       -
                 blobCursor = listedBlobs.data.cursor;

     

       200
       200
       -
               } catch (error) {

     

       201
       201
       -
                 console.error("Error during blob migration batch:", error);

     

       202
       202
       -
                 // If we hit a critical error during blob listing, break the loop

     

       203
       203
       -
                 if (error instanceof Error && 

     

       204
       204
       -
                    (error.message.includes("Unauthorized") || 

     

       205
       205
       -
                     error.message.includes("Invalid token"))) {

     

       206
       206
       -
                   throw error;

     

       207
       207
       -
                 }

     

       208
       208
       -
                 break;

     

       209
       209
       -
               }

     

       210
       210
       -
             } while (blobCursor);

     

       211
       211
       -
       

     

       212
       212
       -
             // Migrate preferences with retry

     

       213
       213
       -
             const prefs = await withRetry(

     

       214
       214
       -
               () => oldAgent.app.bsky.actor.getPreferences(),

     

       215
       215
       -
               {

     

       216
       216
       -
                 maxRetries: 3,

     

       217
       217
       -
                 onRetry: (attempt, error) => {

     

       218
       218
       -
                   console.log(`Retrying preferences fetch (attempt ${attempt}):`, error.message);

     

       219
       219
       -
                 },

     

       220
       220
       -
               }

     

       221
       221
       -
             );

     

       222
       222
       -
       

     

       223
       223
       -
             await withRetry(

     

       224
       224
       -
               () => newAgent.app.bsky.actor.putPreferences(prefs.data),

     

       225
       225
       -
               {

     

       226
       226
       -
                 maxRetries: 3,

     

       227
       227
       -
                 onRetry: (attempt, error) => {

     

       228
       228
       -
                   console.log(`Retrying preferences update (attempt ${attempt}):`, error.message);

     

       229
       229
       -
                 },

     

       230
       230
       -
               }

     

       231
       231
       -
             );

     

       232
       232
       -
       

     

       233
       233
       -
             return new Response(

     

       234
       234
       -
               JSON.stringify({

     

       235
       235
       -
                 success: true,

     

       236
       236
       -
                 message: failedBlobs.length > 0 

     

       237
       237
       -
                   ? `Data migration completed with ${failedBlobs.length} failed blobs`

     

       238
       238
       -
                   : "Data migration completed successfully",

     

       239
       239
       -
                 migratedBlobs,

     

       240
       240
       -
                 failedBlobs,

     

       241
       241
       -
                 totalMigrated: migratedBlobs.length,

     

       242
       242
       -
                 totalFailed: failedBlobs.length,

     

       243
       243
       -
               }),

     

       244
       244
       -
               {

     

       245
       245
       -
                 status: failedBlobs.length > 0 ? 207 : 200, // Use 207 Multi-Status if some blobs failed

     

       246
       246
       -
                 headers: {

     

       247
       247
       -
                   "Content-Type": "application/json",

     

       248
       248
       -
                   ...Object.fromEntries(res.headers), // Include session cookie headers

     

       249
       249
       -
                 },

     

       250
       250
       -
               },

     

       251
       251
       -
             );

     

       252
       252
       -
           } catch (error) {

     

       253
       253
       -
             console.error("Data migration error:", error);

     

       254
       254
       -
             return new Response(

     

       255
       255
       -
               JSON.stringify({

     

       256
       256
       -
                 success: false,

     

       257
       257
       -
                 message: error instanceof Error

     

       258
       258
       -
                   ? error.message

     

       259
       259
       -
                   : "Failed to migrate data",

     

       260
       260
       -
                 error: error instanceof Error ? {

     

       261
       261
       -
                   name: error.name,

     

       262
       262
       -
                   message: error.message,

     

       263
       263
       -
                   stack: error.stack,

     

       264
       264
       -
                 } : String(error),

     

       265
       265
       -
               }),

     

       266
       266
       -
               {

     

       267
       267
       -
                 status: 400,

     

       268
       268
       -
                 headers: { "Content-Type": "application/json" },

     

       269
       269
       -
               },

     

       270
       270
       -
             );

     

       271
       271
       -
           }

     

       272
       272
       -
         },

     

       273
       273
       -
       });

+17

routes/api/migrate/finalize.ts

···

       1
       1
        
       import { getSessionAgent } from "../../../lib/sessions.ts";

     

       2
       2
       +
       import { checkDidsMatch } from "../../../lib/check-dids.ts";

     

       2
       3
        
       import { define } from "../../../utils.ts";

     

       4
       4
       +
       import { assertMigrationAllowed } from "../../../lib/migration-state.ts";

     

       3
       5
        
       

     

       4
       6
        
       export const handler = define.handlers({

     

       5
       7
        
         async POST(ctx) {

     

       6
       8
        
           const res = new Response();

     

       7
       9
        
           try {

     

       10
       10
       +
             // Check if migrations are currently allowed

     

       11
       11
       +
             assertMigrationAllowed();

     

       12
       12
       +
       

     

       8
       13
        
             const oldAgent = await getSessionAgent(ctx.req);

     

       9
       14
        
             const newAgent = await getSessionAgent(ctx.req, res, true);

     

       10
       15
        
       

     
···

       13
       18
        
               return new Response("Migration session not found or invalid", {

     

       14
       19
        
                 status: 400,

     

       15
       20
        
               });

     

       21
       21
       +
             }

     

       22
       22
       +
       

     

       23
       23
       +
             // Verify DIDs match between sessions

     

       24
       24
       +
             const didsMatch = await checkDidsMatch(ctx.req);

     

       25
       25
       +
             if (!didsMatch) {

     

       26
       26
       +
               return new Response(

     

       27
       27
       +
                 JSON.stringify({

     

       28
       28
       +
                   success: false,

     

       29
       29
       +
                   message: "Invalid state, original and target DIDs do not match",

     

       30
       30
       +
                 }),

     

       31
       31
       +
                 { status: 400, headers: { "Content-Type": "application/json" } },

     

       32
       32
       +
               );

     

       16
       33
        
             }

     

       17
       34
        
       

     

       18
       35
        
             // Activate new account and deactivate old account

+81 -4

routes/api/migrate/identity/request.ts

···

       1
       1
       -
       import {

     

       2
       2
       -
         getSessionAgent,

     

       3
       3
       -
       } from "../../../../lib/sessions.ts";

     

       1
       1
       +
       import { getSessionAgent } from "../../../../lib/sessions.ts";

     

       2
       2
       +
       import { checkDidsMatch } from "../../../../lib/check-dids.ts";

     

       4
       3
        
       import { define } from "../../../../utils.ts";

     

       4
       4
       +
       import { assertMigrationAllowed } from "../../../../lib/migration-state.ts";

     

       5
       5
       +
       

     

       6
       6
       +
       // Simple in-memory cache for rate limiting

     

       7
       7
       +
       // In a production environment, you might want to use Redis or another shared cache

     

       8
       8
       +
       const requestCache = new Map<string, number>();

     

       9
       9
       +
       const COOLDOWN_PERIOD_MS = 60000; // 1 minute cooldown

     

       5
       10
        
       

     

       11
       11
       +
       /**

     

       12
       12
       +
        * Handle identity migration request

     

       13
       13
       +
        * Sends a PLC operation signature request to the old account's email

     

       14
       14
       +
        * Should be called after all data is migrated to the new account

     

       15
       15
       +
        * @param ctx - The context object containing the request and response

     

       16
       16
       +
        * @returns A response object with the migration result

     

       17
       17
       +
        */

     

       6
       18
        
       export const handler = define.handlers({

     

       7
       19
        
         async POST(ctx) {

     

       8
       20
        
           const res = new Response();

     

       9
       21
        
           try {

     

       22
       22
       +
             // Check if migrations are currently allowed

     

       23
       23
       +
             assertMigrationAllowed();

     

       24
       24
       +
       

     

       10
       25
        
             console.log("Starting identity migration request...");

     

       11
       26
        
             const oldAgent = await getSessionAgent(ctx.req);

     

       12
       27
        
             console.log("Got old agent:", {

     
···

       45
       60
        
               );

     

       46
       61
        
             }

     

       47
       62
        
       

     

       63
       63
       +
             // Verify DIDs match between sessions

     

       64
       64
       +
             const didsMatch = await checkDidsMatch(ctx.req);

     

       65
       65
       +
             if (!didsMatch) {

     

       66
       66
       +
               return new Response(

     

       67
       67
       +
                 JSON.stringify({

     

       68
       68
       +
                   success: false,

     

       69
       69
       +
                   message: "Invalid state, original and target DIDs do not match",

     

       70
       70
       +
                 }),

     

       71
       71
       +
                 {

     

       72
       72
       +
                   status: 400,

     

       73
       73
       +
                   headers: { "Content-Type": "application/json" },

     

       74
       74
       +
                 },

     

       75
       75
       +
               );

     

       76
       76
       +
             }

     

       77
       77
       +
       

     

       78
       78
       +
             // Check if we've recently sent a request for this DID

     

       79
       79
       +
             const did = oldAgent.did || "";

     

       80
       80
       +
             const now = Date.now();

     

       81
       81
       +
             const lastRequestTime = requestCache.get(did);

     

       82
       82
       +
       

     

       83
       83
       +
             if (lastRequestTime && now - lastRequestTime < COOLDOWN_PERIOD_MS) {

     

       84
       84
       +
               console.log(

     

       85
       85
       +
                 `Rate limiting PLC request for ${did}, last request was ${

     

       86
       86
       +
                   (now - lastRequestTime) / 1000

     

       87
       87
       +
                 } seconds ago`,

     

       88
       88
       +
               );

     

       89
       89
       +
               return new Response(

     

       90
       90
       +
                 JSON.stringify({

     

       91
       91
       +
                   success: true,

     

       92
       92
       +
                   message:

     

       93
       93
       +
                     "A PLC code was already sent to your email. Please check your inbox and spam folder.",

     

       94
       94
       +
                   rateLimited: true,

     

       95
       95
       +
                   cooldownRemaining: Math.ceil(

     

       96
       96
       +
                     (COOLDOWN_PERIOD_MS - (now - lastRequestTime)) / 1000,

     

       97
       97
       +
                   ),

     

       98
       98
       +
                 }),

     

       99
       99
       +
                 {

     

       100
       100
       +
                   status: 200,

     

       101
       101
       +
                   headers: {

     

       102
       102
       +
                     "Content-Type": "application/json",

     

       103
       103
       +
                     ...Object.fromEntries(res.headers),

     

       104
       104
       +
                   },

     

       105
       105
       +
                 },

     

       106
       106
       +
               );

     

       107
       107
       +
             }

     

       108
       108
       +
       

     

       48
       109
        
             // Request the signature

     

       49
       110
        
             console.log("Requesting PLC operation signature...");

     

       50
       111
        
             try {

     

       51
       112
        
               await oldAgent.com.atproto.identity.requestPlcOperationSignature();

     

       52
       113
        
               console.log("Successfully requested PLC operation signature");

     

       114
       114
       +
       

     

       115
       115
       +
               // Store the request time

     

       116
       116
       +
               if (did) {

     

       117
       117
       +
                 requestCache.set(did, now);

     

       118
       118
       +
       

     

       119
       119
       +
                 // Optionally, set up cache cleanup for DIDs that haven't been used in a while

     

       120
       120
       +
                 setTimeout(() => {

     

       121
       121
       +
                   if (

     

       122
       122
       +
                     did &&

     

       123
       123
       +
                     requestCache.has(did) &&

     

       124
       124
       +
                     Date.now() - requestCache.get(did)! > COOLDOWN_PERIOD_MS * 2

     

       125
       125
       +
                   ) {

     

       126
       126
       +
                     requestCache.delete(did);

     

       127
       127
       +
                   }

     

       128
       128
       +
                 }, COOLDOWN_PERIOD_MS * 2);

     

       129
       129
       +
               }

     

       53
       130
        
             } catch (error) {

     

       54
       131
        
               console.error("Error requesting PLC operation signature:", {

     

       55
       132
        
                 name: error instanceof Error ? error.name : "Unknown",

     

       56
       133
        
                 message: error instanceof Error ? error.message : String(error),

     

       57
       57
       -
                 status: 400

     

       134
       134
       +
                 status: 400,

     

       58
       135
        
               });

     

       59
       136
        
               throw error;

     

       60
       137
        
             }

+27 -3

routes/api/migrate/identity/sign.ts

···

       1
       1
       -
       import {

     

       2
       2
       -
         getSessionAgent,

     

       3
       3
       -
       } from "../../../../lib/sessions.ts";

     

       1
       1
       +
       import { getSessionAgent } from "../../../../lib/sessions.ts";

     

       2
       2
       +
       import { checkDidsMatch } from "../../../../lib/check-dids.ts";

     

       4
       3
        
       import { Secp256k1Keypair } from "npm:@atproto/crypto";

     

       5
       4
        
       import * as ui8 from "npm:uint8arrays";

     

       6
       5
        
       import { define } from "../../../../utils.ts";

     

       6
       6
       +
       import { assertMigrationAllowed } from "../../../../lib/migration-state.ts";

     

       7
       7
        
       

     

       8
       8
       +
       /**

     

       9
       9
       +
        * Handle identity migration sign

     

       10
       10
       +
        * Should be called after user receives the migration token via email

     

       11
       11
       +
        * URL params must contain the token

     

       12
       12
       +
        * @param ctx - The context object containing the request with the token in the URL params

     

       13
       13
       +
        * @returns A response object with the migration result

     

       14
       14
       +
        */

     

       8
       15
        
       export const handler = define.handlers({

     

       9
       16
        
         async POST(ctx) {

     

       10
       17
        
           const res = new Response();

     

       11
       18
        
           try {

     

       19
       19
       +
             // Check if migrations are currently allowed

     

       20
       20
       +
             assertMigrationAllowed();

     

       12
       21
        
             const url = new URL(ctx.req.url);

     

       13
       22
        
             const token = url.searchParams.get("token");

     

       14
       23
        
       

     
···

       45
       54
        
                 JSON.stringify({

     

       46
       55
        
                   success: false,

     

       47
       56
        
                   message: "Migration session not found or invalid",

     

       57
       57
       +
                 }),

     

       58
       58
       +
                 {

     

       59
       59
       +
                   status: 400,

     

       60
       60
       +
                   headers: { "Content-Type": "application/json" },

     

       61
       61
       +
                 },

     

       62
       62
       +
               );

     

       63
       63
       +
             }

     

       64
       64
       +
       

     

       65
       65
       +
             // Verify DIDs match between sessions

     

       66
       66
       +
             const didsMatch = await checkDidsMatch(ctx.req);

     

       67
       67
       +
             if (!didsMatch) {

     

       68
       68
       +
               return new Response(

     

       69
       69
       +
                 JSON.stringify({

     

       70
       70
       +
                   success: false,

     

       71
       71
       +
                   message: "Invalid state, original and target DIDs do not match",

     

       48
       72
        
                 }),

     

       49
       73
        
                 {

     

       50
       74
        
                   status: 400,

+44 -37

routes/api/migrate/next-step.ts

···

       2
       2
        
       import { define } from "../../../utils.ts";

     

       3
       3
        
       

     

       4
       4
        
       export const handler = define.handlers({

     

       5
       5
       -
           async GET(ctx) {

     

       6
       6
       -
               let nextStep = null;

     

       7
       7
       -
               const oldAgent = await getSessionAgent(ctx.req);

     

       8
       8
       -
               const newAgent = await getSessionAgent(ctx.req, new Response(), true);

     

       5
       5
       +
         async GET(ctx) {

     

       6
       6
       +
           let nextStep = null;

     

       7
       7
       +
           const oldAgent = await getSessionAgent(ctx.req);

     

       8
       8
       +
           const newAgent = await getSessionAgent(ctx.req, new Response(), true);

     

       9
       9
        
       

     

       10
       10
       -
               if (!newAgent) return Response.json({ nextStep: 1, completed: false });

     

       11
       11
       -
               if (!oldAgent) return new Response("Unauthorized", { status: 401 });

     

       10
       10
       +
           if (!newAgent) return Response.json({ nextStep: 1, completed: false });

     

       11
       11
       +
           if (!oldAgent) return new Response("Unauthorized", { status: 401 });

     

       12
       12
        
       

     

       13
       13
       -
               const oldStatus = await oldAgent.com.atproto.server.checkAccountStatus();

     

       14
       14
       -
               const newStatus = await newAgent.com.atproto.server.checkAccountStatus();

     

       15
       15
       -
               if (!oldStatus.data || !newStatus.data) return new Response("Could not verify status", { status: 500 });

     

       13
       13
       +
           const oldStatus = await oldAgent.com.atproto.server.checkAccountStatus();

     

       14
       14
       +
           const newStatus = await newAgent.com.atproto.server.checkAccountStatus();

     

       15
       15
       +
           if (!oldStatus.data || !newStatus.data) {

     

       16
       16
       +
             return new Response("Could not verify status", { status: 500 });

     

       17
       17
       +
           }

     

       16
       18
        
       

     

       17
       17
       -
               // Check conditions in sequence to determine the next step

     

       18
       18
       -
               if (!newStatus.data) {

     

       19
       19
       -
                   nextStep = 1;

     

       20
       20
       -
               } else if (!(newStatus.data.repoCommit && 

     

       21
       21
       -
                          newStatus.data.indexedRecords === oldStatus.data.indexedRecords &&

     

       22
       22
       -
                          newStatus.data.privateStateValues === oldStatus.data.privateStateValues &&

     

       23
       23
       -
                          newStatus.data.expectedBlobs === newStatus.data.importedBlobs &&

     

       24
       24
       -
                          newStatus.data.importedBlobs === oldStatus.data.importedBlobs)) {

     

       25
       25
       -
                   nextStep = 2;

     

       26
       26
       -
               } else if (!newStatus.data.validDid) {

     

       27
       27
       -
                   nextStep = 3;

     

       28
       28
       -
               } else if (!(newStatus.data.activated === true && oldStatus.data.activated === false)) {

     

       29
       29
       -
                   nextStep = 4;

     

       30
       30
       -
               }

     

       19
       19
       +
           // Check conditions in sequence to determine the next step

     

       20
       20
       +
           if (!newStatus.data) {

     

       21
       21
       +
             nextStep = 1;

     

       22
       22
       +
           } else if (

     

       23
       23
       +
             !(newStatus.data.repoCommit &&

     

       24
       24
       +
               newStatus.data.indexedRecords === oldStatus.data.indexedRecords &&

     

       25
       25
       +
               newStatus.data.privateStateValues ===

     

       26
       26
       +
                 oldStatus.data.privateStateValues &&

     

       27
       27
       +
               newStatus.data.expectedBlobs === newStatus.data.importedBlobs &&

     

       28
       28
       +
               newStatus.data.importedBlobs === oldStatus.data.importedBlobs)

     

       29
       29
       +
           ) {

     

       30
       30
       +
             nextStep = 2;

     

       31
       31
       +
           } else if (!newStatus.data.validDid) {

     

       32
       32
       +
             nextStep = 3;

     

       33
       33
       +
           } else if (

     

       34
       34
       +
             !(newStatus.data.activated === true && oldStatus.data.activated === false)

     

       35
       35
       +
           ) {

     

       36
       36
       +
             nextStep = 4;

     

       37
       37
       +
           }

     

       31
       38
        
       

     

       32
       32
       -
               return Response.json({

     

       33
       33
       -
                   nextStep,

     

       34
       34
       -
                   completed: nextStep === null,

     

       35
       35
       -
                   currentStatus: {

     

       36
       36
       -
                       activated: newStatus.data.activated,

     

       37
       37
       -
                       validDid: newStatus.data.validDid,

     

       38
       38
       -
                       repoCommit: newStatus.data.repoCommit,

     

       39
       39
       -
                       indexedRecords: newStatus.data.indexedRecords,

     

       40
       40
       -
                       privateStateValues: newStatus.data.privateStateValues,

     

       41
       41
       -
                       importedBlobs: newStatus.data.importedBlobs

     

       42
       42
       -
                   }

     

       43
       43
       -
               });

     

       44
       44
       -
           }

     

       45
       45
       -
       }) 
     

       39
       39
       +
           return Response.json({

     

       40
       40
       +
             nextStep,

     

       41
       41
       +
             completed: nextStep === null,

     

       42
       42
       +
             currentStatus: {

     

       43
       43
       +
               activated: newStatus.data.activated,

     

       44
       44
       +
               validDid: newStatus.data.validDid,

     

       45
       45
       +
               repoCommit: newStatus.data.repoCommit,

     

       46
       46
       +
               indexedRecords: newStatus.data.indexedRecords,

     

       47
       47
       +
               privateStateValues: newStatus.data.privateStateValues,

     

       48
       48
       +
               importedBlobs: newStatus.data.importedBlobs,

     

       49
       49
       +
             },

     

       50
       50
       +
           });

     

       51
       51
       +
         },

     

       52
       52
       +
       });

+135 -71

routes/api/migrate/status.ts

···

       1
       1
       +
       import { checkDidsMatch } from "../../../lib/check-dids.ts";

     

       1
       2
        
       import { getSessionAgent } from "../../../lib/sessions.ts";

     

       2
       3
        
       import { define } from "../../../utils.ts";

     

       3
       4
        
       

     

       4
       5
        
       export const handler = define.handlers({

     

       5
       5
       -
           async GET(ctx) {

     

       6
       6
       -
               const url = new URL(ctx.req.url);

     

       7
       7
       -
               const params = new URLSearchParams(url.search);

     

       8
       8
       -
               const step = params.get("step");

     

       9
       9
       -
               const oldAgent = await getSessionAgent(ctx.req);

     

       10
       10
       -
               const newAgent = await getSessionAgent(ctx.req, new Response(), true);

     

       11
       11
       -
               

     

       12
       12
       -
               if (!oldAgent || !newAgent) return new Response("Unauthorized", { status: 401 });

     

       6
       6
       +
         async GET(ctx) {

     

       7
       7
       +
           console.log("Status check: Starting");

     

       8
       8
       +
           const url = new URL(ctx.req.url);

     

       9
       9
       +
           const params = new URLSearchParams(url.search);

     

       10
       10
       +
           const step = params.get("step");

     

       11
       11
       +
           console.log("Status check: Step", step);

     

       13
       12
        
       

     

       14
       14
       -
               const oldStatus = await oldAgent.com.atproto.server.checkAccountStatus();

     

       15
       15
       -
               const newStatus = await newAgent.com.atproto.server.checkAccountStatus();

     

       16
       16
       -
               if (!oldStatus.data || !newStatus.data) return new Response("Could not verify status", { status: 500 });

     

       13
       13
       +
           console.log("Status check: Getting agents");

     

       14
       14
       +
           const oldAgent = await getSessionAgent(ctx.req);

     

       15
       15
       +
           const newAgent = await getSessionAgent(ctx.req, new Response(), true);

     

       17
       16
        
       

     

       18
       18
       -
               const readyToContinue = () => {

     

       19
       19
       -
                   if (step) {

     

       20
       20
       -
                       switch (step) {

     

       21
       21
       -
                           case "1": {

     

       22
       22
       -
                               if (newStatus.data) {

     

       23
       23
       -
                                   return { ready: true };

     

       24
       24
       -
                               }

     

       25
       25
       -
                               return { ready: false, reason: "New account status not available" };

     

       26
       26
       -
                           }

     

       27
       27
       -
                           case "2": {

     

       28
       28
       -
                               if (newStatus.data.repoCommit && 

     

       29
       29
       -
                                   newStatus.data.indexedRecords === oldStatus.data.indexedRecords &&

     

       30
       30
       -
                                   newStatus.data.privateStateValues === oldStatus.data.privateStateValues &&

     

       31
       31
       -
                                   newStatus.data.expectedBlobs === newStatus.data.importedBlobs &&

     

       32
       32
       -
                                   newStatus.data.importedBlobs === oldStatus.data.importedBlobs) {

     

       33
       33
       -
                                   return { ready: true };

     

       34
       34
       -
                               }

     

       35
       35
       -
                               const reasons = [];

     

       36
       36
       -
                               if (!newStatus.data.repoCommit) reasons.push("Repository not imported.");

     

       37
       37
       -
                               if (newStatus.data.indexedRecords < oldStatus.data.indexedRecords) 

     

       38
       38
       -
                                   reasons.push("Not all records imported.");

     

       39
       39
       -
                               if (newStatus.data.privateStateValues < oldStatus.data.privateStateValues)

     

       40
       40
       -
                                   reasons.push("Not all private state values imported.");

     

       41
       41
       -
                               if (newStatus.data.expectedBlobs !== newStatus.data.importedBlobs)

     

       42
       42
       -
                                   reasons.push("Expected blobs not fully imported.");

     

       43
       43
       -
                               if (newStatus.data.importedBlobs < oldStatus.data.importedBlobs)

     

       44
       44
       -
                                   reasons.push("Not all blobs imported.");

     

       45
       45
       -
                               return { ready: false, reason: reasons.join(", ") };

     

       46
       46
       -
                           }

     

       47
       47
       -
                           case "3": {

     

       48
       48
       -
                               if (newStatus.data.validDid) {

     

       49
       49
       -
                                   return { ready: true };

     

       50
       50
       -
                               }

     

       51
       51
       -
                               return { ready: false, reason: "DID not valid" };

     

       52
       52
       -
                           }

     

       53
       53
       -
                           case "4": {

     

       54
       54
       -
                               if (newStatus.data.activated === true && oldStatus.data.activated === false) {

     

       55
       55
       -
                                   return { ready: true };

     

       56
       56
       -
                               }

     

       57
       57
       -
                               return { ready: false, reason: "Account not activated" };

     

       58
       58
       -
                           }

     

       59
       59
       -
                       }

     

       60
       60
       -
                   } else {

     

       61
       61
       -
                       return { ready: true };

     

       17
       17
       +
           if (!oldAgent || !newAgent) {

     

       18
       18
       +
             console.log("Status check: Unauthorized - missing agents", {

     

       19
       19
       +
               hasOldAgent: !!oldAgent,

     

       20
       20
       +
               hasNewAgent: !!newAgent,

     

       21
       21
       +
             });

     

       22
       22
       +
             return new Response("Unauthorized", { status: 401 });

     

       23
       23
       +
           }

     

       24
       24
       +
       

     

       25
       25
       +
           const didsMatch = await checkDidsMatch(ctx.req);

     

       26
       26
       +
       

     

       27
       27
       +
           console.log("Status check: Fetching account statuses");

     

       28
       28
       +
           const oldStatus = await oldAgent.com.atproto.server.checkAccountStatus();

     

       29
       29
       +
           const newStatus = await newAgent.com.atproto.server.checkAccountStatus();

     

       30
       30
       +
       

     

       31
       31
       +
           if (!oldStatus.data || !newStatus.data) {

     

       32
       32
       +
             console.error("Status check: Failed to verify status", {

     

       33
       33
       +
               hasOldStatus: !!oldStatus.data,

     

       34
       34
       +
               hasNewStatus: !!newStatus.data,

     

       35
       35
       +
             });

     

       36
       36
       +
             return new Response("Could not verify status", { status: 500 });

     

       37
       37
       +
           }

     

       38
       38
       +
       

     

       39
       39
       +
           console.log("Status check: Account statuses", {

     

       40
       40
       +
             old: oldStatus.data,

     

       41
       41
       +
             new: newStatus.data,

     

       42
       42
       +
           });

     

       43
       43
       +
       

     

       44
       44
       +
           const readyToContinue = () => {

     

       45
       45
       +
             if (!didsMatch) {

     

       46
       46
       +
               return {

     

       47
       47
       +
                 ready: false,

     

       48
       48
       +
                 reason: "Invalid state, original and target DIDs do not match",

     

       49
       49
       +
               };

     

       50
       50
       +
             }

     

       51
       51
       +
             if (step) {

     

       52
       52
       +
               console.log("Status check: Evaluating step", step);

     

       53
       53
       +
               switch (step) {

     

       54
       54
       +
                 case "1": {

     

       55
       55
       +
                   if (newStatus.data) {

     

       56
       56
       +
                     console.log("Status check: Step 1 ready");

     

       57
       57
       +
                     return { ready: true };

     

       62
       58
        
                   }

     

       59
       59
       +
                   console.log(

     

       60
       60
       +
                     "Status check: Step 1 not ready - new account status not available",

     

       61
       61
       +
                   );

     

       62
       62
       +
                   return { ready: false, reason: "New account status not available" };

     

       63
       63
       +
                 }

     

       64
       64
       +
                 case "2": {

     

       65
       65
       +
                   const isReady = newStatus.data.repoCommit &&

     

       66
       66
       +
                     newStatus.data.indexedRecords === oldStatus.data.indexedRecords &&

     

       67
       67
       +
                     newStatus.data.privateStateValues ===

     

       68
       68
       +
                       oldStatus.data.privateStateValues &&

     

       69
       69
       +
                     newStatus.data.expectedBlobs === newStatus.data.importedBlobs &&

     

       70
       70
       +
                     newStatus.data.importedBlobs === oldStatus.data.importedBlobs;

     

       71
       71
       +
       

     

       72
       72
       +
                   if (isReady) {

     

       73
       73
       +
                     console.log("Status check: Step 2 ready");

     

       74
       74
       +
                     return { ready: true };

     

       75
       75
       +
                   }

     

       76
       76
       +
       

     

       77
       77
       +
                   const reasons = [];

     

       78
       78
       +
                   if (!newStatus.data.repoCommit) {

     

       79
       79
       +
                     reasons.push("Repository not imported.");

     

       80
       80
       +
                   }

     

       81
       81
       +
                   if (newStatus.data.indexedRecords < oldStatus.data.indexedRecords) {

     

       82
       82
       +
                     reasons.push("Not all records imported.");

     

       83
       83
       +
                   }

     

       84
       84
       +
                   if (

     

       85
       85
       +
                     newStatus.data.privateStateValues <

     

       86
       86
       +
                       oldStatus.data.privateStateValues

     

       87
       87
       +
                   ) {

     

       88
       88
       +
                     reasons.push("Not all private state values imported.");

     

       89
       89
       +
                   }

     

       90
       90
       +
                   if (newStatus.data.expectedBlobs !== newStatus.data.importedBlobs) {

     

       91
       91
       +
                     reasons.push("Expected blobs not fully imported.");

     

       92
       92
       +
                   }

     

       93
       93
       +
                   if (newStatus.data.importedBlobs < oldStatus.data.importedBlobs) {

     

       94
       94
       +
                     reasons.push("Not all blobs imported.");

     

       95
       95
       +
                   }

     

       96
       96
       +
       

     

       97
       97
       +
                   console.log("Status check: Step 2 not ready", { reasons });

     

       98
       98
       +
                   return { ready: false, reason: reasons.join(", ") };

     

       99
       99
       +
                 }

     

       100
       100
       +
                 case "3": {

     

       101
       101
       +
                   if (newStatus.data.validDid) {

     

       102
       102
       +
                     console.log("Status check: Step 3 ready");

     

       103
       103
       +
                     return { ready: true };

     

       104
       104
       +
                   }

     

       105
       105
       +
                   console.log("Status check: Step 3 not ready - DID not valid");

     

       106
       106
       +
                   return { ready: false, reason: "DID not valid" };

     

       107
       107
       +
                 }

     

       108
       108
       +
                 case "4": {

     

       109
       109
       +
                   if (

     

       110
       110
       +
                     newStatus.data.activated === true &&

     

       111
       111
       +
                     oldStatus.data.activated === false

     

       112
       112
       +
                   ) {

     

       113
       113
       +
                     console.log("Status check: Step 4 ready");

     

       114
       114
       +
                     return { ready: true };

     

       115
       115
       +
                   }

     

       116
       116
       +
                   console.log(

     

       117
       117
       +
                     "Status check: Step 4 not ready - Account not activated",

     

       118
       118
       +
                   );

     

       119
       119
       +
                   return { ready: false, reason: "Account not activated" };

     

       120
       120
       +
                 }

     

       63
       121
        
               }

     

       122
       122
       +
             } else {

     

       123
       123
       +
               console.log("Status check: No step specified, returning ready");

     

       124
       124
       +
               return { ready: true };

     

       125
       125
       +
             }

     

       126
       126
       +
           };

     

       64
       127
        
       

     

       65
       65
       -
               const status = {

     

       66
       66
       -
                   activated: newStatus.data.activated,

     

       67
       67
       -
                   validDid: newStatus.data.validDid,

     

       68
       68
       -
                   repoCommit: newStatus.data.repoCommit,

     

       69
       69
       -
                   repoRev: newStatus.data.repoRev,

     

       70
       70
       -
                   repoBlocks: newStatus.data.repoBlocks,

     

       71
       71
       -
                   expectedRecords: oldStatus.data.indexedRecords,

     

       72
       72
       -
                   indexedRecords: newStatus.data.indexedRecords,

     

       73
       73
       -
                   privateStateValues: newStatus.data.privateStateValues,

     

       74
       74
       -
                   expectedBlobs: newStatus.data.expectedBlobs,

     

       75
       75
       -
                   importedBlobs: newStatus.data.importedBlobs,

     

       76
       76
       -
                   ...readyToContinue()

     

       77
       77
       -
               }

     

       128
       128
       +
           const status = {

     

       129
       129
       +
             activated: newStatus.data.activated,

     

       130
       130
       +
             validDid: newStatus.data.validDid,

     

       131
       131
       +
             repoCommit: newStatus.data.repoCommit,

     

       132
       132
       +
             repoRev: newStatus.data.repoRev,

     

       133
       133
       +
             repoBlocks: newStatus.data.repoBlocks,

     

       134
       134
       +
             expectedRecords: oldStatus.data.indexedRecords,

     

       135
       135
       +
             indexedRecords: newStatus.data.indexedRecords,

     

       136
       136
       +
             privateStateValues: newStatus.data.privateStateValues,

     

       137
       137
       +
             expectedBlobs: newStatus.data.expectedBlobs,

     

       138
       138
       +
             importedBlobs: newStatus.data.importedBlobs,

     

       139
       139
       +
             ...readyToContinue(),

     

       140
       140
       +
           };

     

       78
       141
        
       

     

       79
       79
       -
               return Response.json(status);

     

       80
       80
       -
           }

     

       81
       81
       -
       })
     

       142
       142
       +
           console.log("Status check: Complete", status);

     

       143
       143
       +
           return Response.json(status);

     

       144
       144
       +
         },

     

       145
       145
       +
       });

+45

routes/api/migration-state.ts

···

       1
       1
       +
       import { getMigrationState } from "../../lib/migration-state.ts";

     

       2
       2
       +
       import { define } from "../../utils.ts";

     

       3
       3
       +
       

     

       4
       4
       +
       /**

     

       5
       5
       +
        * API endpoint to check the current migration state.

     

       6
       6
       +
        * Returns the migration state information including whether migrations are allowed.

     

       7
       7
       +
        */

     

       8
       8
       +
       export const handler = define.handlers({

     

       9
       9
       +
         GET(_ctx) {

     

       10
       10
       +
           try {

     

       11
       11
       +
             const stateInfo = getMigrationState();

     

       12
       12
       +
       

     

       13
       13
       +
             return new Response(

     

       14
       14
       +
               JSON.stringify({

     

       15
       15
       +
                 state: stateInfo.state,

     

       16
       16
       +
                 message: stateInfo.message,

     

       17
       17
       +
                 allowMigration: stateInfo.allowMigration,

     

       18
       18
       +
               }),

     

       19
       19
       +
               {

     

       20
       20
       +
                 status: 200,

     

       21
       21
       +
                 headers: {

     

       22
       22
       +
                   "Content-Type": "application/json",

     

       23
       23
       +
                 },

     

       24
       24
       +
               },

     

       25
       25
       +
             );

     

       26
       26
       +
           } catch (error) {

     

       27
       27
       +
             console.error("Error checking migration state:", error);

     

       28
       28
       +
       

     

       29
       29
       +
             return new Response(

     

       30
       30
       +
               JSON.stringify({

     

       31
       31
       +
                 state: "issue",

     

       32
       32
       +
                 message:

     

       33
       33
       +
                   "Unable to determine migration state. Please try again later.",

     

       34
       34
       +
                 allowMigration: false,

     

       35
       35
       +
               }),

     

       36
       36
       +
               {

     

       37
       37
       +
                 status: 500,

     

       38
       38
       +
                 headers: {

     

       39
       39
       +
                   "Content-Type": "application/json",

     

       40
       40
       +
                 },

     

       41
       41
       +
               },

     

       42
       42
       +
             );

     

       43
       43
       +
           }

     

       44
       44
       +
         },

     

       45
       45
       +
       });

+13 -13

routes/api/oauth/initiate.ts

···

       1
       1
       -
       import { isValidHandle } from 'npm:@atproto/syntax'

     

       1
       1
       +
       import { isValidHandle } from "npm:@atproto/syntax";

     

       2
       2
        
       import { oauthClient } from "../../../lib/oauth/client.ts";

     

       3
       3
        
       import { define } from "../../../utils.ts";

     

       4
       4
        
       

     

       5
       5
        
       function isValidUrl(url: string): boolean {

     

       6
       6
        
         try {

     

       7
       7
       -
           const urlp = new URL(url)

     

       7
       7
       +
           const urlp = new URL(url);

     

       8
       8
        
           // http or https

     

       9
       9
       -
           return urlp.protocol === 'http:' || urlp.protocol === 'https:'

     

       9
       9
       +
           return urlp.protocol === "http:" || urlp.protocol === "https:";

     

       10
       10
        
         } catch {

     

       11
       11
       -
           return false

     

       11
       11
       +
           return false;

     

       12
       12
        
         }

     

       13
       13
        
       }

     

       14
       14
        
       

     

       15
       15
        
       export const handler = define.handlers({

     

       16
       16
        
         async POST(ctx) {

     

       17
       17
       -
           const data = await ctx.req.json()

     

       18
       18
       -
           const handle = data.handle

     

       17
       17
       +
           const data = await ctx.req.json();

     

       18
       18
       +
           const handle = data.handle;

     

       19
       19
        
           if (

     

       20
       20
       -
             typeof handle !== 'string' ||

     

       20
       20
       +
             typeof handle !== "string" ||

     

       21
       21
        
             !(isValidHandle(handle) || isValidUrl(handle))

     

       22
       22
        
           ) {

     

       23
       23
       -
             return new Response("Invalid Handle", {status: 400})

     

       23
       23
       +
             return new Response("Invalid Handle", { status: 400 });

     

       24
       24
        
           }

     

       25
       25
        
       

     

       26
       26
        
           // Initiate the OAuth flow

     

       27
       27
        
           try {

     

       28
       28
        
             const url = await oauthClient.authorize(handle, {

     

       29
       29
       -
               scope: 'atproto transition:generic transition:chat.bsky',

     

       30
       30
       -
             })

     

       31
       31
       -
             return Response.json({ redirectUrl: url.toString() })

     

       29
       29
       +
               scope: "atproto transition:generic transition:chat.bsky",

     

       30
       30
       +
             });

     

       31
       31
       +
             return Response.json({ redirectUrl: url.toString() });

     

       32
       32
        
           } catch (err) {

     

       33
       33
       -
             console.error({ err }, 'oauth authorize failed')

     

       34
       34
       -
             return new Response("Couldn't initiate login", {status: 500})

     

       33
       33
       +
             console.error({ err }, "oauth authorize failed");

     

       34
       34
       +
             return new Response("Couldn't initiate login", { status: 500 });

     

       35
       35
        
           }

     

       36
       36
        
         },

     

       37
       37
        
       });

+42

routes/api/plc/keys.ts

···

       1
       1
       +
       import { Secp256k1Keypair } from "@atproto/crypto";

     

       2
       2
       +
       import { getSessionAgent } from "../../../lib/sessions.ts";

     

       3
       3
       +
       import { define } from "../../../utils.ts";

     

       4
       4
       +
       import * as ui8 from "npm:uint8arrays";

     

       5
       5
       +
       

     

       6
       6
       +
       /**

     

       7
       7
       +
        * Generate and return PLC keys for the authenticated user

     

       8
       8
       +
        */

     

       9
       9
       +
       export const handler = define.handlers({

     

       10
       10
       +
         async GET(ctx) {

     

       11
       11
       +
           const agent = await getSessionAgent(ctx.req);

     

       12
       12
       +
           if (!agent) {

     

       13
       13
       +
             return new Response("Unauthorized", { status: 401 });

     

       14
       14
       +
           }

     

       15
       15
       +
       

     

       16
       16
       +
           // Create a new keypair

     

       17
       17
       +
           const keypair = await Secp256k1Keypair.create({ exportable: true });

     

       18
       18
       +
       

     

       19
       19
       +
           // Export private key bytes

     

       20
       20
       +
           const privateKeyBytes = await keypair.export();

     

       21
       21
       +
           const privateKeyHex = ui8.toString(privateKeyBytes, "hex");

     

       22
       22
       +
       

     

       23
       23
       +
           // Get public key as DID

     

       24
       24
       +
           const publicKeyDid = keypair.did();

     

       25
       25
       +
       

     

       26
       26
       +
           // Convert private key to multikey format (base58btc)

     

       27
       27
       +
           const privateKeyMultikey = ui8.toString(privateKeyBytes, "base58btc");

     

       28
       28
       +
       

     

       29
       29
       +
           // Return the key information

     

       30
       30
       +
           return new Response(

     

       31
       31
       +
             JSON.stringify({

     

       32
       32
       +
               keyType: "secp256k1",

     

       33
       33
       +
               publicKeyDid: publicKeyDid,

     

       34
       34
       +
               privateKeyHex: privateKeyHex,

     

       35
       35
       +
               privateKeyMultikey: privateKeyMultikey,

     

       36
       36
       +
             }),

     

       37
       37
       +
             {

     

       38
       38
       +
               headers: { "Content-Type": "application/json" },

     

       39
       39
       +
             },

     

       40
       40
       +
           );

     

       41
       41
       +
         },

     

       42
       42
       +
       });

+61

routes/api/plc/token.ts

···

       1
       1
       +
       import { getSessionAgent } from "../../../lib/sessions.ts";

     

       2
       2
       +
       import { define } from "../../../utils.ts";

     

       3
       3
       +
       

     

       4
       4
       +
       /**

     

       5
       5
       +
        * Handle account creation

     

       6
       6
       +
        * First step of the migration process

     

       7
       7
       +
        * Body must contain:

     

       8
       8
       +
        * - service: The service URL of the new account

     

       9
       9
       +
        * - handle: The handle of the new account

     

       10
       10
       +
        * - password: The password of the new account

     

       11
       11
       +
        * - email: The email of the new account

     

       12
       12
       +
        * - invite: The invite code of the new account (optional depending on the PDS)

     

       13
       13
       +
        * @param ctx - The context object containing the request and response

     

       14
       14
       +
        * @returns A response object with the creation result

     

       15
       15
       +
        */

     

       16
       16
       +
       export const handler = define.handlers({

     

       17
       17
       +
         async GET(ctx) {

     

       18
       18
       +
           const res = new Response();

     

       19
       19
       +
           try {

     

       20
       20
       +
             const agent = await getSessionAgent(ctx.req, res);

     

       21
       21
       +
       

     

       22
       22
       +
             if (!agent) return new Response("Unauthorized", { status: 401 });

     

       23
       23
       +
       

     

       24
       24
       +
             // console.log("getting did");

     

       25
       25
       +
             // const session = await agent.com.atproto.server.getSession();

     

       26
       26
       +
             // const accountDid = session.data.did;

     

       27
       27
       +
             // console.log("got did");

     

       28
       28
       +
       

     

       29
       29
       +
             await agent.com.atproto.identity.requestPlcOperationSignature();

     

       30
       30
       +
       

     

       31
       31
       +
             return new Response(

     

       32
       32
       +
               JSON.stringify({

     

       33
       33
       +
                 success: true,

     

       34
       34
       +
                 message:

     

       35
       35
       +
                   "We've requested a token to update your identity, it should be sent to your account's email address.",

     

       36
       36
       +
               }),

     

       37
       37
       +
               {

     

       38
       38
       +
                 status: 200,

     

       39
       39
       +
                 headers: {

     

       40
       40
       +
                   "Content-Type": "application/json",

     

       41
       41
       +
                   ...Object.fromEntries(res.headers), // Include session cookie headers

     

       42
       42
       +
                 },

     

       43
       43
       +
               },

     

       44
       44
       +
             );

     

       45
       45
       +
           } catch (error) {

     

       46
       46
       +
             console.error("PLC signature request error:", error);

     

       47
       47
       +
             return new Response(

     

       48
       48
       +
               JSON.stringify({

     

       49
       49
       +
                 success: false,

     

       50
       50
       +
                 message: error instanceof Error

     

       51
       51
       +
                   ? error.message

     

       52
       52
       +
                   : "Failed to get PLC operation signature (sending confirmation email)",

     

       53
       53
       +
               }),

     

       54
       54
       +
               {

     

       55
       55
       +
                 status: 400,

     

       56
       56
       +
                 headers: { "Content-Type": "application/json" },

     

       57
       57
       +
               },

     

       58
       58
       +
             );

     

       59
       59
       +
           }

     

       60
       60
       +
         },

     

       61
       61
       +
       });

+92

routes/api/plc/update/complete.ts

···

       1
       1
       +
       import { getSessionAgent } from "../../../../lib/sessions.ts";

     

       2
       2
       +
       import { define } from "../../../../utils.ts";

     

       3
       3
       +
       

     

       4
       4
       +
       /**

     

       5
       5
       +
        * Complete PLC update using email token

     

       6
       6
       +
        */

     

       7
       7
       +
       export const handler = define.handlers({

     

       8
       8
       +
         async POST(ctx) {

     

       9
       9
       +
           const res = new Response();

     

       10
       10
       +
           try {

     

       11
       11
       +
             const url = new URL(ctx.req.url);

     

       12
       12
       +
             const token = url.searchParams.get("token");

     

       13
       13
       +
       

     

       14
       14
       +
             if (!token) {

     

       15
       15
       +
               return new Response(

     

       16
       16
       +
                 JSON.stringify({

     

       17
       17
       +
                   success: false,

     

       18
       18
       +
                   message: "Missing token parameter",

     

       19
       19
       +
                 }),

     

       20
       20
       +
                 {

     

       21
       21
       +
                   status: 400,

     

       22
       22
       +
                   headers: { "Content-Type": "application/json" },

     

       23
       23
       +
                 },

     

       24
       24
       +
               );

     

       25
       25
       +
             }

     

       26
       26
       +
       

     

       27
       27
       +
             const agent = await getSessionAgent(ctx.req, res, true);

     

       28
       28
       +
             if (!agent) {

     

       29
       29
       +
               return new Response(

     

       30
       30
       +
                 JSON.stringify({

     

       31
       31
       +
                   success: false,

     

       32
       32
       +
                   message: "Unauthorized",

     

       33
       33
       +
                 }),

     

       34
       34
       +
                 {

     

       35
       35
       +
                   status: 401,

     

       36
       36
       +
                   headers: { "Content-Type": "application/json" },

     

       37
       37
       +
                 },

     

       38
       38
       +
               );

     

       39
       39
       +
             }

     

       40
       40
       +
       

     

       41
       41
       +
             const did = agent.did;

     

       42
       42
       +
             if (!did) {

     

       43
       43
       +
               return new Response(

     

       44
       44
       +
                 JSON.stringify({

     

       45
       45
       +
                   success: false,

     

       46
       46
       +
                   message: "No DID found in session",

     

       47
       47
       +
                 }),

     

       48
       48
       +
                 {

     

       49
       49
       +
                   status: 400,

     

       50
       50
       +
                   headers: { "Content-Type": "application/json" },

     

       51
       51
       +
                 },

     

       52
       52
       +
               );

     

       53
       53
       +
             }

     

       54
       54
       +
       

     

       55
       55
       +
             // Submit the PLC operation with the token

     

       56
       56
       +
             await agent!.com.atproto.identity.submitPlcOperation({

     

       57
       57
       +
               operation: { token: token },

     

       58
       58
       +
             });

     

       59
       59
       +
       

     

       60
       60
       +
             return new Response(

     

       61
       61
       +
               JSON.stringify({

     

       62
       62
       +
                 success: true,

     

       63
       63
       +
                 message: "PLC update completed successfully",

     

       64
       64
       +
                 did,

     

       65
       65
       +
               }),

     

       66
       66
       +
               {

     

       67
       67
       +
                 status: 200,

     

       68
       68
       +
                 headers: {

     

       69
       69
       +
                   "Content-Type": "application/json",

     

       70
       70
       +
                   ...Object.fromEntries(res.headers), // Include session cookie headers

     

       71
       71
       +
                 },

     

       72
       72
       +
               },

     

       73
       73
       +
             );

     

       74
       74
       +
           } catch (error) {

     

       75
       75
       +
             console.error("PLC update completion error:", error);

     

       76
       76
       +
             const message = error instanceof Error

     

       77
       77
       +
               ? error.message

     

       78
       78
       +
               : "Unknown error occurred";

     

       79
       79
       +
       

     

       80
       80
       +
             return new Response(

     

       81
       81
       +
               JSON.stringify({

     

       82
       82
       +
                 success: false,

     

       83
       83
       +
                 message: `Failed to complete PLC update: ${message}`,

     

       84
       84
       +
               }),

     

       85
       85
       +
               {

     

       86
       86
       +
                 status: 500,

     

       87
       87
       +
                 headers: { "Content-Type": "application/json" },

     

       88
       88
       +
               },

     

       89
       89
       +
             );

     

       90
       90
       +
           }

     

       91
       91
       +
         },

     

       92
       92
       +
       });

+155

routes/api/plc/update.ts

···

       1
       1
       +
       import { getSessionAgent } from "../../../lib/sessions.ts";

     

       2
       2
       +
       import { define } from "../../../utils.ts";

     

       3
       3
       +
       import * as plc from "@did-plc/lib";

     

       4
       4
       +
       

     

       5
       5
       +
       /**

     

       6
       6
       +
        * Handle PLC update operation

     

       7
       7
       +
        * Body must contain:

     

       8
       8
       +
        * - key: The new rotation key to add

     

       9
       9
       +
        * - token: The email token received from requestPlcOperationSignature

     

       10
       10
       +
        * @param ctx - The context object containing the request and response

     

       11
       11
       +
        * @returns A response object with the update result

     

       12
       12
       +
        */

     

       13
       13
       +
       export const handler = define.handlers({

     

       14
       14
       +
         async POST(ctx) {

     

       15
       15
       +
           const res = new Response();

     

       16
       16
       +
           try {

     

       17
       17
       +
             console.log("=== PLC Update Debug ===");

     

       18
       18
       +
             const body = await ctx.req.json();

     

       19
       19
       +
             const { key: newKey, token } = body;

     

       20
       20
       +
             console.log("Request body:", { newKey, hasToken: !!token });

     

       21
       21
       +
       

     

       22
       22
       +
             if (!newKey) {

     

       23
       23
       +
               console.log("Missing key in request");

     

       24
       24
       +
               return new Response("Missing param key in request body", {

     

       25
       25
       +
                 status: 400,

     

       26
       26
       +
               });

     

       27
       27
       +
             }

     

       28
       28
       +
       

     

       29
       29
       +
             if (!token) {

     

       30
       30
       +
               console.log("Missing token in request");

     

       31
       31
       +
               return new Response("Missing param token in request body", {

     

       32
       32
       +
                 status: 400,

     

       33
       33
       +
               });

     

       34
       34
       +
             }

     

       35
       35
       +
       

     

       36
       36
       +
             const agent = await getSessionAgent(ctx.req, res);

     

       37
       37
       +
             if (!agent) {

     

       38
       38
       +
               console.log("No agent found");

     

       39
       39
       +
               return new Response("Unauthorized", { status: 401 });

     

       40
       40
       +
             }

     

       41
       41
       +
       

     

       42
       42
       +
             const session = await agent.com.atproto.server.getSession();

     

       43
       43
       +
             const did = session.data.did;

     

       44
       44
       +
             if (!did) {

     

       45
       45
       +
               console.log("No DID found in session");

     

       46
       46
       +
               return new Response(

     

       47
       47
       +
                 JSON.stringify({

     

       48
       48
       +
                   success: false,

     

       49
       49
       +
                   message: "No DID found in your session",

     

       50
       50
       +
                 }),

     

       51
       51
       +
                 {

     

       52
       52
       +
                   status: 400,

     

       53
       53
       +
                   headers: { "Content-Type": "application/json" },

     

       54
       54
       +
                 },

     

       55
       55
       +
               );

     

       56
       56
       +
             }

     

       57
       57
       +
             console.log("Using agent DID:", did);

     

       58
       58
       +
       

     

       59
       59
       +
             // Get recommended credentials first

     

       60
       60
       +
             console.log("Getting did:plc document...");

     

       61
       61
       +
             const plcClient = new plc.Client("https://plc.directory");

     

       62
       62
       +
             const didDoc = await plcClient.getDocumentData(did);

     

       63
       63
       +
             if (!didDoc) {

     

       64
       64
       +
               console.log("No DID document found for agent DID");

     

       65
       65
       +
               return new Response(

     

       66
       66
       +
                 JSON.stringify({

     

       67
       67
       +
                   success: false,

     

       68
       68
       +
                   message: "No DID document found for your account",

     

       69
       69
       +
                 }),

     

       70
       70
       +
                 {

     

       71
       71
       +
                   status: 400,

     

       72
       72
       +
                   headers: { "Content-Type": "application/json" },

     

       73
       73
       +
                 },

     

       74
       74
       +
               );

     

       75
       75
       +
             }

     

       76
       76
       +
             console.log("Got DID document:", didDoc);

     

       77
       77
       +
       

     

       78
       78
       +
             const rotationKeys = didDoc.rotationKeys ?? [];

     

       79
       79
       +
             if (!rotationKeys.length) {

     

       80
       80
       +
               console.log("No existing rotation keys found");

     

       81
       81
       +
               throw new Error("No rotation keys provided in recommended credentials");

     

       82
       82
       +
             }

     

       83
       83
       +
       

     

       84
       84
       +
             // Check if the key is already in rotation keys

     

       85
       85
       +
             if (rotationKeys.includes(newKey)) {

     

       86
       86
       +
               console.log("Key already exists in rotation keys");

     

       87
       87
       +
               return new Response(

     

       88
       88
       +
                 JSON.stringify({

     

       89
       89
       +
                   success: false,

     

       90
       90
       +
                   message: "This key is already in your rotation keys",

     

       91
       91
       +
                 }),

     

       92
       92
       +
                 {

     

       93
       93
       +
                   status: 400,

     

       94
       94
       +
                   headers: { "Content-Type": "application/json" },

     

       95
       95
       +
                 },

     

       96
       96
       +
               );

     

       97
       97
       +
             }

     

       98
       98
       +
       

     

       99
       99
       +
             // Perform the actual PLC update with the provided token

     

       100
       100
       +
             console.log("Signing PLC operation...");

     

       101
       101
       +
             const plcOp = await agent.com.atproto.identity.signPlcOperation({

     

       102
       102
       +
               token,

     

       103
       103
       +
               rotationKeys: [newKey, ...rotationKeys],

     

       104
       104
       +
             });

     

       105
       105
       +
             console.log("PLC operation signed successfully:", plcOp.data);

     

       106
       106
       +
       

     

       107
       107
       +
             console.log("Submitting PLC operation...");

     

       108
       108
       +
             const plcSubmit = await agent.com.atproto.identity.submitPlcOperation({

     

       109
       109
       +
               operation: plcOp.data.operation,

     

       110
       110
       +
             });

     

       111
       111
       +
             console.log("PLC operation submitted successfully:", plcSubmit);

     

       112
       112
       +
       

     

       113
       113
       +
             return new Response(

     

       114
       114
       +
               JSON.stringify({

     

       115
       115
       +
                 success: true,

     

       116
       116
       +
                 message: "PLC update completed successfully",

     

       117
       117
       +
                 did: plcOp.data,

     

       118
       118
       +
                 newKey,

     

       119
       119
       +
                 rotationKeys: [newKey, ...rotationKeys],

     

       120
       120
       +
               }),

     

       121
       121
       +
               {

     

       122
       122
       +
                 status: 200,

     

       123
       123
       +
                 headers: {

     

       124
       124
       +
                   "Content-Type": "application/json",

     

       125
       125
       +
                   ...Object.fromEntries(res.headers), // Include session cookie headers

     

       126
       126
       +
                 },

     

       127
       127
       +
               },

     

       128
       128
       +
             );

     

       129
       129
       +
           } catch (error) {

     

       130
       130
       +
             console.error("PLC update error:", error);

     

       131
       131
       +
             const errorMessage = error instanceof Error

     

       132
       132
       +
               ? error.message

     

       133
       133
       +
               : "Failed to update your PLC";

     

       134
       134
       +
             console.log("Sending error response:", errorMessage);

     

       135
       135
       +
       

     

       136
       136
       +
             return new Response(

     

       137
       137
       +
               JSON.stringify({

     

       138
       138
       +
                 success: false,

     

       139
       139
       +
                 message: errorMessage,

     

       140
       140
       +
                 error: error instanceof Error

     

       141
       141
       +
                   ? {

     

       142
       142
       +
                     name: error.name,

     

       143
       143
       +
                     message: error.message,

     

       144
       144
       +
                     stack: error.stack,

     

       145
       145
       +
                   }

     

       146
       146
       +
                   : String(error),

     

       147
       147
       +
               }),

     

       148
       148
       +
               {

     

       149
       149
       +
                 status: 400,

     

       150
       150
       +
                 headers: { "Content-Type": "application/json" },

     

       151
       151
       +
               },

     

       152
       152
       +
             );

     

       153
       153
       +
           }

     

       154
       154
       +
         },

     

       155
       155
       +
       });

+129

routes/api/plc/verify.ts

···

       1
       1
       +
       import { getSessionAgent } from "../../../lib/sessions.ts";

     

       2
       2
       +
       import { define } from "../../../utils.ts";

     

       3
       3
       +
       import * as plc from "@did-plc/lib";

     

       4
       4
       +
       

     

       5
       5
       +
       /**

     

       6
       6
       +
        * Verify if a rotation key exists in the PLC document

     

       7
       7
       +
        * Body must contain:

     

       8
       8
       +
        * - key: The rotation key to verify

     

       9
       9
       +
        * @param ctx - The context object containing the request and response

     

       10
       10
       +
        * @returns A response object with the verification result

     

       11
       11
       +
        */

     

       12
       12
       +
       export const handler = define.handlers({

     

       13
       13
       +
         async POST(ctx) {

     

       14
       14
       +
           const res = new Response();

     

       15
       15
       +
           try {

     

       16
       16
       +
             const body = await ctx.req.json();

     

       17
       17
       +
             const { key: newKey } = body;

     

       18
       18
       +
             console.log("Request body:", { newKey });

     

       19
       19
       +
       

     

       20
       20
       +
             if (!newKey) {

     

       21
       21
       +
               console.log("Missing key in request");

     

       22
       22
       +
               return new Response("Missing param key in request body", {

     

       23
       23
       +
                 status: 400,

     

       24
       24
       +
               });

     

       25
       25
       +
             }

     

       26
       26
       +
       

     

       27
       27
       +
             const agent = await getSessionAgent(ctx.req, res);

     

       28
       28
       +
             if (!agent) {

     

       29
       29
       +
               console.log("No agent found");

     

       30
       30
       +
               return new Response("Unauthorized", { status: 401 });

     

       31
       31
       +
             }

     

       32
       32
       +
       

     

       33
       33
       +
             const session = await agent.com.atproto.server.getSession();

     

       34
       34
       +
             const did = session.data.did;

     

       35
       35
       +
             if (!did) {

     

       36
       36
       +
               console.log("No DID found in session");

     

       37
       37
       +
               return new Response(

     

       38
       38
       +
                 JSON.stringify({

     

       39
       39
       +
                   success: false,

     

       40
       40
       +
                   message: "No DID found in your session",

     

       41
       41
       +
                 }),

     

       42
       42
       +
                 {

     

       43
       43
       +
                   status: 400,

     

       44
       44
       +
                   headers: { "Content-Type": "application/json" },

     

       45
       45
       +
                 },

     

       46
       46
       +
               );

     

       47
       47
       +
             }

     

       48
       48
       +
             console.log("Using agent DID:", did);

     

       49
       49
       +
       

     

       50
       50
       +
             // Fetch the PLC document to check rotation keys

     

       51
       51
       +
             console.log("Getting did:plc document...");

     

       52
       52
       +
             const plcClient = new plc.Client("https://plc.directory");

     

       53
       53
       +
             const didDoc = await plcClient.getDocumentData(did);

     

       54
       54
       +
             if (!didDoc) {

     

       55
       55
       +
               console.log("No DID document found for agent DID");

     

       56
       56
       +
               return new Response(

     

       57
       57
       +
                 JSON.stringify({

     

       58
       58
       +
                   success: false,

     

       59
       59
       +
                   message: "No DID document found for your account",

     

       60
       60
       +
                 }),

     

       61
       61
       +
                 {

     

       62
       62
       +
                   status: 400,

     

       63
       63
       +
                   headers: { "Content-Type": "application/json" },

     

       64
       64
       +
                 },

     

       65
       65
       +
               );

     

       66
       66
       +
             }

     

       67
       67
       +
             console.log("Got DID document:", didDoc);

     

       68
       68
       +
       

     

       69
       69
       +
             const rotationKeys = didDoc.rotationKeys ?? [];

     

       70
       70
       +
             if (!rotationKeys.length) {

     

       71
       71
       +
               console.log("No existing rotation keys found");

     

       72
       72
       +
               throw new Error("No rotation keys found in did:plc document");

     

       73
       73
       +
             }

     

       74
       74
       +
       

     

       75
       75
       +
             // Check if the key exists in rotation keys

     

       76
       76
       +
             if (rotationKeys.includes(newKey)) {

     

       77
       77
       +
               return new Response(

     

       78
       78
       +
                 JSON.stringify({

     

       79
       79
       +
                   success: true,

     

       80
       80
       +
                   message: "Rotation key exists in PLC document",

     

       81
       81
       +
                 }),

     

       82
       82
       +
                 {

     

       83
       83
       +
                   status: 200,

     

       84
       84
       +
                   headers: {

     

       85
       85
       +
                     "Content-Type": "application/json",

     

       86
       86
       +
                     ...Object.fromEntries(res.headers), // Include session cookie headers

     

       87
       87
       +
                   },

     

       88
       88
       +
                 },

     

       89
       89
       +
               );

     

       90
       90
       +
             }

     

       91
       91
       +
       

     

       92
       92
       +
             // If we get here, the key was not found

     

       93
       93
       +
             return new Response(

     

       94
       94
       +
               JSON.stringify({

     

       95
       95
       +
                 success: false,

     

       96
       96
       +
                 message: "Rotation key not found in PLC document",

     

       97
       97
       +
               }),

     

       98
       98
       +
               {

     

       99
       99
       +
                 status: 404,

     

       100
       100
       +
                 headers: { "Content-Type": "application/json" },

     

       101
       101
       +
               },

     

       102
       102
       +
             );

     

       103
       103
       +
           } catch (error) {

     

       104
       104
       +
             console.error("PLC verification error:", error);

     

       105
       105
       +
             const errorMessage = error instanceof Error

     

       106
       106
       +
               ? error.message

     

       107
       107
       +
               : "Failed to verify rotation key";

     

       108
       108
       +
             console.log("Sending error response:", errorMessage);

     

       109
       109
       +
       

     

       110
       110
       +
             return new Response(

     

       111
       111
       +
               JSON.stringify({

     

       112
       112
       +
                 success: false,

     

       113
       113
       +
                 message: errorMessage,

     

       114
       114
       +
                 error: error instanceof Error

     

       115
       115
       +
                   ? {

     

       116
       116
       +
                     name: error.name,

     

       117
       117
       +
                     message: error.message,

     

       118
       118
       +
                     stack: error.stack,

     

       119
       119
       +
                   }

     

       120
       120
       +
                   : String(error),

     

       121
       121
       +
               }),

     

       122
       122
       +
               {

     

       123
       123
       +
                 status: 400,

     

       124
       124
       +
                 headers: { "Content-Type": "application/json" },

     

       125
       125
       +
               },

     

       126
       126
       +
             );

     

       127
       127
       +
           }

     

       128
       128
       +
         },

     

       129
       129
       +
       });

+11 -8

routes/api/resolve-pds.ts

···

       7
       7
        
           const did = url.searchParams.get("did");

     

       8
       8
        
       

     

       9
       9
        
           if (!did) {

     

       10
       10
       -
             return new Response(JSON.stringify({ error: "DID parameter is required" }), {

     

       11
       11
       -
               status: 400,

     

       12
       12
       -
               headers: { "Content-Type": "application/json" }

     

       13
       13
       -
             });

     

       10
       10
       +
             return new Response(

     

       11
       11
       +
               JSON.stringify({ error: "DID parameter is required" }),

     

       12
       12
       +
               {

     

       13
       13
       +
                 status: 400,

     

       14
       14
       +
                 headers: { "Content-Type": "application/json" },

     

       15
       15
       +
               },

     

       16
       16
       +
             );

     

       14
       17
        
           }

     

       15
       18
        
       

     

       16
       19
        
           try {

     

       17
       20
        
             const pds = await resolver.resolveDidToPdsUrl(did);

     

       18
       21
        
             return new Response(JSON.stringify({ pds }), {

     

       19
       22
        
               status: 200,

     

       20
       20
       -
               headers: { "Content-Type": "application/json" }

     

       23
       23
       +
               headers: { "Content-Type": "application/json" },

     

       21
       24
        
             });

     

       22
       25
        
           } catch (error) {

     

       23
       26
        
             console.error("Failed to resolve PDS:", error);

     

       24
       27
        
             return new Response(JSON.stringify({ error: "Failed to resolve PDS" }), {

     

       25
       28
        
               status: 500,

     

       26
       26
       -
               headers: { "Content-Type": "application/json" }

     

       29
       29
       +
               headers: { "Content-Type": "application/json" },

     

       27
       30
        
             });

     

       28
       31
        
           }

     

       29
       29
       -
         }

     

       30
       30
       -
       }); 
     

       32
       32
       +
         },

     

       33
       33
       +
       });

+1 -2

routes/api/server/describe.ts

···

       1
       1
       -
       

     

       2
       1
        
       import { Agent } from "@atproto/api";

     

       3
       2
        
       import { getSessionAgent } from "../../../lib/sessions.ts";

     

       4
       3
        
       import { define } from "../../../utils.ts";

     
···

       21
       20
        
           }

     

       22
       21
        
           const result = await agent.com.atproto.server.describeServer();

     

       23
       22
        
           return Response.json(result);

     

       24
       24
       -
         }

     

       23
       23
       +
         },

     

       25
       24
        
       });

+26 -18

routes/index.tsx

···

       1
       1
        
       import Ticket from "../islands/Ticket.tsx";

     

       2
       2
        
       import AirportSign from "../components/AirportSign.tsx";

     

       3
       3
        
       import SocialLinks from "../islands/SocialLinks.tsx";

     

       4
       4
       -
       import { Button } from "../components/Button.tsx";

     

       4
       4
       +
       import LoginButton from "../islands/LoginButton.tsx";

     

       5
       5
        
       

     

       6
       6
        
       export default function Home() {

     

       7
       7
        
         return (

     
···

       14
       14
        
                   <p class="font-mono text-lg sm:text-xl font-bold mb-4 sm:mb-6 mt-0 text-center text-gray-600 dark:text-gray-300">

     

       15
       15
        
                     Your terminal for seamless AT Protocol PDS migration and backup.

     

       16
       16
        
                   </p>

     

       17
       17
       -
                   <p class="font-mono mb-4 sm:mb-6 mt-0 text-center text-gray-600 dark:text-gray-300">

     

       18
       18
       -
                     Airport is in <strong>alpha</strong> currently, and we don't recommend it for main accounts. <br/> Please use its migration tools at your own risk.

     

       19
       19
       -
                   </p>

     

       20
       17
        
       

     

       21
       18
        
                   <Ticket />

     

       22
       19
        
       

     

       23
       23
       -
                   <div class="mt-6 sm:mt-8 text-center w-fit mx-auto">

     

       24
       24
       -
                     <Button

     

       25
       25
       -
                       href="/login"

     

       26
       26
       -
                       color="blue"

     

       27
       27
       -
                       label="MOBILE NOT SUPPORTED"

     

       28
       28
       -
                       className="opacity-50 cursor-not-allowed sm:opacity-100 sm:cursor-pointer"

     

       29
       29
       -
                       onClick={(e: MouseEvent) => {

     

       30
       30
       -
                         if (globalThis.innerWidth < 640) {

     

       31
       31
       -
                           e.preventDefault();

     

       32
       32
       -
                         }

     

       33
       33
       -
                       }}

     

       34
       34
       -
                     />

     

       35
       35
       -
                   </div>

     

       20
       20
       +
                   <LoginButton />

     

       36
       21
        
                   <p class="font-mono text-lg sm:text-xl mb-4 mt-4 sm:mb-6 text-center text-gray-600 dark:text-gray-300">

     

       37
       37
       -
                     Airport is made with love by <a class="text-blue-500 hover:underline" href="https://bsky.app/profile/knotbin.com">Roscoe</a> for <a class="text-blue-500 hover:underline" href="https://sprk.so">Spark</a>, a new short-video platform for AT Protocol.

     

       22
       22
       +
                     Airport is made with love by{" "}

     

       23
       23
       +
                     <a

     

       24
       24
       +
                       class="text-blue-500 hover:underline"

     

       25
       25
       +
                       href="https://bsky.app/profile/knotbin.com"

     

       26
       26
       +
                     >

     

       27
       27
       +
                       Roscoe

     

       28
       28
       +
                     </a>{" "}

     

       29
       29
       +
                     for{" "}

     

       30
       30
       +
                     <a class="text-blue-500 hover:underline" href="https://sprk.so">

     

       31
       31
       +
                       Spark

     

       32
       32
       +
                     </a>, a new short-video platform for AT Protocol.

     

       38
       33
        
                   </p>

     

       34
       34
       +
                   <div class="text-center mb-4">

     

       35
       35
       +
                     <a

     

       36
       36
       +
                       href="/about"

     

       37
       37
       +
                       class="inline-flex items-center text-blue-500 hover:text-blue-600 transition-colors"

     

       38
       38
       +
                     >

     

       39
       39
       +
                       <img

     

       40
       40
       +
                         src="/icons/info_bold.svg"

     

       41
       41
       +
                         alt="Info"

     

       42
       42
       +
                         class="w-5 h-5 mr-2"

     

       43
       43
       +
                       />

     

       44
       44
       +
                       <span class="font-mono">Learn more about AT Protocol</span>

     

       45
       45
       +
                     </a>

     

       46
       46
       +
                   </div>

     

       39
       47
        
                   <SocialLinks />

     

       40
       48
        
                 </div>

     

       41
       49
        
               </div>

+1 -1

routes/login/index.tsx

···

       1
       1
        
       import { PageProps } from "fresh";

     

       2
       2
       -
       import LoginSelector from "../../islands/LoginSelector.tsx"

     

       2
       2
       +
       import LoginSelector from "../../islands/LoginSelector.tsx";

     

       3
       3
        
       

     

       4
       4
        
       export async function submitHandle(handle: string) {

     

       5
       5
        
         const response = await fetch("/api/oauth/initiate", {

+2 -2

routes/migrate/progress.tsx

···

       10
       10
        
       

     

       11
       11
        
         if (!service || !handle || !email || !password) {

     

       12
       12
        
           return (

     

       13
       13
       -
             <div class="min-h-screen bg-gray-50 dark:bg-gray-900 p-4">

     

       13
       13
       +
             <div class="bg-gray-50 dark:bg-gray-900 p-4">

     

       14
       14
        
               <div class="max-w-2xl mx-auto">

     

       15
       15
        
                 <div class="bg-red-50 dark:bg-red-900 p-4 rounded-lg">

     

       16
       16
        
                   <p class="text-red-800 dark:text-red-200">

     
···

       24
       24
        
         }

     

       25
       25
        
       

     

       26
       26
        
         return (

     

       27
       27
       -
           <div class="min-h-screen bg-gray-50 dark:bg-gray-900 p-4">

     

       27
       27
       +
           <div class="bg-gray-50 dark:bg-gray-900 p-4">

     

       28
       28
        
             <div class="max-w-2xl mx-auto">

     

       29
       29
        
               <h1 class="font-mono text-3xl font-bold text-gray-900 dark:text-white mb-8">

     

       30
       30
        
                 Migration Progress

+14

routes/ticket-booth/index.tsx

···

       1
       1
       +
       import DidPlcProgress from "../../islands/DidPlcProgress.tsx";

     

       2
       2
       +
       

     

       3
       3
       +
       export default function TicketBooth() {

     

       4
       4
       +
         return (

     

       5
       5
       +
           <div class=" bg-gray-50 dark:bg-gray-900 p-4">

     

       6
       6
       +
             <div class="max-w-2xl mx-auto">

     

       7
       7
       +
               <h1 class="font-mono text-3xl font-bold text-gray-900 dark:text-white mb-8">

     

       8
       8
       +
                 Ticket Booth Self-Service Kiosk

     

       9
       9
       +
               </h1>

     

       10
       10
       +
               <DidPlcProgress />

     

       11
       11
       +
             </div>

     

       12
       12
       +
           </div>

     

       13
       13
       +
         );

     

       14
       14
       +
       }

+52 -9

static/favicon.svg

···

       1
       1
       -
       <svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="768px" height="768px"><svg width="768px" height="768px" viewBox="0 0 768 768" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">

     

       1
       1
       +
       <svg

     

       2
       2
       +
         xmlns="http://www.w3.org/2000/svg"

     

       3
       3
       +
         version="1.1"

     

       4
       4
       +
         xmlns:xlink="http://www.w3.org/1999/xlink"

     

       5
       5
       +
         width="768px"

     

       6
       6
       +
         height="768px"

     

       7
       7
       +
       >

     

       8
       8
       +
         <svg

     

       9
       9
       +
           width="768px"

     

       10
       10
       +
           height="768px"

     

       11
       11
       +
           viewBox="0 0 768 768"

     

       12
       12
       +
           version="1.1"

     

       13
       13
       +
           xmlns="http://www.w3.org/2000/svg"

     

       14
       14
       +
           xmlns:xlink="http://www.w3.org/1999/xlink"

     

       15
       15
       +
         >

     

       2
       16
        
           <title>Artboard</title>

     

       3
       3
       -
           <g id="SvgjsG1018" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">

     

       4
       4
       -
               <path d="M258.744161,673.532662 C220.757598,658.556745 187.761971,637.340862 159.757278,609.885015 C131.731315,582.675001 109.640415,549.95668 94.87512,513.789548 C79.62504,476.904419 72,436.829975 72,393.566215 C72,341.982502 79.9023142,296.222756 95.7069425,256.286977 C111.788845,216.351199 133.97078,182.794052 162.252746,155.615536 C190.638366,128.268343 224.327386,107.031355 261.239629,93.2158823 C298.948918,79.0719608 339.292311,72 382.269809,72 C434.951904,72 481.118055,80.1812879 520.768263,96.5438638 C560.418471,112.90644 593.414098,135.092983 619.755146,163.103494 C645.823967,190.667688 665.804365,223.408333 678.398635,259.198961 C691.153247,294.974763 696.976005,332.414555 695.866908,371.518338 C694.480537,425.320706 674.410807,486.092796 651.875912,513.807986 C627.109489,544.267686 603.766423,555.08515 561.350365,555.08515 C539.879106,555.08515 518.908303,544.647246 498.437956,523.771439 L520.642336,488.757018 L553.379562,469.399451 C566.854015,479.647575 578.145985,482.494276 587.255474,477.939554 C600.919708,471.107472 612.130106,436.413978 615.180122,422.270056 C618.73393,406.280102 620.684502,389.975506 621.002879,373.598326 C621.834702,330.611898 615.457396,294.420099 601.870961,265.022929 C588.284526,235.625759 569.845793,211.91389 546.554762,193.887324 C524.028964,175.836615 498.164782,162.407064 470.442999,154.367543 C442.715581,146.047589 415.1268,141.887612 387.676656,141.887612 C348.85827,141.887612 314.337635,148.127577 284.114749,160.607508 C253.891863,172.810107 228.382638,190.143344 207.587075,212.60722 C187.068785,234.793763 171.541431,261.140284 161.005012,291.646781 C150.745868,321.875947 145.893569,355.155762 146.448118,391.486227 C147.557214,427.53936 154.073158,459.98718 165.995948,488.829687 C177.28032,516.727243 194.28181,541.951359 215.9053,562.877276 C237.610095,583.620856 263.386636,599.628298 291.601152,609.885015 C320.714941,620.700955 352.601472,626.108925 387.260744,626.108925 C406.669937,626.108925 425.940493,623.89027 445.072411,619.452962 C464.481604,615.292985 482.227152,609.330351 498.309054,601.565061 L522.015997,666.460701 C500.665885,676.444645 478.206676,683.793938 454.63837,688.508578 C431.262297,693.509483 407.422332,696.019474 383.517543,696 C338.321851,696 296.730724,688.508578 258.744161,673.532662 Z" id="SvgjsPath1017" fill="#0083FF" fill-rule="nonzero"></path>

     

       5
       5
       -
               <g id="SvgjsG1016" transform="translate(115.0733, 79.4049)" fill="#0083FF">

     

       6
       6
       -
                   <path d="M329.828907,231.383849 L260.699401,110.602459 C251.63529,94.765511 234.795945,84.9961472 216.561535,84.9961472 L202.32856,84.9961472 C197.759942,84.9961472 194.291354,89.1141864 195.064554,93.6217527 L218.683383,231.383849 L146.044594,231.383849 L117.317307,191.126992 C112.543308,184.436292 104.83484,180.465281 96.6208666,180.465281 L77.9170684,180.465281 C74.6441326,180.465281 72.2041032,183.486025 72.8889188,186.689439 L90.5192033,269.169882 C90.542094,269.250079 90.5821529,269.322638 90.6349289,269.382467 C90.634293,269.446115 90.634293,269.509764 90.634293,269.572775 L90.6349289,269.760538 C90.5821529,269.821003 90.542094,269.892926 90.5192033,269.973759 L72.8889188,352.453566 C72.2041032,355.657617 74.6441326,358.677724 77.9170684,358.677724 L96.6208666,358.677724 C104.83484,358.677724 112.543308,354.706712 117.317307,348.016012 L146.042051,307.761702 L218.684019,307.761702 L195.064554,445.52889 C194.291354,450.036456 197.759942,454.154495 202.32856,454.154495 L216.561535,454.154495 C234.795945,454.154495 251.63529,444.385132 260.699401,428.548184 L329.83145,307.761702 L399.512242,307.761702 C415.470292,307.761702 431.243943,304.348885 445.777042,297.751748 L448.41584,296.553888 C458.994558,291.751631 465.788667,281.20003 465.788667,269.572775 C465.788667,257.946157 458.994558,247.394556 448.41584,242.592299 L445.777042,241.39444 C431.243943,234.797303 415.470292,231.383849 399.512242,231.383849 L329.828907,231.383849 Z" id="SvgjsPath1015" transform="translate(269.2809, 269.5753) rotate(-134) translate(-269.2809, -269.5753)"></path>

     

       7
       7
       -
               </g>

     

       17
       17
       +
           <g

     

       18
       18
       +
             id="SvgjsG1018"

     

       19
       19
       +
             stroke="none"

     

       20
       20
       +
             stroke-width="1"

     

       21
       21
       +
             fill="none"

     

       22
       22
       +
             fill-rule="evenodd"

     

       23
       23
       +
           >

     

       24
       24
       +
             <path

     

       25
       25
       +
               d="M258.744161,673.532662 C220.757598,658.556745 187.761971,637.340862 159.757278,609.885015 C131.731315,582.675001 109.640415,549.95668 94.87512,513.789548 C79.62504,476.904419 72,436.829975 72,393.566215 C72,341.982502 79.9023142,296.222756 95.7069425,256.286977 C111.788845,216.351199 133.97078,182.794052 162.252746,155.615536 C190.638366,128.268343 224.327386,107.031355 261.239629,93.2158823 C298.948918,79.0719608 339.292311,72 382.269809,72 C434.951904,72 481.118055,80.1812879 520.768263,96.5438638 C560.418471,112.90644 593.414098,135.092983 619.755146,163.103494 C645.823967,190.667688 665.804365,223.408333 678.398635,259.198961 C691.153247,294.974763 696.976005,332.414555 695.866908,371.518338 C694.480537,425.320706 674.410807,486.092796 651.875912,513.807986 C627.109489,544.267686 603.766423,555.08515 561.350365,555.08515 C539.879106,555.08515 518.908303,544.647246 498.437956,523.771439 L520.642336,488.757018 L553.379562,469.399451 C566.854015,479.647575 578.145985,482.494276 587.255474,477.939554 C600.919708,471.107472 612.130106,436.413978 615.180122,422.270056 C618.73393,406.280102 620.684502,389.975506 621.002879,373.598326 C621.834702,330.611898 615.457396,294.420099 601.870961,265.022929 C588.284526,235.625759 569.845793,211.91389 546.554762,193.887324 C524.028964,175.836615 498.164782,162.407064 470.442999,154.367543 C442.715581,146.047589 415.1268,141.887612 387.676656,141.887612 C348.85827,141.887612 314.337635,148.127577 284.114749,160.607508 C253.891863,172.810107 228.382638,190.143344 207.587075,212.60722 C187.068785,234.793763 171.541431,261.140284 161.005012,291.646781 C150.745868,321.875947 145.893569,355.155762 146.448118,391.486227 C147.557214,427.53936 154.073158,459.98718 165.995948,488.829687 C177.28032,516.727243 194.28181,541.951359 215.9053,562.877276 C237.610095,583.620856 263.386636,599.628298 291.601152,609.885015 C320.714941,620.700955 352.601472,626.108925 387.260744,626.108925 C406.669937,626.108925 425.940493,623.89027 445.072411,619.452962 C464.481604,615.292985 482.227152,609.330351 498.309054,601.565061 L522.015997,666.460701 C500.665885,676.444645 478.206676,683.793938 454.63837,688.508578 C431.262297,693.509483 407.422332,696.019474 383.517543,696 C338.321851,696 296.730724,688.508578 258.744161,673.532662 Z"

     

       26
       26
       +
               id="SvgjsPath1017"

     

       27
       27
       +
               fill="#0083FF"

     

       28
       28
       +
               fill-rule="nonzero"

     

       29
       29
       +
             ></path>

     

       30
       30
       +
             <g

     

       31
       31
       +
               id="SvgjsG1016"

     

       32
       32
       +
               transform="translate(115.0733, 79.4049)"

     

       33
       33
       +
               fill="#0083FF"

     

       34
       34
       +
             >

     

       35
       35
       +
               <path

     

       36
       36
       +
                 d="M329.828907,231.383849 L260.699401,110.602459 C251.63529,94.765511 234.795945,84.9961472 216.561535,84.9961472 L202.32856,84.9961472 C197.759942,84.9961472 194.291354,89.1141864 195.064554,93.6217527 L218.683383,231.383849 L146.044594,231.383849 L117.317307,191.126992 C112.543308,184.436292 104.83484,180.465281 96.6208666,180.465281 L77.9170684,180.465281 C74.6441326,180.465281 72.2041032,183.486025 72.8889188,186.689439 L90.5192033,269.169882 C90.542094,269.250079 90.5821529,269.322638 90.6349289,269.382467 C90.634293,269.446115 90.634293,269.509764 90.634293,269.572775 L90.6349289,269.760538 C90.5821529,269.821003 90.542094,269.892926 90.5192033,269.973759 L72.8889188,352.453566 C72.2041032,355.657617 74.6441326,358.677724 77.9170684,358.677724 L96.6208666,358.677724 C104.83484,358.677724 112.543308,354.706712 117.317307,348.016012 L146.042051,307.761702 L218.684019,307.761702 L195.064554,445.52889 C194.291354,450.036456 197.759942,454.154495 202.32856,454.154495 L216.561535,454.154495 C234.795945,454.154495 251.63529,444.385132 260.699401,428.548184 L329.83145,307.761702 L399.512242,307.761702 C415.470292,307.761702 431.243943,304.348885 445.777042,297.751748 L448.41584,296.553888 C458.994558,291.751631 465.788667,281.20003 465.788667,269.572775 C465.788667,257.946157 458.994558,247.394556 448.41584,242.592299 L445.777042,241.39444 C431.243943,234.797303 415.470292,231.383849 399.512242,231.383849 L329.828907,231.383849 Z"

     

       37
       37
       +
                 id="SvgjsPath1015"

     

       38
       38
       +
                 transform="translate(269.2809, 269.5753) rotate(-134) translate(-269.2809, -269.5753)"

     

       39
       39
       +
               ></path>

     

       40
       40
       +
             </g>

     

       8
       41
        
           </g>

     

       9
       9
       -
       </svg><style>@media (prefers-color-scheme: light) { :root { filter: none; } }

     

       10
       10
       -
       @media (prefers-color-scheme: dark) { :root { filter: none; } }

     

       11
       11
       -
       </style></svg>
     

       42
       42
       +
         </svg><style>

     

       43
       43
       +
         @media (prefers-color-scheme: light) {

     

       44
       44
       +
           :root {

     

       45
       45
       +
             filter: none;

     

       46
       46
       +
           }

     

       47
       47
       +
         }

     

       48
       48
       +
         @media (prefers-color-scheme: dark) {

     

       49
       49
       +
           :root {

     

       50
       50
       +
             filter: none;

     

       51
       51
       +
           }

     

       52
       52
       +
         }

     

       53
       53
       +
         </style>

     

       54
       54
       +
       </svg>

+12

static/icons/account.svg

···

       1
       1
       +
       <svg

     

       2
       2
       +
         xmlns="http://www.w3.org/2000/svg"

     

       3
       3
       +
         height="24px"

     

       4
       4
       +
         viewBox="0 0 24 24"

     

       5
       5
       +
         width="24px"

     

       6
       6
       +
         fill="#e3e3e3"

     

       7
       7
       +
       >

     

       8
       8
       +
         <path d="M0 0h24v24H0z" fill="none" />

     

       9
       9
       +
         <path

     

       10
       10
       +
           d="M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z"

     

       11
       11
       +
         />

     

       12
       12
       +
       </svg>

+9 -3

static/icons/bluesky.svg

···

       1
       1
       -
       <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="-20 -20 296 266" fill="none">

     

       2
       2
       -
         <path 

     

       1
       1
       +
       <svg

     

       2
       2
       +
         xmlns="http://www.w3.org/2000/svg"

     

       3
       3
       +
         width="24"

     

       4
       4
       +
         height="24"

     

       5
       5
       +
         viewBox="-20 -20 296 266"

     

       6
       6
       +
         fill="none"

     

       7
       7
       +
       >

     

       8
       8
       +
         <path

     

       3
       9
        
           d="M55.491 15.172c29.35 22.035 60.917 66.712 72.509 90.686 11.592-23.974 43.159-68.651 72.509-90.686C221.686-.727 256-13.028 256 26.116c0 7.818-4.482 65.674-7.111 75.068-9.138 32.654-42.436 40.983-72.057 35.942 51.775 8.812 64.946 38 36.501 67.187-54.021 55.433-77.644-13.908-83.696-31.676-1.11-3.257-1.63-4.78-1.637-3.485-.008-1.296-.527.228-1.637 3.485-6.052 17.768-29.675 87.11-83.696 31.676-28.445-29.187-15.274-58.375 36.5-67.187-29.62 5.041-62.918-3.288-72.056-35.942C4.482 91.79 0 33.934 0 26.116 0-13.028 34.314-.727 55.491 15.172Z"

     

       4
       10
        
           stroke="currentColor"

     

       5
       11
        
           stroke-width="25"

     

       6
       12
        
           fill="none"

     

       7
       13
        
           stroke-linejoin="round"

     

       8
       14
        
         />

     

       9
       9
       -
       </svg>
     

       15
       15
       +
       </svg>

+30

static/icons/info_bold.svg

···

       1
       1
       +
       <?xml version="1.0" encoding="UTF-8"?>

     

       2
       2
       +
       <svg

     

       3
       3
       +
         width="24"

     

       4
       4
       +
         height="24"

     

       5
       5
       +
         viewBox="0 0 24 24"

     

       6
       6
       +
         fill="none"

     

       7
       7
       +
         xmlns="http://www.w3.org/2000/svg"

     

       8
       8
       +
       >

     

       9
       9
       +
         <path

     

       10
       10
       +
           d="M12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22Z"

     

       11
       11
       +
           stroke="currentColor"

     

       12
       12
       +
           stroke-width="2"

     

       13
       13
       +
           stroke-linecap="round"

     

       14
       14
       +
           stroke-linejoin="round"

     

       15
       15
       +
         />

     

       16
       16
       +
         <path

     

       17
       17
       +
           d="M12 16V12"

     

       18
       18
       +
           stroke="currentColor"

     

       19
       19
       +
           stroke-width="2"

     

       20
       20
       +
           stroke-linecap="round"

     

       21
       21
       +
           stroke-linejoin="round"

     

       22
       22
       +
         />

     

       23
       23
       +
         <path

     

       24
       24
       +
           d="M12 8H12.01"

     

       25
       25
       +
           stroke="currentColor"

     

       26
       26
       +
           stroke-width="2"

     

       27
       27
       +
           stroke-linecap="round"

     

       28
       28
       +
           stroke-linejoin="round"

     

       29
       29
       +
         />

     

       30
       30
       +
       </svg>

+21 -4

static/icons/plane-departure_bold.svg

···

       1
       1
       -
       <svg width="80" height="80" viewBox="4 20 70 36" fill="none" xmlns="http://www.w3.org/2000/svg">

     

       2
       2
       -
         <path fill-rule="evenodd" clip-rule="evenodd" d="M50.8224 33.2841L31.008 22.743C29.2561 21.8109 27.1909 21.6663 25.3262 22.345L19.7985 24.3569C19.3667 24.5141 19.2513 25.0706 19.5849 25.3865L34.2839 39.3037L18.5107 45.0447L13.6805 42.0448C12.6378 41.3972 11.3555 41.2642 10.202 41.684L5.45108 43.4133C4.99314 43.5799 4.83855 44.15 5.14954 44.5252L13.9345 55.124C13.9589 55.1535 13.9934 55.1711 14.0299 55.1746C14.0582 55.1928 14.0913 55.2035 14.1264 55.2046L22.9607 55.4824C27.707 55.6317 32.4381 54.874 36.9004 53.2498L63.8001 43.4591C66.6965 42.405 69.3245 40.7247 71.4968 38.5381L72.708 37.3189C73.9986 36.0199 74.4226 34.0923 73.7963 32.3716C73.1701 30.6509 71.6062 29.4468 69.7826 29.2812L68.071 29.1259C65.0014 28.8472 61.9082 29.2493 59.0119 30.3034L50.8224 33.2841Z" fill="#FFFFFF" />

     

       3
       3
       -
         <path d="M7 64H75" stroke="#C2CCDE" stroke-width="6" stroke-linecap="round" stroke-linejoin="round" />

     

       4
       4
       -
       </svg>
     

       1
       1
       +
       <svg

     

       2
       2
       +
         width="80"

     

       3
       3
       +
         height="80"

     

       4
       4
       +
         viewBox="4 20 70 36"

     

       5
       5
       +
         fill="none"

     

       6
       6
       +
         xmlns="http://www.w3.org/2000/svg"

     

       7
       7
       +
       >

     

       8
       8
       +
         <path

     

       9
       9
       +
           fill-rule="evenodd"

     

       10
       10
       +
           clip-rule="evenodd"

     

       11
       11
       +
           d="M50.8224 33.2841L31.008 22.743C29.2561 21.8109 27.1909 21.6663 25.3262 22.345L19.7985 24.3569C19.3667 24.5141 19.2513 25.0706 19.5849 25.3865L34.2839 39.3037L18.5107 45.0447L13.6805 42.0448C12.6378 41.3972 11.3555 41.2642 10.202 41.684L5.45108 43.4133C4.99314 43.5799 4.83855 44.15 5.14954 44.5252L13.9345 55.124C13.9589 55.1535 13.9934 55.1711 14.0299 55.1746C14.0582 55.1928 14.0913 55.2035 14.1264 55.2046L22.9607 55.4824C27.707 55.6317 32.4381 54.874 36.9004 53.2498L63.8001 43.4591C66.6965 42.405 69.3245 40.7247 71.4968 38.5381L72.708 37.3189C73.9986 36.0199 74.4226 34.0923 73.7963 32.3716C73.1701 30.6509 71.6062 29.4468 69.7826 29.2812L68.071 29.1259C65.0014 28.8472 61.9082 29.2493 59.0119 30.3034L50.8224 33.2841Z"

     

       12
       12
       +
           fill="#FFFFFF"

     

       13
       13
       +
         />

     

       14
       14
       +
         <path

     

       15
       15
       +
           d="M7 64H75"

     

       16
       16
       +
           stroke="#C2CCDE"

     

       17
       17
       +
           stroke-width="6"

     

       18
       18
       +
           stroke-linecap="round"

     

       19
       19
       +
           stroke-linejoin="round"

     

       20
       20
       +
         />

     

       21
       21
       +
       </svg>

+14 -3

static/icons/plane_bold.svg

···

       1
       1
       -
       <svg width="80" height="80" viewBox="8 10 64 60" fill="none" xmlns="http://www.w3.org/2000/svg">

     

       2
       2
       -
         <path fill-rule="evenodd" clip-rule="evenodd" d="M49.4268 34L38.5549 15.0236C37.1294 12.5354 34.4811 11.0005 31.6134 11.0005H29.375C28.6565 11.0005 28.111 11.6475 28.2326 12.3557L31.9471 34H20.5233L16.0054 27.6751C15.2546 26.6239 14.0423 26 12.7505 26H9.80898C9.29425 26 8.91051 26.4746 9.01821 26.9779L11.7909 39.9367C11.7945 39.9493 11.8008 39.9607 11.8091 39.9701C11.809 39.9801 11.809 39.9901 11.809 40L11.8091 40.0295C11.8008 40.039 11.7945 40.0503 11.7909 40.063L9.01821 53.0217C8.91051 53.5251 9.29425 53.9996 9.80898 53.9996H12.7505C14.0423 53.9996 15.2546 53.3757 16.0054 52.3245L20.5229 46H31.9472L28.2326 67.6451C28.111 68.3533 28.6565 69.0003 29.375 69.0003H31.6134C34.4811 69.0003 37.1294 67.4654 38.5549 64.9772L49.4272 46H60.3858C62.8955 46 65.3762 45.4638 67.6618 44.4273L68.0768 44.2391C69.7405 43.4846 70.809 41.8268 70.809 40C70.809 38.1733 69.7405 36.5155 68.0768 35.761L67.6618 35.5728C65.3762 34.5363 62.8955 34 60.3858 34H49.4268Z" fill="#C2CCDE" />

     

       3
       3
       -
       </svg>
     

       1
       1
       +
       <svg

     

       2
       2
       +
         width="80"

     

       3
       3
       +
         height="80"

     

       4
       4
       +
         viewBox="8 10 64 60"

     

       5
       5
       +
         fill="none"

     

       6
       6
       +
         xmlns="http://www.w3.org/2000/svg"

     

       7
       7
       +
       >

     

       8
       8
       +
         <path

     

       9
       9
       +
           fill-rule="evenodd"

     

       10
       10
       +
           clip-rule="evenodd"

     

       11
       11
       +
           d="M49.4268 34L38.5549 15.0236C37.1294 12.5354 34.4811 11.0005 31.6134 11.0005H29.375C28.6565 11.0005 28.111 11.6475 28.2326 12.3557L31.9471 34H20.5233L16.0054 27.6751C15.2546 26.6239 14.0423 26 12.7505 26H9.80898C9.29425 26 8.91051 26.4746 9.01821 26.9779L11.7909 39.9367C11.7945 39.9493 11.8008 39.9607 11.8091 39.9701C11.809 39.9801 11.809 39.9901 11.809 40L11.8091 40.0295C11.8008 40.039 11.7945 40.0503 11.7909 40.063L9.01821 53.0217C8.91051 53.5251 9.29425 53.9996 9.80898 53.9996H12.7505C14.0423 53.9996 15.2546 53.3757 16.0054 52.3245L20.5229 46H31.9472L28.2326 67.6451C28.111 68.3533 28.6565 69.0003 29.375 69.0003H31.6134C34.4811 69.0003 37.1294 67.4654 38.5549 64.9772L49.4272 46H60.3858C62.8955 46 65.3762 45.4638 67.6618 44.4273L68.0768 44.2391C69.7405 43.4846 70.809 41.8268 70.809 40C70.809 38.1733 69.7405 36.5155 68.0768 35.761L67.6618 35.5728C65.3762 34.5363 62.8955 34 60.3858 34H49.4268Z"

     

       12
       12
       +
           fill="#C2CCDE"

     

       13
       13
       +
         />

     

       14
       14
       +
       </svg>

+18 -4

static/icons/ticket_bold.svg

···

       1
       1
       -
       <svg width="80" height="80" viewBox="6 18 70 44" fill="none" xmlns="http://www.w3.org/2000/svg">

     

       2
       2
       -
         <path fill-rule="evenodd" clip-rule="evenodd" d="M8 24C8 21.7909 9.79086 20 12 20H68C70.2091 20 72 21.7909 72 24V33.6052C71.6647 33.6578 71.3304 33.7373 71 33.8446C68.3333 34.7111 66.5279 37.1961 66.5279 40C66.5279 42.8039 68.3333 45.2889 71 46.1554C71.3304 46.2627 71.6647 46.3422 72 46.3948V56C72 58.2091 70.2091 60 68 60H12C9.79086 60 8 58.2091 8 56V46.4726C8.66685 46.4727 9.3412 46.3694 10 46.1554C12.6667 45.2889 14.4721 42.8039 14.4721 40C14.4721 37.1961 12.6667 34.7111 10 33.8446C9.3412 33.6306 8.66685 33.5273 8 33.5274V24Z" fill="#FFFFFF" />

     

       3
       3
       -
         <path d="M72 33.6052L72.3097 35.5811C73.2828 35.4286 74 34.5903 74 33.6052H72ZM71 33.8446L70.382 31.9425L70.382 31.9425L71 33.8446ZM71 46.1554L70.382 48.0575H70.382L71 46.1554ZM72 46.3948H74C74 45.4097 73.2828 44.5714 72.3097 44.4189L72 46.3948ZM8 46.4726L8.00027 44.4726C7.46979 44.4725 6.96101 44.6832 6.58588 45.0583C6.21075 45.4333 6 45.9421 6 46.4726H8ZM10 46.1554L10.618 48.0575H10.618L10 46.1554ZM14.4721 40H12.4721H14.4721ZM10 33.8446L10.618 31.9425H10.618L10 33.8446ZM8 33.5274H6C6 34.0579 6.21075 34.5667 6.58588 34.9417C6.96101 35.3168 7.46979 35.5275 8.00027 35.5274L8 33.5274ZM12 18C8.68629 18 6 20.6863 6 24H10C10 22.8954 10.8954 22 12 22V18ZM68 18H12V22H68V18ZM74 24C74 20.6863 71.3137 18 68 18V22C69.1046 22 70 22.8954 70 24H74ZM74 33.6052V24H70V33.6052H74ZM71.6903 31.6294C71.2511 31.6982 70.8136 31.8023 70.382 31.9425L71.618 35.7467C71.8472 35.6723 72.0783 35.6174 72.3097 35.5811L71.6903 31.6294ZM70.382 31.9425C66.8913 33.0767 64.5279 36.3296 64.5279 40H68.5279C68.5279 38.0626 69.7754 36.3454 71.618 35.7467L70.382 31.9425ZM64.5279 40C64.5279 43.6704 66.8913 46.9233 70.382 48.0575L71.618 44.2533C69.7754 43.6546 68.5279 41.9374 68.5279 40H64.5279ZM70.382 48.0575C70.8136 48.1977 71.2511 48.3018 71.6903 48.3706L72.3097 44.4189C72.0783 44.3826 71.8472 44.3277 71.618 44.2533L70.382 48.0575ZM74 56V46.3948H70V56H74ZM68 62C71.3137 62 74 59.3137 74 56H70C70 57.1046 69.1046 58 68 58V62ZM12 62H68V58H12V62ZM6 56C6 59.3137 8.68629 62 12 62V58C10.8954 58 10 57.1046 10 56H6ZM6 46.4726V56H10V46.4726H6ZM9.38197 44.2533C8.92559 44.4015 8.46006 44.4726 8.00027 44.4726L7.99973 48.4726C8.87364 48.4727 9.7568 48.3373 10.618 48.0575L9.38197 44.2533ZM12.4721 40C12.4721 41.9374 11.2246 43.6545 9.38197 44.2533L10.618 48.0575C14.1087 46.9233 16.4721 43.6704 16.4721 40H12.4721ZM9.38197 35.7467C11.2246 36.3454 12.4721 38.0626 12.4721 40H16.4721C16.4721 36.3296 14.1087 33.0767 10.618 31.9425L9.38197 35.7467ZM8.00027 35.5274C8.46006 35.5274 8.92559 35.5985 9.38197 35.7467L10.618 31.9425C9.7568 31.6627 8.87364 31.5273 7.99973 31.5274L8.00027 35.5274ZM6 24V33.5274H10V24H6Z" fill="#FFFFFF" />

     

       4
       4
       -
       </svg>
     

       1
       1
       +
       <svg

     

       2
       2
       +
         width="80"

     

       3
       3
       +
         height="80"

     

       4
       4
       +
         viewBox="6 18 70 44"

     

       5
       5
       +
         fill="none"

     

       6
       6
       +
         xmlns="http://www.w3.org/2000/svg"

     

       7
       7
       +
       >

     

       8
       8
       +
         <path

     

       9
       9
       +
           fill-rule="evenodd"

     

       10
       10
       +
           clip-rule="evenodd"

     

       11
       11
       +
           d="M8 24C8 21.7909 9.79086 20 12 20H68C70.2091 20 72 21.7909 72 24V33.6052C71.6647 33.6578 71.3304 33.7373 71 33.8446C68.3333 34.7111 66.5279 37.1961 66.5279 40C66.5279 42.8039 68.3333 45.2889 71 46.1554C71.3304 46.2627 71.6647 46.3422 72 46.3948V56C72 58.2091 70.2091 60 68 60H12C9.79086 60 8 58.2091 8 56V46.4726C8.66685 46.4727 9.3412 46.3694 10 46.1554C12.6667 45.2889 14.4721 42.8039 14.4721 40C14.4721 37.1961 12.6667 34.7111 10 33.8446C9.3412 33.6306 8.66685 33.5273 8 33.5274V24Z"

     

       12
       12
       +
           fill="#FFFFFF"

     

       13
       13
       +
         />

     

       14
       14
       +
         <path

     

       15
       15
       +
           d="M72 33.6052L72.3097 35.5811C73.2828 35.4286 74 34.5903 74 33.6052H72ZM71 33.8446L70.382 31.9425L70.382 31.9425L71 33.8446ZM71 46.1554L70.382 48.0575H70.382L71 46.1554ZM72 46.3948H74C74 45.4097 73.2828 44.5714 72.3097 44.4189L72 46.3948ZM8 46.4726L8.00027 44.4726C7.46979 44.4725 6.96101 44.6832 6.58588 45.0583C6.21075 45.4333 6 45.9421 6 46.4726H8ZM10 46.1554L10.618 48.0575H10.618L10 46.1554ZM14.4721 40H12.4721H14.4721ZM10 33.8446L10.618 31.9425H10.618L10 33.8446ZM8 33.5274H6C6 34.0579 6.21075 34.5667 6.58588 34.9417C6.96101 35.3168 7.46979 35.5275 8.00027 35.5274L8 33.5274ZM12 18C8.68629 18 6 20.6863 6 24H10C10 22.8954 10.8954 22 12 22V18ZM68 18H12V22H68V18ZM74 24C74 20.6863 71.3137 18 68 18V22C69.1046 22 70 22.8954 70 24H74ZM74 33.6052V24H70V33.6052H74ZM71.6903 31.6294C71.2511 31.6982 70.8136 31.8023 70.382 31.9425L71.618 35.7467C71.8472 35.6723 72.0783 35.6174 72.3097 35.5811L71.6903 31.6294ZM70.382 31.9425C66.8913 33.0767 64.5279 36.3296 64.5279 40H68.5279C68.5279 38.0626 69.7754 36.3454 71.618 35.7467L70.382 31.9425ZM64.5279 40C64.5279 43.6704 66.8913 46.9233 70.382 48.0575L71.618 44.2533C69.7754 43.6546 68.5279 41.9374 68.5279 40H64.5279ZM70.382 48.0575C70.8136 48.1977 71.2511 48.3018 71.6903 48.3706L72.3097 44.4189C72.0783 44.3826 71.8472 44.3277 71.618 44.2533L70.382 48.0575ZM74 56V46.3948H70V56H74ZM68 62C71.3137 62 74 59.3137 74 56H70C70 57.1046 69.1046 58 68 58V62ZM12 62H68V58H12V62ZM6 56C6 59.3137 8.68629 62 12 62V58C10.8954 58 10 57.1046 10 56H6ZM6 46.4726V56H10V46.4726H6ZM9.38197 44.2533C8.92559 44.4015 8.46006 44.4726 8.00027 44.4726L7.99973 48.4726C8.87364 48.4727 9.7568 48.3373 10.618 48.0575L9.38197 44.2533ZM12.4721 40C12.4721 41.9374 11.2246 43.6545 9.38197 44.2533L10.618 48.0575C14.1087 46.9233 16.4721 43.6704 16.4721 40H12.4721ZM9.38197 35.7467C11.2246 36.3454 12.4721 38.0626 12.4721 40H16.4721C16.4721 36.3296 14.1087 33.0767 10.618 31.9425L9.38197 35.7467ZM8.00027 35.5274C8.46006 35.5274 8.92559 35.5985 9.38197 35.7467L10.618 31.9425C9.7568 31.6627 8.87364 31.5273 7.99973 31.5274L8.00027 35.5274ZM6 24V33.5274H10V24H6Z"

     

       16
       16
       +
           fill="#FFFFFF"

     

       17
       17
       +
         />

     

       18
       18
       +
       </svg>

+125 -116

static/styles.css

···

       2
       2
        
       @import url("https://fonts.googleapis.com/css2?family=Share+Tech+Mono&family=Space+Mono:ital,wght@0,400;0,700;1,400;1,700&display=swap");

     

       3
       3
        
       

     

       4
       4
        
       @font-face {

     

       5
       5
       -
           font-family: "Skyfont";

     

       6
       6
       -
           src: url("fonts/skyfont.regular.otf") format("opentype");

     

       7
       7
       -
           font-weight: normal;

     

       8
       8
       -
           font-style: normal;

     

       5
       5
       +
         font-family: "Skyfont";

     

       6
       6
       +
         src: url("fonts/skyfont.regular.otf") format("opentype");

     

       7
       7
       +
         font-weight: normal;

     

       8
       8
       +
         font-style: normal;

     

       9
       9
        
       }

     

       10
       10
        
       

     

       11
       11
        
       @font-face {

     

       12
       12
       -
           font-family: "F25_Bank_Printer";

     

       13
       13
       -
           src: url("fonts/F25_Bank_Printer.ttf") format("truetype");

     

       14
       14
       -
           font-weight: normal;

     

       15
       15
       -
           font-style: normal;

     

       12
       12
       +
         font-family: "F25_Bank_Printer";

     

       13
       13
       +
         src: url("fonts/F25_Bank_Printer.ttf") format("truetype");

     

       14
       14
       +
         font-weight: normal;

     

       15
       15
       +
         font-style: normal;

     

       16
       16
        
       }

     

       17
       17
        
       

     

       18
       18
        
       @tailwind base;

     
···

       20
       20
        
       @tailwind utilities;

     

       21
       21
        
       

     

       22
       22
        
       @keyframes fadeOut {

     

       23
       23
       -
           0% {

     

       24
       24
       -
               opacity: 1;

     

       25
       25
       -
           }

     

       26
       26
       -
           75% {

     

       27
       27
       -
               opacity: 1;

     

       28
       28
       -
           } /* Hold full opacity for most of the animation */

     

       29
       29
       -
           100% {

     

       30
       30
       -
               opacity: 0;

     

       31
       31
       -
           }

     

       23
       23
       +
         0% {

     

       24
       24
       +
           opacity: 1;

     

       25
       25
       +
         }

     

       26
       26
       +
         75% {

     

       27
       27
       +
           opacity: 1;

     

       28
       28
       +
         } /* Hold full opacity for most of the animation */

     

       29
       29
       +
         100% {

     

       30
       30
       +
           opacity: 0;

     

       31
       31
       +
         }

     

       32
       32
        
       }

     

       33
       33
        
       

     

       34
       34
        
       .status-message-fade {

     

       35
       35
       -
           animation: fadeOut 2s forwards;

     

       35
       35
       +
         animation: fadeOut 2s forwards;

     

       36
       36
        
       }

     

       37
       37
        
       

     

       38
       38
        
       .font-spectral {

     

       39
       39
       -
           font-family: "Spectral", serif;

     

       39
       39
       +
         font-family: "Spectral", serif;

     

       40
       40
        
       }

     

       41
       41
        
       

     

       42
       42
        
       .grow-wrap {

     

       43
       43
       -
           /* easy way to plop the elements on top of each other and have them both sized based on the tallest one's height */

     

       44
       44
       -
           display: grid;

     

       43
       43
       +
         /* easy way to plop the elements on top of each other and have them both sized based on the tallest one's height */

     

       44
       44
       +
         display: grid;

     

       45
       45
        
       }

     

       46
       46
        
       .grow-wrap::after {

     

       47
       47
       -
           /* Note the weird space! Needed to preventy jumpy behavior */

     

       48
       48
       -
           content: attr(data-replicated-value) " ";

     

       47
       47
       +
         /* Note the weird space! Needed to preventy jumpy behavior */

     

       48
       48
       +
         content: attr(data-replicated-value) " ";

     

       49
       49
        
       

     

       50
       50
       -
           /* This is how textarea text behaves */

     

       51
       51
       -
           white-space: pre-wrap;

     

       50
       50
       +
         /* This is how textarea text behaves */

     

       51
       51
       +
         white-space: pre-wrap;

     

       52
       52
        
       

     

       53
       53
       -
           /* Hidden from view, clicks, and screen readers */

     

       54
       54
       -
           visibility: hidden;

     

       53
       53
       +
         /* Hidden from view, clicks, and screen readers */

     

       54
       54
       +
         visibility: hidden;

     

       55
       55
        
       }

     

       56
       56
        
       .grow-wrap > textarea {

     

       57
       57
       -
           /* You could leave this, but after a user resizes, then it ruins the auto sizing */

     

       58
       58
       -
           resize: none;

     

       57
       57
       +
         /* You could leave this, but after a user resizes, then it ruins the auto sizing */

     

       58
       58
       +
         resize: none;

     

       59
       59
        
       

     

       60
       60
       -
           /* Firefox shows scrollbar on growth, you can hide like this. */

     

       61
       61
       -
           overflow: hidden;

     

       60
       60
       +
         /* Firefox shows scrollbar on growth, you can hide like this. */

     

       61
       61
       +
         overflow: hidden;

     

       62
       62
        
       }

     

       63
       63
        
       .grow-wrap > textarea,

     

       64
       64
        
       .grow-wrap::after {

     

       65
       65
       -
           /* Identical styling required!! */

     

       66
       66
       -
           font: inherit;

     

       65
       65
       +
         /* Identical styling required!! */

     

       66
       66
       +
         font: inherit;

     

       67
       67
        
       

     

       68
       68
       -
           /* Place on top of each other */

     

       69
       69
       -
           grid-area: 1 / 1 / 2 / 2;

     

       68
       68
       +
         /* Place on top of each other */

     

       69
       69
       +
         grid-area: 1 / 1 / 2 / 2;

     

       70
       70
        
       }

     

       71
       71
        
       

     

       72
       72
        
       /* Base styling */

     

       73
       73
        
       @layer base {

     

       74
       74
       -
           body {

     

       75
       75
       -
               @apply bg-gray-50 dark:bg-gray-900 text-gray-900 dark:text-gray-100;

     

       76
       76
       -
               font-family: Space Mono;

     

       77
       77
       -
           }

     

       78
       78
       -
           button {

     

       79
       79
       -
               @apply rounded-xl;

     

       80
       80
       -
           }

     

       74
       74
       +
         body {

     

       75
       75
       +
           @apply bg-gray-50 dark:bg-gray-900 text-gray-900 dark:text-gray-100;

     

       76
       76
       +
           font-family: Space Mono;

     

       77
       77
       +
         }

     

       78
       78
       +
         button {

     

       79
       79
       +
           @apply rounded-xl;

     

       80
       80
       +
         }

     

       81
       81
        
       

     

       82
       82
       -
           input {

     

       83
       83
       -
               @apply px-4 py-2;

     

       84
       84
       -
           }

     

       82
       82
       +
         input {

     

       83
       83
       +
           @apply px-4 py-2;

     

       84
       84
       +
         }

     

       85
       85
        
       

     

       86
       86
       -
           h1,

     

       87
       87
       -
           h2,

     

       88
       88
       -
           h3,

     

       89
       89
       -
           h4,

     

       90
       90
       -
           h5 {

     

       91
       91
       -
               font-family:

     

       92
       92
       -
                   Share Tech Mono,

     

       93
       93
       -
                   monospace;

     

       94
       94
       -
           }

     

       86
       86
       +
         h1,

     

       87
       87
       +
         h2,

     

       88
       88
       +
         h3,

     

       89
       89
       +
         h4,

     

       90
       90
       +
         h5 {

     

       91
       91
       +
           font-family: Share Tech Mono, monospace;

     

       92
       92
       +
         }

     

       95
       93
        
       }

     

       96
       94
        
       

     

       97
       95
        
       .ticket {

     

       98
       98
       -
           font-family: F25_Bank_Printer, monospace;

     

       99
       99
       -
           @apply bg-white dark:bg-gray-800 p-8 relative overflow-hidden;

     

       100
       100
       -
           position: relative;

     

       101
       101
       -
           /* Angled corners */

     

       102
       102
       -
           clip-path: polygon(

     

       103
       103
       -
               20px 0,

     

       104
       104
       -
               /* Top left corner */ calc(100% - 20px) 0,

     

       105
       105
       -
               /* Top right corner */ 100% 20px,

     

       106
       106
       -
               /* Top right */ 100% calc(100% - 20px),

     

       107
       107
       -
               /* Bottom right */ calc(100% - 20px) 100%,

     

       108
       108
       -
               /* Bottom right corner */ 20px 100%,

     

       109
       109
       -
               /* Bottom left corner */ 0 calc(100% - 20px),

     

       110
       110
       -
               /* Bottom left */ 0 20px /* Back to top left */

     

       111
       111
       -
           );

     

       96
       96
       +
         font-family: F25_Bank_Printer, monospace;

     

       97
       97
       +
         @apply bg-white dark:bg-gray-800 p-8 relative overflow-hidden;

     

       98
       98
       +
         position: relative;

     

       99
       99
       +
         /* Angled corners */

     

       100
       100
       +
         clip-path: polygon(

     

       101
       101
       +
           20px 0,

     

       102
       102
       +
           /* Top left corner */ calc(100% - 20px) 0,

     

       103
       103
       +
           /* Top right corner */ 100% 20px,

     

       104
       104
       +
           /* Top right */ 100% calc(100% - 20px),

     

       105
       105
       +
           /* Bottom right */ calc(100% - 20px) 100%,

     

       106
       106
       +
           /* Bottom right corner */ 20px 100%,

     

       107
       107
       +
           /* Bottom left corner */ 0 calc(100% - 20px),

     

       108
       108
       +
           /* Bottom left */ 0 20px /* Back to top left */

     

       109
       109
       +
         );

     

       112
       110
        
       }

     

       113
       111
        
       

     

       114
       112
        
       /* Create side perforations using pseudo-elements */

     

       115
       113
        
       .ticket::before,

     

       116
       114
        
       .ticket::after {

     

       117
       117
       -
           content: "";

     

       118
       118
       -
           position: absolute;

     

       119
       119
       -
           top: 30px;

     

       120
       120
       -
           bottom: 30px;

     

       121
       121
       -
           width: 1px;

     

       122
       122
       -
           background-image: linear-gradient(

     

       123
       123
       -
               to bottom,

     

       124
       124
       -
               transparent 0%,

     

       125
       125
       -
               transparent 40%,

     

       126
       126
       -
               currentColor 40%,

     

       127
       127
       -
               currentColor 60%,

     

       128
       128
       -
               transparent 60%,

     

       129
       129
       -
               transparent 100%

     

       130
       130
       -
           );

     

       131
       131
       -
           background-size: 100% 20px;

     

       132
       132
       -
           background-repeat: repeat-y;

     

       133
       133
       -
           opacity: 0.2;

     

       115
       115
       +
         content: "";

     

       116
       116
       +
         position: absolute;

     

       117
       117
       +
         top: 30px;

     

       118
       118
       +
         bottom: 30px;

     

       119
       119
       +
         width: 1px;

     

       120
       120
       +
         background-image: linear-gradient(

     

       121
       121
       +
           to bottom,

     

       122
       122
       +
           transparent 0%,

     

       123
       123
       +
           transparent 40%,

     

       124
       124
       +
           currentColor 40%,

     

       125
       125
       +
           currentColor 60%,

     

       126
       126
       +
           transparent 60%,

     

       127
       127
       +
           transparent 100%

     

       128
       128
       +
         );

     

       129
       129
       +
         background-size: 100% 20px;

     

       130
       130
       +
         background-repeat: repeat-y;

     

       131
       131
       +
         opacity: 0.2;

     

       134
       132
        
       }

     

       135
       133
        
       

     

       136
       134
        
       .ticket::before {

     

       137
       137
       -
           left: 8px;

     

       135
       135
       +
         left: 8px;

     

       138
       136
        
       }

     

       139
       137
        
       

     

       140
       138
        
       .ticket::after {

     

       141
       141
       -
           right: 8px;

     

       139
       139
       +
         right: 8px;

     

       142
       140
        
       }

     

       143
       141
        
       

     

       144
       142
        
       .dark .ticket {

     

       145
       145
       -
           background-image:

     

       146
       146
       -
               radial-gradient(

     

       147
       147
       -
                   circle at 10px center,

     

       148
       148
       -
                   rgb(17 24 39) 4px,

     

       149
       149
       -
                   transparent 4px

     

       150
       150
       -
               ),

     

       151
       151
       -
               radial-gradient(

     

       152
       152
       -
                   circle at calc(100% - 10px) center,

     

       153
       153
       -
                   rgb(17 24 39) 4px,

     

       154
       154
       -
                   transparent 4px

     

       155
       155
       -
               );

     

       143
       143
       +
         background-image:

     

       144
       144
       +
           radial-gradient(

     

       145
       145
       +
             circle at 10px center,

     

       146
       146
       +
             rgb(17 24 39) 4px,

     

       147
       147
       +
             transparent 4px

     

       148
       148
       +
           ),

     

       149
       149
       +
           radial-gradient(

     

       150
       150
       +
           circle at calc(100% - 10px) center,

     

       151
       151
       +
           rgb(17 24 39) 4px,

     

       152
       152
       +
           transparent 4px

     

       153
       153
       +
         );

     

       156
       154
        
       }

     

       157
       155
        
       

     

       158
       156
        
       /* Remove the previous background images and corner cuts */

     

       159
       157
        
       .ticket::before,

     

       160
       158
        
       .ticket::after {

     

       161
       161
       -
           display: none;

     

       159
       159
       +
         display: none;

     

       162
       160
        
       }

     

       163
       161
        
       

     

       164
       162
        
       .boarding-label {

     

       165
       165
       -
           @apply absolute top-2 right-2 bg-blue-100 dark:bg-blue-900 px-3 py-1 rounded-full text-xs font-bold uppercase tracking-wider;

     

       166
       166
       -
           transform: rotate(2deg);

     

       163
       163
       +
         @apply absolute top-2 right-2 bg-blue-100 dark:bg-blue-900 px-3 py-1

     

       164
       164
       +
           rounded-full text-xs font-bold uppercase tracking-wider;

     

       165
       165
       +
         transform: rotate(2deg);

     

       167
       166
        
       }

     

       168
       167
        
       

     

       169
       168
        
       .flight-info {

     

       170
       170
       -
           @apply flex justify-between items-center mt-4 pt-4 border-t border-dashed;

     

       169
       169
       +
         @apply flex justify-between items-center mt-4 pt-4 border-t border-dashed;

     

       171
       170
        
       }

     

       172
       171
        
       

     

       173
       172
        
       .passenger-info {

     

       174
       174
       -
           @apply text-sm text-gray-600 dark:text-gray-400 mt-2;

     

       173
       173
       +
         @apply text-sm text-gray-600 dark:text-gray-400 mt-2;

     

       175
       174
        
       }

     

       176
       175
        
       

     

       177
       176
        
       /* Modern Airport Sign Styles */

     

       178
       177
        
       .airport-sign {

     

       179
       179
       -
           position: relative;

     

       180
       180
       -
           transform-origin: top;

     

       181
       181
       -
           transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);

     

       182
       182
       -
           border-radius: 0.5rem;

     

       183
       183
       -
           backdrop-filter: blur(8px);

     

       178
       178
       +
         position: relative;

     

       179
       179
       +
         transform-origin: top;

     

       180
       180
       +
         transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);

     

       181
       181
       +
         border-radius: 0.5rem;

     

       182
       182
       +
         backdrop-filter: blur(8px);

     

       184
       183
        
       }

     

       185
       184
        
       

     

       186
       185
        
       /* Dropdown panel styles */

     

       187
       186
        
       .airport-sign + div {

     

       188
       188
       -
           border-radius: 0.5rem;

     

       189
       189
       -
           backdrop-filter: blur(8px);

     

       187
       187
       +
         border-radius: 0.5rem;

     

       188
       188
       +
         backdrop-filter: blur(8px);

     

       190
       189
        
       }

     

       191
       190
        
       

     

       192
       191
        
       /* Remove old texture styles */

     

       193
       192
        
       .airport-sign,

     

       194
       193
        
       .airport-sign + div {

     

       195
       195
       -
           background-blend-mode: overlay;

     

       194
       194
       +
         background-blend-mode: overlay;

     

       196
       195
        
       }

     

       197
       196
        
       

     

       198
       197
        
       @keyframes popin {

     

       199
       199
       -
         0% { opacity: 0; transform: scale(0.95); }

     

       200
       200
       -
         100% { opacity: 1; transform: scale(1); }

     

       198
       198
       +
         0% {

     

       199
       199
       +
           opacity: 0;

     

       200
       200
       +
           transform: scale(0.95);

     

       201
       201
       +
         }

     

       202
       202
       +
         100% {

     

       203
       203
       +
           opacity: 1;

     

       204
       204
       +
           transform: scale(1);

     

       205
       205
       +
         }

     

       201
       206
        
       }

     

       202
       207
        
       .animate-popin {

     

       203
       203
       -
         animation: popin 0.25s cubic-bezier(0.4,0,0.2,1);

     

       208
       208
       +
         animation: popin 0.25s cubic-bezier(0.4, 0, 0.2, 1);

     

       204
       209
        
       }

     

       205
       210
        
       @keyframes bounce-short {

     

       206
       206
       -
         0%, 100% { transform: translateY(0); }

     

       207
       207
       -
         50% { transform: translateY(-8px); }

     

       211
       211
       +
         0%, 100% {

     

       212
       212
       +
           transform: translateY(0);

     

       213
       213
       +
         }

     

       214
       214
       +
         50% {

     

       215
       215
       +
           transform: translateY(-8px);

     

       216
       216
       +
         }

     

       208
       217
        
       }

     

       209
       218
        
       .animate-bounce-short {

     

       210
       219
        
         animation: bounce-short 0.5s;

Compare changes