|
|
@ -246,22 +246,23 @@ |
|
|
|
<div v-if="comparison" class="space-y-6"> |
|
|
|
<!-- Summary Cards --> |
|
|
|
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-6 gap-6"> |
|
|
|
<!-- Accounts Summary (moved first) --> |
|
|
|
<div class="bg-white overflow-hidden shadow rounded-lg"> |
|
|
|
<div class="p-5"> |
|
|
|
<div class="flex items-center"> |
|
|
|
<div class="flex-shrink-0"> |
|
|
|
<IconRenderer |
|
|
|
icon-name="chart" |
|
|
|
svg-class="h-6 w-6 text-blue-600" |
|
|
|
icon-name="lock" |
|
|
|
svg-class="h-6 w-6 text-orange-600" |
|
|
|
/> |
|
|
|
</div> |
|
|
|
<div class="ml-5 w-0 flex-1"> |
|
|
|
<dl> |
|
|
|
<dt class="text-sm font-medium text-gray-500 truncate"> |
|
|
|
Dexie Contacts |
|
|
|
Dexie Accounts |
|
|
|
</dt> |
|
|
|
<dd class="text-lg font-medium text-gray-900"> |
|
|
|
{{ comparison.dexieContacts.length }} |
|
|
|
{{ comparison.dexieAccounts.length }} |
|
|
|
</dd> |
|
|
|
</dl> |
|
|
|
</div> |
|
|
@ -275,16 +276,16 @@ |
|
|
|
<div class="flex-shrink-0"> |
|
|
|
<IconRenderer |
|
|
|
icon-name="check" |
|
|
|
svg-class="h-6 w-6 text-green-600" |
|
|
|
svg-class="h-6 w-6 text-teal-600" |
|
|
|
/> |
|
|
|
</div> |
|
|
|
<div class="ml-5 w-0 flex-1"> |
|
|
|
<dl> |
|
|
|
<dt class="text-sm font-medium text-gray-500 truncate"> |
|
|
|
SQLite Contacts |
|
|
|
SQLite Accounts |
|
|
|
</dt> |
|
|
|
<dd class="text-lg font-medium text-gray-900"> |
|
|
|
{{ comparison.sqliteContacts.length }} |
|
|
|
{{ comparison.sqliteAccounts.length }} |
|
|
|
</dd> |
|
|
|
</dl> |
|
|
|
</div> |
|
|
@ -292,6 +293,7 @@ |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
<!-- Settings Summary (second) --> |
|
|
|
<div class="bg-white overflow-hidden shadow rounded-lg"> |
|
|
|
<div class="p-5"> |
|
|
|
<div class="flex items-center"> |
|
|
@ -338,22 +340,23 @@ |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
<!-- Contacts Summary (last) --> |
|
|
|
<div class="bg-white overflow-hidden shadow rounded-lg"> |
|
|
|
<div class="p-5"> |
|
|
|
<div class="flex items-center"> |
|
|
|
<div class="flex-shrink-0"> |
|
|
|
<IconRenderer |
|
|
|
icon-name="lock" |
|
|
|
svg-class="h-6 w-6 text-orange-600" |
|
|
|
icon-name="chart" |
|
|
|
svg-class="h-6 w-6 text-blue-600" |
|
|
|
/> |
|
|
|
</div> |
|
|
|
<div class="ml-5 w-0 flex-1"> |
|
|
|
<dl> |
|
|
|
<dt class="text-sm font-medium text-gray-500 truncate"> |
|
|
|
Dexie Accounts |
|
|
|
Dexie Contacts |
|
|
|
</dt> |
|
|
|
<dd class="text-lg font-medium text-gray-900"> |
|
|
|
{{ comparison.dexieAccounts.length }} |
|
|
|
{{ comparison.dexieContacts.length }} |
|
|
|
</dd> |
|
|
|
</dl> |
|
|
|
</div> |
|
|
@ -367,16 +370,16 @@ |
|
|
|
<div class="flex-shrink-0"> |
|
|
|
<IconRenderer |
|
|
|
icon-name="check" |
|
|
|
svg-class="h-6 w-6 text-teal-600" |
|
|
|
svg-class="h-6 w-6 text-green-600" |
|
|
|
/> |
|
|
|
</div> |
|
|
|
<div class="ml-5 w-0 flex-1"> |
|
|
|
<dl> |
|
|
|
<dt class="text-sm font-medium text-gray-500 truncate"> |
|
|
|
SQLite Accounts |
|
|
|
SQLite Contacts |
|
|
|
</dt> |
|
|
|
<dd class="text-lg font-medium text-gray-900"> |
|
|
|
{{ comparison.sqliteAccounts.length }} |
|
|
|
{{ comparison.sqliteContacts.length }} |
|
|
|
</dd> |
|
|
|
</dl> |
|
|
|
</div> |
|
|
@ -387,11 +390,11 @@ |
|
|
|
|
|
|
|
<!-- Differences Section --> |
|
|
|
<div class="grid grid-cols-1 lg:grid-cols-3 gap-6"> |
|
|
|
<!-- Contacts Differences --> |
|
|
|
<!-- Account Differences (moved first) --> |
|
|
|
<div class="bg-white shadow rounded-lg"> |
|
|
|
<div class="px-4 py-5 sm:p-6"> |
|
|
|
<h3 class="text-lg leading-6 font-medium text-gray-900 mb-4"> |
|
|
|
Contact Differences |
|
|
|
Account Differences |
|
|
|
</h3> |
|
|
|
|
|
|
|
<div class="space-y-4"> |
|
|
@ -406,7 +409,7 @@ |
|
|
|
<span class="text-sm font-medium text-blue-900">Added</span> |
|
|
|
</div> |
|
|
|
<span class="text-sm font-bold text-blue-900">{{ |
|
|
|
comparison.differences.contacts.added.length |
|
|
|
comparison.differences.accounts.added.length |
|
|
|
}}</span> |
|
|
|
</div> |
|
|
|
|
|
|
@ -423,7 +426,7 @@ |
|
|
|
> |
|
|
|
</div> |
|
|
|
<span class="text-sm font-bold text-yellow-900">{{ |
|
|
|
comparison.differences.contacts.modified.length |
|
|
|
comparison.differences.accounts.modified.length |
|
|
|
}}</span> |
|
|
|
</div> |
|
|
|
|
|
|
@ -440,77 +443,83 @@ |
|
|
|
> |
|
|
|
</div> |
|
|
|
<span class="text-sm font-bold text-red-900">{{ |
|
|
|
comparison.differences.contacts.missing.length |
|
|
|
comparison.differences.accounts.missing.length |
|
|
|
}}</span> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
<!-- Contact Details --> |
|
|
|
<!-- Account Details --> |
|
|
|
<div |
|
|
|
v-if="comparison.differences.contacts.added.length > 0" |
|
|
|
v-if="comparison.differences.accounts.added.length > 0" |
|
|
|
class="mt-4" |
|
|
|
> |
|
|
|
<h4 class="text-sm font-medium text-gray-900 mb-2"> |
|
|
|
Added Contacts ({{ comparison.differences.contacts.added.length }}): |
|
|
|
Added Accounts ({{ comparison.differences.accounts.added.length }}): |
|
|
|
</h4> |
|
|
|
<div class="space-y-1"> |
|
|
|
<div |
|
|
|
v-for="contact in comparison.differences.contacts.added" |
|
|
|
:key="contact.did" |
|
|
|
v-for="account in comparison.differences.accounts.added" |
|
|
|
:key="account.id" |
|
|
|
class="text-xs text-gray-600 bg-gray-50 p-2 rounded" |
|
|
|
> |
|
|
|
<div class="font-medium">{{ contact.name || '<empty>' }}</div> |
|
|
|
<div class="text-gray-500">{{ contact.did }}</div> |
|
|
|
<div class="text-gray-400">{{ contact.contactMethods?.length || 0 }} contact methods</div> |
|
|
|
<div class="font-medium">ID: {{ account.id }}</div> |
|
|
|
<div class="text-gray-500">{{ account.did }}</div> |
|
|
|
<div class="text-gray-400">Created: {{ account.dateCreated }}</div> |
|
|
|
<div class="text-gray-400">Has Identity: {{ getAccountHasIdentity(account) ? 'Yes' : 'No' }}</div> |
|
|
|
<div class="text-gray-400">Has Mnemonic: {{ getAccountHasMnemonic(account) ? 'Yes' : 'No' }}</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
<!-- Modified Contacts --> |
|
|
|
<!-- Modified Accounts --> |
|
|
|
<div |
|
|
|
v-if="comparison.differences.contacts.modified.length > 0" |
|
|
|
v-if="comparison.differences.accounts.modified.length > 0" |
|
|
|
class="mt-4" |
|
|
|
> |
|
|
|
<h4 class="text-sm font-medium text-gray-900 mb-2"> |
|
|
|
Modified Contacts ({{ comparison.differences.contacts.modified.length }}): |
|
|
|
Modified Accounts ({{ comparison.differences.accounts.modified.length }}): |
|
|
|
</h4> |
|
|
|
<div class="space-y-1"> |
|
|
|
<div |
|
|
|
v-for="contact in comparison.differences.contacts.modified" |
|
|
|
:key="contact.did" |
|
|
|
v-for="account in comparison.differences.accounts.modified" |
|
|
|
:key="account.id" |
|
|
|
class="text-xs text-gray-600 bg-gray-50 p-2 rounded" |
|
|
|
> |
|
|
|
<div class="font-medium">{{ contact.name || '<empty>' }}</div> |
|
|
|
<div class="text-gray-500">{{ contact.did }}</div> |
|
|
|
<div class="text-gray-400">{{ contact.contactMethods?.length || 0 }} contact methods</div> |
|
|
|
<div class="font-medium">ID: {{ account.id }}</div> |
|
|
|
<div class="text-gray-500">{{ account.did }}</div> |
|
|
|
<div class="text-gray-400">Created: {{ account.dateCreated }}</div> |
|
|
|
<div class="text-gray-400">Has Identity: {{ getAccountHasIdentity(account) ? 'Yes' : 'No' }}</div> |
|
|
|
<div class="text-gray-400">Has Mnemonic: {{ getAccountHasMnemonic(account) ? 'Yes' : 'No' }}</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
<!-- Missing Contacts --> |
|
|
|
<!-- Missing Accounts --> |
|
|
|
<div |
|
|
|
v-if="comparison.differences.contacts.missing.filter(c => c.did).length > 0" |
|
|
|
v-if="comparison.differences.accounts.missing.filter(a => a.did).length > 0" |
|
|
|
class="mt-4" |
|
|
|
> |
|
|
|
<h4 class="text-sm font-medium text-gray-900 mb-2"> |
|
|
|
Missing Contacts ({{ comparison.differences.contacts.missing.filter(c => c.did).length }}): |
|
|
|
Missing Accounts ({{ comparison.differences.accounts.missing.filter(a => a.did).length }}): |
|
|
|
</h4> |
|
|
|
<div class="space-y-1"> |
|
|
|
<div |
|
|
|
v-for="contact in comparison.differences.contacts.missing.filter(c => c.did)" |
|
|
|
:key="contact.did" |
|
|
|
v-for="account in comparison.differences.accounts.missing.filter(a => a.did)" |
|
|
|
:key="account.id" |
|
|
|
class="text-xs text-gray-600 bg-gray-50 p-2 rounded" |
|
|
|
> |
|
|
|
<div class="font-medium">{{ contact.name || '<empty>' }}</div> |
|
|
|
<div class="text-gray-500">{{ contact.did }}</div> |
|
|
|
<div class="text-gray-400">{{ contact.contactMethods?.length || 0 }} contact methods</div> |
|
|
|
<div class="font-medium">ID: {{ account.id }}</div> |
|
|
|
<div class="text-gray-500">{{ account.did }}</div> |
|
|
|
<div class="text-gray-400">Created: {{ account.dateCreated }}</div> |
|
|
|
<div class="text-gray-400">Has Identity: {{ getAccountHasIdentity(account) ? 'Yes' : 'No' }}</div> |
|
|
|
<div class="text-gray-400">Has Mnemonic: {{ getAccountHasMnemonic(account) ? 'Yes' : 'No' }}</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
<!-- Settings Differences --> |
|
|
|
<!-- Settings Differences (second) --> |
|
|
|
<div class="bg-white shadow rounded-lg"> |
|
|
|
<div class="px-4 py-5 sm:p-6"> |
|
|
|
<h3 class="text-lg leading-6 font-medium text-gray-900 mb-4"> |
|
|
@ -633,11 +642,11 @@ |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
<!-- Account Differences --> |
|
|
|
<!-- Contacts Differences (last) --> |
|
|
|
<div class="bg-white shadow rounded-lg"> |
|
|
|
<div class="px-4 py-5 sm:p-6"> |
|
|
|
<h3 class="text-lg leading-6 font-medium text-gray-900 mb-4"> |
|
|
|
Account Differences |
|
|
|
Contact Differences |
|
|
|
</h3> |
|
|
|
|
|
|
|
<div class="space-y-4"> |
|
|
@ -652,7 +661,7 @@ |
|
|
|
<span class="text-sm font-medium text-blue-900">Added</span> |
|
|
|
</div> |
|
|
|
<span class="text-sm font-bold text-blue-900">{{ |
|
|
|
comparison.differences.accounts.added.length |
|
|
|
comparison.differences.contacts.added.length |
|
|
|
}}</span> |
|
|
|
</div> |
|
|
|
|
|
|
@ -669,7 +678,7 @@ |
|
|
|
> |
|
|
|
</div> |
|
|
|
<span class="text-sm font-bold text-yellow-900">{{ |
|
|
|
comparison.differences.accounts.modified.length |
|
|
|
comparison.differences.contacts.modified.length |
|
|
|
}}</span> |
|
|
|
</div> |
|
|
|
|
|
|
@ -686,76 +695,70 @@ |
|
|
|
> |
|
|
|
</div> |
|
|
|
<span class="text-sm font-bold text-red-900">{{ |
|
|
|
comparison.differences.accounts.missing.length |
|
|
|
comparison.differences.contacts.missing.length |
|
|
|
}}</span> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
<!-- Account Details --> |
|
|
|
<!-- Contact Details --> |
|
|
|
<div |
|
|
|
v-if="comparison.differences.accounts.added.length > 0" |
|
|
|
v-if="comparison.differences.contacts.added.length > 0" |
|
|
|
class="mt-4" |
|
|
|
> |
|
|
|
<h4 class="text-sm font-medium text-gray-900 mb-2"> |
|
|
|
Added Accounts ({{ comparison.differences.accounts.added.length }}): |
|
|
|
Added Contacts ({{ comparison.differences.contacts.added.length }}): |
|
|
|
</h4> |
|
|
|
<div class="space-y-1"> |
|
|
|
<div |
|
|
|
v-for="account in comparison.differences.accounts.added" |
|
|
|
:key="account.id" |
|
|
|
v-for="contact in comparison.differences.contacts.added" |
|
|
|
:key="contact.did" |
|
|
|
class="text-xs text-gray-600 bg-gray-50 p-2 rounded" |
|
|
|
> |
|
|
|
<div class="font-medium">ID: {{ account.id }}</div> |
|
|
|
<div class="text-gray-500">{{ account.did }}</div> |
|
|
|
<div class="text-gray-400">Created: {{ account.dateCreated }}</div> |
|
|
|
<div class="text-gray-400">Has Identity: {{ getAccountHasIdentity(account) ? 'Yes' : 'No' }}</div> |
|
|
|
<div class="text-gray-400">Has Mnemonic: {{ getAccountHasMnemonic(account) ? 'Yes' : 'No' }}</div> |
|
|
|
<div class="font-medium">{{ contact.name || '<empty>' }}</div> |
|
|
|
<div class="text-gray-500">{{ contact.did }}</div> |
|
|
|
<div class="text-gray-400">{{ contact.contactMethods?.length || 0 }} contact methods</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
<!-- Modified Accounts --> |
|
|
|
<!-- Modified Contacts --> |
|
|
|
<div |
|
|
|
v-if="comparison.differences.accounts.modified.length > 0" |
|
|
|
v-if="comparison.differences.contacts.modified.length > 0" |
|
|
|
class="mt-4" |
|
|
|
> |
|
|
|
<h4 class="text-sm font-medium text-gray-900 mb-2"> |
|
|
|
Modified Accounts ({{ comparison.differences.accounts.modified.length }}): |
|
|
|
Modified Contacts ({{ comparison.differences.contacts.modified.length }}): |
|
|
|
</h4> |
|
|
|
<div class="space-y-1"> |
|
|
|
<div |
|
|
|
v-for="account in comparison.differences.accounts.modified" |
|
|
|
:key="account.id" |
|
|
|
v-for="contact in comparison.differences.contacts.modified" |
|
|
|
:key="contact.did" |
|
|
|
class="text-xs text-gray-600 bg-gray-50 p-2 rounded" |
|
|
|
> |
|
|
|
<div class="font-medium">ID: {{ account.id }}</div> |
|
|
|
<div class="text-gray-500">{{ account.did }}</div> |
|
|
|
<div class="text-gray-400">Created: {{ account.dateCreated }}</div> |
|
|
|
<div class="text-gray-400">Has Identity: {{ getAccountHasIdentity(account) ? 'Yes' : 'No' }}</div> |
|
|
|
<div class="text-gray-400">Has Mnemonic: {{ getAccountHasMnemonic(account) ? 'Yes' : 'No' }}</div> |
|
|
|
<div class="font-medium">{{ contact.name || '<empty>' }}</div> |
|
|
|
<div class="text-gray-500">{{ contact.did }}</div> |
|
|
|
<div class="text-gray-400">{{ contact.contactMethods?.length || 0 }} contact methods</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
<!-- Missing Accounts --> |
|
|
|
<!-- Missing Contacts --> |
|
|
|
<div |
|
|
|
v-if="comparison.differences.accounts.missing.filter(a => a.did).length > 0" |
|
|
|
v-if="comparison.differences.contacts.missing.filter(c => c.did).length > 0" |
|
|
|
class="mt-4" |
|
|
|
> |
|
|
|
<h4 class="text-sm font-medium text-gray-900 mb-2"> |
|
|
|
Missing Accounts ({{ comparison.differences.accounts.missing.filter(a => a.did).length }}): |
|
|
|
Missing Contacts ({{ comparison.differences.contacts.missing.filter(c => c.did).length }}): |
|
|
|
</h4> |
|
|
|
<div class="space-y-1"> |
|
|
|
<div |
|
|
|
v-for="account in comparison.differences.accounts.missing.filter(a => a.did)" |
|
|
|
:key="account.id" |
|
|
|
v-for="contact in comparison.differences.contacts.missing.filter(c => c.did)" |
|
|
|
:key="contact.did" |
|
|
|
class="text-xs text-gray-600 bg-gray-50 p-2 rounded" |
|
|
|
> |
|
|
|
<div class="font-medium">ID: {{ account.id }}</div> |
|
|
|
<div class="text-gray-500">{{ account.did }}</div> |
|
|
|
<div class="text-gray-400">Created: {{ account.dateCreated }}</div> |
|
|
|
<div class="text-gray-400">Has Identity: {{ getAccountHasIdentity(account) ? 'Yes' : 'No' }}</div> |
|
|
|
<div class="text-gray-400">Has Mnemonic: {{ getAccountHasMnemonic(account) ? 'Yes' : 'No' }}</div> |
|
|
|
<div class="font-medium">{{ contact.name || '<empty>' }}</div> |
|
|
|
<div class="text-gray-500">{{ contact.did }}</div> |
|
|
|
<div class="text-gray-400">{{ contact.contactMethods?.length || 0 }} contact methods</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|