diff --git a/public/mix-manifest.json b/public/mix-manifest.json
index 532eb6a3..1f239cbd 100644
--- a/public/mix-manifest.json
+++ b/public/mix-manifest.json
@@ -38,8 +38,8 @@
     "/chunks/files~chunks/platform~chunks/shared~chunks/shared-files~chunks/shared/file-browser.js": "/chunks/files~chunks/platform~chunks/shared~chunks/shared-files~chunks/shared/file-browser.js?id=4231d578d933b87cf7a2",
     "/chunks/files~chunks/platform~chunks/shared~chunks/shared-files~chunks/shared/file-browser~chunks/sha~8510f6c9.js": "/chunks/files~chunks/platform~chunks/shared~chunks/shared-files~chunks/shared/file-browser~chunks/sha~8510f6c9.js?id=b4ccb4a816e5c72a0b85",
     "/chunks/files~chunks/settings-subscription~chunks/shared-files~chunks/shared/file-browser~chunks/user~9058a49f.js": "/chunks/files~chunks/settings-subscription~chunks/shared-files~chunks/shared/file-browser~chunks/user~9058a49f.js?id=31a17ad1d2536342abbe",
-    "/chunks/files~chunks/shared-files~chunks/shared/file-browser.js": "/chunks/files~chunks/shared-files~chunks/shared/file-browser.js?id=1124ccfaa19f766f7eab",
-    "/chunks/files~chunks/shared-files~chunks/shared/file-browser~chunks/shared/single-file.js": "/chunks/files~chunks/shared-files~chunks/shared/file-browser~chunks/shared/single-file.js?id=7b28213601852c696f82",
+    "/chunks/files~chunks/shared-files~chunks/shared/file-browser.js": "/chunks/files~chunks/shared-files~chunks/shared/file-browser.js?id=3e4185912c6d380f0906",
+    "/chunks/files~chunks/shared-files~chunks/shared/file-browser~chunks/shared/single-file.js": "/chunks/files~chunks/shared-files~chunks/shared/file-browser~chunks/shared/single-file.js?id=06665bebae33953fed87",
     "/chunks/files~chunks/shared/file-browser.js": "/chunks/files~chunks/shared/file-browser.js?id=44899a3c3880630dbcd9",
     "/chunks/forgotten-password.js": "/chunks/forgotten-password.js?id=877a9289b77ac3885042",
     "/chunks/homepage.js": "/chunks/homepage.js?id=1a86b7f0efa95ad65c4a",
@@ -55,7 +55,7 @@
     "/chunks/plan-subscribers.js": "/chunks/plan-subscribers.js?id=08e2056bc3744b2ea8f9",
     "/chunks/plans.js": "/chunks/plans.js?id=5e1c668e35d2f04973b7",
     "/chunks/platform.js": "/chunks/platform.js?id=f463eed74ce0e6852b6d",
-    "/chunks/platform~chunks/shared.js": "/chunks/platform~chunks/shared.js?id=5cbf6f86ac97a0cf5aa3",
+    "/chunks/platform~chunks/shared.js": "/chunks/platform~chunks/shared.js?id=ec633fb6ff41c34084c8",
     "/chunks/profile.js": "/chunks/profile.js?id=1c1c666004fb44b1c404",
     "/chunks/profile~chunks/settings-password.js": "/chunks/profile~chunks/settings-password.js?id=d0a44ee2cc3e9882c14a",
     "/chunks/purchase-code.js": "/chunks/purchase-code.js?id=a1e46acc22ce82b2a61b",
@@ -67,7 +67,7 @@
     "/chunks/settings-storage.js": "/chunks/settings-storage.js?id=0c243c68b17ca976d05a",
     "/chunks/settings-subscription.js": "/chunks/settings-subscription.js?id=22e5c49d5b0a154e1a28",
     "/chunks/setup-wizard.js": "/chunks/setup-wizard.js?id=c6b88005b133268ed88f",
-    "/chunks/shared.js": "/chunks/shared.js?id=a2c4342bfddd4946cb85",
+    "/chunks/shared.js": "/chunks/shared.js?id=df4e059dc1a64631449b",
     "/chunks/shared-files.js": "/chunks/shared-files.js?id=8d6ff3bdf8b295fde3d0",
     "/chunks/shared/authenticate.js": "/chunks/shared/authenticate.js?id=3d5c7754d438830a4204",
     "/chunks/shared/file-browser.js": "/chunks/shared/file-browser.js?id=f46e9dc63c1313bc2256",
@@ -231,7 +231,7 @@
     "/chunks/admin~chunks/oasis/invoices.js": "/chunks/admin~chunks/oasis/invoices.js?id=b2549892933bd8168687",
     "/chunks/admin~chunks/oasis/invoices~chunks/platform.js": "/chunks/admin~chunks/oasis/invoices~chunks/platform.js?id=0ccc81388ec9941ce779",
     "/chunks/admin~chunks/oasis/invoices~chunks/platform~chunks/shared.js": "/chunks/admin~chunks/oasis/invoices~chunks/platform~chunks/shared.js?id=073522656c63224e16a6",
-    "/chunks/oasis/invoices.js": "/chunks/oasis/invoices.js?id=105b79d0e3a5511e18fc",
+    "/chunks/oasis/invoices.js": "/chunks/oasis/invoices.js?id=9ce9919feb289ce2676e",
     "/chunks/oasis/platba.249a9996d8860ab6460b.hot-update.js": "/chunks/oasis/platba.249a9996d8860ab6460b.hot-update.js",
     "/vendors~chunks/admin~chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~4d3e0a33.js": "/vendors~chunks/admin~chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~4d3e0a33.js?id=bddf517c5fc330d6d968",
     "/vendors~chunks/admin~chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~bf111d7d.js": "/vendors~chunks/admin~chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~bf111d7d.js?id=fdb84e561914c2163b21",
@@ -256,25 +256,25 @@
     "/js/main.18c00af72bbde2f61903.hot-update.js": "/js/main.18c00af72bbde2f61903.hot-update.js",
     "/chunks/app-language~chunks/dashboard~chunks/dashboard-oasis~chunks/files~chunks/invoices~chunks/oasi~2728da6e.js": "/chunks/app-language~chunks/dashboard~chunks/dashboard-oasis~chunks/files~chunks/invoices~chunks/oasi~2728da6e.js?id=80436dceca6104f2698b",
     "/chunks/files~chunks/oasis/invoices~chunks/oasis/platba~chunks/settings-subscription~chunks/shared-fi~a12efdd3.js": "/chunks/files~chunks/oasis/invoices~chunks/oasis/platba~chunks/settings-subscription~chunks/shared-fi~a12efdd3.js?id=4a8ae2023c94755bd0e8",
-    "/chunks/files~chunks/oasis/invoices~chunks/platform~chunks/shared-files~chunks/shared/file-browser.js": "/chunks/files~chunks/oasis/invoices~chunks/platform~chunks/shared-files~chunks/shared/file-browser.js?id=590b407b4957ca964b6f",
+    "/chunks/files~chunks/oasis/invoices~chunks/platform~chunks/shared-files~chunks/shared/file-browser.js": "/chunks/files~chunks/oasis/invoices~chunks/platform~chunks/shared-files~chunks/shared/file-browser.js?id=a0b9c38a648d9aaf19e3",
     "/chunks/files~chunks/oasis/invoices~chunks/platform~chunks/shared~chunks/shared-files~chunks/shared/f~5c41de43.js": "/chunks/files~chunks/oasis/invoices~chunks/platform~chunks/shared~chunks/shared-files~chunks/shared/f~5c41de43.js?id=59e6939b51e925500de6",
     "/chunks/files~chunks/oasis/invoices~chunks/platform~chunks/shared~chunks/shared-files~chunks/shared/f~9f6a6eef.js": "/chunks/files~chunks/oasis/invoices~chunks/platform~chunks/shared~chunks/shared-files~chunks/shared/f~9f6a6eef.js?id=9bc0d89f45dff1feb308",
-    "/chunks/files~chunks/oasis/invoices~chunks/shared-files~chunks/shared/file-browser.js": "/chunks/files~chunks/oasis/invoices~chunks/shared-files~chunks/shared/file-browser.js?id=6d2770c66e581edfbcba",
+    "/chunks/files~chunks/oasis/invoices~chunks/shared-files~chunks/shared/file-browser.js": "/chunks/files~chunks/oasis/invoices~chunks/shared-files~chunks/shared/file-browser.js?id=d633f35d894179a81a49",
     "/chunks/files~chunks/oasis/invoices~chunks/shared-files~chunks/shared/file-browser~chunks/shared/single-file.js": "/chunks/files~chunks/oasis/invoices~chunks/shared-files~chunks/shared/file-browser~chunks/shared/single-file.js?id=08f4c8ee97cbbe75be22",
     "/chunks/oasis/invoices.18c00af72bbde2f61903.hot-update.js": "/chunks/oasis/invoices.18c00af72bbde2f61903.hot-update.js",
     "/vendors~chunks/files~chunks/oasis/invoices~chunks/platform~chunks/shared~chunks/shared-files~chunks/~9b82b04f.js": "/vendors~chunks/files~chunks/oasis/invoices~chunks/platform~chunks/shared~chunks/shared-files~chunks/~9b82b04f.js?id=548bff41ffa0385b8f01",
     "/chunks/oasis/invoices.d66ff1fbf4e24e8ec5cd.hot-update.js": "/chunks/oasis/invoices.d66ff1fbf4e24e8ec5cd.hot-update.js",
     "/chunks/oasis/invoices.2b7a37f23761c8771f3d.hot-update.js": "/chunks/oasis/invoices.2b7a37f23761c8771f3d.hot-update.js",
     "/js/main.d274f733d95bca3ec329.hot-update.js": "/js/main.d274f733d95bca3ec329.hot-update.js",
-    "/chunks/admin~chunks/files~chunks/oasis/invoices~chunks/oasis/invoices/list~chunks/platform~chunks/sh~f205bd67.js": "/chunks/admin~chunks/files~chunks/oasis/invoices~chunks/oasis/invoices/list~chunks/platform~chunks/sh~f205bd67.js?id=fa690960a972b61a0d05",
+    "/chunks/admin~chunks/files~chunks/oasis/invoices~chunks/oasis/invoices/list~chunks/platform~chunks/sh~f205bd67.js": "/chunks/admin~chunks/files~chunks/oasis/invoices~chunks/oasis/invoices/list~chunks/platform~chunks/sh~f205bd67.js?id=f0f8b99d0c2ad4e5d0bc",
     "/chunks/app-language~chunks/dashboard~chunks/dashboard-oasis~chunks/files~chunks/invoices~chunks/oasi~cd3e6128.js": "/chunks/app-language~chunks/dashboard~chunks/dashboard-oasis~chunks/files~chunks/invoices~chunks/oasi~cd3e6128.js?id=64ee94ef1dbfecb30cb9",
     "/chunks/files~chunks/oasis/invoices~chunks/oasis/invoices/list~chunks/oasis/platba~chunks/settings-su~50fe86ed.js": "/chunks/files~chunks/oasis/invoices~chunks/oasis/invoices/list~chunks/oasis/platba~chunks/settings-su~50fe86ed.js?id=623f7615840be8374dcf",
     "/chunks/files~chunks/oasis/invoices~chunks/oasis/invoices/list~chunks/platform~chunks/shared-files~ch~e5a24789.js": "/chunks/files~chunks/oasis/invoices~chunks/oasis/invoices/list~chunks/platform~chunks/shared-files~ch~e5a24789.js?id=8a936fa4187b27beddd8",
     "/chunks/files~chunks/oasis/invoices~chunks/oasis/invoices/list~chunks/platform~chunks/shared~chunks/s~707bd579.js": "/chunks/files~chunks/oasis/invoices~chunks/oasis/invoices/list~chunks/platform~chunks/shared~chunks/s~707bd579.js?id=3c49df5afaf5bb1f42f3",
