fix: change and update trusted dapps (#533)

Signed-off-by: Urban Vidovič <urbanfoundit@gmail.com> Co-authored-by: Urban Vidovič <urbanfoundit@gmail.com>
blockchain-lab-um · Feb 13, 2024 · e8d8e5b · e8d8e5b
1 parent ad80cd1
commit e8d8e5b
Show file tree

Hide file tree

Showing 51 changed files with 473 additions and 406 deletions.
diff --git a/.changeset/chilled-pumas-play.md b/.changeset/chilled-pumas-play.md
@@ -0,0 +1,9 @@
+---
+'@blockchain-lab-um/masca-connector': patch
+'@blockchain-lab-um/masca-types': patch
+'@blockchain-lab-um/dapp': patch
+'@blockchain-lab-um/masca-docs': patch
+'@blockchain-lab-um/masca': patch
+---
+
+Changed and updated trusted dapps
diff --git a/packages/connector/src/snap.ts b/packages/connector/src/snap.ts
@@ -220,26 +220,33 @@ async function togglePopups(this: Masca): Promise<Result<boolean>> {
 }
 
 /**
- * Adds origin of the current dapp to the list of friendly dapps. This will disable popups from appearing while using the dapp.
+ * Adds origin of the current dapp to the list of trusted dapps. This will disable popups from appearing while using the dapp.
  *
  * @return Result<boolean> - true if the addition was successful
  */
-async function addFriendlyDapp(this: Masca): Promise<Result<boolean>> {
-  return sendSnapMethod(this, { method: 'addFriendlyDapp' }, this.snapId);
+async function addTrustedDapp(
+  this: Masca,
+  origin: string
+): Promise<Result<boolean>> {
+  return sendSnapMethod(
+    this,
+    { method: 'addTrustedDapp', params: { origin } },
+    this.snapId
+  );
 }
 
 /**
- * Removes origin of the current dapp from the list of friendly dapps. This will enable popups while using the dapp.
+ * Removes origin of the current dapp from the list of trusted dapps. This will enable popups while using the dapp.
  *
  * @return Result<boolean> - true if the removal was successful
  */
-async function removeFriendlyDapp(
+async function removeTrustedDapp(
   this: Masca,
-  id: string
+  origin: string
 ): Promise<Result<boolean>> {
   return sendSnapMethod(
     this,
-    { method: 'removeFriendlyDapp', params: { id } },
+    { method: 'removeTrustedDapp', params: { origin } },
     this.snapId
   );
 }
@@ -577,8 +584,8 @@ export class Masca {
     queryCredentials: wrapper(queryCredentials.bind(this)),
     createPresentation: wrapper(createPresentation.bind(this)),
     togglePopups: wrapper(togglePopups.bind(this)),
-    addFriendlyDapp: wrapper(addFriendlyDapp.bind(this)),
-    removeFriendlyDapp: wrapper(removeFriendlyDapp.bind(this)),
+    addTrustedDapp: wrapper(addTrustedDapp.bind(this)),
+    removeTrustedDapp: wrapper(removeTrustedDapp.bind(this)),
     getDID: wrapper(getDID.bind(this)),
     getSelectedMethod: wrapper(getSelectedMethod.bind(this)),
     getAvailableMethods: wrapper(getAvailableMethods.bind(this)),

diff --git a/packages/dapp/src/app/[locale]/app/(protected)/shared-presentations/sharedPresentations.tsx b/packages/dapp/src/app/[locale]/app/(protected)/shared-presentations/sharedPresentations.tsx
@@ -244,8 +244,8 @@ export const SharedPresentations = () => {
                   column.key === 'actions'
                     ? 'text-end'
                     : column.key === 'title'
-                      ? 'text-start'
-                      : 'text-center'
+                    ? 'text-start'
+                    : 'text-center'
                 )}
               >
                 {column.label}
@@ -265,8 +265,8 @@ export const SharedPresentations = () => {
                       columnKey === 'actions'
                         ? 'text-end'
                         : columnKey === 'title'
-                          ? 'text-start'
-                          : 'text-center'
+                        ? 'text-start'
+                        : 'text-center'
                     )}
                   >
                     {renderCell(item, columnKey)}

diff --git a/packages/dapp/src/app/[locale]/app/(public)/share-presentation/[id]/page.tsx b/packages/dapp/src/app/[locale]/app/(public)/share-presentation/[id]/page.tsx
@@ -1,4 +1,3 @@
-import { headers } from 'next/headers';
 import { notFound } from 'next/navigation';
 import { createClient } from '@supabase/supabase-js';
 import { VerifiablePresentation } from '@veramo/core';

diff --git a/packages/dapp/src/components/SettingsCard/AddFriendlydAppModal.tsx b/packages/dapp/src/components/SettingsCard/AddFriendlydAppModal.tsx
diff --git a/...onents/SettingsCard/FriendlydAppTable.tsx → ...ponents/SettingsCard/TrustedDappTable.tsx b/...onents/SettingsCard/FriendlydAppTable.tsx → ...ponents/SettingsCard/TrustedDappTable.tsx
@@ -4,23 +4,17 @@ import { TrashIcon } from '@heroicons/react/24/outline';
 import { useTranslations } from 'next-intl';
 
 import { useMascaStore, useToastStore } from '@/stores';
+import Button from '../Button';
+import InputField from '../InputField';
 
-export const FriendlydAppTable = () => {
-  const t = useTranslations('FriendlydAppTable');
+export const TrustedDappTable = () => {
+  const t = useTranslations('TrustedDappTable');
   const [settings, setSettings] = useState<MascaConfig>();
+  const [origin, setOrigin] = useState<string>(window.location.origin);
   const { api } = useMascaStore((state) => ({
     api: state.mascaApi,
   }));
 
-  const isMascaFriendlyDapp = (
-    friendlyDapps: string[] | undefined
-  ): boolean => {
-    if (friendlyDapps && friendlyDapps.includes('https://masca.io')) {
-      return true;
-    }
-    return false;
-  };
-
   const snapGetSettings = async () => {
     if (!api) return;
     const snapSettings = await api.getSnapSettings();
@@ -34,8 +28,8 @@ export const FriendlydAppTable = () => {
     snapGetSettings().catch((e) => console.log(e));
   }, []);
 
-  const addFriendlydApp = async () => {
-    if (!api) return;
+  const addTrustedDapp = async () => {
+    if (!api || !origin) return;
 
     setTimeout(() => {
       useToastStore.setState({
@@ -46,8 +40,7 @@ export const FriendlydAppTable = () => {
         link: null,
       });
     }, 200);
-
-    const res = await api.addFriendlyDapp();
+    const res = await api.addTrustedDapp(origin);
 
     if (res) {
       await snapGetSettings();
@@ -73,7 +66,7 @@ export const FriendlydAppTable = () => {
     }, 200);
   };
 
-  const removeFriendlydApp = async (dapp: string) => {
+  const removeTrustedDapp = async (dapp: string) => {
     if (!api) return;
 
     setTimeout(() => {
@@ -85,7 +78,7 @@ export const FriendlydAppTable = () => {
         link: null,
       });
     }, 200);
-    const res = await api.removeFriendlyDapp(dapp);
+    const res = await api.removeTrustedDapp(dapp);
     if (res) {
       await snapGetSettings();
       setTimeout(() => {
@@ -115,6 +108,13 @@ export const FriendlydAppTable = () => {
       <p className="text-md dark:text-navy-blue-400 text-gray-700">
         {t('popups-desc')}
       </p>
+      <div className="mt-4 flex w-1/2 gap-x-4">
+        <InputField value={origin} setValue={setOrigin} />
+        <Button variant="primary" size="xs" onClick={() => addTrustedDapp()}>
+          {t('add')}
+        </Button>
+      </div>
+
       <table className="dark:border-navy-blue-200 my-5 w-full border-2 border-gray-300">
         <thead>
           <tr className="text-md">
@@ -123,7 +123,7 @@ export const FriendlydAppTable = () => {
           </tr>
         </thead>
         <tbody>
-          {settings?.dApp.friendlyDapps.map((app, i) => (
+          {settings?.dApp.trustedDapps?.map((app, i) => (
             <tr
               className="dark:border-navy-blue-500 border-t-2 border-gray-200 text-sm"
               key={i}
@@ -132,7 +132,7 @@ export const FriendlydAppTable = () => {
               <td className="p-2 text-end">
                 <button
                   onClick={() => {
-                    removeFriendlydApp(app).catch((e) => console.log(e));
+                    removeTrustedDapp(app).catch((e) => console.log(e));
                   }}
                 >
                   <TrashIcon className="h-4 w-4" />
@@ -142,11 +142,6 @@ export const FriendlydAppTable = () => {
           ))}
         </tbody>
       </table>
-      {!isMascaFriendlyDapp(settings?.dApp.friendlyDapps) && (
-        <div className="dark:text-orange-accent-dark -mt-4 flex justify-end gap-x-2 text-sm text-pink-400">
-          <button onClick={() => addFriendlydApp()}>{t('add-masca')}</button>
-        </div>
-      )}
     </>
   );
 };
diff --git a/packages/dapp/src/components/SettingsCard/index.tsx b/packages/dapp/src/components/SettingsCard/index.tsx
@@ -11,8 +11,8 @@ import { useMascaStore, useToastStore } from '@/stores';
 import Button from '../Button';
 import InfoIcon from '../InfoIcon';
 import UploadButton from '../UploadButton';
-import { FriendlydAppTable } from './FriendlydAppTable';
 import GoogleBackupForm from './GoogleBackupForm';
+import { TrustedDappTable } from './TrustedDappTable';
 
 const SettingsCard = () => {
   const t = useTranslations('SettingsCard');
@@ -229,7 +229,7 @@ const SettingsCard = () => {
           {t('popups')}
         </div>
         <div className="mt-4">
-          <FriendlydAppTable />
+          <TrustedDappTable />
           <span className="dark:text-navy-blue-200 mt-12 flex justify-between text-gray-700">
             <div className="flex">
               <span className="mr-1 text-red-500">{t('disable-popups')}</span>

diff --git a/packages/dapp/src/messages/en.json b/packages/dapp/src/messages/en.json
@@ -350,16 +350,17 @@
     "expired-on": "Expired on",
     "polygon-unsupported": "Polygon ID VCs aren't supported yet. Please remove this credential to continue!"
   },
-  "FriendlydAppTable": {
-    "add-failed": "Failed to add Friendly dapp",
-    "add-masca": "Add Masca.io to Friendly dapps",
-    "added": "Friendly dapp added",
-    "adding": "Adding Friendly dapp",
+  "TrustedDappTable": {
+    "add-failed": "Failed to add trusted dapp",
+    "add-masca": "Add masca.io to trusted dapps",
+    "added": "Trusted dapp added",
+    "adding": "Adding trusted dapp",
     "app-url": "Application URL",
-    "popups-desc": "Disabling pop-ups is very dangerous. We recommend setting friendly dapps instead!",
-    "remove-failed": "Failed to remove Friendly dapp",
-    "removed": "Friendly dapp removed",
-    "removing": "Removing Friendly dapp"
+    "popups-desc": "Disabling pop-ups is very dangerous. We recommend setting trusted dapps instead!",
+    "remove-failed": "Failed to remove trusted dapp",
+    "removed": "Trusted dapp removed",
+    "removing": "Removing trusted dapp",
+    "add": "Add"
   },
   "GetCredential": {
     "handling": "Handling credential offer",
@@ -520,7 +521,7 @@
     "import-success": "Successfully imported backup",
     "not-implemented": "Not implemented yet",
     "popups": "Pop-ups",
-    "popups-desc": "Disabling pop-ups is very dangerous. We recommend setting friendly dapps instead!",
+    "popups-desc": "Disabling pop-ups is very dangerous. We recommend setting trusted dapps instead!",
     "title": "Settings",
     "unknown-error": "Unknown error",
     "wallet-error": "Failed to get wallet ID"