···
import {Migrator} from '@pds-moover/moover';
import SignThePapers from './SignThePapers.svelte';
8
+
let {data} = $props();
10
+
let selectedPds = $derived(data.pdsOptions);
11
+
let cleanSelectedPds = $derived(selectedPds?.did.replace('did:web:', ''));
12
+
//Kept as a "global" state to handle logic of passing the full handle that is used to SignThePapers
13
+
let newHandle = $state('');
15
+
let selectedDomain = $state(data.intinalDomain);
17
+
let handlePlaceHolder = $derived(
18
+
selectedPds ? `username${selectedDomain === 'custom' ? '' : `${selectedPds?.availableUserDomains[0]}`} or mydomain.com` : 'username.newpds.com or mycooldomain.com')
22
+
if (!selectedPds) return;
24
+
if (selectedDomain == 'custom') return;
27
+
if (formData.newHandle.includes('.')) {
28
+
// When a period is typed, force custom domain selection
29
+
selectedDomain = 'custom';
31
+
// If user clears the dot and we have provider domains, fall back to first option
32
+
if ((selectedPds?.availableUserDomains?.length ?? 0) > 0 && selectedDomain === 'custom') {
33
+
selectedDomain = selectedPds!.availableUserDomains[0]!
···
47
+
// Acceptance of provider policies (when required by selected PDS)
48
+
acceptPolicies: false,
···
let errorMessage: null | string = $state(null);
let statusMessage: null | string = $state(null);
70
+
// Links that may require acceptance prior to migration from the selected PDS
71
+
const privacyUrl = $derived(selectedPds?.links?.privacyPolicy);
72
+
const tosUrl = $derived(selectedPds?.links?.termsOfService);
73
+
const requiresAccept = $derived(!!(privacyUrl || tosUrl));
const updateStatusHandler = (status: string) => {
···
91
+
// If the selected PDS provides policy or privacy links, require explicit acceptance
92
+
if (requiresAccept && !formData.acceptPolicies) {
93
+
errorMessage = 'Please review and accept the providers policies';
94
+
disableSubmit = false;
97
+
newHandle = formData.newHandle;
99
+
//Not happy about this unwrap, but it should always have a value on a legit PDS that I know of
101
+
formData.newPds = `https://${cleanSelectedPds!}`;
102
+
// Combine username and selected domain for the new handle
103
+
if (selectedDomain !== 'custom') {
104
+
newHandle = formData.newHandle + selectedDomain;
if (showTwoFactorCodeInput) {
···
migrator.migratePrefs = formData.migratePrefs;
migrator.migratePlcRecord = formData.migratePlcRecord;
72
-
console.log(migrator);
126
+
console.log(formData.newPds, newHandle);
updateStatusHandler('Starting migration...');
showStatusMessage = true;
···
···
<!-- Second section: New account details -->
147
-
<h2>Setup for the new PDS</h2>
148
-
<div class="form-group">
149
-
<label for="new-pds">New PDS (URL):</label>
150
-
<input type="url" id="new-pds" name="newPds" placeholder="https://coolnewpds.com"
151
-
required bind:value={formData.newPds}>
201
+
<h2>{selectedPds ? `Setup for ${cleanSelectedPds}` : 'Setup for the new PDS'}</h2>
203
+
<div class="form-group">
204
+
<label for="new-pds">New PDS (URL):</label>
205
+
<input type="url" id="new-pds" name="newPds" placeholder="https://coolnewpds.com"
206
+
required bind:value={formData.newPds}>
<label for="new-email">New Email:</label>
156
-
<input type="email" id="new-email" name="newEmail" placeholder="CanBeSameEmailAsTheOldPds@email.com"
212
+
<input type="email" id="new-email" name="newEmail"
213
+
placeholder="CanBeSameEmailAsTheOldPds@email.com"
required bind:value={formData.newEmail}>
<label for="new-handle">New Handle:</label>
162
-
<input type="text" id="new-handle" name="newHandle"
163
-
placeholder="username.newpds.com or mycooldomain.com" required
164
-
bind:value={formData.newHandle}>
220
+
<div class={selectedPds ? 'input-group' : ''}>
221
+
<input type="text" id="new-handle" name="newHandle"
222
+
placeholder="{handlePlaceHolder}"
224
+
bind:value={formData.newHandle}>
167
-
<div class="form-group">
168
-
<label for="invite-code">Invite Code:</label>
169
-
<input type="text" id="invite-code" name="inviteCode"
170
-
placeholder="Invite code from your new PDS (Leave blank if you don't have one)"
171
-
bind:value={formData.inviteCode}>
227
+
<select bind:value={selectedDomain} class="domain-select">
228
+
{#each selectedPds?.availableUserDomains as domain (domain)}
229
+
<option value={domain}>{domain}</option>
231
+
<option value="custom">I have my own domain setup</option>
238
+
{#if !selectedPds || selectedPds.inviteCodeRequired !== false}
239
+
<div class="form-group">
240
+
<label for="invite-code">Invite Code:</label>
241
+
<input type="text" id="invite-code" name="inviteCode"
242
+
placeholder="Invite code from your new PDS (Leave blank if you don't have one)"
243
+
bind:value={formData.inviteCode}>
<button type="button" onclick={() => showAdvance = !showAdvance} id="advance" name="advance">Advance
···
304
+
{#if requiresAccept}
305
+
<div class="section" style="text-align: left">
306
+
<h3>Provider policies</h3>
308
+
To migrate to {cleanSelectedPds}, you must review and accept:
312
+
<li><a href={privacyUrl} target="_blank" rel="noopener noreferrer">Privacy
316
+
<li><a href={tosUrl} target="_blank" rel="noopener noreferrer">Terms of Service</a></li>
319
+
<div class="form-group">
320
+
<label for="accept-policies" class="moove-checkbox-label">
321
+
<input bind:checked={formData.acceptPolicies} type="checkbox" id="accept-policies"
322
+
name="acceptPolicies" required>
324
+
I have read and accept
<p style="text-align: left">There are some risks that come with doing an account migration.
<a href="https://github.com/bluesky-social/pds/blob/main/ACCOUNT_MIGRATION.md#%EF%B8%8F-warning-%EF%B8%8F-%EF%B8%8F">here</a>)
···
260
-
<button disabled={disableSubmit} type="submit">MOOve</button>
361
+
<button disabled={disableSubmit}
362
+
type="submit">{selectedPds ? `MOOve to ${cleanSelectedPds}` : 'MOOve'}</button>
265
-
<SignThePapers migrator={migrator} newHandle={formData.newHandle}/>
367
+
<SignThePapers migrator={migrator} newHandle={newHandle}/>