-    "/chunks/files~chunks/oasis/invoices~chunks/oasis/invoices/list~chunks/platform~chunks/shared~chunks/s~87b39a8d.js": "/chunks/files~chunks/oasis/invoices~chunks/oasis/invoices/list~chunks/platform~chunks/shared~chunks/s~87b39a8d.js?id=4ebf5cc9fb3ba55fcd79",
-    "/chunks/files~chunks/oasis/invoices~chunks/oasis/invoices/list~chunks/shared-files~chunks/shared/file-browser.js": "/chunks/files~chunks/oasis/invoices~chunks/oasis/invoices/list~chunks/shared-files~chunks/shared/file-browser.js?id=75ecfbff622777db6ce3",
+    "/chunks/files~chunks/oasis/invoices~chunks/oasis/invoices/list~chunks/platform~chunks/shared~chunks/s~87b39a8d.js": "/chunks/files~chunks/oasis/invoices~chunks/oasis/invoices/list~chunks/platform~chunks/shared~chunks/s~87b39a8d.js?id=493b24181051e0ba7b73",
+    "/chunks/files~chunks/oasis/invoices~chunks/oasis/invoices/list~chunks/shared-files~chunks/shared/file-browser.js": "/chunks/files~chunks/oasis/invoices~chunks/oasis/invoices/list~chunks/shared-files~chunks/shared/file-browser.js?id=5bdccb1404fe389ea24f",
     "/chunks/files~chunks/oasis/invoices~chunks/oasis/invoices/list~chunks/shared-files~chunks/shared/file~7807db72.js": "/chunks/files~chunks/oasis/invoices~chunks/oasis/invoices/list~chunks/shared-files~chunks/shared/file~7807db72.js?id=962f11c09911fbc094d6",
-    "/chunks/oasis/invoices/list.js": "/chunks/oasis/invoices/list.js?id=1e8cb04f4470dee2827e",
+    "/chunks/oasis/invoices/list.js": "/chunks/oasis/invoices/list.js?id=0615c2d7e1701edff409",
     "/vendors~chunks/files~chunks/oasis/invoices~chunks/oasis/invoices/list~chunks/platform~chunks/shared~~c9df84c5.js": "/vendors~chunks/files~chunks/oasis/invoices~chunks/oasis/invoices/list~chunks/platform~chunks/shared~~c9df84c5.js?id=4d042d0c0d8477a4f7ac",
     "/chunks/oasis/invoices/list.51c1a825e34ada41b37b.hot-update.js": "/chunks/oasis/invoices/list.51c1a825e34ada41b37b.hot-update.js",
     "/chunks/admin~chunks/oasis/invoices~chunks/platform.291e81896f6c9f73d66b.hot-update.js": "/chunks/admin~chunks/oasis/invoices~chunks/platform.291e81896f6c9f73d66b.hot-update.js",
@@ -317,5 +317,144 @@
     "/chunks/oasis/invoices/list.71fdb103d5232b771b14.hot-update.js": "/chunks/oasis/invoices/list.71fdb103d5232b771b14.hot-update.js",
     "/chunks/admin~chunks/files~chunks/oasis/invoices~chunks/oasis/invoices/list~chunks/platform~chunks/sh~f205bd67.de24112ab030ac431c7f.hot-update.js": "/chunks/admin~chunks/files~chunks/oasis/invoices~chunks/oasis/invoices/list~chunks/platform~chunks/sh~f205bd67.de24112ab030ac431c7f.hot-update.js",
     "/chunks/oasis/invoices/list.25a2e7775dd722b378cf.hot-update.js": "/chunks/oasis/invoices/list.25a2e7775dd722b378cf.hot-update.js",
