diff --git a/src/lib/Server.js b/src/lib/Server.js
index f8f380bd..4cfe0b41 100644
--- a/src/lib/Server.js
+++ b/src/lib/Server.js
@@ -109,8 +109,14 @@ module.exports = class Server {
         res.send(config);
       }))
       .post('/api/wireguard/client', Util.promisify(async req => {
-        const { name } = req.body;
-        return WireGuard.createClient({ name });
+        const { name , storeId } = req.body;
+        if (name === undefined) {
+          throw new ServerError('Missing: Name', 400);
+        }
+        if (storeId === undefined) {
+          throw new ServerError('Missing: StoreId', 400);
+        }
+        return WireGuard.createClient({ name , storeId});
       }))
       .delete('/api/wireguard/client/:clientId', Util.promisify(async req => {
         const { clientId } = req.params;
diff --git a/src/lib/WireGuard.js b/src/lib/WireGuard.js
index 237496d5..e68b7f98 100644
--- a/src/lib/WireGuard.js
+++ b/src/lib/WireGuard.js
@@ -224,7 +224,7 @@ Endpoint = ${localIP}:${WG_PORT}`;
     });
   }
 
-  async createClient({ name }) {
+  async createClient({ name , storeId }) {
     if (!name) {
       throw new Error('Missing: Name');
     }
@@ -275,11 +275,11 @@ Endpoint = ${localIP}:${WG_PORT}`;
     const clientId = uuid.v4();
     const client = {
       name,
+      storeId,
       address,
       privateKey,
       publicKey,
       // preSharedKey, //unclear generation of preSharedKey
-
       createdAt: new Date(),
       updatedAt: new Date(),
 
diff --git a/src/www/index.html b/src/www/index.html
index 6bd21d95..98befb20 100644
--- a/src/www/index.html
+++ b/src/www/index.html
@@ -60,7 +60,7 @@
               <p class="text-2xl font-medium">Clients</p>
             </div>
             <div class="flex-shrink-0">
-              <button @click="clientCreate = true; clientCreateName = '';"
+              <button @click="clientCreate = true; clientCreateName = ''; clientCreateStoreId = '';"
                 class="hover:bg-red-800 hover:border-red-800 hover:text-white text-gray-700 border-2 border-gray-100 py-2 px-4 rounded inline-flex items-center transition">
                 <svg class="w-4 mr-2" inline xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
                   stroke="currentColor">
@@ -281,7 +281,7 @@
             </div>
             <div v-if="clients && clients.length === 0">
               <p class="text-center m-10 text-gray-400 text-sm">There are no clients yet.<br /><br />
-                <button @click="clientCreate = true; clientCreateName = '';"
+                <button @click="clientCreate = true; clientCreateName = ''; clientCreateStoreId = '';"
                   class="bg-red-800 text-white hover:bg-red-700 border-2 border-none py-2 px-4 rounded inline-flex items-center transition">
                   <svg class="w-4 mr-2" inline xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
                     stroke="currentColor">
@@ -368,14 +368,17 @@
                     <div class="mt-2">
                       <p class="text-sm text-gray-500">
                         <input class="rounded p-2 border-2 border-gray-100 focus:border-gray-200 outline-none w-full"
-                          type="text" v-model.trim="clientCreateName" placeholder="Name" />
+                          type="text" v-model.trim="clientCreateName" placeholder="Name"/>
+
+                        <input class="rounded p-2 border-2 border-gray-100 focus:border-gray-200 outline-none w-full"
+                          type="text" v-model.trim="clientCreateStoreId" placeholder="Store Id" style="margin-top: 5%;"/>
                       </p>
                     </div>
                   </div>
                 </div>
               </div>
               <div class="bg-gray-50 px-4 py-3 sm:px-6 sm:flex sm:flex-row-reverse">
-                <button v-if="clientCreateName.length" type="button" @click="createClient(); clientCreate = null"
+                <button v-if="clientCreateName.length && clientCreateStoreId.length" type="button" @click="createClient(); clientCreate = null"
                   class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-red-800 text-base font-medium text-white hover:bg-red-700 focus:outline-none sm:ml-3 sm:w-auto sm:text-sm">
                   Create
                 </button>
diff --git a/src/www/js/api.js b/src/www/js/api.js
index 84885f17..3ea07715 100644
--- a/src/www/js/api.js
+++ b/src/www/js/api.js
@@ -72,11 +72,11 @@ class API {
     })));
   }
 
-  async createClient({ name }) {
+  async createClient({ name , storeId}) {
     return this.call({
       method: 'post',
       path: '/wireguard/client',
-      body: { name },
+      body: { name , storeId },
     });
   }
 
diff --git a/src/www/js/app.js b/src/www/js/app.js
index e22cbfe0..702584be 100644
--- a/src/www/js/app.js
+++ b/src/www/js/app.js
@@ -36,6 +36,7 @@ new Vue({
     clientDelete: null,
     clientCreate: null,
     clientCreateName: '',
+    clientCreateStoreId: '',
     clientEditName: null,
     clientEditNameId: null,
     clientEditAddress: null,
@@ -208,9 +209,11 @@ new Vue({
     },
     createClient() {
       const name = this.clientCreateName;
+      const storeId = this.clientCreateStoreId;
       if (!name) return;
+      if (!storeId) return;
 
-      this.api.createClient({ name })
+      this.api.createClient({ name , storeId })
         .catch(err => alert(err.message || err.toString()))
         .finally(() => this.refresh().catch(console.error));
     },