allow to switch the server

src/views/AccountViewView.vue

@@ -248,6 +248,40 @@
       </div>
     </div>
 
+    <div class="flex py-2">
+      Claim Server
+      <input
+        type="text"
+        class="block w-full rounded border border-slate-400 px-3 py-2"
+        v-model="apiServerInput"
+      />
+      <button
+        v-if="apiServerInput != apiServer"
+        class="px-4 rounded bg-slate-200 border border-slate-400"
+        @click="onClickSaveApiServer()"
+      >
+        <fa icon="floppy-disk" class="fa-fw"></fa>
+      </button>
+      <button
+        class="px-4 rounded bg-slate-200 border border-slate-400"
+        @click="setApiServerInput(Constants.PROD_ENDORSER_API_SERVER)"
+      >
+        Use Prod
+      </button>
+      <button
+        class="px-4 rounded bg-slate-200 border border-slate-400"
+        @click="setApiServerInput(Constants.TEST_ENDORSER_API_SERVER)"
+      >
+        Use Test
+      </button>
+      <button
+        class="px-4 rounded bg-slate-200 border border-slate-400"
+        @click="setApiServerInput(Constants.LOCAL_ENDORSER_API_SERVER)"
+      >
+        Use Local
+      </button>
+    </div>
+
     <div v-if="numAccounts > 0" class="flex py-2">
       Switch Account
       <span v-for="accountNum in numAccounts" :key="accountNum">
@@ -302,7 +336,11 @@ interface RateLimits {
 
 @Component
 export default class AccountViewView extends Vue {
+  Constants = AppString;
+
   activeDid = "";
+  apiServer = "";
+  apiServerInput = "";
   derivationPath = "";
   firstName = "";
   lastName = "";
@@ -345,6 +383,8 @@ export default class AccountViewView extends Vue {
       await db.open();
       const settings = await db.settings.get(MASTER_SETTINGS_KEY);
       this.activeDid = settings?.activeDid || "";
+      this.apiServer = settings?.apiServer || "";
+      this.apiServerInput = settings?.apiServer || "";
       this.firstName = settings?.firstName || "";
       this.lastName = settings?.lastName || "";
       this.showContactGives = !!settings?.showContactGivesInline;
@@ -433,8 +473,7 @@ export default class AccountViewView extends Vue {
   }
 
   async checkLimits() {
-    const endorserApiServer = AppString.DEFAULT_ENDORSER_API_SERVER;
-    const url = endorserApiServer + "/api/report/rateLimits";
+    const url = this.apiServer + "/api/report/rateLimits";
     await accountsDB.open();
     const accounts = await accountsDB.accounts.toArray();
     const account = R.find((acc) => acc.did === this.activeDid, accounts);
@@ -491,6 +530,18 @@ export default class AccountViewView extends Vue {
     };
   }
 
+  async onClickSaveApiServer() {
+    await db.open();
+    db.settings.update(MASTER_SETTINGS_KEY, {
+      apiServer: this.apiServerInput,
+    });
+    this.apiServer = this.apiServerInput;
+  }
+
+  setApiServerInput(value) {
+    this.apiServerInput = value;
+  }
+
   alertMessage = "";
   alertTitle = "";
   isAlertVisible = false;