-    "/chunks/admin~chunks/files~chunks/oasis/invoices~chunks/oasis/invoices/list~chunks/platform~chunks/sh~f205bd67.2287f96b9fa7b144c71f.hot-update.js": "/chunks/admin~chunks/files~chunks/oasis/invoices~chunks/oasis/invoices/list~chunks/platform~chunks/sh~f205bd67.2287f96b9fa7b144c71f.hot-update.js"
+    "/chunks/admin~chunks/files~chunks/oasis/invoices~chunks/oasis/invoices/list~chunks/platform~chunks/sh~f205bd67.2287f96b9fa7b144c71f.hot-update.js": "/chunks/admin~chunks/files~chunks/oasis/invoices~chunks/oasis/invoices/list~chunks/platform~chunks/sh~f205bd67.2287f96b9fa7b144c71f.hot-update.js",
+    "/js/main.6eab69f37642a7582c6e.hot-update.js": "/js/main.6eab69f37642a7582c6e.hot-update.js",
+    "/chunks/files~chunks/oasis/invoices~chunks/oasis/invoices/list~chunks/platform~chunks/shared~chunks/s~87b39a8d.6eab69f37642a7582c6e.hot-update.js": "/chunks/files~chunks/oasis/invoices~chunks/oasis/invoices/list~chunks/platform~chunks/shared~chunks/s~87b39a8d.6eab69f37642a7582c6e.hot-update.js",
+    "/chunks/files~chunks/oasis/invoices~chunks/oasis/invoices/list~chunks/shared-files~chunks/shared/file-browser.6eab69f37642a7582c6e.hot-update.js": "/chunks/files~chunks/oasis/invoices~chunks/oasis/invoices/list~chunks/shared-files~chunks/shared/file-browser.6eab69f37642a7582c6e.hot-update.js",
+    "/chunks/oasis/invoices/list.6eab69f37642a7582c6e.hot-update.js": "/chunks/oasis/invoices/list.6eab69f37642a7582c6e.hot-update.js",
+    "/chunks/oasis/invoices/list.fd314b7a64dc5e0b9c3b.hot-update.js": "/chunks/oasis/invoices/list.fd314b7a64dc5e0b9c3b.hot-update.js",
+    "/js/main.7c130bdf6ee486674c39.hot-update.js": "/js/main.7c130bdf6ee486674c39.hot-update.js",
+    "/chunks/files~chunks/oasis/invoices~chunks/shared-files~chunks/shared/file-browser.7c130bdf6ee486674c39.hot-update.js": "/chunks/files~chunks/oasis/invoices~chunks/shared-files~chunks/shared/file-browser.7c130bdf6ee486674c39.hot-update.js",
+    "/chunks/oasis/invoices/list.7c130bdf6ee486674c39.hot-update.js": "/chunks/oasis/invoices/list.7c130bdf6ee486674c39.hot-update.js",
+    "/chunks/shared.7c130bdf6ee486674c39.hot-update.js": "/chunks/shared.7c130bdf6ee486674c39.hot-update.js",
+    "/chunks/oasis/invoices/list.949b50672f47a97d4970.hot-update.js": "/chunks/oasis/invoices/list.949b50672f47a97d4970.hot-update.js",
+    "/chunks/oasis/invoices/list.565aa4906880d84b951e.hot-update.js": "/chunks/oasis/invoices/list.565aa4906880d84b951e.hot-update.js",
+    "/chunks/oasis/invoices/list.b72e63c1bca86c838552.hot-update.js": "/chunks/oasis/invoices/list.b72e63c1bca86c838552.hot-update.js",
+    "/chunks/oasis/invoices/list.c4378a8773285d9ff2fd.hot-update.js": "/chunks/oasis/invoices/list.c4378a8773285d9ff2fd.hot-update.js",
+    "/chunks/oasis/invoices/list.a360bc4acfe8f7ffc5f3.hot-update.js": "/chunks/oasis/invoices/list.a360bc4acfe8f7ffc5f3.hot-update.js",
+    "/chunks/oasis/invoices/list.c3b769eb12a345457255.hot-update.js": "/chunks/oasis/invoices/list.c3b769eb12a345457255.hot-update.js",
+    "/chunks/oasis/invoices/list.ce8c83574de6ecb6dbc1.hot-update.js": "/chunks/oasis/invoices/list.ce8c83574de6ecb6dbc1.hot-update.js",
+    "/chunks/oasis/invoices/list.87540ba0d43503dd496e.hot-update.js": "/chunks/oasis/invoices/list.87540ba0d43503dd496e.hot-update.js",
+    "/chunks/oasis/invoices/list.68cf76f7959d015b2bcd.hot-update.js": "/chunks/oasis/invoices/list.68cf76f7959d015b2bcd.hot-update.js",
+    "/js/main.256fbc5f64dbab3300ef.hot-update.js": "/js/main.256fbc5f64dbab3300ef.hot-update.js",
+    "/chunks/files~chunks/oasis/invoices~chunks/oasis/invoices/list~chunks/shared-files~chunks/shared/file-browser.256fbc5f64dbab3300ef.hot-update.js": "/chunks/files~chunks/oasis/invoices~chunks/oasis/invoices/list~chunks/shared-files~chunks/shared/file-browser.256fbc5f64dbab3300ef.hot-update.js",
+    "/chunks/oasis/invoices/list.256fbc5f64dbab3300ef.hot-update.js": "/chunks/oasis/invoices/list.256fbc5f64dbab3300ef.hot-update.js",
+    "/js/main.9341eab08bd24f778310.hot-update.js": "/js/main.9341eab08bd24f778310.hot-update.js",
+    "/chunks/oasis/invoices/list.9341eab08bd24f778310.hot-update.js": "/chunks/oasis/invoices/list.9341eab08bd24f778310.hot-update.js",
+    "/chunks/oasis/invoices/list.7e78ee3aaf86d01e2d60.hot-update.js": "/chunks/oasis/invoices/list.7e78ee3aaf86d01e2d60.hot-update.js",
+    "/chunks/oasis/invoices/list.c212695694ffa9886c3b.hot-update.js": "/chunks/oasis/invoices/list.c212695694ffa9886c3b.hot-update.js",
+    "/chunks/oasis/invoices/list.a58ef0d5fdcb64e1dc91.hot-update.js": "/chunks/oasis/invoices/list.a58ef0d5fdcb64e1dc91.hot-update.js",
+    "/chunks/oasis/invoices/list.391ac4bff2bfc52b4f0e.hot-update.js": "/chunks/oasis/invoices/list.391ac4bff2bfc52b4f0e.hot-update.js",
+    "/chunks/oasis/invoices/list.18436249ce0cd17ec92c.hot-update.js": "/chunks/oasis/invoices/list.18436249ce0cd17ec92c.hot-update.js",
+    "/chunks/oasis/invoices/list.b51febe9f2e37a16fb6c.hot-update.js": "/chunks/oasis/invoices/list.b51febe9f2e37a16fb6c.hot-update.js",
+    "/chunks/oasis/invoices/list.520bb0b07e44eb5f9742.hot-update.js": "/chunks/oasis/invoices/list.520bb0b07e44eb5f9742.hot-update.js",
+    "/chunks/oasis/invoices/list.7ee43006e02832ff43fa.hot-update.js": "/chunks/oasis/invoices/list.7ee43006e02832ff43fa.hot-update.js",
+    "/chunks/oasis/invoices/list.0e62c6c150a9acf551ee.hot-update.js": "/chunks/oasis/invoices/list.0e62c6c150a9acf551ee.hot-update.js",
+    "/chunks/oasis/invoices/list.f4a745f5e2b95f79cf06.hot-update.js": "/chunks/oasis/invoices/list.f4a745f5e2b95f79cf06.hot-update.js",
+    "/chunks/oasis/invoices/list.cf71430b8905544d72fa.hot-update.js": "/chunks/oasis/invoices/list.cf71430b8905544d72fa.hot-update.js",
+    "/chunks/oasis/invoices/list.2761100cf3c86dfc24c4.hot-update.js": "/chunks/oasis/invoices/list.2761100cf3c86dfc24c4.hot-update.js",
+    "/chunks/oasis/invoices/list.963e1ceccb8fc16b3a0a.hot-update.js": "/chunks/oasis/invoices/list.963e1ceccb8fc16b3a0a.hot-update.js",
+    "/chunks/oasis/invoices/list.0fd93f99aafd118c936a.hot-update.js": "/chunks/oasis/invoices/list.0fd93f99aafd118c936a.hot-update.js",
+    "/chunks/oasis/invoices/list.ef65942b96bf9ae98f1e.hot-update.js": "/chunks/oasis/invoices/list.ef65942b96bf9ae98f1e.hot-update.js",
+    "/chunks/oasis/invoices/list.fd9b583c210e0089aac8.hot-update.js": "/chunks/oasis/invoices/list.fd9b583c210e0089aac8.hot-update.js",
+    "/chunks/oasis/invoices/list.9a67ee2f80234649512c.hot-update.js": "/chunks/oasis/invoices/list.9a67ee2f80234649512c.hot-update.js",
+    "/chunks/oasis/invoices/list.b1e26b754571d4bfe96d.hot-update.js": "/chunks/oasis/invoices/list.b1e26b754571d4bfe96d.hot-update.js",
+    "/chunks/oasis/invoices/list.3f3cbd2baaeb032bea2b.hot-update.js": "/chunks/oasis/invoices/list.3f3cbd2baaeb032bea2b.hot-update.js",
+    "/chunks/oasis/invoices/list.93cc01339ee85a67dcf9.hot-update.js": "/chunks/oasis/invoices/list.93cc01339ee85a67dcf9.hot-update.js",
+    "/chunks/oasis/invoices/list.36c83d854d32aeb05348.hot-update.js": "/chunks/oasis/invoices/list.36c83d854d32aeb05348.hot-update.js",
+    "/chunks/oasis/invoices/list.c1f51cfa1e0390b59939.hot-update.js": "/chunks/oasis/invoices/list.c1f51cfa1e0390b59939.hot-update.js",
+    "/chunks/oasis/invoices/list.90060f2218fcb4254767.hot-update.js": "/chunks/oasis/invoices/list.90060f2218fcb4254767.hot-update.js",
+    "/chunks/oasis/invoices/list.d84f04ea2725900df3cd.hot-update.js": "/chunks/oasis/invoices/list.d84f04ea2725900df3cd.hot-update.js",
+    "/chunks/oasis/invoices/list.d4717362954128537f68.hot-update.js": "/chunks/oasis/invoices/list.d4717362954128537f68.hot-update.js",
+    "/chunks/oasis/invoices/list.d849a372c592953b0812.hot-update.js": "/chunks/oasis/invoices/list.d849a372c592953b0812.hot-update.js",
+    "/chunks/oasis/invoices/list.8e38ead46402eec04b3b.hot-update.js": "/chunks/oasis/invoices/list.8e38ead46402eec04b3b.hot-update.js",
+    "/chunks/oasis/invoices/list.94fa55a814cd1cdb6c6b.hot-update.js": "/chunks/oasis/invoices/list.94fa55a814cd1cdb6c6b.hot-update.js",
+    "/chunks/oasis/invoices/list.877bb0d7c6693db0a3fe.hot-update.js": "/chunks/oasis/invoices/list.877bb0d7c6693db0a3fe.hot-update.js",
+    "/chunks/oasis/invoices/list.71bd92228a1156c2a668.hot-update.js": "/chunks/oasis/invoices/list.71bd92228a1156c2a668.hot-update.js",
+    "/chunks/oasis/invoices/list.fffb15f7b33655ab9a91.hot-update.js": "/chunks/oasis/invoices/list.fffb15f7b33655ab9a91.hot-update.js",
+    "/chunks/oasis/invoices/list.92e067b3c278b1a88c7d.hot-update.js": "/chunks/oasis/invoices/list.92e067b3c278b1a88c7d.hot-update.js",
+    "/chunks/oasis/invoices/list.3ae774294ab745a52e0d.hot-update.js": "/chunks/oasis/invoices/list.3ae774294ab745a52e0d.hot-update.js",
+    "/chunks/oasis/invoices/list.c5648ffa131a3cd87d34.hot-update.js": "/chunks/oasis/invoices/list.c5648ffa131a3cd87d34.hot-update.js",
+    "/chunks/oasis/invoices/list.ea5b34e7743be66feaf6.hot-update.js": "/chunks/oasis/invoices/list.ea5b34e7743be66feaf6.hot-update.js",
+    "/chunks/oasis/invoices/list.27b134d06db1e087db41.hot-update.js": "/chunks/oasis/invoices/list.27b134d06db1e087db41.hot-update.js",
+    "/chunks/oasis/invoices/list.8a6ebe035aeefe0e2698.hot-update.js": "/chunks/oasis/invoices/list.8a6ebe035aeefe0e2698.hot-update.js",
+    "/chunks/oasis/invoices/list.c99ebf9b838695474058.hot-update.js": "/chunks/oasis/invoices/list.c99ebf9b838695474058.hot-update.js",
+    "/chunks/oasis/invoices/list.a7eae672986bd9fdc07a.hot-update.js": "/chunks/oasis/invoices/list.a7eae672986bd9fdc07a.hot-update.js",
+    "/chunks/oasis/invoices/list.6ba6e668cc4714af7453.hot-update.js": "/chunks/oasis/invoices/list.6ba6e668cc4714af7453.hot-update.js",
+    "/chunks/oasis/invoices/list.87c42300b3417aabd6d4.hot-update.js": "/chunks/oasis/invoices/list.87c42300b3417aabd6d4.hot-update.js",
+    "/js/main.8a6ec194827c238d0bdc.hot-update.js": "/js/main.8a6ec194827c238d0bdc.hot-update.js",
+    "/chunks/oasis/invoices/list.8a6ec194827c238d0bdc.hot-update.js": "/chunks/oasis/invoices/list.8a6ec194827c238d0bdc.hot-update.js",
+    "/chunks/oasis/invoices/list.0ff27720231a93e11cfb.hot-update.js": "/chunks/oasis/invoices/list.0ff27720231a93e11cfb.hot-update.js",
+    "/chunks/oasis/invoices/list.59ba32f05a9496b5dde8.hot-update.js": "/chunks/oasis/invoices/list.59ba32f05a9496b5dde8.hot-update.js",
+    "/chunks/oasis/invoices/list.b53b0def32f4c4bb7041.hot-update.js": "/chunks/oasis/invoices/list.b53b0def32f4c4bb7041.hot-update.js",
+    "/js/main.5f3915a1e0f9938faf1e.hot-update.js": "/js/main.5f3915a1e0f9938faf1e.hot-update.js",
+    "/chunks/files~chunks/oasis/invoices~chunks/oasis/invoices/list~chunks/platform~chunks/shared~chunks/s~87b39a8d.5f3915a1e0f9938faf1e.hot-update.js": "/chunks/files~chunks/oasis/invoices~chunks/oasis/invoices/list~chunks/platform~chunks/shared~chunks/s~87b39a8d.5f3915a1e0f9938faf1e.hot-update.js",
+    "/chunks/files~chunks/oasis/invoices~chunks/oasis/invoices/list~chunks/shared-files~chunks/shared/file-browser.5f3915a1e0f9938faf1e.hot-update.js": "/chunks/files~chunks/oasis/invoices~chunks/oasis/invoices/list~chunks/shared-files~chunks/shared/file-browser.5f3915a1e0f9938faf1e.hot-update.js",
+    "/chunks/oasis/invoices/list.5f3915a1e0f9938faf1e.hot-update.js": "/chunks/oasis/invoices/list.5f3915a1e0f9938faf1e.hot-update.js",
+    "/js/main.e94bfc0cbf0f407fbf26.hot-update.js": "/js/main.e94bfc0cbf0f407fbf26.hot-update.js",
+    "/chunks/files~chunks/oasis/invoices~chunks/shared-files~chunks/shared/file-browser.e94bfc0cbf0f407fbf26.hot-update.js": "/chunks/files~chunks/oasis/invoices~chunks/shared-files~chunks/shared/file-browser.e94bfc0cbf0f407fbf26.hot-update.js",
+    "/chunks/oasis/invoices/list.e94bfc0cbf0f407fbf26.hot-update.js": "/chunks/oasis/invoices/list.e94bfc0cbf0f407fbf26.hot-update.js",
+    "/chunks/shared.e94bfc0cbf0f407fbf26.hot-update.js": "/chunks/shared.e94bfc0cbf0f407fbf26.hot-update.js",
+    "/chunks/oasis/invoices/list.e94318ed578037e0d13e.hot-update.js": "/chunks/oasis/invoices/list.e94318ed578037e0d13e.hot-update.js",
+    "/chunks/oasis/invoices/list.0181ad3074555193006e.hot-update.js": "/chunks/oasis/invoices/list.0181ad3074555193006e.hot-update.js",
+    "/chunks/files~chunks/oasis/invoices~chunks/oasis/invoices/list~chunks/platform~chunks/shared~chunks/s~87b39a8d.c1d39c49db4c062614bc.hot-update.js": "/chunks/files~chunks/oasis/invoices~chunks/oasis/invoices/list~chunks/platform~chunks/shared~chunks/s~87b39a8d.c1d39c49db4c062614bc.hot-update.js",
+    "/js/main.4265a73fdf0add91dc25.hot-update.js": "/js/main.4265a73fdf0add91dc25.hot-update.js",
+    "/chunks/files~chunks/oasis/invoices~chunks/oasis/invoices/list~chunks/platform~chunks/shared~chunks/s~87b39a8d.4265a73fdf0add91dc25.hot-update.js": "/chunks/files~chunks/oasis/invoices~chunks/oasis/invoices/list~chunks/platform~chunks/shared~chunks/s~87b39a8d.4265a73fdf0add91dc25.hot-update.js",
+    "/chunks/oasis/invoices/list.434786a6ab4a142f2f4f.hot-update.js": "/chunks/oasis/invoices/list.434786a6ab4a142f2f4f.hot-update.js",
+    "/chunks/oasis/invoices/list.2e3c4b4b078d490441ec.hot-update.js": "/chunks/oasis/invoices/list.2e3c4b4b078d490441ec.hot-update.js",
+    "/chunks/files~chunks/oasis/invoices~chunks/oasis/invoices/list~chunks/platform~chunks/shared~chunks/s~87b39a8d.946a2dbd97e90f67ee93.hot-update.js": "/chunks/files~chunks/oasis/invoices~chunks/oasis/invoices/list~chunks/platform~chunks/shared~chunks/s~87b39a8d.946a2dbd97e90f67ee93.hot-update.js",
+    "/chunks/oasis/invoices/list.5d2341e65923020252c4.hot-update.js": "/chunks/oasis/invoices/list.5d2341e65923020252c4.hot-update.js",
+    "/chunks/oasis/invoices/list.b6dda62fc6e3973fb9f8.hot-update.js": "/chunks/oasis/invoices/list.b6dda62fc6e3973fb9f8.hot-update.js",
+    "/chunks/oasis/invoices/list.f161c22c82f3c67667d0.hot-update.js": "/chunks/oasis/invoices/list.f161c22c82f3c67667d0.hot-update.js",
+    "/js/main.9033385bdd60fe574428.hot-update.js": "/js/main.9033385bdd60fe574428.hot-update.js",
+    "/chunks/files~chunks/oasis/invoices~chunks/oasis/invoices/list~chunks/platform~chunks/shared~chunks/s~87b39a8d.9033385bdd60fe574428.hot-update.js": "/chunks/files~chunks/oasis/invoices~chunks/oasis/invoices/list~chunks/platform~chunks/shared~chunks/s~87b39a8d.9033385bdd60fe574428.hot-update.js",
+    "/chunks/files~chunks/oasis/invoices~chunks/oasis/invoices/list~chunks/shared-files~chunks/shared/file-browser.9033385bdd60fe574428.hot-update.js": "/chunks/files~chunks/oasis/invoices~chunks/oasis/invoices/list~chunks/shared-files~chunks/shared/file-browser.9033385bdd60fe574428.hot-update.js",
+    "/chunks/oasis/invoices/list.9033385bdd60fe574428.hot-update.js": "/chunks/oasis/invoices/list.9033385bdd60fe574428.hot-update.js",
+    "/js/main.8027083661fc5f09c13b.hot-update.js": "/js/main.8027083661fc5f09c13b.hot-update.js",
+    "/chunks/files~chunks/oasis/invoices~chunks/oasis/invoices/list~chunks/shared-files~chunks/shared/file-browser.8027083661fc5f09c13b.hot-update.js": "/chunks/files~chunks/oasis/invoices~chunks/oasis/invoices/list~chunks/shared-files~chunks/shared/file-browser.8027083661fc5f09c13b.hot-update.js",
+    "/chunks/files~chunks/oasis/invoices~chunks/shared-files~chunks/shared/file-browser.8027083661fc5f09c13b.hot-update.js": "/chunks/files~chunks/oasis/invoices~chunks/shared-files~chunks/shared/file-browser.8027083661fc5f09c13b.hot-update.js",
+    "/chunks/oasis/invoices/list.8027083661fc5f09c13b.hot-update.js": "/chunks/oasis/invoices/list.8027083661fc5f09c13b.hot-update.js",
+    "/chunks/platform~chunks/shared.8027083661fc5f09c13b.hot-update.js": "/chunks/platform~chunks/shared.8027083661fc5f09c13b.hot-update.js",
+    "/chunks/admin~chunks/files~chunks/oasis/invoices~chunks/oasis/invoices/list~chunks/platform~chunks/sh~f205bd67.91565b28b07bf73709b7.hot-update.js": "/chunks/admin~chunks/files~chunks/oasis/invoices~chunks/oasis/invoices/list~chunks/platform~chunks/sh~f205bd67.91565b28b07bf73709b7.hot-update.js",
+    "/chunks/oasis/invoices/list.f2bd63514676fa651816.hot-update.js": "/chunks/oasis/invoices/list.f2bd63514676fa651816.hot-update.js",
+    "/chunks/oasis/invoices/list.39bf55c5e89103afc8e3.hot-update.js": "/chunks/oasis/invoices/list.39bf55c5e89103afc8e3.hot-update.js",
+    "/chunks/oasis/invoices/list.8f5b38b21364f53b9169.hot-update.js": "/chunks/oasis/invoices/list.8f5b38b21364f53b9169.hot-update.js",
+    "/chunks/oasis/invoices/list.01d27fc62fa07739f54b.hot-update.js": "/chunks/oasis/invoices/list.01d27fc62fa07739f54b.hot-update.js",
+    "/chunks/oasis/invoices/list.f2340e940032d6fe5cdc.hot-update.js": "/chunks/oasis/invoices/list.f2340e940032d6fe5cdc.hot-update.js",
+    "/chunks/oasis/invoices/list.962f38a16fedd1a35854.hot-update.js": "/chunks/oasis/invoices/list.962f38a16fedd1a35854.hot-update.js",
+    "/chunks/oasis/invoices/list.08aa049964996067f722.hot-update.js": "/chunks/oasis/invoices/list.08aa049964996067f722.hot-update.js",
+    "/chunks/oasis/invoices/list.f9e7723145d17efb308e.hot-update.js": "/chunks/oasis/invoices/list.f9e7723145d17efb308e.hot-update.js",
+    "/chunks/oasis/invoices/list.c9295d65717e665081bd.hot-update.js": "/chunks/oasis/invoices/list.c9295d65717e665081bd.hot-update.js",
+    "/chunks/oasis/invoices/list.29a326802b42e7c08916.hot-update.js": "/chunks/oasis/invoices/list.29a326802b42e7c08916.hot-update.js",
+    "/js/main.b1c4173f2c7d2300496b.hot-update.js": "/js/main.b1c4173f2c7d2300496b.hot-update.js",
+    "/chunks/oasis/invoices.b1c4173f2c7d2300496b.hot-update.js": "/chunks/oasis/invoices.b1c4173f2c7d2300496b.hot-update.js",
+    "/chunks/oasis/invoices~chunks/platform~chunks/shared.js": "/chunks/oasis/invoices~chunks/platform~chunks/shared.js?id=9ad184d8e96c7d04941c",
+    "/chunks/platform~chunks/shared.b1c4173f2c7d2300496b.hot-update.js": "/chunks/platform~chunks/shared.b1c4173f2c7d2300496b.hot-update.js",
+    "/vendors~chunks/oasis/invoices~chunks/platform~chunks/shared.js": "/vendors~chunks/oasis/invoices~chunks/platform~chunks/shared.js?id=03d3cf785cbafa4d31f0",
+    "/js/main.37ed0717d3dc48e05e22.hot-update.js": "/js/main.37ed0717d3dc48e05e22.hot-update.js",
+    "/chunks/app-language~chunks/dashboard~chunks/dashboard-oasis~chunks/files~chunks/invoices~chunks/oasi~c6e9de01.js": "/chunks/app-language~chunks/dashboard~chunks/dashboard-oasis~chunks/files~chunks/invoices~chunks/oasi~c6e9de01.js?id=6078ad99e9e331c91ef5",
+    "/chunks/files~chunks/oasis/invoices/list~chunks/oasis/platba~chunks/settings-subscription~chunks/shar~d6675e1e.js": "/chunks/files~chunks/oasis/invoices/list~chunks/oasis/platba~chunks/settings-subscription~chunks/shar~d6675e1e.js?id=effef49b99446fdaee0b",
+    "/chunks/files~chunks/oasis/invoices/list~chunks/platform~chunks/shared-files~chunks/shared/file-browser.js": "/chunks/files~chunks/oasis/invoices/list~chunks/platform~chunks/shared-files~chunks/shared/file-browser.js?id=c777877000f1e219a748",
+    "/chunks/files~chunks/oasis/invoices/list~chunks/platform~chunks/shared~chunks/shared-files~chunks/sha~bf90c201.js": "/chunks/files~chunks/oasis/invoices/list~chunks/platform~chunks/shared~chunks/shared-files~chunks/sha~bf90c201.js?id=81388dc3e14b7acd0f2b",
+    "/chunks/files~chunks/oasis/invoices/list~chunks/shared-files~chunks/shared/file-browser.js": "/chunks/files~chunks/oasis/invoices/list~chunks/shared-files~chunks/shared/file-browser.js?id=e89dff7b404fcb5f3107",
+    "/chunks/files~chunks/oasis/invoices~chunks/oasis/invoices/list~chunks/platform~chunks/shared~chunks/s~87b39a8d.37ed0717d3dc48e05e22.hot-update.js": "/chunks/files~chunks/oasis/invoices~chunks/oasis/invoices/list~chunks/platform~chunks/shared~chunks/s~87b39a8d.37ed0717d3dc48e05e22.hot-update.js",
+    "/chunks/oasis/invoices.37ed0717d3dc48e05e22.hot-update.js": "/chunks/oasis/invoices.37ed0717d3dc48e05e22.hot-update.js",
+    "/chunks/platform~chunks/shared.37ed0717d3dc48e05e22.hot-update.js": "/chunks/platform~chunks/shared.37ed0717d3dc48e05e22.hot-update.js",
+    "/chunks/oasis/invoices/list.f9d7c26ceba18ad845a0.hot-update.js": "/chunks/oasis/invoices/list.f9d7c26ceba18ad845a0.hot-update.js",
+    "/chunks/oasis/invoices/list.0c60cd1dbfacb4584e14.hot-update.js": "/chunks/oasis/invoices/list.0c60cd1dbfacb4584e14.hot-update.js",
+    "/chunks/files~chunks/shared-files~chunks/shared/file-browser.3344633ba03b982c57cb.hot-update.js": "/chunks/files~chunks/shared-files~chunks/shared/file-browser.3344633ba03b982c57cb.hot-update.js",
+    "/chunks/files~chunks/shared-files~chunks/shared/file-browser~chunks/shared/single-file.efde4510611d9c9c988c.hot-update.js": "/chunks/files~chunks/shared-files~chunks/shared/file-browser~chunks/shared/single-file.efde4510611d9c9c988c.hot-update.js",
+    "/chunks/oasis/invoices.69b175e22a01dbab973f.hot-update.js": "/chunks/oasis/invoices.69b175e22a01dbab973f.hot-update.js",
+    "/js/main.065e1f920d89f8ba1172.hot-update.js": "/js/main.065e1f920d89f8ba1172.hot-update.js",
+    "/chunks/oasis/invoices.065e1f920d89f8ba1172.hot-update.js": "/chunks/oasis/invoices.065e1f920d89f8ba1172.hot-update.js",
+    "/chunks/platform~chunks/shared.065e1f920d89f8ba1172.hot-update.js": "/chunks/platform~chunks/shared.065e1f920d89f8ba1172.hot-update.js",
+    "/chunks/oasis/invoices.bef300afa860698cf4a2.hot-update.js": "/chunks/oasis/invoices.bef300afa860698cf4a2.hot-update.js",
+    "/chunks/oasis/invoices.55234e73dfa2f3e2939a.hot-update.js": "/chunks/oasis/invoices.55234e73dfa2f3e2939a.hot-update.js",
+    "/chunks/oasis/invoices.ab334725faff0d544fac.hot-update.js": "/chunks/oasis/invoices.ab334725faff0d544fac.hot-update.js",
+    "/chunks/oasis/invoices.0740ea58d60e4c18ae4e.hot-update.js": "/chunks/oasis/invoices.0740ea58d60e4c18ae4e.hot-update.js",
+    "/js/main.3ccd9c262a1821c4f79a.hot-update.js": "/js/main.3ccd9c262a1821c4f79a.hot-update.js",
+    "/chunks/oasis/invoices.3ccd9c262a1821c4f79a.hot-update.js": "/chunks/oasis/invoices.3ccd9c262a1821c4f79a.hot-update.js",
+    "/chunks/oasis/invoices.5e0733e72ba2d3afcf51.hot-update.js": "/chunks/oasis/invoices.5e0733e72ba2d3afcf51.hot-update.js",
+    "/chunks/oasis/invoices.37769d4dbff674656c56.hot-update.js": "/chunks/oasis/invoices.37769d4dbff674656c56.hot-update.js",
+    "/chunks/oasis/invoices.142f8f35b167f7265e5e.hot-update.js": "/chunks/oasis/invoices.142f8f35b167f7265e5e.hot-update.js"
 }
diff --git a/resources/js/Oasis/Modules/Invoices/Invoices.vue b/resources/js/Oasis/Modules/Invoices/Invoices.vue
index 7542dcae..a164cf9d 100644
--- a/resources/js/Oasis/Modules/Invoices/Invoices.vue
+++ b/resources/js/Oasis/Modules/Invoices/Invoices.vue
@@ -1,10 +1,13 @@
 <template>
     <section id="viewport">
 
-        <!--Mobile Navigation-->
-        <MobileNavigation />
+		<!--File preview window-->
+        <FilePreview />
 
-        <!--Navigation Sidebar-->
+		<InvoiceMobileMenu />
+
+        <!--Navigations-->
+        <MobileNavigation />
         <SidebarNavigation/>
 
 		<!--Sidebar navigation-->
@@ -43,23 +46,21 @@
             </ContentGroup>
         </ContentSidebar>
 
-		<!--<ContentFileView/>-->
-
 		<router-view :class="{'is-scaled-down': isScaledDown}" />
     </section>
 </template>
 
 <script>
+    import InvoiceMobileMenu from '@/Oasis/Modules/Invoices/components/InvoiceMobileMenu'
     import { UsersIcon, FileTextIcon, ClockIcon } from 'vue-feather-icons'
     import SidebarNavigation from '@/components/Sidebar/SidebarNavigation'
     import MobileNavigation from '@/components/Others/MobileNavigation'
     import ContentSidebar from '@/components/Sidebar/ContentSidebar'
+    import FilePreview from '@/components/FilesView/FilePreview'
     import ContentGroup from '@/components/Sidebar/ContentGroup'
 	import { mapGetters } from 'vuex'
 	import {events} from '@/bus'
 
-	import ContentFileView from '@/components/Others/ContentFileView'
-
 	export default {
         name: 'Settings',
         computed: {
@@ -68,14 +69,15 @@
 			]),
         },
         components: {
+			InvoiceMobileMenu,
             SidebarNavigation,
             MobileNavigation,
             ContentSidebar,
             FileTextIcon,
             ContentGroup,
+			FilePreview,
             UsersIcon,
 			ClockIcon,
-			ContentFileView,
         },
 		data() {
 			return {
diff --git a/resources/js/Oasis/Modules/Invoices/InvoicesList.vue b/resources/js/Oasis/Modules/Invoices/InvoicesList.vue
index 0f6e7756..9ad118aa 100644
--- a/resources/js/Oasis/Modules/Invoices/InvoicesList.vue
+++ b/resources/js/Oasis/Modules/Invoices/InvoicesList.vue
@@ -1,23 +1,23 @@
 <template>
     <div @contextmenu.prevent.capture="contextMenu($event, undefined)" id="files-view">
-		<DesktopToolbarInvoices/>
-		<!--<ContextMenu />
-        <FileBrowser/>-->
+		<InvoiceDesktopToolbar/>
+		<InvoiceContextMenu />
+        <InvoiceBrowser/>
     </div>
 </template>
 
 <script>
-    import DesktopToolbarInvoices from '@/Oasis/Modules/Invoices/components/DesktopToolbarInvoices'
-    import FileBrowser from '@/components/FilesView/FileBrowser'
-	import ContextMenu from '@/components/FilesView/ContextMenu'
+    import InvoiceDesktopToolbar from '@/Oasis/Modules/Invoices/components/InvoiceDesktopToolbar'
+    import InvoiceBrowser from '@/Oasis/Modules/Invoices/components/InvoiceBrowser'
+	import InvoiceContextMenu from '@/Oasis/Modules/Invoices/components/InvoiceContextMenu'
     import {events} from '@/bus'
 
     export default {
         name: 'FilesView',
         components: {
-			DesktopToolbarInvoices,
-            FileBrowser,
-            ContextMenu,
+			InvoiceDesktopToolbar,
+            InvoiceContextMenu,
+            InvoiceBrowser,
         },
         methods: {
             contextMenu(event, item) {
diff --git a/resources/js/Oasis/Modules/Invoices/components/InvoiceBrowser.vue b/resources/js/Oasis/Modules/Invoices/components/InvoiceBrowser.vue
new file mode 100644
index 00000000..19df4c71
--- /dev/null
+++ b/resources/js/Oasis/Modules/Invoices/components/InvoiceBrowser.vue
@@ -0,0 +1,350 @@
+<template>
+    <div
+		class="file-content"
+		id="file-content-id"
+		tabindex="-1"
+	>
+        <div
+			:class="{'is-visible': isVisibleSidebar, 'mobile-multi-select': isMultiSelect}"
+			@click.self="filesContainerClick"
+			class="files-container"
+			ref="fileContainer"
+		>
+            <MobileToolbar />
+
+            <SearchBar v-model="query" @reset-query="query = ''" class="mobile-search" :placeholder="$t('inputs.placeholder_search_files')" />
+
+			<!--Mobile Actions-->
+            <FileActionsMobile />
+
+			<!--Item previews list-->
+            <div class="file-list-wrapper">
+                <transition-group
+					name="file"
+					tag="section"
+					class="file-list"
+				>
+                    <InvoiceItem
+						@contextmenu.native.prevent="contextMenu($event, item)"
+						:item="item"
+						v-for="item in entries"
+						:key="item.id"
+						class="file-item"
+					/>
+                </transition-group>
+            </div>
+
+			<!--Show empty page if folder is empty-->
+            <EmptyFilePage v-if="! isSearching" />
+
+			<!--Show empty page if no search results-->
+            <EmptyMessage
+				v-if="isSearching && isEmpty"
+				:message="$t('messages.nothing_was_found')"
+				icon="eye-slash"
+			/>
+        </div>
+
+		<!--File Info Panel-->
+        <div :class="{'is-visible': isVisibleSidebar }" class="file-info-container">
+            <InvoiceInfoSidebar />
+        </div>
+    </div>
+</template>
+
+<script>
+	import InvoiceInfoSidebar from '@/Oasis/Modules/Invoices/components/InvoiceInfoSidebar'
+    import FileActionsMobile from '@/components/FilesView/FileActionsMobile'
+	import MobileToolbar from '@/components/FilesView/MobileToolbar'
+	import EmptyFilePage from '@/components/FilesView/EmptyFilePage'
+	import EmptyMessage from '@/components/FilesView/EmptyMessage'
+	import InvoiceItem from '@/Oasis/Modules/Invoices/components/InvoiceItem'
+	import SearchBar from '@/components/FilesView/SearchBar'
+	import {mapGetters} from 'vuex'
+	import {events} from '@/bus'
+
+	export default {
+		name: 'FilesContainer',
+		components: {
+			FileActionsMobile,
+			EmptyFilePage,
+			MobileToolbar,
+			InvoiceItem,
+			EmptyMessage,
+			InvoiceInfoSidebar,
+			SearchBar,
+		},
+		computed: {
+			...mapGetters([
+				'filesInQueueTotal',
+				'isVisibleSidebar',
+				'FilePreviewType',
+				'currentFolder',
+				'isSearching',
+				'clipboard',
+				'isLoading',
+				'entries',
+			]),
+			isEmpty() {
+				return this.entries.length == 0
+			},
+			draggedItems() {
+				//Set opacity for dragged items
+
+				if (!this.clipboard.includes(this.draggingId)) {
+					return [this.draggingId]
+				}
+
+				if (this.clipboard.includes(this.draggingId)) {
+					return this.clipboard
+				}
+			}
+		},
+		watch: {
+			query(val) {
+				this.$searchFiles(val)
+			}
+		},
+		data() {
+			return {
+				draggingId: undefined,
+				isDragging: false,
+				isMultiSelect: false,
+				query: '',
+			}
+		},
+		methods: {
+			deleteItems() {
+				if (this.clipboard.length > 0 && this.$checkPermission('master') || this.$checkPermission('editor')) {
+					this.$store.dispatch('deleteItem')
+				}
+			},
+			contextMenu(event, item) {
+				events.$emit('contextMenu:show', event, item)
+			},
+			filesContainerClick() {
+				this.$store.commit('CLIPBOARD_CLEAR')
+			}
+		},
+		created() {
+			events.$on('mobileSelecting:start', () => {
+				this.isMultiSelect = true
+			})
+
+			events.$on('mobileSelecting:stop', () => {
+				this.isMultiSelect = false
+			})
+
+			events.$on('fileItem:deselect', () => {
+				this.$store.commit('CLIPBOARD_CLEAR')
+			})
+
+			this.$store.commit('LOADING_STATE', {
+				isLoading: false,
+				data: [
+					{
+						id: 'c2fa9df5-se64-499b-b001-94691ccb14e2',
+						name: 'Nitex s.r.o. - 3260,00 EUR',
+						invoiceNumber: '2021001',
+						total: '3260,00 EUR',
+						created_at: '12. April. 2021',
+						clientName: 'Nitex s.r.o.',
+						file_url: 'http://192.168.1.198:8000/file/9ti6r4481cqtuk36-190001-FMkuIZM5TYWjp0TpxoTPjSYj96a5qMtM.pdf',
+						mimetype: 'pdf',
+					},
+					{
+						id: 'c3fa9df5-ee64-499b-b001-94691ccb14e1',
+						name: 'VueFileManager s.r.o. - 220,00 EUR',
+						invoiceNumber: '2021002',
+						total: '220,00 EUR',
+						created_at: '9. April. 2021',
+						clientName: 'VueFileManager s.r.o.',
+						file_url: 'http://192.168.1.198:8000/file/9ti6r4481cqtuk36-190001-FMkuIZM5TYWjp0TpxoTPjSYj96a5qMtM.pdf',
+						mimetype: 'pdf',
+					},
+				],
+			})
+		}
+	}
+</script>
+
+<style scoped lang="scss">
+    @import '@assets/vuefilemanager/_variables';
+	@import '@assets/vuefilemanager/_mixins';
+
+	.file-list {
+		.dragged {
+			/deep/ .is-dragenter {
+				border: 2px solid transparent;
+			}
+		}
+	}
+
+	.dragged {
+		opacity: 0.5;
+	}
+
+	#multi-selected {
+		position: fixed;
+		pointer-events: none;
+		z-index: 100;
+
+	}
+
+	.mobile-multi-select {
+		bottom: 50px !important;
+		top: 0px;
+	}
+
+	.button-upload {
+		display: block;
+		text-align: center;
+		margin: 20px 0;
+	}
+
+	.mobile-search {
+		display: none;
+		margin-bottom: 10px;
+		margin-top: 10px;
+	}
+
+	.file-content {
+		display: flex;
+
+		&.is-dragging {
+			@include transform(scale(0.99));
+		}
+	}
+
+	.files-container {
+		overflow-x: hidden;
+		overflow-y: auto;
+		flex: 0 0 100%;
+		@include transition(150ms);
+		position: relative;
+		scroll-behavior: smooth;
+
+		&.is-visible {
+			flex: 0 1 100%;
+		}
+
+		.file-list {
+
+			&.grid {
+				display: grid;
+				grid-template-columns: repeat(auto-fill, 180px);
+				justify-content: space-evenly;
+			}
+		}
+	}
+
+	.file-info-container {
+		flex: 0 0 300px;
+		padding-left: 20px;
+		overflow: auto;
+	}
+
+	// Transition
+	.file-move {
+		transition: transform 0.6s;
+	}
+
+	.file-enter-active {
+		transition: all 300ms ease;
+	}
+
+	.file-leave-active {
+		transition: all 0ms;
+	}
+
+	.file-enter, .file-leave-to /* .list-leave-active below version 2.1.8 */
+	{
+		opacity: 0;
+		transform: translateX(-20px);
+	}
+
+	@media only screen and (min-width: 960px) {
+
+		.file-content {
+			position: absolute;
+			top: 72px;
+			left: 15px;
+			right: 15px;
+			bottom: 0;
+			@include transition;
+			overflow-y: auto;
+			overflow-x: hidden;
+
+			&.is-offset {
+				margin-top: 50px;
+			}
+		}
+	}
+
+	@media only screen and (max-width: 960px) {
+
+		.file-info-container {
+			display: none;
+		}
+
+		.mobile-search {
+			display: block;
+		}
+		.file-content {
+			position: absolute;
+			top: 0px;
+			left: 15px;
+			right: 15px;
+			bottom: 0;
+			@include transition;
+			overflow-y: auto;
+			overflow-x: hidden;
+
+			&.is-offset {
+				margin-top: 50px;
+			}
+		}
+	}
+
+	@media only screen and (max-width: 690px) {
+
+		.files-container {
+			padding-left: 15px;
+			padding-right: 15px;
+			top: 0;
+			left: 0;
+			right: 0;
+			bottom: 0;
+			position: fixed;
+			overflow-y: auto;
+
+			.file-list {
+
+				&.grid {
+					grid-template-columns: repeat(auto-fill, 120px);
+				}
+			}
+		}
+
+		.file-content {
+			position: absolute;
+			top: 0;
+			left: 0px;
+			right: 0px;
+			bottom: 0;
+			@include transition;
+
+			&.is-offset {
+				margin-top: 50px;
+			}
+		}
+
+		.mobile-search {
+			margin-bottom: 0;
+		}
+
+		.file-info-container {
+			display: none;
+		}
+	}
+</style>
diff --git a/resources/js/Oasis/Modules/Invoices/components/InvoiceContextMenu.vue b/resources/js/Oasis/Modules/Invoices/components/InvoiceContextMenu.vue
new file mode 100644
index 00000000..9654ef17
--- /dev/null
+++ b/resources/js/Oasis/Modules/Invoices/components/InvoiceContextMenu.vue
@@ -0,0 +1,237 @@
+<template>
+    <div :style="{ top: positionY + 'px', left: positionX + 'px' }" @click="closeAndResetContextMenu" class="contextmenu" v-show="isVisible || showFromPreview" ref="contextmenu" :class="{'filePreviewFixed': showFromPreview}">
+
+        <!-- File Preview -->
+        <div class="menu-options" id="menu-list">
+            <OptionGroup class="menu-option-group">
+                <Option @click.native="" title="Edit Invoice" icon="rename" />
+                <Option @click.native="" title="Share Invoice" icon="send" />
+                <Option @click.native="" title="Go to Company" icon="user" />
+                <Option @click.native="deleteItem" :title="$t('context_menu.delete')" icon="trash" />
+            </OptionGroup>
+
+            <OptionGroup>
+                <Option @click.native="showDetail" :title="$t('context_menu.detail')" icon="detail" />
+                <Option @click.native="downloadItem" :title="$t('context_menu.download')" icon="download" />
+            </OptionGroup>
+        </div>
+
+    </div>
+</template>
+
+<script>
+import OptionGroup from '@/components/FilesView/OptionGroup'
+import Option from '@/components/FilesView/Option'
+import {mapGetters} from 'vuex'
+import {events} from '@/bus'
+
+export default {
+    name: 'ContextMenu',
+    components: {
+        OptionGroup,
+        Option
+    },
+    computed: {
+        ...mapGetters([
+			'user',
+			'clipboard'
+		]),
+        isMultiSelectContextMenu() {
+
+            // If is context Menu open on multi selected items open just options for the multi selected items
+            if (this.clipboard.length > 1 && this.clipboard.includes(this.item))
+                return false
+
+            // If is context Menu open for the non selected item open options for the single item
+            if (this.clipboard.length < 2 || !this.clipboard.includes(this.item))
+                return true
+        },
+    },
+    data() {
+        return {
+            showFromPreview: false,
+            item: undefined,
+            isVisible: false,
+            positionX: 0,
+            positionY: 0
+        }
+    },
+    methods: {
+        downloadItem() {
+            if (this.clipboard.length > 1)
+                this.$store.dispatch('downloadFiles')
+            else {
+                this.$downloadFile(this.item.file_url, this.item.name + '.' + this.item.mimetype)
+            }
+        },
+		showDetail() {
+            // Dispatch load file info detail
+            this.$store.commit('ADD_ITEM_TO_CLIPBOARD', this.item)
+
+            // Show panel if is not open
+            this.$store.dispatch('fileInfoToggle', true)
+        },
+        deleteItem() {
+
+        },
+        closeAndResetContextMenu() {
+            // Close context menu
+            this.isVisible = false
+
+            // Reset item container
+            this.item = undefined
+        },
+        showFolderActionsMenu() {
+            let container = document.getElementById('folder-actions')
+
+            this.positionX = container.offsetLeft + 16
+            this.positionY = container.offsetTop + 30
+
+            // Show context menu
+            this.isVisible = true
+        },
+        showContextMenu(event) {
+            let parent = document.getElementById('menu-list')
+            let nodesSameClass = parent.getElementsByClassName('menu-option')
+
+            let VerticalOffsetArea = nodesSameClass.length * 50
+            let HorizontalOffsetArea = 190
+
+            let container = document.getElementById('files-view')
+
+            var offset = container.getClientRects()[0]
+
+            let x = event.clientX - offset.left
+            let y = event.clientY - offset.top
+
+            // Set position Y
+            if (container.offsetHeight - y < VerticalOffsetArea) {
+                this.positionY = y - VerticalOffsetArea
+            } else {
+                this.positionY = y
+            }
+
+            // Set position X
+            if (container.offsetWidth - x < HorizontalOffsetArea) {
+                this.positionX = x - HorizontalOffsetArea
+            } else {
+                this.positionX = x
+            }
+
+            // Show context menu
+            this.isVisible = true
+        },
+        showFilePreviewMenu() {
+            let container = document.getElementById('fast-preview-menu')
+            if (container) {
+                this.positionX = container.offsetLeft + 16
+                this.positionY = container.offsetTop + 51
+            }
+        }
+    },
+    created() {
+        events.$on('showContextMenuPreview:show', (item) => {
+            if (!this.showFromPreview) {
+                this.item = item
+                this.showFromPreview = true
+                this.showFilePreviewMenu()
+            } else if (this.showFromPreview) {
+                this.showFromPreview = false
+                this.item = undefined
+            }
+        })
+
+        events.$on('showContextMenuPreview:hide', () => {
+            this.isVisible = false
+            this.showFromPreview = false
+            this.item = undefined
+        })
+
+        events.$on('contextMenu:show', (event, item) => {
+            // Store item
+            this.item = item
+
+            // Show context menu
+            setTimeout(() => this.showContextMenu(event, item), 10)
+        })
+
+        events.$on('unClick', () => this.closeAndResetContextMenu())
+
+        events.$on('folder:actions', (folder) => {
+            // Store item
+            this.item = folder
+
+            if (this.isVisible) this.isVisible = false
+            else this.showFolderActionsMenu()
+        })
+    }
+}
+</script>
+
+<style scoped lang="scss">
+@import "@assets/vuefilemanager/_variables";
+@import "@assets/vuefilemanager/_mixins";
+
+.no-options {
+    /deep/ .text-label {
+        color: $text-muted !important;
+    }
+
+    /deep/ &:hover {
+        background: transparent;
+    }
+
+    /deep/ path,
+    /deep/ line,
+    /deep/ circle {
+        stroke: $text-muted !important;
+    }
+}
+
+.filePreviewFixed {
+    position: fixed !important;
+    display: flex;
+}
+
+.contextmenu {
+    min-width: 250px;
+    position: absolute;
+    z-index: 99;
+    box-shadow: $shadow;
+    background: white;
+    border-radius: 8px;
+    overflow: hidden;
+
+    &.showed {
+        display: block;
+    }
+}
+
+.menu-options {
+    list-style: none;
+    width: 100%;
+    margin: 0;
+    padding: 0;
+}
+
+@media (prefers-color-scheme: dark) {
+    .contextmenu {
+        background: $dark_mode_foreground;
+    }
+    .no-options {
+        /deep/ .text-label {
+            color: $dark_mode_text_secondary !important;
+        }
+
+        /deep/ &:hover {
+            background: transparent;
+        }
+
+        /deep/ path,
+        /deep/ line,
+        /deep/ circle {
+            stroke: $dark_mode_text_secondary !important;
+        }
+    }
+}
+</style>
diff --git a/resources/js/Oasis/Modules/Invoices/components/DesktopToolbarInvoices.vue b/resources/js/Oasis/Modules/Invoices/components/InvoiceDesktopToolbar.vue
similarity index 97%
rename from resources/js/Oasis/Modules/Invoices/components/DesktopToolbarInvoices.vue
rename to resources/js/Oasis/Modules/Invoices/components/InvoiceDesktopToolbar.vue
index f7feb236..315a5934 100644
--- a/resources/js/Oasis/Modules/Invoices/components/DesktopToolbarInvoices.vue
+++ b/resources/js/Oasis/Modules/Invoices/components/InvoiceDesktopToolbar.vue
@@ -37,6 +37,7 @@
 				<!--Invoice Controls-->
 				<ToolbarGroup v-if="! $isMobile()">
                     <ToolbarButton @click.native="shareInvoice" source="send" :action="$t('actions.share')" />
+                    <ToolbarButton @click.native="shareInvoice" source="rename" :action="$t('actions.share')" />
                     <ToolbarButton @click.native="deleteInvoice" source="trash" :action="$t('actions.delete')" />
 				</ToolbarGroup>
 
@@ -70,7 +71,7 @@
 	import Option from '@/components/FilesView/Option'
 
 	export default {
-		name: 'ToolBar',
+		name: 'InvoiceDesktopToolbar',
 		components: {
 			FileSortingOptions,
 			MoreHorizontalIcon,
diff --git a/resources/js/Oasis/Modules/Invoices/components/InvoiceInfoSidebar.vue b/resources/js/Oasis/Modules/Invoices/components/InvoiceInfoSidebar.vue
new file mode 100644
index 00000000..6beda0c7
--- /dev/null
+++ b/resources/js/Oasis/Modules/Invoices/components/InvoiceInfoSidebar.vue
@@ -0,0 +1,153 @@
+<template>
+    <div class="info-wrapper">
+
+		<!--Is empty clipboard-->
+		<EmptyMessage
+			v-if="isEmpty"
+			:message="$t('messages.nothing_to_preview')"
+			icon="eye-off"
+		/>
+
+		<!--Multiple item selection-->
+        <div v-if="! isSingleFile && !isEmpty" class="info-headline">
+			<TitlePreview
+				icon="check-square"
+				:title="$t('file_detail.selected_multiple')"
+				:subtitle="this.clipboard.length + ' ' + $tc('file_detail.items', this.clipboard.length)"
+			/>
+        </div>
+
+		<!--Single file preview-->
+        <div v-if="isSingleFile && !isEmpty" class="info-headline">
+            <FilePreviewDetail />
+
+			<TitlePreview
+				icon="file-text"
+				:title="singleFile.clientName"
+				:subtitle="'Invoice - ' + singleFile.invoiceNumber"
+			/>
+        </div>
+
+		<!--File info-->
+        <ListInfo v-if="isSingleFile && !isEmpty">
+
+            <ListInfoItem
+				title="Invoice Number"
+				:content="singleFile.invoiceNumber"
+			/>
+
+            <ListInfoItem
+				title="Total"
+				:content="singleFile.total"
+			/>
+
+            <ListInfoItem
+				title="Client"
+				:content="singleFile.clientName"
+			/>
+
+			<!--Created At-->
+            <ListInfoItem
+				:title="$t('file_detail.created_at')"
+				:content="singleFile.created_at"
+			/>
+
+        </ListInfo>
+    </div>
+</template>
+
+<script>
+	import FilePreviewDetail from '@/components/Others/FilePreviewDetail'
+    import {Edit2Icon, LockIcon, UnlockIcon} from 'vue-feather-icons'
+	import ImageMetaData from '@/components/FilesView/ImageMetaData'
+    import EmptyMessage from '@/components/FilesView/EmptyMessage'
+	import TitlePreview from '@/components/FilesView/TitlePreview'
+	import CopyInput from '@/components/Others/Forms/CopyInput'
+	import ListInfoItem from '@/components/Others/ListInfoItem'
+	import ListInfo from '@/components/Others/ListInfo'
+	import {mapGetters} from 'vuex'
+	import {events} from "@/bus"
+
+	export default {
+		name: 'InfoSidebar',
+		components: {
+			FilePreviewDetail,
+			ImageMetaData,
+			EmptyMessage,
+			TitlePreview,
+			ListInfoItem,
+			UnlockIcon,
+			CopyInput,
+			Edit2Icon,
+			LockIcon,
+			ListInfo,
+		},
+		computed: {
+			...mapGetters([
+				'permissionOptions',
+				'clipboard',
+			]),
+			isEmpty() {
+				return this.clipboard.length === 0
+			},
+			isSingleFile() {
+				return this.clipboard.length === 1
+			},
+			singleFile() {
+				return this.clipboard[0]
+			},
+			canShowMetaData() {
+				return this.clipboard[0].metadata && this.clipboard[0].metadata.ExifImageWidth
+			},
+			isLocked() {
+				return this.clipboard[0].shared.is_protected
+			},
+			sharedInfo() {
+				let title = this.permissionOptions.find(option => {
+					return option.value === this.clipboard[0].shared.permission
+				})
+
+				return title ? this.$t(title.label) : this.$t('shared.can_download')
+			},
+		},
+		methods: {
+			openShareOptions() {
+				events.$emit('popup:open', {name: 'share-edit', item: this.clipboard[0]})
+			},
+			openMoveOptions() {
+				events.$emit("popup:open", {name: "move", item: this.clipboard});
+			}
+		}
+	}
+</script>
+
+<style scoped lang="scss">
+
+	.info-wrapper {
+		padding-bottom: 20px;
+		height: 100%;
+	}
+
+	.info-headline {
+		margin-bottom: 20px;
+		border-radius: 8px;
+	}
+
+	.share-link {
+		display: flex;
+		width: 100%;
+		align-items: center;
+		margin-top: 10px;
+
+		.lock-icon {
+			display: inline-block;
+			width: 15px;
+			margin-right: 9px;
+			cursor: pointer;
+		}
+
+		.copy-share-link {
+			width: 100%;
+		}
+	}
+</style>
diff --git a/resources/js/Oasis/Modules/Invoices/components/InvoiceItem.vue b/resources/js/Oasis/Modules/Invoices/components/InvoiceItem.vue
new file mode 100644
index 00000000..04494441
--- /dev/null
+++ b/resources/js/Oasis/Modules/Invoices/components/InvoiceItem.vue
@@ -0,0 +1,454 @@
+<template>
+    <div class="file-wrapper" @mouseup.stop="clickedItem" @dblclick="showInvoice">
+        <div class="file-item" :class="{'is-clicked': isClicked , 'no-clicked': !isClicked && $isMobile()}">
+
+			<!-- MultiSelecting for the mobile version -->
+            <transition name="slide-from-left">
+                <div class="check-select" v-if="isMobileSelectMode">
+                    <div class="select-box" :class="{'select-box-active': isClicked } ">
+                        <CheckIcon v-if="isClicked" class="icon" size="17" />
+                    </div>
+                </div>
+            </transition>
+
+            <!--Name-->
+            <div class="item-name">
+
+				<b :ref="item.id" class="name">
+                    {{ item.clientName }} - {{ item.total }}
+                </b>
+
+                <div class="item-info">
+                    <span class="item-size">
+						{{ item.created_at }}, {{ item.invoiceNumber }}
+					</span>
+                </div>
+            </div>
+
+            <!--Show item actions-->
+            <transition name="slide-from-right">
+                <div class="actions" v-if="$isMobile() && ! isMobileSelectMode">
+                    <span @mousedown.stop="showItemActions" class="show-actions">
+                        <MoreVerticalIcon size="16" class="icon-action text-theme" />
+                    </span>
+                </div>
+            </transition>
+        </div>
+    </div>
+</template>
+
+<script>
+import {CheckIcon, MoreVerticalIcon} from 'vue-feather-icons'
+import {mapGetters} from 'vuex'
+import {events} from '@/bus'
+
+export default {
+    name: 'InvoiceItem',
+    props: [
+		'item'
+	],
+    components: {
+        MoreVerticalIcon,
+        CheckIcon,
+    },
+    computed: {
+        ...mapGetters([
+            'FilePreviewType',
+            'clipboard',
+            'entries'
+        ]),
+        isClicked() {
+            return this.clipboard.some(element => element.id === this.item.id)
+        },
+    },
+    data() {
+        return {
+            isMobileSelectMode: false
+        }
+    },
+    methods: {
+        showItemActions() {
+            this.$store.commit('CLIPBOARD_CLEAR')
+            this.$store.commit('ADD_ITEM_TO_CLIPBOARD', this.item)
+
+            events.$emit('mobile-menu:show', 'invoice-menu')
+        },
+        clickedItem(e) {
+            if (!this.$isMobile()) {
+
+                if ((e.ctrlKey || e.metaKey) && !e.shiftKey) {
+
+                	// Click + Ctrl
+                    if (this.clipboard.some(item => item.data.id === this.item.data.id)) {
+                        this.$store.commit('REMOVE_ITEM_FROM_CLIPBOARD', this.item)
+                    } else {
+                        this.$store.commit('ADD_ITEM_TO_CLIPBOARD', this.item)
+                    }
+
+                } else if (e.shiftKey) {
+
+                	// Click + Shift
+                    let lastItem = this.entries.indexOf(this.clipboard[this.clipboard.length - 1])
+                    let clickedItem = this.entries.indexOf(this.item)
+
+                    // If Click + Shift + Ctrl dont remove already selected items
+                    if (!e.ctrlKey && !e.metaKey) {
+                        this.$store.commit('CLIPBOARD_CLEAR')
+                    }
+
+                    //Shift selecting from top to bottom
+                    if (lastItem < clickedItem) {
+                        for (let i = lastItem; i <= clickedItem; i++) {
+                            this.$store.commit('ADD_ITEM_TO_CLIPBOARD', this.entries[i])
+                        }
+                        //Shift selecting from bottom to top
+                    } else {
+                        for (let i = lastItem; i >= clickedItem; i--) {
+                            this.$store.commit('ADD_ITEM_TO_CLIPBOARD', this.entries[i])
+                        }
+                    }
+
+                } else {
+
+                	// Click
+                    this.$store.commit('CLIPBOARD_CLEAR')
+                    this.$store.commit('ADD_ITEM_TO_CLIPBOARD', this.item)
+                }
+            }
+
+            if (!this.isMobileSelectMode && this.$isMobile()) {
+				events.$emit('file-preview:show')
+            }
+
+            if (this.isMobileSelectMode && this.$isMobile()) {
+                if (this.clipboard.some(item => item.data.id === this.item.data.id)) {
+                    this.$store.commit('REMOVE_ITEM_FROM_CLIPBOARD', this.item)
+                } else {
+                    this.$store.commit('ADD_ITEM_TO_CLIPBOARD', this.item)
+                }
+            }
+        },
+        showInvoice() {
+			events.$emit('file-preview:show')
+        },
+    },
+    created() {
+        events.$on('mobileSelecting:start', () => {
+            this.isMobileSelectMode = true
+            this.$store.commit('CLIPBOARD_CLEAR')
+        })
+
+        events.$on('mobileSelecting:stop', () => {
+            this.isMobileSelectMode = false
+            this.$store.commit('CLIPBOARD_CLEAR')
+        })
+    }
+}
+</script>
+
+<style scoped lang="scss">
+@import '@assets/vuefilemanager/_variables';
+@import '@assets/vuefilemanager/_mixins';
+
+
+.slide-from-left-move {
+    transition: transform 300s ease;
+}
+
+.slide-from-left-enter-active,
+.slide-from-right-enter-active,
+.slide-from-left-leave-active,
+.slide-from-right-leave-active {
+    transition: all 300ms;
+}
+
+.slide-from-left-enter,
+.slide-from-left-leave-to {
+    opacity: 0;
+    transform: translateX(-100%);
+}
+
+.slide-from-right-enter,
+.slide-from-right-leave-to {
+    opacity: 0;
+    transform: translateX(100%);
+}
+
+
+.check-select {
+    margin-right: 15px;
+    margin-left: 6px;
+
+    .select-box {
+        width: 20px;
+        height: 20px;
+        background-color: darken($light_background, 5%);
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        border-radius: 5px;
+    }
+
+    .select-box-active {
+        background-color: $theme;
+
+        .icon {
+            stroke: white;
+        }
+    }
+}
+
+.file-wrapper {
+    user-select: none;
+    position: relative;
+
+    &:hover {
+        border-color: transparent;
+    }
+
+    .actions {
+        text-align: right;
+        width: 50px;
+
+        .show-actions {
+            cursor: pointer;
+            padding: 12px 0 12px 6px;
+
+            .icon-action {
+                margin-top: 9px;
+                @include font-size(14);
+
+                circle {
+                    color: inherit;
+                }
+            }
+        }
+    }
+
+    .item-name {
+        display: block;
+        width: 100%;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+
+        .item-info {
+            display: block;
+            line-height: 1;
+        }
+
+        .item-shared {
+            display: inline-block;
+
+            .label {
+                @include font-size(12);
+                font-weight: 400;
+                color: $theme;
+            }
+
+            .shared-icon {
+                vertical-align: middle;
+
+                path,
+                circle,
+                line {
+                    color: inherit;
+                }
+            }
+        }
+
+        .item-size,
+        .item-length {
+            @include font-size(11);
+            font-weight: 400;
+            color: rgba($text, 0.7);
+        }
+
+        .name {
+            white-space: nowrap;
+
+            &[contenteditable] {
+                -webkit-user-select: text;
+                user-select: text;
+            }
+
+            &[contenteditable='true']:hover {
+                text-decoration: underline;
+            }
+        }
+
+        .name {
+            color: $text;
+            @include font-size(14);
+            font-weight: 700;
+            max-height: 40px;
+            overflow: hidden;
+            text-overflow: ellipsis;
+
+            &.actived {
+                max-height: initial;
+            }
+        }
+    }
+
+    &.selected {
+        .file-item {
+            background: $light_background;
+        }
+    }
+
+    .icon-item {
+        text-align: center;
+        position: relative;
+        flex: 0 0 50px;
+        line-height: 0;
+        margin-right: 20px;
+
+        .folder {
+            width: 52px;
+            height: 52px;
+
+            /deep/ .folder-icon {
+                @include font-size(52)
+            }
+        }
+
+        .file-icon {
+            @include font-size(45);
+
+            path {
+                fill: #fafafc;
+                stroke: #dfe0e8;
+                stroke-width: 1;
+            }
+        }
+
+        .file-icon-text {
+            line-height: 1;
+            top: 40%;
+            @include font-size(11);
+            margin: 0 auto;
+            position: absolute;
+            text-align: center;
+            left: 0;
+            right: 0;
+            font-weight: 600;
+            user-select: none;
+            max-width: 50px;
+            max-height: 20px;
+            overflow: hidden;
+            text-overflow: ellipsis;
+            white-space: nowrap;
+        }
+
+        .image {
+            object-fit: cover;
+            user-select: none;
+            max-width: 100%;
+            border-radius: 5px;
+            width: 50px;
+            height: 50px;
+            pointer-events: none;
+        }
+    }
+
+    .file-item {
+        border: 2px dashed transparent;
+        width: 100%;
+        display: flex;
+        align-items: center;
+        padding: 7px 7px 7px 15px;
+
+        &.is-dragenter {
+            border-radius: 8px;
+        }
+
+        &.no-clicked {
+            background: white !important;
+
+            .item-name {
+                .name {
+                    color: $text !important;
+                }
+            }
+        }
+
+        &:hover,
+        &.is-clicked {
+            border-radius: 8px;
+            background: $light_background;
+        }
+    }
+}
+
+@media (prefers-color-scheme: dark) {
+    .check-select {
+
+        .select-box {
+            background-color: lighten($dark_mode_foreground, 10%);
+        }
+
+        .select-box-active {
+            background-color: $theme;
+
+            .icon {
+                stroke: white;
+            }
+        }
+    }
+
+    .file-wrapper {
+        .icon-item {
+            .file-icon {
+                path {
+                    fill: $dark_mode_foreground;
+                    stroke: #2f3c54;
+                }
+            }
+        }
+
+        .file-item {
+            &.no-clicked {
+                background: $dark_mode_background !important;
+
+                .file-icon {
+
+                    path {
+                        fill: $dark_mode_foreground !important;
+                        stroke: #2F3C54;
+                    }
+                }
+
+                .item-name {
+
+                    .name {
+                        color: $dark_mode_text_primary !important;
+                    }
+                }
+            }
+
+            &:hover,
+            &.is-clicked {
+                background: $dark_mode_foreground;
+
+                .file-icon {
+                    path {
+                        fill: $dark_mode_background;
+                    }
+                }
+            }
+        }
+
+        .item-name {
+            .name {
+                color: $dark_mode_text_primary;
+            }
+
+            .item-size,
+            .item-length {
+                color: $dark_mode_text_secondary;
+            }
+        }
+    }
+}
+</style>
\ No newline at end of file
diff --git a/resources/js/Oasis/Modules/Invoices/components/InvoiceMobileMenu.vue b/resources/js/Oasis/Modules/Invoices/components/InvoiceMobileMenu.vue
new file mode 100644
index 00000000..a5057dad
--- /dev/null
+++ b/resources/js/Oasis/Modules/Invoices/components/InvoiceMobileMenu.vue
@@ -0,0 +1,70 @@
+<template>
+    <MenuMobile name="invoice-menu">
+		<TitlePreview
+			v-if="clipboard[0]"
+			class="headline"
+			icon="file-text"
+			:title="clipboard[0].name"
+			:subtitle="'Invoice - ' + clipboard[0].invoiceNumber"
+		/>
+
+		<!--Trash location-->
+        <MenuMobileGroup>
+            <OptionGroup class="menu-option-group">
+                <Option @click.native="" title="Edit Invoice" icon="rename" />
+                <Option @click.native="" title="Share Invoice" icon="send" />
+                <Option @click.native="" title="Go to Company" icon="user" />
+                <Option @click.native="" :title="$t('context_menu.delete')" icon="trash" />
+            </OptionGroup>
+
+            <OptionGroup>
+                <Option @click.native="" :title="$t('context_menu.detail')" icon="detail" />
+                <Option @click.native="" :title="$t('context_menu.download')" icon="download" />
+            </OptionGroup>
+        </MenuMobileGroup>
+    </MenuMobile>
+</template>
+
+<script>
+import MenuMobileGroup from '@/components/Mobile/MenuMobileGroup'
+import TitlePreview from '@/components/FilesView/TitlePreview'
+import ThumbnailItem from '@/components/Others/ThumbnailItem'
+import OptionGroup from '@/components/FilesView/OptionGroup'
+import MenuMobile from '@/components/Mobile/MenuMobile'
+import Option from '@/components/FilesView/Option'
+import {mapGetters} from 'vuex'
+
+export default {
+    name: 'FileMenuMobile',
+    components: {
+        MenuMobileGroup,
+        ThumbnailItem,
+		TitlePreview,
+        OptionGroup,
+        MenuMobile,
+        Option,
+    },
+    computed: {
+        ...mapGetters([
+            'clipboard',
+            'user',
+        ]),
+    },
+    data() {
+        return {
+            isVisible: false,
+        }
+    },
+    methods: {
+
+    }
+}
+</script>
+
+<style scoped lang="scss">
+
+	.headline {
+		padding: 20px 20px 10px;
+		margin-bottom: 0;
+	}
+</style>
diff --git a/resources/js/components/FilesView/FileItemGrid.vue b/resources/js/components/FilesView/FileItemGrid.vue
index 871cade1..adbf8dc8 100644
--- a/resources/js/components/FilesView/FileItemGrid.vue
+++ b/resources/js/components/FilesView/FileItemGrid.vue
@@ -171,8 +171,6 @@ export default {
             this.area = false
         },
         clickedItem(e) {
-            events.$emit('unClick')
-
             if (!this.$isMobile()) {
 
                 // After click deselect new folder rename input
diff --git a/resources/js/components/FilesView/FileItemList.vue b/resources/js/components/FilesView/FileItemList.vue
index b7799460..f0d26837 100644
--- a/resources/js/components/FilesView/FileItemList.vue
+++ b/resources/js/components/FilesView/FileItemList.vue
@@ -170,8 +170,6 @@ export default {
             this.area = false
         },
         clickedItem(e) {
-            events.$emit('unClick')
-
             if (!this.$isMobile()) {
 
                 // After click deselect new folder rename input
diff --git a/resources/js/components/FilesView/Option.vue b/resources/js/components/FilesView/Option.vue
index 53f44fb3..d5a8c99e 100644
--- a/resources/js/components/FilesView/Option.vue
+++ b/resources/js/components/FilesView/Option.vue
@@ -33,6 +33,7 @@
             <monitor-icon v-if="icon === 'monitor'" size="17" class="group-hover-text-theme" :class="{'text-theme': isActive}"/>
             <box-icon v-if="icon === 'box'" size="17" class="group-hover-text-theme" :class="{'text-theme': isActive}"/>
             <clock-icon v-if="icon === 'clock'" size="17" class="group-hover-text-theme" :class="{'text-theme': isActive}"/>
+            <send-icon v-if="icon === 'send'" size="17" class="group-hover-text-theme" :class="{'text-theme': isActive}"/>
         </div>
         <div class="text-label group-hover-text-theme" :class="{'text-theme': isActive}">
             {{ title }}
@@ -46,6 +47,7 @@
 <script>
 import AlphabetIcon from '@/components/FilesView/Icons/AlphabetIcon'
 import {
+	SendIcon,
 	ClockIcon,
     ChevronRightIcon,
     BoxIcon,
@@ -89,6 +91,7 @@ import {
             'icon'
         ],
         components: {
+			SendIcon,
 			ClockIcon,
 			BoxIcon,
             MonitorIcon,
diff --git a/resources/js/components/FilesView/TitlePreview.vue b/resources/js/components/FilesView/TitlePreview.vue
index b454e800..04edd998 100644
--- a/resources/js/components/FilesView/TitlePreview.vue
+++ b/resources/js/components/FilesView/TitlePreview.vue
@@ -6,6 +6,7 @@
 			<video-icon v-if="icon === 'video'" class="icon text-theme" size="21" />
 			<folder-icon v-if="icon === 'folder'" class="icon text-theme" size="21" />
 			<file-icon v-if="icon === 'file'" class="icon text-theme" size="21" />
+			<file-text-icon v-if="icon === 'file-text'" class="icon text-theme" size="21" />
         </div>
         <div class="text">
             <span class="title">{{ title }}</span>
@@ -17,6 +18,7 @@
 <script>
 import {
 	CheckSquareIcon,
+	FileTextIcon,
 	FolderIcon,
 	ImageIcon,
 	VideoIcon,
@@ -32,6 +34,7 @@ export default {
     ],
     components: {
         CheckSquareIcon,
+		FileTextIcon,
 		FolderIcon,
 		ImageIcon,
 		VideoIcon,
@@ -71,7 +74,7 @@ export default {
 
     .icon-wrapper {
 
-        polyline, path, rect, circle, polyline {
+        polyline, path, rect, circle, polyline, line {
             color: inherit;
         }
     }