diff --git a/.eslintrc.js b/.eslintrc.js
index 4d77354..d74d7c5 100644
--- a/.eslintrc.js
+++ b/.eslintrc.js
@@ -1,16 +1,17 @@
 module.exports = {
     root: true,
     env: {
-        node: true
+        node: true,
     },
     extends: ['plugin:vue/vue3-essential', 'eslint:recommended'],
     parserOptions: {
-        parser: 'babel-eslint'
+        parser: 'babel-eslint',
     },
     rules: {
         'no-console': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
         'no-debugger': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
         'no-unused-vars': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
-        'no-undef': process.env.NODE_ENV === 'production' ? 'warn' : 'off'
-    }
+        'no-undef': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
+        'array-element-newline': ['error', 'consistent'],
+    },
 }
diff --git a/babel.config.js b/babel.config.js
index e955840..f47f7db 100644
--- a/babel.config.js
+++ b/babel.config.js
@@ -1,5 +1,3 @@
 module.exports = {
-  presets: [
-    '@vue/cli-plugin-babel/preset'
-  ]
+    presets: ['@vue/cli-plugin-babel/preset'],
 }
diff --git a/package-lock.json b/package-lock.json
index 6aba3da..5dd98f6 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,5 +1,5 @@
 {
-    "name": "vue3-empty",
+    "name": "zippy",
     "version": "0.1.0",
     "lockfileVersion": 1,
     "requires": true,
@@ -9,14 +9,6 @@
             "resolved": "https://registry.npmjs.org/7zip-bin/-/7zip-bin-5.1.1.tgz",
             "integrity": "sha512-sAP4LldeWNz0lNzmTird3uWfFDWWTeg6V/MsmyyLR9X1idwKBWIgt/ZvinqQldJm3LecKEs1emkbquO6PCiLVQ=="
         },
-        "7zip-min": {
-            "version": "1.3.2",
-            "resolved": "https://registry.npmjs.org/7zip-min/-/7zip-min-1.3.2.tgz",
-            "integrity": "sha512-6mJ0lJ6N0djfUgt9xBaupr7Se0pidYNM2UIDYk2CJg4S9071TeY0QfSCN11iLMs1qEjLklRiOxBhIdk8futW4A==",
-            "requires": {
-                "7zip-bin": "^5.1.1"
-            }
-        },
         "@babel/code-frame": {
             "version": "7.14.5",
             "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.14.5.tgz",
@@ -1215,6 +1207,19 @@
                 "to-fast-properties": "^2.0.0"
             }
         },
+        "@continuata/unrar": {
+            "version": "1.6.0",
+            "resolved": "https://registry.npmjs.org/@continuata/unrar/-/unrar-1.6.0.tgz",
+            "integrity": "sha512-zPhtsG4e0a8wx6bEDw3bKiikyyPMivSqP7Mh8pKAqGDScmWK3mRVZUqsRPSRyU9XO9WKRZb7rGQBrTOof0T3xA==",
+            "requires": {
+                "app-root-dir": "^1.0.2"
+            }
+        },
+        "@daybrush/utils": {
+            "version": "1.5.0",
+            "resolved": "https://registry.npmjs.org/@daybrush/utils/-/utils-1.5.0.tgz",
+            "integrity": "sha512-f/9JNy4yqsUO/pzu9fcXpnCXyO6aQQGA5L2x60zsEhmiRyStqdD8fbYZfelT4khmnSt6g11DiLtTOIVIoUhF8Q=="
+        },
         "@develar/schema-utils": {
             "version": "2.6.5",
             "resolved": "https://registry.npmjs.org/@develar/schema-utils/-/schema-utils-2.6.5.tgz",
@@ -1245,6 +1250,19 @@
                 }
             }
         },
+        "@egjs/children-differ": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/@egjs/children-differ/-/children-differ-1.0.1.tgz",
+            "integrity": "sha512-DRvyqMf+CPCOzAopQKHtW+X8iN6Hy6SFol+/7zCUiE5y4P/OB8JP8FtU4NxtZwtafvSL4faD5KoQYPj3JHzPFQ==",
+            "requires": {
+                "@egjs/list-differ": "^1.0.0"
+            }
+        },
+        "@egjs/list-differ": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/@egjs/list-differ/-/list-differ-1.0.0.tgz",
+            "integrity": "sha512-HsbMKc0ZAQH+EUeCmI/2PvTYSybmkaWwakU8QGDYYgMVIg9BQ5sM0A0Nnombjxo2+JzXHxmH+jw//yGX+y6GYw=="
+        },
         "@electron/get": {
             "version": "1.12.4",
             "resolved": "https://registry.npmjs.org/@electron/get/-/get-1.12.4.tgz",
@@ -1480,6 +1498,11 @@
                 "glob-to-regexp": "^0.3.0"
             }
         },
+        "@node_js/unrar": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/@node_js/unrar/-/unrar-1.0.1.tgz",
+            "integrity": "sha512-ORpRO3ZTxuFf5x/AneFJ064F6xlsxSW0qv0Sp2mx1njdzuw0nxqPypep/LjWGVl5EZdJhODvGIjzOzow8p0SSw=="
+        },
         "@nodelib/fs.stat": {
             "version": "1.1.3",
             "resolved": "https://registry.npmjs.org/@nodelib/fs.stat/-/fs.stat-1.1.3.tgz",
@@ -1513,6 +1536,30 @@
                 }
             }
         },
+        "@scena/dragscroll": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/@scena/dragscroll/-/dragscroll-1.0.1.tgz",
+            "integrity": "sha512-EQXsJku85gb8dxlCWmMpqWieunN/Ojr5u5czNQwwC/Ab0YjhdHtvvK9DGS9ej9Uu4+MbN/F4HUTIMhhukx6dSg==",
+            "requires": {
+                "@scena/event-emitter": "^1.0.2"
+            }
+        },
+        "@scena/event-emitter": {
+            "version": "1.0.5",
+            "resolved": "https://registry.npmjs.org/@scena/event-emitter/-/event-emitter-1.0.5.tgz",
+            "integrity": "sha512-AzY4OTb0+7ynefmWFQ6hxDdk0CySAq/D4efljfhtRHCOP7MBF9zUfhKG3TJiroVjASqVgkRJFdenS8ArZo6Olg==",
+            "requires": {
+                "@daybrush/utils": "^1.1.1"
+            }
+        },
+        "@scena/matrix": {
+            "version": "1.1.1",
+            "resolved": "https://registry.npmjs.org/@scena/matrix/-/matrix-1.1.1.tgz",
+            "integrity": "sha512-JVKBhN0tm2Srl+Yt+Ywqu0oLgLcdemDQlD1OxmN9jaCTwaFPZ7tY8n6dhVgMEaR9qcR7r+kAlMXnSfNyYdE+Vg==",
+            "requires": {
+                "@daybrush/utils": "^1.4.0"
+            }
+        },
         "@sindresorhus/is": {
             "version": "0.14.0",
             "resolved": "https://registry.npmjs.org/@sindresorhus/is/-/is-0.14.0.tgz",
@@ -2637,6 +2684,11 @@
             "integrity": "sha512-aT6camzM4xEA54YVJYSqxz1kv4IHnQZRtThJJHhUMRExaU5spC7jX5ugSwTaTgJliIgs4VhZOk7htClvQ/LmRA==",
             "dev": true
         },
+        "aes-js": {
+            "version": "3.1.2",
+            "resolved": "https://registry.npmjs.org/aes-js/-/aes-js-3.1.2.tgz",
+            "integrity": "sha512-e5pEa2kBnBOgR4Y/p20pskXI74UEz7de8ZGVo58asOtvSVG5YAbJeELPZxOmt+Bnz3rX753YKhfIn4X4l1PPRQ=="
+        },
         "aggregate-error": {
             "version": "3.1.0",
             "resolved": "https://registry.npmjs.org/aggregate-error/-/aggregate-error-3.1.0.tgz",
@@ -2924,6 +2976,11 @@
                 }
             }
         },
+        "app-root-dir": {
+            "version": "1.0.2",
+            "resolved": "https://registry.npmjs.org/app-root-dir/-/app-root-dir-1.0.2.tgz",
+            "integrity": "sha1-OBh+wt6nV3//Az/8sSFyaS/24Rg="
+        },
         "aproba": {
             "version": "1.2.0",
             "resolved": "https://registry.npmjs.org/aproba/-/aproba-1.2.0.tgz",
@@ -2936,6 +2993,68 @@
             "integrity": "sha512-Of/R0wqp83cgHozfIYLbBMnej79U/SVGOOyuB3VVFv1NRM/PSFMK12x9KVtiYzJqmnU5WR2qp0Z5rHb7sWGnFQ==",
             "dev": true
         },
+        "archiver": {
+            "version": "5.3.0",
+            "resolved": "https://registry.npmjs.org/archiver/-/archiver-5.3.0.tgz",
+            "integrity": "sha512-iUw+oDwK0fgNpvveEsdQ0Ase6IIKztBJU2U0E9MzszMfmVVUyv1QJhS2ITW9ZCqx8dktAxVAjWWkKehuZE8OPg==",
+            "requires": {
+                "archiver-utils": "^2.1.0",
+                "async": "^3.2.0",
+                "buffer-crc32": "^0.2.1",
+                "readable-stream": "^3.6.0",
+                "readdir-glob": "^1.0.0",
+                "tar-stream": "^2.2.0",
+                "zip-stream": "^4.1.0"
+            },
+            "dependencies": {
+                "async": {
+                    "version": "3.2.0",
+                    "resolved": "https://registry.npmjs.org/async/-/async-3.2.0.tgz",
+                    "integrity": "sha512-TR2mEZFVOj2pLStYxLht7TyfuRzaydfpxr3k9RpHIzMgw7A64dzsdqCxH1WJyQdoe8T10nDXd9wnEigmiuHIZw=="
+                },
+                "readable-stream": {
+                    "version": "3.6.0",
+                    "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-3.6.0.tgz",
+                    "integrity": "sha512-BViHy7LKeTz4oNnkcLJ+lVSL6vpiFeX6/d3oSH8zCW7UxP2onchk+vTGB143xuFjHS3deTgkKoXXymXqymiIdA==",
+                    "requires": {
+                        "inherits": "^2.0.3",
+                        "string_decoder": "^1.1.1",
+                        "util-deprecate": "^1.0.1"
+                    }
+                }
+            }
+        },
+        "archiver-utils": {
+            "version": "2.1.0",
+            "resolved": "https://registry.npmjs.org/archiver-utils/-/archiver-utils-2.1.0.tgz",
+            "integrity": "sha512-bEL/yUb/fNNiNTuUz979Z0Yg5L+LzLxGJz8x79lYmR54fmTIb6ob/hNQgkQnIUDWIFjZVQwl9Xs356I6BAMHfw==",
+            "requires": {
+                "glob": "^7.1.4",
+                "graceful-fs": "^4.2.0",
+                "lazystream": "^1.0.0",
+                "lodash.defaults": "^4.2.0",
+                "lodash.difference": "^4.5.0",
+                "lodash.flatten": "^4.4.0",
+                "lodash.isplainobject": "^4.0.6",
+                "lodash.union": "^4.6.0",
+                "normalize-path": "^3.0.0",
+                "readable-stream": "^2.0.0"
+            }
+        },
+        "archiver-zip-encrypted": {
+            "version": "1.0.10",
+            "resolved": "https://registry.npmjs.org/archiver-zip-encrypted/-/archiver-zip-encrypted-1.0.10.tgz",
+            "integrity": "sha512-Lrufx6UOithz1Z4C0PrwTsbF7qak/TDhMs3nAC/mFxV/tPKKaMhdjUgHV1UqRjcu2FaS8ghNexFVcNZ+CdFaXA==",
+            "requires": {
+                "aes-js": "^3.1.2",
+                "archiver": "^5.3.0",
+                "archiver-utils": "^2.1.0",
+                "buffer-crc32": "^0.2.13",
+                "compress-commons": "^4.1.1",
+                "crc32-stream": "^4.0.2",
+                "zip-stream": "^4.1.0"
+            }
+        },
         "argparse": {
             "version": "1.0.10",
             "resolved": "https://registry.npmjs.org/argparse/-/argparse-1.0.10.tgz",
@@ -3121,8 +3240,7 @@
         "at-least-node": {
             "version": "1.0.0",
             "resolved": "https://registry.npmjs.org/at-least-node/-/at-least-node-1.0.0.tgz",
-            "integrity": "sha512-+q/t7Ekv1EDY2l6Gda6LLiX14rU9TV20Wa3ofeQmwPFZbOMo9DXrLbOjFaaclkXKWidIaopwAObQDqwWtGUjqg==",
-            "dev": true
+            "integrity": "sha512-+q/t7Ekv1EDY2l6Gda6LLiX14rU9TV20Wa3ofeQmwPFZbOMo9DXrLbOjFaaclkXKWidIaopwAObQDqwWtGUjqg=="
         },
         "atob": {
             "version": "2.1.2",
@@ -3238,8 +3356,7 @@
         "balanced-match": {
             "version": "1.0.2",
             "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz",
-            "integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==",
-            "dev": true
+            "integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw=="
         },
         "base": {
             "version": "0.11.2",
@@ -3299,8 +3416,7 @@
         "base64-js": {
             "version": "1.5.1",
             "resolved": "https://registry.npmjs.org/base64-js/-/base64-js-1.5.1.tgz",
-            "integrity": "sha512-AKpaYlHn8t4SVbOHCy+b5+KKgvR4vrsD8vbvrbiQJps7fKDTkjkDry6ji0rUJjC0kzbNePLwzxq8iypo41qeWA==",
-            "dev": true
+            "integrity": "sha512-AKpaYlHn8t4SVbOHCy+b5+KKgvR4vrsD8vbvrbiQJps7fKDTkjkDry6ji0rUJjC0kzbNePLwzxq8iypo41qeWA=="
         },
         "batch": {
             "version": "0.6.1",
@@ -3329,18 +3445,63 @@
                 "tryer": "^1.0.1"
             }
         },
+        "big-integer": {
+            "version": "1.6.48",
+            "resolved": "https://registry.npmjs.org/big-integer/-/big-integer-1.6.48.tgz",
+            "integrity": "sha512-j51egjPa7/i+RdiRuJbPdJ2FIUYYPhvYLjzoYbcMMm62ooO6F94fETG4MTs46zPAF9Brs04OajboA/qTGuz78w=="
+        },
         "big.js": {
             "version": "5.2.2",
             "resolved": "https://registry.npmjs.org/big.js/-/big.js-5.2.2.tgz",
             "integrity": "sha512-vyL2OymJxmarO8gxMr0mhChsO9QGwhynfuu4+MHTAW6czfq9humCB7rKpUjDd9YUiDPU4mzpyupFSvOClAwbmQ==",
             "dev": true
         },
+        "binary": {
+            "version": "0.3.0",
+            "resolved": "https://registry.npmjs.org/binary/-/binary-0.3.0.tgz",
+            "integrity": "sha1-n2BVO8XOjDOG87VTz/R0Yq3sqnk=",
+            "requires": {
+                "buffers": "~0.1.1",
+                "chainsaw": "~0.1.0"
+            }
+        },
         "binary-extensions": {
             "version": "2.2.0",
             "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.2.0.tgz",
             "integrity": "sha512-jDctJ/IVQbZoJykoeHbhXpOlNBqGNcwXJKJog42E5HDPUwQTSdjCHdihjj0DlnheQ7blbT6dHOafNAiS8ooQKA==",
             "dev": true
         },
+        "bl": {
+            "version": "4.1.0",
+            "resolved": "https://registry.npmjs.org/bl/-/bl-4.1.0.tgz",
+            "integrity": "sha512-1W07cM9gS6DcLperZfFSj+bWLtaPGSOHWhPiGzXmvVJbRLdG82sH/Kn8EtW1VqWVA54AKf2h5k5BbnIbwF3h6w==",
+            "requires": {
+                "buffer": "^5.5.0",
+                "inherits": "^2.0.4",
+                "readable-stream": "^3.4.0"
+            },
+            "dependencies": {
+                "buffer": {
+                    "version": "5.7.1",
+                    "resolved": "https://registry.npmjs.org/buffer/-/buffer-5.7.1.tgz",
+                    "integrity": "sha512-EHcyIPBQ4BSGlvjB16k5KgAJ27CIsHY/2JBmCRReo48y9rQ3MaUzWX3KVlBa4U7MyX02HdVj0K7C3WaB3ju7FQ==",
+                    "requires": {
+                        "base64-js": "^1.3.1",
+                        "ieee754": "^1.1.13"
+                    }
+                },
+                "readable-stream": {
+                    "version": "3.6.0",
+                    "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-3.6.0.tgz",
+                    "integrity": "sha512-BViHy7LKeTz4oNnkcLJ+lVSL6vpiFeX6/d3oSH8zCW7UxP2onchk+vTGB143xuFjHS3deTgkKoXXymXqymiIdA==",
+                    "requires": {
+                        "inherits": "^2.0.3",
+                        "string_decoder": "^1.1.1",
+                        "util-deprecate": "^1.0.1"
+                    }
+                }
+            }
+        },
         "bluebird": {
             "version": "3.7.2",
             "resolved": "https://registry.npmjs.org/bluebird/-/bluebird-3.7.2.tgz",
@@ -3500,7 +3661,6 @@
             "version": "1.1.11",
             "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz",
             "integrity": "sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==",
-            "dev": true,
             "requires": {
                 "balanced-match": "^1.0.0",
                 "concat-map": "0.0.1"
@@ -3660,8 +3820,7 @@
         "buffer-crc32": {
             "version": "0.2.13",
             "resolved": "https://registry.npmjs.org/buffer-crc32/-/buffer-crc32-0.2.13.tgz",
-            "integrity": "sha1-DTM+PwDqxQqhRUq9MO+MKl2ackI=",
-            "dev": true
+            "integrity": "sha1-DTM+PwDqxQqhRUq9MO+MKl2ackI="
         },
         "buffer-equal": {
             "version": "1.0.0",
@@ -3681,6 +3840,11 @@
             "integrity": "sha512-4/rOEg86jivtPTeOUUT61jJO1Ya1TrR/OkqCSZDyq84WJh3LuuiphBYJN+fm5xufIk4XAFcEwte/8WzC8If/1g==",
             "dev": true
         },
+        "buffer-indexof-polyfill": {
+            "version": "1.0.2",
+            "resolved": "https://registry.npmjs.org/buffer-indexof-polyfill/-/buffer-indexof-polyfill-1.0.2.tgz",
+            "integrity": "sha512-I7wzHwA3t1/lwXQh+A5PbNvJxgfo5r3xulgpYDB5zckTu/Z9oUK9biouBKQUjEqzaz3HnAT6TYoovmE+GqSf7A=="
+        },
         "buffer-json": {
             "version": "2.0.0",
             "resolved": "https://registry.npmjs.org/buffer-json/-/buffer-json-2.0.0.tgz",
@@ -3693,6 +3857,11 @@
             "integrity": "sha1-JuYe0UIvtw3ULm42cp7VHYVf6Nk=",
             "dev": true
         },
+        "buffers": {
+            "version": "0.1.1",
+            "resolved": "https://registry.npmjs.org/buffers/-/buffers-0.1.1.tgz",
+            "integrity": "sha1-skV5w77U1tOWru5tmorn9Ugqt7s="
+        },
         "builder-util": {
             "version": "22.11.7",
             "resolved": "https://registry.npmjs.org/builder-util/-/builder-util-22.11.7.tgz",
@@ -4072,6 +4241,14 @@
             "integrity": "sha1-G2gcIf+EAzyCZUMJBolCDRhxUdw=",
             "dev": true
         },
+        "chainsaw": {
+            "version": "0.1.0",
+            "resolved": "https://registry.npmjs.org/chainsaw/-/chainsaw-0.1.0.tgz",
+            "integrity": "sha1-XqtQsor+WAdNDVgpE4iCi15fvJg=",
+            "requires": {
+                "traverse": ">=0.3.0 <0.4"
+            }
+        },
         "chalk": {
             "version": "2.4.2",
             "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.4.2.tgz",
@@ -4548,6 +4725,29 @@
             "integrity": "sha512-Rd3se6QB+sO1TwqZjscQrurpEPIfO0/yYnSin6Q/rD3mOutHvUrCAhJub3r90uNb+SESBuE0QYoB90YdfatsRg==",
             "dev": true
         },
+        "compress-commons": {
+            "version": "4.1.1",
+            "resolved": "https://registry.npmjs.org/compress-commons/-/compress-commons-4.1.1.tgz",
+            "integrity": "sha512-QLdDLCKNV2dtoTorqgxngQCMA+gWXkM/Nwu7FpeBhk/RdkzimqC3jueb/FDmaZeXh+uby1jkBqE3xArsLBE5wQ==",
+            "requires": {
+                "buffer-crc32": "^0.2.13",
+                "crc32-stream": "^4.0.2",
+                "normalize-path": "^3.0.0",
+                "readable-stream": "^3.6.0"
+            },
+            "dependencies": {
+                "readable-stream": {
+                    "version": "3.6.0",
+                    "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-3.6.0.tgz",
+                    "integrity": "sha512-BViHy7LKeTz4oNnkcLJ+lVSL6vpiFeX6/d3oSH8zCW7UxP2onchk+vTGB143xuFjHS3deTgkKoXXymXqymiIdA==",
+                    "requires": {
+                        "inherits": "^2.0.3",
+                        "string_decoder": "^1.1.1",
+                        "util-deprecate": "^1.0.1"
+                    }
+                }
+            }
+        },
         "compressible": {
             "version": "2.0.18",
             "resolved": "https://registry.npmjs.org/compressible/-/compressible-2.0.18.tgz",
@@ -4583,8 +4783,7 @@
         "concat-map": {
             "version": "0.0.1",
             "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz",
-            "integrity": "sha1-2Klr13/Wjfd5OnMDajug1UBdR3s=",
-            "dev": true
+            "integrity": "sha1-2Klr13/Wjfd5OnMDajug1UBdR3s="
         },
         "concat-stream": {
             "version": "1.6.2",
@@ -4902,8 +5101,7 @@
         "core-util-is": {
             "version": "1.0.2",
             "resolved": "https://registry.npmjs.org/core-util-is/-/core-util-is-1.0.2.tgz",
-            "integrity": "sha1-tf1UIgqivFq1eqtxQMlAdUUDwac=",
-            "dev": true
+            "integrity": "sha1-tf1UIgqivFq1eqtxQMlAdUUDwac="
         },
         "cosmiconfig": {
             "version": "5.2.1",
@@ -4952,6 +5150,36 @@
                 }
             }
         },
+        "crc-32": {
+            "version": "1.2.0",
+            "resolved": "https://registry.npmjs.org/crc-32/-/crc-32-1.2.0.tgz",
+            "integrity": "sha512-1uBwHxF+Y/4yF5G48fwnKq6QsIXheor3ZLPT80yGBV1oEUwpPojlEhQbWKVw1VwcTQyMGHK1/XMmTjmlsmTTGA==",
+            "requires": {
+                "exit-on-epipe": "~1.0.1",
+                "printj": "~1.1.0"
+            }
+        },
+        "crc32-stream": {
+            "version": "4.0.2",
+            "resolved": "https://registry.npmjs.org/crc32-stream/-/crc32-stream-4.0.2.tgz",
+            "integrity": "sha512-DxFZ/Hk473b/muq1VJ///PMNLj0ZMnzye9thBpmjpJKCc5eMgB95aK8zCGrGfQ90cWo561Te6HK9D+j4KPdM6w==",
+            "requires": {
+                "crc-32": "^1.2.0",
+                "readable-stream": "^3.4.0"
+            },
+            "dependencies": {
+                "readable-stream": {
+                    "version": "3.6.0",
+                    "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-3.6.0.tgz",
+                    "integrity": "sha512-BViHy7LKeTz4oNnkcLJ+lVSL6vpiFeX6/d3oSH8zCW7UxP2onchk+vTGB143xuFjHS3deTgkKoXXymXqymiIdA==",
+                    "requires": {
+                        "inherits": "^2.0.3",
+                        "string_decoder": "^1.1.1",
+                        "util-deprecate": "^1.0.1"
+                    }
+                }
+            }
+        },
         "create-ecdh": {
             "version": "4.0.4",
             "resolved": "https://registry.npmjs.org/create-ecdh/-/create-ecdh-4.0.4.tgz",
@@ -5001,7 +5229,6 @@
             "version": "7.0.3",
             "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.3.tgz",
             "integrity": "sha512-iRDPJKUPVEND7dHPO8rkbOnPpyDygcDFtWjpeWNCgy8WP2rXcxXL8TskReQl6OrB2G7+UJrags1q15Fudc7G6w==",
-            "dev": true,
             "requires": {
                 "path-key": "^3.1.0",
                 "shebang-command": "^2.0.0",
@@ -5102,6 +5329,24 @@
             "integrity": "sha512-jQVeeRG70QI08vSTwf1jHxp74JoZsr2XSgETae8/xC8ovSnL2WF87GTLO86Sbwdt2lK4Umg4HnnwMO4YF3Ce7w==",
             "dev": true
         },
+        "css-styled": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/css-styled/-/css-styled-1.0.0.tgz",
+            "integrity": "sha512-lDdPvM2/djv+La110zVY3RGQ7X4OOlzLS+IEjRcn8UlUmJd1+GNcGfDFmsKWwnLBupsY1w0QM1gRgV4RdcCjfw==",
+            "requires": {
+                "@daybrush/utils": "^1.0.0",
+                "string-hash": "^1.1.3"
+            }
+        },
+        "css-to-mat": {
+            "version": "1.0.3",
+            "resolved": "https://registry.npmjs.org/css-to-mat/-/css-to-mat-1.0.3.tgz",
+            "integrity": "sha512-HADRhVqPc8wFqEp6ClK+uuPYg+FMBinNo2ReLyI/KQCncmHPJ60o5zldyJG7NjsTqXWbdfGJO51jnoxfMvWJiA==",
+            "requires": {
+                "@daybrush/utils": "^1.3.1",
+                "@scena/matrix": "^1.0.0"
+            }
+        },
         "css-tree": {
             "version": "1.0.0-alpha.37",
             "resolved": "https://registry.npmjs.org/css-tree/-/css-tree-1.0.0-alpha.37.tgz",
@@ -5821,6 +6066,14 @@
             "integrity": "sha512-jtD6YG370ZCIi/9GTaJKQxWTZD045+4R4hTk/x1UyoqadyJ9x9CgSi1RlVDQF8U2sxLLSnFkCaMihqljHIWgMg==",
             "dev": true
         },
+        "duplexer2": {
+            "version": "0.1.4",
+            "resolved": "https://registry.npmjs.org/duplexer2/-/duplexer2-0.1.4.tgz",
+            "integrity": "sha1-ixLauHjA1p4+eJEFFmKjL8a93ME=",
+            "requires": {
+                "readable-stream": "^2.0.2"
+            }
+        },
         "duplexer3": {
             "version": "0.1.4",
             "resolved": "https://registry.npmjs.org/duplexer3/-/duplexer3-0.1.4.tgz",
@@ -6219,7 +6472,6 @@
             "version": "1.4.4",
             "resolved": "https://registry.npmjs.org/end-of-stream/-/end-of-stream-1.4.4.tgz",
             "integrity": "sha512-+uw1inIHVPQoaVuHzRyXd21icM+cnt4CzD5rW+NC1wjOUSTOs+Te7FOv7AhN7vS9x/oIyhLP5PR1H+phQAHu5Q==",
-            "dev": true,
             "requires": {
                 "once": "^1.4.0"
             }
@@ -6799,6 +7051,11 @@
                 }
             }
         },
+        "exit-on-epipe": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/exit-on-epipe/-/exit-on-epipe-1.0.1.tgz",
+            "integrity": "sha512-h2z5mrROTxce56S+pnvAV890uu7ls7f1kEvVGJbw1OlFH3/mlJ5bkXu0KRyW94v37zzHPiUd55iLn3DA7TjWpw=="
+        },
         "expand-brackets": {
             "version": "2.1.4",
             "resolved": "https://registry.npmjs.org/expand-brackets/-/expand-brackets-2.1.4.tgz",
@@ -7261,6 +7518,11 @@
                 "map-cache": "^0.2.2"
             }
         },
+        "framework-utils": {
+            "version": "1.1.0",
+            "resolved": "https://registry.npmjs.org/framework-utils/-/framework-utils-1.1.0.tgz",
+            "integrity": "sha512-KAfqli5PwpFJ8o3psRNs8svpMGyCSAe8nmGcjQ0zZBWN2H6dZDnq+ABp3N3hdUmFeMrLtjOCTXD4yplUJIWceg=="
+        },
         "fresh": {
             "version": "0.5.2",
             "resolved": "https://registry.npmjs.org/fresh/-/fresh-0.5.2.tgz",
@@ -7363,6 +7625,11 @@
                 "readable-stream": "^2.0.0"
             }
         },
+        "fs-constants": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/fs-constants/-/fs-constants-1.0.0.tgz",
+            "integrity": "sha512-y6OAwoSIf7FyjMIv94u+b5rdheZEjzR63GTyZJm5qh4Bi+2YgwLCcI/fPFZkL5PSixOt6ZNKm+w+Hfp/Bciwow=="
+        },
         "fs-extra": {
             "version": "7.0.1",
             "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-7.0.1.tgz",
@@ -7398,8 +7665,7 @@
         "fs.realpath": {
             "version": "1.0.0",
             "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz",
-            "integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8=",
-            "dev": true
+            "integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8="
         },
         "fsevents": {
             "version": "2.3.2",
@@ -7408,6 +7674,17 @@
             "dev": true,
             "optional": true
         },
+        "fstream": {
+            "version": "1.0.12",
+            "resolved": "https://registry.npmjs.org/fstream/-/fstream-1.0.12.tgz",
+            "integrity": "sha512-WvJ193OHa0GHPEL+AycEJgxvBEwyfRkN1vhjca23OaPVMCaLCXTd5qAu82AjTcgP1UJmytkOKb63Ypde7raDIg==",
+            "requires": {
+                "graceful-fs": "^4.1.2",
+                "inherits": "~2.0.0",
+                "mkdirp": ">=0.5 0",
+                "rimraf": "2"
+            }
+        },
         "function-bind": {
             "version": "1.1.1",
             "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.1.tgz",
@@ -7435,6 +7712,15 @@
             "integrity": "sha512-3hN7NaskYvMDLQY55gnW3NQ+mesEAepTqlg+VEbj7zzqEMBVNhzcGYYeqFo/TlYz6eQiFcp1HcsCZO+nGgS8zg==",
             "dev": true
         },
+        "gesto": {
+            "version": "1.3.0",
+            "resolved": "https://registry.npmjs.org/gesto/-/gesto-1.3.0.tgz",
+            "integrity": "sha512-be9jSmhiDMjMzCQwBewOp/kBtKDB97d3e2lNkojMW9Ckgeu8c8Qglx7fopnLweoIGlIYsqDqwxHdJAkyL/TmFA==",
+            "requires": {
+                "@daybrush/utils": "^1.0.0",
+                "@scena/event-emitter": "^1.0.2"
+            }
+        },
         "get-caller-file": {
             "version": "2.0.5",
             "resolved": "https://registry.npmjs.org/get-caller-file/-/get-caller-file-2.0.5.tgz",
@@ -7486,7 +7772,6 @@
             "version": "7.1.7",
             "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.7.tgz",
             "integrity": "sha512-OvD9ENzPLbegENnYP5UUfJIirTg4+XwMWGaQfQTY0JenxNvvIKP3U3/tAQSPIu/lHxXYSZmpXlUHeqAIdKzBLQ==",
-            "dev": true,
             "requires": {
                 "fs.realpath": "^1.0.0",
                 "inflight": "^1.0.4",
@@ -7611,8 +7896,7 @@
         "graceful-fs": {
             "version": "4.2.6",
             "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.2.6.tgz",
-            "integrity": "sha512-nTnJ528pbqxYanhpDYsi4Rd8MAeaBA67+RZ10CM1m3bTAVFEDcd5AuA4a6W5YkGZ1iNXHzZz8T6TBKLeBuNriQ==",
-            "dev": true
+            "integrity": "sha512-nTnJ528pbqxYanhpDYsi4Rd8MAeaBA67+RZ10CM1m3bTAVFEDcd5AuA4a6W5YkGZ1iNXHzZz8T6TBKLeBuNriQ=="
         },
         "graceful-readlink": {
             "version": "1.0.1",
@@ -8167,8 +8451,7 @@
         "ieee754": {
             "version": "1.2.1",
             "resolved": "https://registry.npmjs.org/ieee754/-/ieee754-1.2.1.tgz",
-            "integrity": "sha512-dcyqhDvX1C46lXZcVqCpK+FtMRQVdIMN6/Df5js2zouUsqG7I6sFxitIC+7KYK29KdXOLHdu9zL4sFnoVQnqaA==",
-            "dev": true
+            "integrity": "sha512-dcyqhDvX1C46lXZcVqCpK+FtMRQVdIMN6/Df5js2zouUsqG7I6sFxitIC+7KYK29KdXOLHdu9zL4sFnoVQnqaA=="
         },
         "iferr": {
             "version": "0.1.5",
@@ -8265,7 +8548,6 @@
             "version": "1.0.6",
             "resolved": "https://registry.npmjs.org/inflight/-/inflight-1.0.6.tgz",
             "integrity": "sha1-Sb1jMdfQLQwJvJEKEHW6gWW1bfk=",
-            "dev": true,
             "requires": {
                 "once": "^1.3.0",
                 "wrappy": "1"
@@ -8274,8 +8556,7 @@
         "inherits": {
             "version": "2.0.4",
             "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.4.tgz",
-            "integrity": "sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==",
-            "dev": true
+            "integrity": "sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ=="
         },
         "ini": {
             "version": "1.3.8",
@@ -8771,8 +9052,7 @@
         "isarray": {
             "version": "1.0.0",
             "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-            "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE=",
-            "dev": true
+            "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "isbinaryfile": {
             "version": "4.0.8",
@@ -8783,8 +9063,7 @@
         "isexe": {
             "version": "2.0.0",
             "resolved": "https://registry.npmjs.org/isexe/-/isexe-2.0.0.tgz",
-            "integrity": "sha1-6PvzdNxVb/iUehDcsFctYz8s+hA=",
-            "dev": true
+            "integrity": "sha1-6PvzdNxVb/iUehDcsFctYz8s+hA="
         },
         "isobject": {
             "version": "3.0.1",
@@ -8989,6 +9268,21 @@
                 "set-immediate-shim": "~1.0.1"
             }
         },
+        "keycode": {
+            "version": "2.2.0",
+            "resolved": "https://registry.npmjs.org/keycode/-/keycode-2.2.0.tgz",
+            "integrity": "sha1-PQr1bce4uOXLqNCpfxByBO7CKwQ="
+        },
+        "keycon": {
+            "version": "1.1.2",
+            "resolved": "https://registry.npmjs.org/keycon/-/keycon-1.1.2.tgz",
+            "integrity": "sha512-yCoUAfwqmQUWrtOFuZhicxasF/4ae+M0aH8yV1wEKKZCZql8v6jWhlVF9dT5i1TfuHSmgt/GNuCaWIHT8wk6eQ==",
+            "requires": {
+                "@daybrush/utils": "^1.0.0",
+                "@scena/event-emitter": "^1.0.2",
+                "keycode": "^2.2.0"
+            }
+        },
         "keyv": {
             "version": "3.1.0",
             "resolved": "https://registry.npmjs.org/keyv/-/keyv-3.1.0.tgz",
@@ -9050,6 +9344,14 @@
             "integrity": "sha512-0/BnGCCfyUMkBpeDgWihanIAF9JmZhHBgUhEqzvf+adhNGLoP6TaiI5oF8oyb3I45P+PcnrqihSf01M0l0G5+Q==",
             "dev": true
         },
+        "lazystream": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/lazystream/-/lazystream-1.0.0.tgz",
+            "integrity": "sha1-9plf4PggOS9hOWvolGJAe7dxaOQ=",
+            "requires": {
+                "readable-stream": "^2.0.5"
+            }
+        },
         "levn": {
             "version": "0.3.0",
             "resolved": "https://registry.npmjs.org/levn/-/levn-0.3.0.tgz",
@@ -9075,6 +9377,11 @@
             "integrity": "sha1-HADHQ7QzzQpOgHWPe2SldEDZ/wA=",
             "dev": true
         },
+        "listenercount": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/listenercount/-/listenercount-1.0.1.tgz",
+            "integrity": "sha1-hMinKrWcRyUyFIDJdeZQg0LnCTc="
+        },
         "loader-fs-cache": {
             "version": "1.0.3",
             "resolved": "https://registry.npmjs.org/loader-fs-cache/-/loader-fs-cache-1.0.3.tgz",
@@ -9181,11 +9488,45 @@
             "integrity": "sha1-gteb/zCmfEAF/9XiUVMArZyk168=",
             "dev": true
         },
+        "lodash.defaults": {
+            "version": "4.2.0",
+            "resolved": "https://registry.npmjs.org/lodash.defaults/-/lodash.defaults-4.2.0.tgz",
+            "integrity": "sha1-0JF4cW/+pN3p5ft7N/bwgCJ0WAw="
+        },
         "lodash.defaultsdeep": {
             "version": "4.6.1",
             "resolved": "https://registry.npmjs.org/lodash.defaultsdeep/-/lodash.defaultsdeep-4.6.1.tgz",
-            "integrity": "sha512-3j8wdDzYuWO3lM3Reg03MuQR957t287Rpcxp1njpEa8oDrikb+FwGdW3n+FELh/A6qib6yPit0j/pv9G/yeAqA==",
-            "dev": true
+            "integrity": "sha512-3j8wdDzYuWO3lM3Reg03MuQR957t287Rpcxp1njpEa8oDrikb+FwGdW3n+FELh/A6qib6yPit0j/pv9G/yeAqA=="
+        },
+        "lodash.defaultto": {
+            "version": "4.14.0",
+            "resolved": "https://registry.npmjs.org/lodash.defaultto/-/lodash.defaultto-4.14.0.tgz",
+            "integrity": "sha1-OL09QlrO5zPg4ru9TkspcRzC7hE="
+        },
+        "lodash.difference": {
+            "version": "4.5.0",
+            "resolved": "https://registry.npmjs.org/lodash.difference/-/lodash.difference-4.5.0.tgz",
+            "integrity": "sha1-nMtOUF1Ia5FlE0V3KIWi3yf9AXw="
+        },
+        "lodash.flatten": {
+            "version": "4.4.0",
+            "resolved": "https://registry.npmjs.org/lodash.flatten/-/lodash.flatten-4.4.0.tgz",
+            "integrity": "sha1-8xwiIlqWMtK7+OSt2+8kCqdlph8="
+        },
+        "lodash.flattendeep": {
+            "version": "4.4.0",
+            "resolved": "https://registry.npmjs.org/lodash.flattendeep/-/lodash.flattendeep-4.4.0.tgz",
+            "integrity": "sha1-+wMJF/hqMTTlvJvsDWngAT3f7bI="
+        },
+        "lodash.isempty": {
+            "version": "4.4.0",
+            "resolved": "https://registry.npmjs.org/lodash.isempty/-/lodash.isempty-4.4.0.tgz",
+            "integrity": "sha1-b4bL7di+TsmHvpqvM8loTbGzHn4="
+        },
+        "lodash.isplainobject": {
+            "version": "4.0.6",
+            "resolved": "https://registry.npmjs.org/lodash.isplainobject/-/lodash.isplainobject-4.0.6.tgz",
+            "integrity": "sha1-fFJqUtibRcRcxpC4gWO+BJf1UMs="
         },
         "lodash.kebabcase": {
             "version": "4.1.1",
@@ -9211,12 +9552,22 @@
             "integrity": "sha512-0KpjqXRVvrYyCsX1swR/XTK0va6VQkQM6MNo7PqW77ByjAhoARA8EfrP1N4+KlKj8YS0ZUCtRT/YUuhyYDujIQ==",
             "dev": true
         },
+        "lodash.negate": {
+            "version": "3.0.2",
+            "resolved": "https://registry.npmjs.org/lodash.negate/-/lodash.negate-3.0.2.tgz",
+            "integrity": "sha1-nIl7C/YQAZ4LQ7j/Pwr+89e2bzQ="
+        },
         "lodash.transform": {
             "version": "4.6.0",
             "resolved": "https://registry.npmjs.org/lodash.transform/-/lodash.transform-4.6.0.tgz",
             "integrity": "sha1-EjBkIvYzJK7YSD0/ODMrX2cFR6A=",
             "dev": true
         },
+        "lodash.union": {
+            "version": "4.6.0",
+            "resolved": "https://registry.npmjs.org/lodash.union/-/lodash.union-4.6.0.tgz",
+            "integrity": "sha1-SLtQiECfFvGCFmZkHETdGqrjzYg="
+        },
         "lodash.uniq": {
             "version": "4.5.0",
             "resolved": "https://registry.npmjs.org/lodash.uniq/-/lodash.uniq-4.5.0.tgz",
@@ -9531,7 +9882,6 @@
             "version": "3.0.4",
             "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.0.4.tgz",
             "integrity": "sha512-yJHVQEhyqPLUTgt9B83PXu6W3rx4MvvHvSUvToogpwoGDOUQ+yDrR0HRot+yOCdCO7u4hX3pWft6kWBBcqh0UA==",
-            "dev": true,
             "requires": {
                 "brace-expansion": "^1.1.7"
             }
@@ -9539,8 +9889,7 @@
         "minimist": {
             "version": "1.2.5",
             "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.5.tgz",
-            "integrity": "sha512-FM9nNUYrRBAELZQT3xeZQ7fmMOBg6nWNmJKTcgsJeaLstP/UODVpGsr5OhXhhXg6f+qtJ8uiZ+PUxkDWcgIXLw==",
-            "dev": true
+            "integrity": "sha512-FM9nNUYrRBAELZQT3xeZQ7fmMOBg6nWNmJKTcgsJeaLstP/UODVpGsr5OhXhhXg6f+qtJ8uiZ+PUxkDWcgIXLw=="
         },
         "minipass": {
             "version": "3.1.3",
@@ -9643,7 +9992,6 @@
             "version": "0.5.5",
             "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.5.5.tgz",
             "integrity": "sha512-NKmAlESf6jMGym1++R0Ra7wvhV+wFW63FaSOFPwRahvea0gMUcGUhVeAg/0BC0wiv9ih5NYPB1Wn1UEI1/L+xQ==",
-            "dev": true,
             "requires": {
                 "minimist": "^1.2.5"
             }
@@ -9766,6 +10114,81 @@
                 "lower-case": "^1.1.1"
             }
         },
+        "node-7z": {
+            "version": "2.1.2",
+            "resolved": "https://registry.npmjs.org/node-7z/-/node-7z-2.1.2.tgz",
+            "integrity": "sha512-mSmn90OIYKYIkuRwH1YRJl2sMwB9OlYhCQS4SPTOfxlzWwomoC1G9j4tsvAsv7vJPwvK7B76Z0a2dH5Mvwo91Q==",
+            "requires": {
+                "cross-spawn": "^7.0.2",
+                "debug": "^4.1.1",
+                "lodash.defaultsdeep": "^4.6.1",
+                "lodash.defaultto": "^4.14.0",
+                "lodash.flattendeep": "^4.4.0",
+                "lodash.isempty": "^4.4.0",
+                "lodash.negate": "^3.0.2",
+                "normalize-path": "^3.0.0"
+            },
+            "dependencies": {
+                "debug": {
+                    "version": "4.3.1",
+                    "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.1.tgz",
+                    "integrity": "sha512-doEwdvm4PCeK4K3RQN2ZC2BYUBaxwLARCqZmMjtF8a51J2Rb0xpVloFRnCODwqjpwnAoao4pelN8l3RJdv3gRQ==",
+                    "requires": {
+                        "ms": "2.1.2"
+                    }
+                },
+                "ms": {
+                    "version": "2.1.2",
+                    "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz",
+                    "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w=="
+                }
+            }
+        },
+        "node-7z-archive": {
+            "version": "1.0.4",
+            "resolved": "https://registry.npmjs.org/node-7z-archive/-/node-7z-archive-1.0.4.tgz",
+            "integrity": "sha512-pcFtISDFfblPOOcKBpPGT/cJm2SyZ6W7BwEchGOSVSVlhERuRdf4dSxJEHRFiGXjlpmQ/QFWoBHDjA27VgT1Pw==",
+            "requires": {
+                "fs-extra": "^9.0.1",
+                "minimist": "1.2.5",
+                "node-sys": "^1.1.3",
+                "node-unar": "^1.0.6",
+                "node-wget-fetch": "^1.1.0",
+                "when": "^3.7.8"
+            },
+            "dependencies": {
+                "fs-extra": {
+                    "version": "9.1.0",
+                    "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-9.1.0.tgz",
+                    "integrity": "sha512-hcg3ZmepS30/7BSFqRvoo3DOMQu7IjqxO5nCDt+zM9XWjb33Wg7ziNT+Qvqbuc3+gWpzO02JubVyk2G4Zvo1OQ==",
+                    "requires": {
+                        "at-least-node": "^1.0.0",
+                        "graceful-fs": "^4.2.0",
+                        "jsonfile": "^6.0.1",
+                        "universalify": "^2.0.0"
+                    }
+                },
+                "jsonfile": {
+                    "version": "6.1.0",
+                    "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-6.1.0.tgz",
+                    "integrity": "sha512-5dgndWOriYSm5cnYaJNhalLNDKOqFwyDB/rr1E9ZsGciGvKPs8R2xYGCacuf3z6K1YKDz182fd+fY3cn3pMqXQ==",
+                    "requires": {
+                        "graceful-fs": "^4.1.6",
+                        "universalify": "^2.0.0"
+                    }
+                },
+                "universalify": {
+                    "version": "2.0.0",
+                    "resolved": "https://registry.npmjs.org/universalify/-/universalify-2.0.0.tgz",
+                    "integrity": "sha512-hAZsKq7Yy11Zu1DE0OzWjw7nnLZmJZYTDZZyEFHZdUhV8FkH5MCfoU1XMaxXovpyW5nq5scPqq0ZDP9Zyl04oQ=="
+                }
+            }
+        },
+        "node-fetch": {
+            "version": "2.6.1",
+            "resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-2.6.1.tgz",
+            "integrity": "sha512-V4aYg89jEoVRxRb2fJdAg8FHvI7cEyYdVAh94HH0UIK8oJxUfkjlDQN9RbMx+bEjP7+ggMiFRprSti032Oipxw=="
+        },
         "node-forge": {
             "version": "0.10.0",
             "resolved": "https://registry.npmjs.org/node-forge/-/node-forge-0.10.0.tgz",
@@ -9828,6 +10251,71 @@
             "integrity": "sha512-uW7fodD6pyW2FZNZnp/Z3hvWKeEW1Y8R1+1CnErE8cXFXzl5blBOoVB41CvMer6P6Q0S5FXDwcHgFd1Wj0U9zg==",
             "dev": true
         },
+        "node-stream-zip": {
+            "version": "1.13.6",
+            "resolved": "https://registry.npmjs.org/node-stream-zip/-/node-stream-zip-1.13.6.tgz",
+            "integrity": "sha512-c7tRSVkLNOHvasWgmZ2d86cDgTWEygnkuuHNOY9c0mR3yLZtQTTrGvMaJ/fPs6+LOJn3240y30l5sjLaXFtcvw==",
+            "optional": true
+        },
+        "node-sys": {
+            "version": "1.1.3",
+            "resolved": "https://registry.npmjs.org/node-sys/-/node-sys-1.1.3.tgz",
+            "integrity": "sha512-TJdqG0Qf3lVWD42AzdXJnd6SHUGLikfB/2AOGc557R5ZOHpEpKJw9K7W5tEA4OyumH6vRR2OplOZPpdMYZBA8Q==",
+            "requires": {
+                "minimist": "1.2.5",
+                "which": "^2.0.2"
+            }
+        },
+        "node-unar": {
+            "version": "1.0.6",
+            "resolved": "https://registry.npmjs.org/node-unar/-/node-unar-1.0.6.tgz",
+            "integrity": "sha512-WOOBPD+jeoW/aVCHzLk9m06biJkC7E8azYf/9aiVAsz8f6FtPGCLC4PV5pKP9XW+0JvamzJs81Qd+GPxeEz67A==",
+            "requires": {
+                "fs-extra": "^9.0.1",
+                "node-stream-zip": "^1.12.0",
+                "node-sys": "^1.1.3",
+                "node-wget-fetch": "^1.1.0",
+                "when": "^3.7.8"
+            },
+            "dependencies": {
+                "fs-extra": {
+                    "version": "9.1.0",
+                    "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-9.1.0.tgz",
+                    "integrity": "sha512-hcg3ZmepS30/7BSFqRvoo3DOMQu7IjqxO5nCDt+zM9XWjb33Wg7ziNT+Qvqbuc3+gWpzO02JubVyk2G4Zvo1OQ==",
+                    "optional": true,
+                    "requires": {
+                        "at-least-node": "^1.0.0",
+                        "graceful-fs": "^4.2.0",
+                        "jsonfile": "^6.0.1",
+                        "universalify": "^2.0.0"
+                    }
+                },
+                "jsonfile": {
+                    "version": "6.1.0",
+                    "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-6.1.0.tgz",
+                    "integrity": "sha512-5dgndWOriYSm5cnYaJNhalLNDKOqFwyDB/rr1E9ZsGciGvKPs8R2xYGCacuf3z6K1YKDz182fd+fY3cn3pMqXQ==",
+                    "optional": true,
+                    "requires": {
+                        "graceful-fs": "^4.1.6",
+                        "universalify": "^2.0.0"
+                    }
+                },
+                "universalify": {
+                    "version": "2.0.0",
+                    "resolved": "https://registry.npmjs.org/universalify/-/universalify-2.0.0.tgz",
+                    "integrity": "sha512-hAZsKq7Yy11Zu1DE0OzWjw7nnLZmJZYTDZZyEFHZdUhV8FkH5MCfoU1XMaxXovpyW5nq5scPqq0ZDP9Zyl04oQ==",
+                    "optional": true
+                }
+            }
+        },
+        "node-wget-fetch": {
+            "version": "1.1.0",
+            "resolved": "https://registry.npmjs.org/node-wget-fetch/-/node-wget-fetch-1.1.0.tgz",
+            "integrity": "sha512-JLB8mYCi97SWfNt+XLex3d1/PmIgouN0rU+j6cWXbEvtASf3/LGyp73tORkZ6dFSMMphtw+4xfuANPMo+DmVqg==",
+            "requires": {
+                "node-fetch": "~2.6.1"
+            }
+        },
         "normalize-package-data": {
             "version": "2.5.0",
             "resolved": "https://registry.npmjs.org/normalize-package-data/-/normalize-package-data-2.5.0.tgz",
@@ -9851,8 +10339,7 @@
         "normalize-path": {
             "version": "3.0.0",
             "resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-3.0.0.tgz",
-            "integrity": "sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==",
-            "dev": true
+            "integrity": "sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA=="
         },
         "normalize-range": {
             "version": "0.1.2",
@@ -10066,7 +10553,6 @@
             "version": "1.4.0",
             "resolved": "https://registry.npmjs.org/once/-/once-1.4.0.tgz",
             "integrity": "sha1-WDsap3WWHUsROsF9nFC6753Xa9E=",
-            "dev": true,
             "requires": {
                 "wrappy": "1"
             }
@@ -10170,6 +10656,14 @@
             "integrity": "sha1-u+Z0BseaqFxc/sdm/lc0VV36EnQ=",
             "dev": true
         },
+        "overlap-area": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/overlap-area/-/overlap-area-1.0.0.tgz",
+            "integrity": "sha512-Oi3hxRf6Flvv1upldnjOtV7euFkc75G/wsxYfS/ssNKEZ3Z+HbIoPHkFfLH3hgwqLJKpq9wdFo7I6xcdS6k8yg==",
+            "requires": {
+                "@daybrush/utils": "^1.3.1"
+            }
+        },
         "p-cancelable": {
             "version": "1.1.0",
             "resolved": "https://registry.npmjs.org/p-cancelable/-/p-cancelable-1.1.0.tgz",
@@ -10361,8 +10855,7 @@
         "path-is-absolute": {
             "version": "1.0.1",
             "resolved": "https://registry.npmjs.org/path-is-absolute/-/path-is-absolute-1.0.1.tgz",
-            "integrity": "sha1-F0uSaHNVNP+8es5r9TpanhtcX18=",
-            "dev": true
+            "integrity": "sha1-F0uSaHNVNP+8es5r9TpanhtcX18="
         },
         "path-is-inside": {
             "version": "1.0.2",
@@ -10373,8 +10866,7 @@
         "path-key": {
             "version": "3.1.1",
             "resolved": "https://registry.npmjs.org/path-key/-/path-key-3.1.1.tgz",
-            "integrity": "sha512-ojmeN0qd+y0jszEtoY48r0Peq5dwMEkIlCOu6Q5f41lfkswXuKtYrhgoTpLnyIcHm24Uhqx+5Tqm2InSwLhE6Q==",
-            "dev": true
+            "integrity": "sha512-ojmeN0qd+y0jszEtoY48r0Peq5dwMEkIlCOu6Q5f41lfkswXuKtYrhgoTpLnyIcHm24Uhqx+5Tqm2InSwLhE6Q=="
         },
         "path-parse": {
             "version": "1.0.7",
@@ -11272,6 +11764,11 @@
                 "renderkid": "^2.0.4"
             }
         },
+        "printj": {
+            "version": "1.1.2",
+            "resolved": "https://registry.npmjs.org/printj/-/printj-1.1.2.tgz",
+            "integrity": "sha512-zA2SmoLaxZyArQTOPj5LXecR+RagfPSU5Kw1qP+jkWeNlrq+eJZyY2oS68SU1Z/7/myXM4lo9716laOFAVStCQ=="
+        },
         "process": {
             "version": "0.11.10",
             "resolved": "https://registry.npmjs.org/process/-/process-0.11.10.tgz",
@@ -11281,8 +11778,7 @@
         "process-nextick-args": {
             "version": "2.0.1",
             "resolved": "https://registry.npmjs.org/process-nextick-args/-/process-nextick-args-2.0.1.tgz",
-            "integrity": "sha512-3ouUOpQhtgrbOa17J7+uxOTpITYWaGP7/AhoR3+A+/1e9skrzelGi/dXzEYyvbxubEF6Wn2ypscTKiKJFFn1ag==",
-            "dev": true
+            "integrity": "sha512-3ouUOpQhtgrbOa17J7+uxOTpITYWaGP7/AhoR3+A+/1e9skrzelGi/dXzEYyvbxubEF6Wn2ypscTKiKJFFn1ag=="
         },
         "progress": {
             "version": "2.0.3",
@@ -11549,7 +12045,6 @@
             "version": "2.3.7",
             "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.7.tgz",
             "integrity": "sha512-Ebho8K4jIbHAxnuxi7o42OrZgF/ZTNcsZj6nRKyUmkhLFq8CHItp/fy6hQZuZmP/n3yZ9VBUbp4zz/mX8hmYPw==",
-            "dev": true,
             "requires": {
                 "core-util-is": "~1.0.0",
                 "inherits": "~2.0.3",
@@ -11560,6 +12055,14 @@
                 "util-deprecate": "~1.0.1"
             }
         },
+        "readdir-glob": {
+            "version": "1.1.1",
+            "resolved": "https://registry.npmjs.org/readdir-glob/-/readdir-glob-1.1.1.tgz",
+            "integrity": "sha512-91/k1EzZwDx6HbERR+zucygRFfiPl2zkIYZtv3Jjr6Mn7SkKcVct8aVO+sSRiGMc6fLf72du3d92/uY63YPdEA==",
+            "requires": {
+                "minimatch": "^3.0.4"
+            }
+        },
         "readdirp": {
             "version": "3.5.0",
             "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-3.5.0.tgz",
@@ -11936,7 +12439,6 @@
             "version": "2.7.1",
             "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.7.1.tgz",
             "integrity": "sha512-uWjbaKIK3T1OSVptzX7Nl6PvQ3qAGtKEtVRjRuazjfL3Bx5eI409VZSqgND+4UNnmzLVdPj9FqFJNPqBZFve4w==",
-            "dev": true,
             "requires": {
                 "glob": "^7.1.3"
             }
@@ -12002,8 +12504,7 @@
         "safe-buffer": {
             "version": "5.1.2",
             "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.2.tgz",
-            "integrity": "sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g==",
-            "dev": true
+            "integrity": "sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g=="
         },
         "safe-regex": {
             "version": "1.1.0",
@@ -12136,6 +12637,23 @@
             "integrity": "sha1-Yl2GWPhlr0Psliv8N2o3NZpJlMo=",
             "dev": true
         },
+        "selecto": {
+            "version": "1.12.1",
+            "resolved": "https://registry.npmjs.org/selecto/-/selecto-1.12.1.tgz",
+            "integrity": "sha512-X/NcHVFp55YbmV15N8mq6NUexQ+5JM1lKXbGSjdS7hGXLcJ4vxs6VELQtNpoETSTdgDL3d0Hvp0z7sR9MtkXXg==",
+            "requires": {
+                "@daybrush/utils": "^1.4.0",
+                "@egjs/children-differ": "^1.0.1",
+                "@scena/dragscroll": "^1.0.1",
+                "@scena/event-emitter": "^1.0.5",
+                "css-styled": "^1.0.0",
+                "css-to-mat": "^1.0.3",
+                "framework-utils": "^1.1.0",
+                "gesto": "^1.3.0",
+                "keycon": "^1.1.2",
+                "overlap-area": "^1.0.0"
+            }
+        },
         "selfsigned": {
             "version": "1.10.11",
             "resolved": "https://registry.npmjs.org/selfsigned/-/selfsigned-1.10.11.tgz",
@@ -12325,8 +12843,7 @@
         "setimmediate": {
             "version": "1.0.5",
             "resolved": "https://registry.npmjs.org/setimmediate/-/setimmediate-1.0.5.tgz",
-            "integrity": "sha1-KQy7Iy4waULX1+qbg3Mqt4VvgoU=",
-            "dev": true
+            "integrity": "sha1-KQy7Iy4waULX1+qbg3Mqt4VvgoU="
         },
         "setprototypeof": {
             "version": "1.1.1",
@@ -12348,7 +12865,6 @@
             "version": "2.0.0",
             "resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-2.0.0.tgz",
             "integrity": "sha512-kHxr2zZpYtdmrN1qDjrrX/Z1rR1kG8Dx+gkpK1G4eXmvXswmcE1hTWBWYUzlraYw1/yZp6YuDY77YtvbN0dmDA==",
-            "dev": true,
             "requires": {
                 "shebang-regex": "^3.0.0"
             }
@@ -12362,8 +12878,7 @@
         "shebang-regex": {
             "version": "3.0.0",
             "resolved": "https://registry.npmjs.org/shebang-regex/-/shebang-regex-3.0.0.tgz",
-            "integrity": "sha512-7++dFhtcx3353uBaq8DDR4NuxBetBzC7ZQOhmTQInHEd6bSrXdiEyzCvG07Z44UYdLShWUyXt5M/yhz8ekcb1A==",
-            "dev": true
+            "integrity": "sha512-7++dFhtcx3353uBaq8DDR4NuxBetBzC7ZQOhmTQInHEd6bSrXdiEyzCvG07Z44UYdLShWUyXt5M/yhz8ekcb1A=="
         },
         "shell-quote": {
             "version": "1.7.2",
@@ -12910,8 +13425,7 @@
         "string-hash": {
             "version": "1.1.3",
             "resolved": "https://registry.npmjs.org/string-hash/-/string-hash-1.1.3.tgz",
-            "integrity": "sha1-6Kr8CsGFW0Zmkp7X3RJ1311sgRs=",
-            "dev": true
+            "integrity": "sha1-6Kr8CsGFW0Zmkp7X3RJ1311sgRs="
         },
         "string-width": {
             "version": "4.2.2",
@@ -12948,7 +13462,6 @@
             "version": "1.1.1",
             "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.1.1.tgz",
             "integrity": "sha512-n/ShnvDi6FHbbVfviro+WojiFzv+s8MPMHBczVePfUpDJLwoLT0ht1l4YwBCbi8pJAveEEdnkHyPyTP/mzRfwg==",
-            "dev": true,
             "requires": {
                 "safe-buffer": "~5.1.0"
             }
@@ -13187,6 +13700,30 @@
                 }
             }
         },
+        "tar-stream": {
+            "version": "2.2.0",
+            "resolved": "https://registry.npmjs.org/tar-stream/-/tar-stream-2.2.0.tgz",
+            "integrity": "sha512-ujeqbceABgwMZxEJnk2HDY2DlnUZ+9oEcb1KzTVfYHio0UE6dG71n60d8D2I4qNvleWrrXpmjpt7vZeF1LnMZQ==",
+            "requires": {
+                "bl": "^4.0.3",
+                "end-of-stream": "^1.4.1",
+                "fs-constants": "^1.0.0",
+                "inherits": "^2.0.3",
+                "readable-stream": "^3.1.1"
+            },
+            "dependencies": {
+                "readable-stream": {
+                    "version": "3.6.0",
+                    "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-3.6.0.tgz",
+                    "integrity": "sha512-BViHy7LKeTz4oNnkcLJ+lVSL6vpiFeX6/d3oSH8zCW7UxP2onchk+vTGB143xuFjHS3deTgkKoXXymXqymiIdA==",
+                    "requires": {
+                        "inherits": "^2.0.3",
+                        "string_decoder": "^1.1.1",
+                        "util-deprecate": "^1.0.1"
+                    }
+                }
+            }
+        },
         "temp-file": {
             "version": "3.4.0",
             "resolved": "https://registry.npmjs.org/temp-file/-/temp-file-3.4.0.tgz",
@@ -13546,6 +14083,11 @@
                 "punycode": "^2.1.1"
             }
         },
+        "traverse": {
+            "version": "0.3.9",
+            "resolved": "https://registry.npmjs.org/traverse/-/traverse-0.3.9.tgz",
+            "integrity": "sha1-cXuPIgzAu3tE5AUUwisui7xw2Lk="
+        },
         "truncate-utf8-bytes": {
             "version": "1.0.2",
             "resolved": "https://registry.npmjs.org/truncate-utf8-bytes/-/truncate-utf8-bytes-1.0.2.tgz",
@@ -13829,6 +14371,30 @@
                 "yaku": "^0.16.6"
             }
         },
+        "unzipper": {
+            "version": "0.10.11",
+            "resolved": "https://registry.npmjs.org/unzipper/-/unzipper-0.10.11.tgz",
+            "integrity": "sha512-+BrAq2oFqWod5IESRjL3S8baohbevGcVA+teAIOYWM3pDVdseogqbzhhvvmiyQrUNKFUnDMtELW3X8ykbyDCJw==",
+            "requires": {
+                "big-integer": "^1.6.17",
+                "binary": "~0.3.0",
+                "bluebird": "~3.4.1",
+                "buffer-indexof-polyfill": "~1.0.0",
+                "duplexer2": "~0.1.4",
+                "fstream": "^1.0.12",
+                "graceful-fs": "^4.2.2",
+                "listenercount": "~1.0.1",
+                "readable-stream": "~2.3.6",
+                "setimmediate": "~1.0.4"
+            },
+            "dependencies": {
+                "bluebird": {
+                    "version": "3.4.7",
+                    "resolved": "https://registry.npmjs.org/bluebird/-/bluebird-3.4.7.tgz",
+                    "integrity": "sha1-9y12C+Cbf3bQjtj66Ysomo0F+rM="
+                }
+            }
+        },
         "upath": {
             "version": "1.2.0",
             "resolved": "https://registry.npmjs.org/upath/-/upath-1.2.0.tgz",
@@ -14039,8 +14605,7 @@
         "util-deprecate": {
             "version": "1.0.2",
             "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",
-            "integrity": "sha1-RQ1Nyfpw3nMnYvvS1KKJgUGaDM8=",
-            "dev": true
+            "integrity": "sha1-RQ1Nyfpw3nMnYvvS1KKJgUGaDM8="
         },
         "util.promisify": {
             "version": "1.0.1",
@@ -15301,11 +15866,15 @@
             "integrity": "sha512-OqedPIGOfsDlo31UNwYbCFMSaO9m9G/0faIHj5/dZFDMFqPTcx6UwqyOy3COEaEOg/9VsGIpdqn62W5KhoKSpg==",
             "dev": true
         },
+        "when": {
+            "version": "3.7.8",
+            "resolved": "https://registry.npmjs.org/when/-/when-3.7.8.tgz",
+            "integrity": "sha1-xxMLan6gRpPoQs3J56Hyqjmjn4I="
+        },
         "which": {
             "version": "2.0.2",
             "resolved": "https://registry.npmjs.org/which/-/which-2.0.2.tgz",
             "integrity": "sha512-BLI3Tl1TW3Pvl70l3yq3Y64i+awpwXqsGBYWkkqMtnbXgrMD+yj7rhW0kuEDxzJaYXGjEW5ogapKNMEKNMjibA==",
-            "dev": true,
             "requires": {
                 "isexe": "^2.0.0"
             }
@@ -15393,8 +15962,7 @@
         "wrappy": {
             "version": "1.0.2",
             "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz",
-            "integrity": "sha1-tSQ9jz7BqjXxNkYFvA0QNuMKtp8=",
-            "dev": true
+            "integrity": "sha1-tSQ9jz7BqjXxNkYFvA0QNuMKtp8="
         },
         "write": {
             "version": "1.0.3",
@@ -15616,6 +16184,28 @@
                     "dev": true
                 }
             }
+        },
+        "zip-stream": {
+            "version": "4.1.0",
+            "resolved": "https://registry.npmjs.org/zip-stream/-/zip-stream-4.1.0.tgz",
+            "integrity": "sha512-zshzwQW7gG7hjpBlgeQP9RuyPGNxvJdzR8SUM3QhxCnLjWN2E7j3dOvpeDcQoETfHx0urRS7EtmVToql7YpU4A==",
+            "requires": {
+                "archiver-utils": "^2.1.0",
+                "compress-commons": "^4.1.0",
+                "readable-stream": "^3.6.0"
+            },
+            "dependencies": {
+                "readable-stream": {
+                    "version": "3.6.0",
+                    "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-3.6.0.tgz",
+                    "integrity": "sha512-BViHy7LKeTz4oNnkcLJ+lVSL6vpiFeX6/d3oSH8zCW7UxP2onchk+vTGB143xuFjHS3deTgkKoXXymXqymiIdA==",
+                    "requires": {
+                        "inherits": "^2.0.3",
+                        "string_decoder": "^1.1.1",
+                        "util-deprecate": "^1.0.1"
+                    }
+                }
+            }
         }
     }
 }
diff --git a/package.json b/package.json
index 0b4921b..2e73fef 100644
--- a/package.json
+++ b/package.json
@@ -1,7 +1,9 @@
 {
-    "name": "vue3-empty",
+    "name": "zippy",
     "version": "0.1.0",
     "private": true,
+    "author": "Roman Ranniew",
+    "description": "Modern archives manager",
     "scripts": {
         "serve": "vue-cli-service serve",
         "build": "vue-cli-service build",
@@ -14,17 +16,26 @@
     },
     "main": "background.js",
     "dependencies": {
-        "7zip-min": "^1.3.2",
+        "7zip-bin": "^5.1.1",
+        "@continuata/unrar": "^1.6.0",
+        "@node_js/unrar": "^1.0.1",
+        "archiver": "^5.3.0",
+        "archiver-zip-encrypted": "^1.0.10",
         "core-js": "^3.6.5",
         "date-fns": "^2.22.1",
         "electron-store": "^8.0.0",
         "materialize-css": "^1.0.0",
+        "node-7z": "^2.1.2",
+        "node-7z-archive": "^1.0.4",
         "pretty-bytes": "^5.6.0",
+        "selecto": "^1.12.1",
+        "unzipper": "^0.10.11",
         "vue": "^3.0.0",
         "vue-router": "^4.0.0-0",
         "vuex": "^4.0.1"
     },
     "devDependencies": {
+        "@babel/plugin-proposal-class-properties": "^7.14.5",
         "@vue/cli-plugin-babel": "~4.5.0",
         "@vue/cli-plugin-eslint": "~4.5.0",
         "@vue/cli-plugin-router": "^4.5.13",
diff --git a/public/favicon.ico b/public/favicon.ico
deleted file mode 100644
index df36fcf..0000000
Binary files a/public/favicon.ico and /dev/null differ
diff --git a/src/App.vue b/src/App.vue
index 6d1b526..810fbb6 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,31 +1,32 @@
-<template>
-    <div id="app" class="app">
-        <router-view></router-view>
-    </div>
-</template>
-
-<script>
-export default {
-    name: 'App',
-}
-</script>
-
-<style lang="scss">
-@import '~materialize-css/dist/css/materialize.css';
-@import url('https://fonts.googleapis.com/icon?family=Material+Icons');
-* {
-    box-sizing: inherit;
-}
-html,
-body {
-    height: 100%;
-    background: white;
-    box-sizing: border-box;
-}
-.app {
-    height: 100%;
-}
-.max-height {
-    height: 100%;
-}
-</style>
+<template>
+    <div id="app" class="app">
+        <router-view></router-view>
+    </div>
+</template>
+
+<script>
+export default {
+    name: 'App',
+}
+</script>
+
+<style lang="scss">
+@import '~materialize-css/dist/css/materialize.css';
+@import url('https://fonts.googleapis.com/icon?family=Material+Icons');
+* {
+    box-sizing: inherit;
+}
+html,
+body {
+    height: 100%;
+    background: white;
+    box-sizing: border-box;
+}
+.app {
+    height: 100%;
+}
+.max-height {
+    height: 100%;
+}
+// test
+</style>
diff --git a/src/components/LandingPage.vue b/src/components/LandingPage.vue
index c5a3e0e..60223b0 100644
--- a/src/components/LandingPage.vue
+++ b/src/components/LandingPage.vue
@@ -1,14 +1,14 @@
-<template>
-    <Browser />
-</template>
-
-<script>
-import Browser from './browser/Browser'
-
-export default {
-    name: 'landing-page',
-    components: { Browser },
-}
-</script>
-
-<style></style>
+<template>
+    <Browser />
+</template>
+
+<script>
+import Browser from './browser/Browser'
+
+export default {
+    name: 'landing-page',
+    components: { Browser },
+}
+</script>
+
+<style></style>
diff --git a/src/components/browser/Browser.vue b/src/components/browser/Browser.vue
index b16d174..9241813 100644
--- a/src/components/browser/Browser.vue
+++ b/src/components/browser/Browser.vue
@@ -1,119 +1,314 @@
-<template>
-    <div class="browser">
-        <drive-list class="browser__drivelist" :drives="drives" :loading="loadingDrives" @click="readDir" />
-        <main class="browser__main" :class="{ loading: loading }">
-            <div class="section">
-                <filter-bar @previous="readDir(previousDir)" @filter="readDir(currentDir)" />
-                <div class="divider"></div>
-                <div class="btn-flat waves-effect waves-teal parent_dir" @click="readDir('../')" v-show="previousDirExists">../</div>
-                <div class="files-wrap">
-                    <ul class="files">
-                        <file v-for="file in files" :key="file.name" :file="file" @click="readDir(file.fullPath)"> </file>
-                    </ul>
-                </div>
-            </div>
-        </main>
-        <loader class="browser__loader" :loading="loading"></loader>
-        <!-- <vue-context ref="menu">
-            <template v-slot:default="{ child }">
-                <ul>
-                    <li @click="rename(child.data)">Rename</li>
-                    <li v-if="child.data && child.data.type === 'storage'" @click="unzip($event, child.data)">Unzip</li>
-                </ul>
-            </template>
-        </vue-context> -->
-        <div class="modal">
-            <div class="modal-content">
-                <input type="text" />
-            </div>
-            <div class="modal-footer">
-                <button class="modal-close waves-effect waves-red btn-flat">Cancel</button>
-                <button class="modal-close waves-effect waves-green btn-flat">Accept</button>
-            </div>
-        </div>
-    </div>
-</template>
-
-<script>
-import DriveList from './components/DriveList.vue'
-import FilterBar from './components/FilterBar.vue'
-import Loader from './components/Loader.vue'
-import File from './components/File.vue'
-import { computed } from 'vue'
-import { useStore } from 'vuex'
-export default {
-    components: { Loader, DriveList, FilterBar, File },
-    setup() {
-        const store = useStore()
-
-        const loadingDrives = computed(() => store.state.browser.loadingDrives)
-        const loading = computed(() => store.state.browser.loading)
-        const drives = computed(() => store.state.browser.drives)
-        const previousDir = computed(() => store.state.browser.previousDir)
-        const currentDir = computed(() => store.state.browser.currentDir)
-        const files = computed(() => store.state.browser.files)
-        const previousDirExists = computed(() => store.state.browser.previousDirExists)
-
-        store.dispatch('browser/getDrives')
-        store.dispatch('browser/readDir')
-        return {
-            loadingDrives,
-            loading,
-            drives,
-            previousDir,
-            currentDir,
-            files,
-            previousDirExists,
-            readDir(path) {
-                store.dispatch('browser/readDir', path)
-            },
-            rename() {}
-        }
-    }
-}
-</script>
-
-<style lang="scss">
-.btn-flat {
-    text-transform: none;
-    transition: background 150ms ease;
-    &:hover {
-        background: fade(black, 10%);
-    }
-}
-.browser__drivelist {
-    display: inline-block;
-    vertical-align: top;
-    width: 150px;
-    padding-top: 20px;
-    min-height: 100vh;
-    opacity: 1;
-    z-index: 2;
-    position: relative;
-    transition: opacity 250ms ease;
-}
-.browser__main {
-    display: inline-block;
-    vertical-align: top;
-    width: calc(100% - 150px);
-    opacity: 1;
-    z-index: 1;
-    position: relative;
-    transition: opacity 250ms ease;
-    &.loading {
-        opacity: 0;
-    }
-}
-.browser__loader {
-    opacity: 0;
-    position: fixed;
-    left: 50%;
-    top: 50%;
-    transform: translate(-50%, -50%);
-    z-index: -1;
-    &.loading {
-        z-index: 1;
-        opacity: 1;
-    }
-}
-</style>
+<template>
+    <div
+        class="browser"
+        ref="browserElement"
+        @click="onBrowserClick"
+        @mousemove="onMouseMove"
+        @mousedown="onMouseDown"
+        @drop="onDrop"
+        @dragenter.prevent
+        @dragover.prevent
+    >
+        <!-- <div @click="closeWindow">ZAMKNIJ OKNO</div> -->
+        <sidebar class="browser__sidebar" :drives="drives" :loading="loadingDrives" @click="readDir" />
+        <main class="browser__main" :class="{ loading: loading }">
+            <div class="section">
+                <filter-bar @previous="readDir(previousDir)" @filter="readDir(currentDir)" />
+                <div class="divider"></div>
+                <div class="btn-flat waves-effect waves-teal parent_dir" @click="readDir(previousDir)" v-show="previousDirExists">../</div>
+                <div class="files-wrap">
+                    <ul class="files" @contextmenu="onRightClick">
+                        <file
+                            v-for="(file, fileIndex) in files"
+                            :data-index="fileIndex"
+                            :key="file.name"
+                            :selected="checkIfSelected(file.fullPath)"
+                            :file="file"
+                            @click.stop="select($event, file.fullPath)"
+                            @contextmenu="select($event, file.fullPath)"
+                            @doubleClick="readDir(file.fullPath)"
+                        >
+                        </file>
+                    </ul>
+                </div>
+            </div>
+        </main>
+
+        <loader class="browser__loader" :loading="loading"></loader>
+        <context-menu :position="contextMenuCoords" :selectedFiles="selectedFiles" v-show="contextMenuOpen" @change="contextClick" />
+        <div class="modal">
+            <div class="modal-content">
+                <input type="text" />
+            </div>
+            <div class="modal-footer">
+                <button class="modal-close waves-effect waves-red btn-flat">Cancel</button>
+                <button class="modal-close waves-effect waves-green btn-flat">Accept</button>
+            </div>
+        </div>
+    </div>
+</template>
+
+<script>
+import { computed, onMounted, onUnmounted, ref } from 'vue'
+import { useStore } from 'vuex'
+import Selecto from 'selecto'
+import Sidebar from './components/Sidebar.vue'
+import FilterBar from './components/FilterBar.vue'
+import Loader from './components/Loader.vue'
+import File from './components/File.vue'
+import ContextMenu from './components/ContextMenu.vue'
+import { handledExtensions } from '@/electron/utilities/service.js'
+
+const keys = {
+    ctrl: 'Control',
+    shift: 'Shift',
+    ctrlShift: 'ControlShift',
+}
+
+export default {
+    components: { Loader, Sidebar, FilterBar, File, ContextMenu },
+
+    setup() {
+        const store = useStore()
+        let selectedFiles = ref([])
+        const browserElement = ref(false)
+        const heldKey = ref(null)
+        const contextMenuOpen = ref(false)
+        const isMoving = ref(false)
+        const contextMenuCoords = ref({ x: 0, y: 0 })
+
+        const loadingDrives = computed(() => store.state.browser.loadingDrives)
+        const loading = computed(() => store.state.browser.loading)
+        const drives = computed(() => store.state.browser.drives)
+        const previousDir = computed(() => store.state.browser.previousDir)
+        const currentDir = computed(() => store.state.browser.currentDir)
+        const files = computed(() => store.state.browser.files)
+        const filesPaths = computed(() => files.value.map((file) => file.fullPath))
+        const selectedFilesPaths = computed(() => selectedFiles.value.map((file) => file.fullPath))
+        const previousDirExists = computed(() => store.state.browser.previousDirExists)
+
+        function handleKeyEvent(ev) {
+            if (ev.key === 'Delete') {
+                store.dispatch('browser/delete', { paths: selectedFilesPaths.value })
+                return
+            }
+            if (ev.key === 'F2' && selectedFilesPaths.value.length === 1) {
+                rename()
+                return
+            }
+            if (ev.key !== keys.shift && ev.key !== keys.ctrl) {
+                return
+            }
+            if (ev.key === keys.shift && ev.ctrlKey) {
+                heldKey.value = ev.type === 'keydown' ? keys.ctrlShift : null
+                return
+            }
+
+            heldKey.value = ev.type === 'keydown' ? ev.key : null
+        }
+
+        function getSelectedFiles(path) {
+            let firstSelectedFileIndex = filesPaths.value.indexOf(selectedFilesPaths.value[0])
+            let secondSelectedFileIndex = filesPaths.value.indexOf(path)
+            if (firstSelectedFileIndex > secondSelectedFileIndex) {
+                // prettier-ignore
+                [firstSelectedFileIndex, secondSelectedFileIndex] = [secondSelectedFileIndex, firstSelectedFileIndex]
+            }
+            return files.value.slice(firstSelectedFileIndex, secondSelectedFileIndex + 1)
+        }
+
+        function handleSelection(path, heldKey) {
+            const fileIndex = filesPaths.value.indexOf(path)
+
+            const actions = {
+                [keys.ctrl](path) {
+                    const selectedFilePathIndex = selectedFilesPaths.value.indexOf(path)
+                    const isSelected = selectedFilePathIndex >= 0
+                    if (isSelected) {
+                        const { pullAt, cloneDeep } = require('lodash')
+                        const selectedFilesCopy = cloneDeep(selectedFiles.value)
+                        pullAt(selectedFilesCopy, selectedFilePathIndex)
+                        selectedFiles.value = selectedFilesCopy
+                    } else {
+                        selectedFiles.value = [...selectedFiles.value, files[fileIndex]]
+                    }
+                },
+                [keys.shift](path) {
+                    selectedFiles.value = getSelectedFiles(path)
+                },
+                [keys.ctrlShift](path) {
+                    selectedFiles.value = [...selectedFiles.value, ...getSelectedFiles(path)]
+                },
+                default() {
+                    selectedFiles.value = [files.value[fileIndex]]
+                },
+            }
+            actions[heldKey] ? actions[heldKey](path) : actions.default(path)
+        }
+        function addSelectRectangle() {
+            const selecto = new Selecto({
+                container: browserElement.value,
+                selectableTargets: ['.file'],
+                selectByClick: false,
+                selectFromInside: true,
+                continueSelect: false,
+                toggleContinueSelect: 'shift',
+                keyContainer: window,
+                preventDefault: true,
+                preventDragFromInside: true,
+                hitRate: 10,
+            })
+            selecto.on('select', (e) => {
+                selectedFiles.value = e.selected.map((el) => files.value[el.dataset.index])
+            })
+        }
+
+        const methods = {
+            checkIfSelected(path) {
+                return selectedFilesPaths.value.includes(path)
+            },
+            select(event, path) {
+                contextMenuOpen.value = false
+                if (path === null) {
+                    return (selectedFiles.value = [])
+                }
+                if (event.type === 'contextmenu' && selectedFiles.value.length > 1) {
+                    return
+                }
+
+                handleSelection(path, heldKey.value)
+            },
+            readDir(path) {
+                store.dispatch('browser/readDir', path)
+            },
+            onRightClick(ev) {
+                contextMenuCoords.value = { x: ev.pageX, y: ev.pageY }
+                contextMenuOpen.value = true
+            },
+            contextClick(eventName) {
+                contextMenuOpen.value = false
+
+                const eventFunctions = {
+                    zip() {
+                        store.dispatch('browser/zip', { paths: selectedFilesPaths.value, extension: handledExtensions.SEVENZIP, password: null })
+                    },
+                    unzip() {
+                        store.dispatch('browser/unzip', { paths: selectedFilesPaths.value })
+                    },
+                    delete() {
+                        store.dispatch('browser/delete', { paths: selectedFilesPaths.value })
+                    },
+                }
+                eventFunctions[eventName] ? eventFunctions[eventName]() : null
+            },
+            onBrowserClick(ev) {
+                contextMenuOpen.value = false
+                if (!isMoving.value) {
+                    selectedFiles.value = []
+                }
+            },
+            onMouseMove() {
+                isMoving.value = true
+            },
+            onMouseDown(ev) {
+                isMoving.value = false
+            },
+            closeWindow() {
+                window.api.closeWindow()
+            },
+            onDrop(ev) {
+                const { toArray } = require('lodash')
+                const files = toArray(ev.dataTransfer.files)
+                const paths = files.map((file) => file.path)
+                store.dispatch('browser/move', { paths, targetDir: currentDir.value })
+            },
+        }
+
+        window.addEventListener('keydown', handleKeyEvent)
+        window.addEventListener('keyup', handleKeyEvent)
+        onUnmounted(() => {
+            window.removeEventListener('keydown', handleKeyEvent)
+            window.removeEventListener('keyup', handleKeyEvent)
+        })
+        onMounted(() => {
+            addSelectRectangle()
+        })
+
+        async function init() {
+            store.dispatch('browser/getDrives')
+            await store.dispatch('browser/getCWD')
+            store.dispatch('browser/readDir', currentDir.value)
+        }
+
+        init()
+
+        return {
+            loadingDrives,
+            loading,
+            drives,
+            browserElement,
+            previousDir,
+            currentDir,
+            files,
+            filesPaths,
+            selectedFiles,
+            selectedFilesPaths,
+            previousDirExists,
+            contextMenuOpen,
+            contextMenuCoords,
+            ...methods,
+        }
+    },
+}
+</script>
+
+<style lang="scss">
+.btn-flat {
+    text-transform: none;
+    transition: background 150ms ease;
+    &:hover {
+        background: fade(black, 10%);
+    }
+}
+.browser__sidebar {
+    display: inline-block;
+    vertical-align: top;
+    width: 150px;
+    padding-top: 20px;
+    min-height: 100vh;
+    opacity: 1;
+    z-index: 2;
+    position: relative;
+    transition: opacity 250ms ease;
+}
+.browser__main {
+    display: inline-block;
+    vertical-align: top;
+    width: calc(100% - 150px);
+    height: 100vh;
+    opacity: 1;
+    z-index: 1;
+    position: relative;
+    transition: opacity 250ms ease;
+    &.loading {
+        opacity: 0;
+    }
+}
+.browser__loader {
+    opacity: 0;
+    position: fixed;
+    left: 50%;
+    top: 50%;
+    transform: translate(-50%, -50%);
+    z-index: -1;
+    &.loading {
+        z-index: 1;
+        opacity: 1;
+    }
+}
+.files-wrap {
+    max-height: calc(100vh - 105px);
+    overflow: auto;
+    -webkit-app-region: drag;
+}
+</style>
diff --git a/src/components/browser/components/ContextMenu.vue b/src/components/browser/components/ContextMenu.vue
new file mode 100644
index 0000000..f37cdc9
--- /dev/null
+++ b/src/components/browser/components/ContextMenu.vue
@@ -0,0 +1,60 @@
+<template>
+    <div class="">
+        <div class="context-menu z-depth-3" :style="{ left: `${position.x}px`, top: `${position.y}px` }">
+            <ul>
+                <li class="context-menu__item" v-show="!isArchive" @click="$emit('change', 'zip')">Zip</li>
+                <li class="context-menu__item" v-show="hasArchive" @click="$emit('change', 'unzip')">Unzip</li>
+                <li class="context-menu__item" v-show="selectedFiles.length === 1" @click="$emit('change', 'rename')">Rename</li>
+                <li class="context-menu__item" v-show="selectedFiles.length === 0" @click="$emit('change', 'new')">New folder</li>
+                <li class="context-menu__item" @click="$emit('change', 'delete')">Delete</li>
+            </ul>
+        </div>
+    </div>
+</template>
+
+<script>
+import { computed } from 'vue'
+export default {
+    props: {
+        selectedFiles: {
+            required: true,
+            type: Array,
+        },
+        position: {
+            require: true,
+            type: Object,
+        },
+    },
+    setup(props) {
+        const hasArchive = computed(() => !!props.selectedFiles.find((file) => file.type === 'archive'))
+        const isArchive = computed(() => {
+            if (props.selectedFiles.length === 1) {
+                return props.selectedFiles[0].type === 'archive'
+            }
+            return false
+        })
+        return {
+            hasArchive,
+            isArchive,
+        }
+    },
+}
+</script>
+
+<style lang="scss">
+.context-menu {
+    position: fixed;
+    background: white;
+    padding: 3px 0px;
+    z-index: 100;
+    border-radius: 6px;
+    min-width: 100px;
+}
+.context-menu__item {
+    cursor: pointer;
+    padding: 5px 10px;
+    &:hover {
+        background: teal;
+    }
+}
+</style>
diff --git a/src/components/browser/components/File.vue b/src/components/browser/components/File.vue
index 38113f7..dc606b6 100644
--- a/src/components/browser/components/File.vue
+++ b/src/components/browser/components/File.vue
@@ -1,22 +1,37 @@
 <template>
-    <li class="truncate file" v-if="!file.hidden" @click="$emit('click')" @contextmenu.prevent="$emit('right-click', $event, file)">
-        <div class="file__col icon"><i class="material-icons left" v-text="file.type" v-if="file.type"></i></div>
+    <li class="truncate file" :class="{ 'file--selected': selected }" @dblclick="$emit('doubleClick')">
+        <div class="file__col icon"><i class="material-icons left" v-text="icon" v-if="file.type"></i></div>
         <div class="file__col name">
             <span>{{ file.name }}</span>
         </div>
-        <div class="file__col size" v-if="file.display">
+        <div class="file__col size">
             <span>{{ file.display.size }}</span>
         </div>
-        <div class="file__col time" v-if="file.display">
+        <div class="file__col time">
             <span>{{ file.display.time }}</span>
         </div>
     </li>
 </template>
 <script>
+import { computed } from 'vue'
 export default {
     props: {
-        file: Object
-    }
+        file: Object,
+        selected: Boolean,
+    },
+    setup(props) {
+        const icon = computed(() => {
+            const icons = {
+                archive: 'storage',
+                folder: 'folder',
+                file: 'file',
+            }
+            return icons[props.file.type]
+        })
+        return {
+            icon,
+        }
+    },
 }
 </script>
 
@@ -25,18 +40,19 @@ $accent: teal;
 .file {
     color: #444;
     font-size: 13px;
-    cursor: pointer;
     letter-spacing: 0.5px;
     font-family: Roboto;
     display: table-row;
-    &:nth-child(2n + 1) {
-        background: fade($accent, 5%);
-    }
+
     transition: background 150ms ease;
+    user-select: none;
     &:hover {
-        background: fade(black, 10%);
+        background: rgba(black, 10%);
     }
 }
+.file--selected {
+    background: rgba($accent, 10%);
+}
 
 .file__col {
     &:first-child {
diff --git a/src/components/browser/components/FilterBar.vue b/src/components/browser/components/FilterBar.vue
index 83ae0a5..737ffc6 100644
--- a/src/components/browser/components/FilterBar.vue
+++ b/src/components/browser/components/FilterBar.vue
@@ -1,66 +1,66 @@
-<template>
-    <div class="filter-bar">
-        <a class="btn-flat waves-effect waves-teal" @click="$emit('previous')"> <i class="material-icons left">history</i><span>Previous</span> </a>
-        <a class="btn-flat waves-effect waves-teal" @click="filterZipClick" :class="{ teal: filterZipFiles }">
-            <i class="material-icons left">content_cut</i><span>Filter zip</span>
-        </a>
-        <div class="divider"></div>
-        <div class="sort-bar z-depth-1">
-            <div class="sort-row">
-                <div class="btn-flat waves-effect waves-teal sort" v-for="(val, type) in sort" :key="type" @click="sortClick">
-                    {{ type }}
-                    <i class="material-icons right" v-if="val.direction === directionsEnum.ASCENDING">arrow_drop_up</i>
-                    <i class="material-icons right" v-if="val.direction === directionsEnum.DESCENDING">arrow_drop_down</i>
-                    <i class="material-icons right" v-if="val.direction === directionsEnum.EMPTY">remove</i>
-                </div>
-            </div>
-        </div>
-    </div>
-</template>
-
-<script>
-import { computed } from 'vue'
-import { useStore } from 'vuex'
-import { directionsEnum, sortEnum } from '@/store/filters'
-export default {
-    setup(props, { emit }) {
-        const store = useStore()
-        const filterZipFiles = computed({
-            get() {
-                return store.state.browser.filterZipFiles
-            },
-            set(value) {
-                store.commit('browser/filterZipFiles', value)
-            },
-        })
-        const sort = computed(() => store.state.filters.sort)
-        return {
-            directionsEnum,
-            sortEnum,
-            sort,
-            filterZipFiles,
-            sortClick(type) {
-                store.dispatch('filters/sortFiles', type)
-            },
-            filterZipClick() {
-                filterZipFiles.value = !filterZipFiles.value
-                emit('filter')
-            },
-        }
-    },
-}
-</script>
-
-<style lang="scss">
-.sort-bar {
-    display: table;
-    width: 100%;
-    border-collapse: collapse;
-}
-.sort-row {
-    display: table-row;
-}
-.sort {
-    display: table-cell;
-}
-</style>
+<template>
+    <div class="filter-bar">
+        <a class="btn-flat waves-effect waves-teal" @click="$emit('previous')"> <i class="material-icons left">history</i><span>Previous</span> </a>
+        <a class="btn-flat waves-effect waves-teal" @click="filterZipClick" :class="{ teal: filterZipFiles }">
+            <i class="material-icons left">visibility</i><span>Show only zip files</span>
+        </a>
+        <div class="divider"></div>
+        <div class="sort-bar z-depth-1">
+            <div class="sort-row">
+                <div class="btn-flat waves-effect waves-teal sort" v-for="(val, type) in sort" :key="type" @click="sortClick(type)">
+                    {{ type }}
+                    <i class="material-icons right" v-if="val.direction === directionsEnum.ASCENDING">arrow_drop_up</i>
+                    <i class="material-icons right" v-if="val.direction === directionsEnum.DESCENDING">arrow_drop_down</i>
+                    <i class="material-icons right" v-if="val.direction === directionsEnum.EMPTY">remove</i>
+                </div>
+            </div>
+        </div>
+    </div>
+</template>
+
+<script>
+import { computed } from 'vue'
+import { useStore } from 'vuex'
+import { directionsEnum, sortEnum } from '@/store/filters'
+export default {
+    setup(props, { emit }) {
+        const store = useStore()
+        const filterZipFiles = computed({
+            get() {
+                return store.state.browser.filterZipFiles
+            },
+            set(value) {
+                store.commit('browser/filterZipFiles', value)
+            },
+        })
+        const sort = computed(() => store.state.filters.sort)
+        return {
+            directionsEnum,
+            sortEnum,
+            sort,
+            filterZipFiles,
+            sortClick(type) {
+                store.dispatch('filters/sortFiles', type)
+            },
+            filterZipClick() {
+                filterZipFiles.value = !filterZipFiles.value
+                emit('filter')
+            },
+        }
+    },
+}
+</script>
+
+<style lang="scss">
+.sort-bar {
+    display: table;
+    width: 100%;
+    border-collapse: collapse;
+}
+.sort-row {
+    display: table-row;
+}
+.sort {
+    display: table-cell;
+}
+</style>
diff --git a/src/components/browser/components/Loader.vue b/src/components/browser/components/Loader.vue
index ca0a527..ef86312 100644
--- a/src/components/browser/components/Loader.vue
+++ b/src/components/browser/components/Loader.vue
@@ -13,7 +13,7 @@
                 </div>
             </div>
         </div>
-        <p class="flow-text">Opening the archive...</p>
+        <p class="flow-text">Opening directory...</p>
         <!-- TODO: progress bar -->
     </div>
 </template>
@@ -21,8 +21,8 @@
 <script>
 export default {
     props: {
-        loading: Boolean
-    }
+        loading: Boolean,
+    },
 }
 </script>
 
diff --git a/src/components/browser/components/DriveList.vue b/src/components/browser/components/Sidebar.vue
similarity index 100%
rename from src/components/browser/components/DriveList.vue
rename to src/components/browser/components/Sidebar.vue
diff --git a/src/electron/background.js b/src/electron/background.js
index ec021b3..bc78929 100644
--- a/src/electron/background.js
+++ b/src/electron/background.js
@@ -1,6 +1,6 @@
 'use strict'
 
-import { app, protocol, BrowserWindow } from 'electron'
+import { app, protocol, BrowserWindow, ipcRenderer } from 'electron'
 import { createProtocol } from 'vue-cli-plugin-electron-builder/lib'
 import installExtension, { VUEJS3_DEVTOOLS } from 'electron-devtools-installer'
 const isDevelopment = process.env.NODE_ENV !== 'production'
@@ -11,27 +11,29 @@ const { handleFile } = require('./system-handlers/app')
 const { saveLog } = require('./utilities/log')
 protocol.registerSchemesAsPrivileged([{ scheme: 'app', privileges: { secure: true, standard: true } }])
 
-const isDev = process.env.NODE_ENV === 'development'
 const unzipPath = path.parse(process.argv[1])
 if (unzipPath.base === 'dist_electron' || unzipPath.base === 'zippy') {
     async function createWindow() {
         const win = new BrowserWindow({
-            width: 800,
-            height: 600,
+            width: 1600,
+            height: 1000,
             webPreferences: {
                 nodeIntegration: process.env.ELECTRON_NODE_INTEGRATION,
                 contextIsolation: !process.env.ELECTRON_NODE_INTEGRATION,
                 preload: path.join(__dirname, 'preload.js'),
                 enableRemoteModule: true,
+                frame: false,
+                autoHideMenuBar: true,
             },
         })
 
+        addIpcHandlers(win)
         if (process.env.WEBPACK_DEV_SERVER_URL) {
             await win.loadURL(process.env.WEBPACK_DEV_SERVER_URL)
             if (!process.env.IS_TEST) win.webContents.openDevTools()
         } else {
             createProtocol('app')
-            win.loadURL('app://./index.html')
+            await win.loadURL('app://./index.html')
         }
     }
 
@@ -69,8 +71,6 @@ if (unzipPath.base === 'dist_electron' || unzipPath.base === 'zippy') {
             })
         }
     }
-
-    addIpcHandlers()
 } else {
     handleFile(process.argv[1])
         .then(() => {
diff --git a/src/electron/preload.js b/src/electron/preload.js
index ec04900..2dfbbe0 100644
--- a/src/electron/preload.js
+++ b/src/electron/preload.js
@@ -2,8 +2,32 @@
 
 const { contextBridge, ipcRenderer } = require('electron')
 
-// In this file we want to expose protected methods that allow the renderer
-// process to use the ipcRenderer without exposing the entire object.
+const { handlers } = require('./service/ipc')
+const remote = require('electron').remote
+
+/****************************************************************
+ * Auto-creates window.api[handleName] handlers
+ *
+ *
+ * *************/
+const apiFunctions = Object.keys(handlers).reduce((reducer, key) => {
+    reducer[key] = (payload) => ipcRenderer.invoke(key, payload)
+    return reducer
+}, {})
+
+let watchDir
+
 contextBridge.exposeInMainWorld('api', {
-    readDir: (payload) => ipcRenderer.invoke('readDir', payload),
+    ...apiFunctions,
+    dirWatcher: (payload) => {
+        if (watchDir) ipcRenderer.removeListener('dirChange', watchDir)
+        ipcRenderer.invoke('watchDir', { dir: payload.dir })
+        watchDir = function (event, data) {
+            payload.callback(data)
+        }
+        ipcRenderer.on('dirChange', watchDir)
+    },
+    closeWindow() {
+        remote.getCurrentWindow().close()
+    },
 })
diff --git a/src/electron/service/browser.js b/src/electron/service/browser.js
index 0a5f6ec..e0b8a28 100644
--- a/src/electron/service/browser.js
+++ b/src/electron/service/browser.js
@@ -1,79 +1,75 @@
-const { saveLog } = require('../utilities/log')
-function getDirPattern(isInsideArchive, filterZip = true) {
-    let pattern = '*'
-    if (!isInsideArchive) {
-        pattern = '*(!(*.*)'
-        if (filterZip) {
-            'rar, zip, 7z'.split(', ').forEach(ext => (pattern += `|*.${ext}`))
-        } else {
-            pattern += '|*.*'
-        }
-        pattern = pattern + ')'
-    }
-    return pattern
-}
-async function openFile(filePath) {
-    const fs = require('fs-extra')
-    const path = require('path')
-    const { extractArchive } = require('../utilities/service')
-
-    const filePathParsed = path.parse(filePath)
-    const targetPath = path.resolve(process.env.TMP, `${filePathParsed.name}${filePathParsed.ext}`)
-    const pathExists = await fs.pathExists(targetPath)
-    if (pathExists) {
-        return targetPath
-    } else {
-        return await extractArchive(filePath, targetPath)
-    }
-}
-
-function getDirectoryFiles(dir, filterZipFiles, openedArchive) {
-    const { getFileStats } = require('../utilities/file')
-    const glob = require('glob')
-
-    return new Promise((resolve, reject) => {
-        glob(getDirPattern(openedArchive, filterZipFiles), { cwd: dir }, async (error, newFiles) => {
-            files = await Promise.all(newFiles.map(async file => await getFileStats(file, dir)))
-            if (error) {
-                reject(error)
-            }
-            resolve(files)
-        })
-    })
-}
-
-async function readDir(targetDir, filterZipFiles, openedArchive) {
-    const path = require('path')
-    const fs = require('fs-extra')
-    if (openedArchive) {
-        if (targetDir.search(openedArchive) < 0) {
-            openedArchive = false
-        }
-    }
-    // --If target directory is a file
-    const stat = await fs.stat(targetDir)
-    const isFile = stat.isFile()
-    if (isFile) {
-        try {
-            const archiveDir = await openFile(targetDir)
-            const targetDirParsed = path.parse(targetDir)
-            return await readDir(archiveDir, filterZipFiles, `${targetDirParsed.name}${targetDirParsed.ext}`)
-        } catch (error) {
-            saveLog('ERROR', 'open-file', error)
-        }
-    } else {
-        // --
-        let files
-
-        try {
-            files = await getDirectoryFiles(targetDir, filterZipFiles, openedArchive)
-        } catch (error) {
-            saveLog('ERROR', 'glob-read', error)
-        }
-        return { files, targetDir }
-    }
-}
-
-module.exports = {
-    readDir
-}
+const { saveLog } = require('../utilities/log')
+
+async function openFile(filePath) {
+    const path = require('path')
+    const { extractArchive } = require('../utilities/service')
+
+    const targetPath = path.resolve(process.env.TMP)
+    return await extractArchive(filePath, targetPath)
+}
+
+function getDirectoryFiles(dir) {
+    const { getFileStats } = require('../utilities/file')
+    const glob = require('glob')
+
+    return new Promise((resolve, reject) => {
+        glob(`*(!($RECYCLE.BIN))`, { cwd: dir }, async (error, newFiles) => {
+            files = await Promise.all(newFiles.map(async (file) => await getFileStats(file, dir)))
+            files = files.filter((file) => !!file)
+            if (error) {
+                reject(error)
+            }
+            resolve(files)
+        })
+    })
+}
+async function handleFile(fileDir) {
+    const path = require('path')
+    const { handledExtensions } = require('../utilities/service')
+
+    const fileExtension = path.extname(fileDir)
+    if (Object.values(handledExtensions).includes(fileExtension)) {
+        try {
+            const archiveDir = await openFile(fileDir)
+            return await readDir(archiveDir)
+        } catch (error) {
+            saveLog('ERROR', 'open-file', error)
+            return { error }
+        }
+    } else {
+        const shell = require('electron').shell
+
+        shell.openPath(fileDir)
+        return {
+            targetDir: path.parse(fileDir).dir,
+            handledDefault: true,
+        }
+    }
+}
+
+async function readDir(targetDir) {
+    const fs = require('fs-extra')
+    const path = require('path')
+    targetDir = path.normalize(targetDir)
+    const previousDir = path.join(targetDir, '..')
+    const targetStat = await fs.stat(targetDir)
+    const isFile = targetStat.isFile()
+    if (isFile) {
+        return await handleFile(targetDir)
+    } else {
+        // --
+        let files, error
+
+        try {
+            files = await getDirectoryFiles(targetDir)
+        } catch (dirError) {
+            error = dirError
+            saveLog('ERROR', 'glob-read', dirError)
+        }
+        return { files, targetDir, previousDir, error }
+    }
+}
+
+module.exports = {
+    readDir,
+}
diff --git a/src/electron/service/ipc.js b/src/electron/service/ipc.js
index c255a89..28c7975 100644
--- a/src/electron/service/ipc.js
+++ b/src/electron/service/ipc.js
@@ -1,19 +1,68 @@
-const Store = require('electron-store')
-const { readDir } = require('./browser')
-const storage = new Store()
-const { ipcMain } = require('electron')
-
-const handlers = {
-    async readDir(event, payload) {
-        const response = await readDir(payload.dir, payload.filterZipFiles)
-        return response
-    },
-}
-
-module.exports = {
-    addIpcHandlers() {
-        Object.keys(handlers).forEach((key) => {
-            ipcMain.handle(key, handlers[key])
-        })
-    },
-}
+const Store = require('electron-store')
+const { readDir } = require('./browser')
+const storage = new Store()
+const { ipcMain } = require('electron')
+const { extractArchive, createArchive } = require('../utilities/service')
+
+let dirWatcher
+const handlers = {
+    async readStore(event, payload) {
+        return storage.get(payload.name)
+    },
+    async readDir(event, payload) {
+        const path = require('path')
+        storage.set('cwd', path.normalize(payload.dir))
+        const response = await readDir(payload.dir)
+        return response
+    },
+    unzip(event, payload) {
+        const path = require('path')
+        const targetDir = path.parse(payload.paths[0])
+        payload.paths.forEach((path) => {
+            extractArchive(path, targetDir.dir, payload.password)
+        })
+    },
+    zip(event, payload) {
+        return createArchive(payload.paths, payload.extension, payload.password)
+    },
+    delete(event, payload) {
+        const fs = require('fs-extra')
+        payload.paths.forEach((path) => {
+            fs.remove(path)
+        })
+    },
+    async move(event, payload) {
+        const fs = require('fs-extra')
+        const path = require('path')
+
+        const moves = payload.paths.map(async (filePath) => {
+            const pathParsed = path.parse(filePath)
+            const targetPath = `${payload.targetDir}/${pathParsed.name}${pathParsed.ext}`
+            return await fs.move(filePath, targetPath)
+        })
+        try {
+            await Promise.all(moves)
+        } catch (err) {
+            return err
+        }
+    },
+}
+
+module.exports = {
+    handlers,
+    addIpcHandlers(win) {
+        Object.keys(handlers).forEach((key) => {
+            ipcMain.handle(key, handlers[key])
+        })
+        ipcMain.handle('watchDir', (event, payload) => {
+            const fs = require('fs')
+            const { debounce } = require('lodash')
+            dirWatcher && dirWatcher.close()
+            const watcherCallback = async (a, b) => {
+                const paths = await readDir(payload.dir)
+                win.webContents.send('dirChange', paths)
+            }
+            dirWatcher = fs.watch(payload.dir, {}, debounce(watcherCallback, 33))
+        })
+    },
+}
diff --git a/src/electron/system-handlers/app.js b/src/electron/system-handlers/app.js
index 941b76a..25ca0c4 100644
--- a/src/electron/system-handlers/app.js
+++ b/src/electron/system-handlers/app.js
@@ -6,7 +6,7 @@ module.exports = {
     async handleFile(filePath) {
         const targetDir = path.parse(filePath).dir
         try {
-            await extractArchive(filePath, targetDir)
+            await extractArchive(filePath, targetDir, password)
         } catch (error) {
             saveLog('ERROR', 'extraction', error)
         }
diff --git a/src/electron/utilities/file.js b/src/electron/utilities/file.js
index b475409..da5de2c 100644
--- a/src/electron/utilities/file.js
+++ b/src/electron/utilities/file.js
@@ -1,47 +1,54 @@
-function getDisplayStats(stats) {
-    const { format } = require('date-fns')
-    const prettyBytes = require('pretty-bytes')
-
-    return {
-        size: stats.size ? prettyBytes(stats.size) : '',
-        time: format(stats.mtime, 'yyyy/MM/dd HH:mm')
-    }
-}
-module.exports = {
-    async getFileStats(file, currentDir) {
-        if (file === '../') {
-            return {
-                type: ''
-            }
-        }
-        const path = require('path')
-        const fs = require('fs-extra')
-        const { clone } = require('lodash')
-        const fullPath = path.resolve(currentDir, file)
-        try {
-            const data = await fs.stat(fullPath)
-            const dataStats = clone(data)
-            dataStats.mtime = data.mtime.getTime()
-            dataStats.atime = data.atime.getTime()
-            dataStats.ctime = data.ctime.getTime()
-            return {
-                type: data.isDirectory() ? 'folder' : 'storage',
-                name: file,
-                data: dataStats,
-                hidden: 0,
-                fullPath: fullPath,
-                display: getDisplayStats(data)
-            }
-        } catch (err) {
-            console.warn(err)
-            return {
-                type: 'lock',
-                hidden: true
-            }
-        }
-    },
-    getDisplayStats,
-    renameDir(file) {
-        console.log(file)
-    }
-}
+function getDisplayStats(stats) {
+    const { format } = require('date-fns')
+    const prettyBytes = require('pretty-bytes')
+
+    return {
+        size: stats.size ? prettyBytes(stats.size) : '',
+        time: format(stats.mtime, 'yyyy/MM/dd HH:mm'),
+    }
+}
+const { handledExtensions } = require('./service')
+
+module.exports = {
+    async getFileStats(file, currentDir) {
+        if (file === '../') {
+            return {
+                type: '',
+            }
+        }
+        const path = require('path')
+        const fs = require('fs-extra')
+        const { clone, find } = require('lodash')
+        const fullPath = path.resolve(currentDir, file)
+        try {
+            const data = await fs.stat(fullPath)
+            const dataStats = clone(data)
+            dataStats.mtime = data.mtime.getTime()
+            dataStats.atime = data.atime.getTime()
+            dataStats.ctime = data.ctime.getTime()
+            const extension = path.parse(file).ext
+            let type = 'folder'
+            if (!data.isDirectory()) {
+                if (!!find(handledExtensions, (value) => value === extension)) {
+                    type = 'archive'
+                } else {
+                    type = 'file'
+                }
+            }
+            return {
+                type,
+                name: file,
+                data: dataStats,
+                fullPath: path.normalize(fullPath),
+                display: getDisplayStats(data),
+            }
+        } catch (err) {
+            console.warn(err)
+            return null
+        }
+    },
+    getDisplayStats,
+    renameDir(file) {
+        console.log(file)
+    },
+}
diff --git a/src/electron/utilities/service.js b/src/electron/utilities/service.js
index 9b30343..8b44d96 100644
--- a/src/electron/utilities/service.js
+++ b/src/electron/utilities/service.js
@@ -1,37 +1,100 @@
-module.exports = {
-    extractArchive(sourcePath, targetDir) {
-        const path = require('path')
-
-        return new Promise((resolve, reject) => {
-            const extensions = {
-                '.zip': () => {
-                    const extract = require('extract-zip')
-
-                    extract(sourcePath, { dir: targetDir }, (error) => {
-                        console.log('aaa poszlo zip', error)
-                        if (error) {
-                            return reject(error)
-                        }
-                        resolve(targetDir)
-                    })
-                },
-                '.7z': () => {
-                    const _7z = require('7zip-min')
-                    _7z.unpack(sourcePath, targetDir, (error) => {
-                        if (error) {
-                            return reject(error)
-                        }
-                        resolve(targetDir)
-                    })
-                },
-            }
-            const extension = path.parse(sourcePath).ext
-            const extractFunction = extensions[extension]
-            if (extractFunction) {
-                extractFunction()
-            } else {
-                reject('Unhandled extension: ' + extension)
-            }
-        })
-    },
-}
+const handledExtensions = {
+    ZIP: '.zip',
+    SEVENZIP: '.7z',
+    RAR: '.rar',
+}
+
+module.exports = {
+    handledExtensions,
+    async extractArchive(sourcePath, targetDir, password) {
+        const path = require('path')
+        const fs = require('fs-extra')
+
+        let zipName = path.parse(sourcePath).name
+        let zipTargetDir = path.normalize(`${targetDir}/${zipName}`)
+        await fs.ensureDir(zipTargetDir)
+
+        return new Promise((resolve, reject) => {
+            const extensions = {
+                [handledExtensions.ZIP]: async () => {
+                    const unzipper = require('unzipper')
+                    const directory = await unzipper.Open.file(sourcePath)
+                    const extractionPromises = []
+                    directory.files.forEach(async (file) => {
+                        const extracted = password ? await file.buffer(password) : await file.buffer()
+                        extractionPromises.push(await fs.writeFile(`${zipTargetDir}\\${file.path}`, extracted))
+                    })
+                    await Promise.all(extractionPromises)
+                    resolve(zipTargetDir)
+                },
+                [handledExtensions.SEVENZIP]: async () => {
+                    const sevenBin = require('7zip-bin')
+                    const { extractFull } = require('node-7z')
+
+                    const pathTo7zip = sevenBin.path7za
+                    await extractFull(sourcePath, zipTargetDir, {
+                        $bin: pathTo7zip,
+                        password,
+                    })
+                    resolve(zipTargetDir)
+                },
+            }
+            const extension = path.parse(sourcePath).ext
+            const extractFunction = extensions[extension]
+            if (extractFunction) {
+                extractFunction()
+            } else {
+                reject('Unhandled extension: ' + extension)
+            }
+        })
+    },
+    createArchive(paths, extension, password) {
+        return new Promise((resolve, reject) => {
+            const path = require('path')
+            const targetDir = path.parse(paths[0]).dir
+            const dirArray = targetDir.split('\\')
+            const zipPath = `${targetDir}\\${dirArray[dirArray.length - 1]}${extension}`
+
+            const extensions = {
+                [handledExtensions.ZIP]: async () => {
+                    const archiver = require('archiver')
+                    archiver.registerFormat('zip-encrypted', require('archiver-zip-encrypted'))
+
+                    const fs = require('fs-extra')
+                    const output = fs.createWriteStream(zipPath)
+                    output.on('end', () => resolve())
+                    let archive
+                    if (password) {
+                        archive = archiver.create('zip-encrypted', { zlib: { level: 8 }, encryptionMethod: 'aes256', password })
+                    } else {
+                        archive = archiver.create('zip', { zlib: { level: 8 } })
+                    }
+                    archive.pipe(output)
+                    paths.forEach(async (filePath) => {
+                        const pathParsed = path.parse(filePath)
+                        archive.append(fs.createReadStream(filePath), { name: `${pathParsed.name}${pathParsed.ext}` })
+                    })
+                    archive.finalize((error) => {
+                        console.log('finalize error', error)
+                        error && reject(error)
+                    })
+                },
+                [handledExtensions.SEVENZIP]: async () => {
+                    const sevenBin = require('7zip-bin')
+                    const { add } = require('node-7z')
+                    const pathTo7zip = sevenBin.path7za
+                    await add(zipPath, paths, {
+                        $bin: pathTo7zip,
+                        password: password ? password : undefined,
+                    })
+                },
+            }
+            const zipFunction = extensions[extension]
+            if (zipFunction) {
+                zipFunction()
+            } else {
+                reject('Unhandled extension: ' + extension)
+            }
+        })
+    },
+}
diff --git a/src/store/browser.js b/src/store/browser.js
index 5728edd..8f41ec5 100644
--- a/src/store/browser.js
+++ b/src/store/browser.js
@@ -1,53 +1,75 @@
-const { makeMutations } = require('../utilities/store')
-
-const initialState = {
-    files: [],
-    drives: [],
-    loading: true,
-    loadingDrives: true,
-    openedArchive: false,
-    filterZipFiles: false,
-    currentDir: '',
-    previousDir: null,
-    previousDirExists: false
-}
-
-export default {
-    state: initialState,
-    namespaced: true,
-    mutations: {
-        ...makeMutations(initialState)
-    },
-    actions: {
-        getDrives() {
-            const platforms = {
-                win32: async () => {
-                    // const drives = await getWinDrives()
-                    // context.commit('drives', drives)
-                }
-            }
-            platforms[process.platform]?.()
-        },
-
-        readDir: async function(context, dir) {
-            const path = require('path')
-            const os = require('os')
-            if (!dir) {
-                dir = os.homedir()
-            }
-            context.commit('previousDir', context.state.currentDir)
-            context.commit('loading', true)
-            const response = await window.api.readDir({ dir, filterZipFiles: context.state.filterZipFiles })
-            window.title = response.targetDir
-            context.commit('files', response.files)
-            context.commit('previousDirExists', path.dirname(dir) !== dir)
-            context.commit('currentDir', dir)
-            context.commit('loading', false)
-        },
-        sortFiles(context, payload) {
-            const { orderBy } = require('lodash')
-
-            context.commit('files', orderBy(context.rootState.browser.files, payload))
-        }
-    }
-}
+const { makeMutations } = require('../utilities/store')
+
+const initialState = {
+    files: [],
+    drives: [],
+    loading: true,
+    loadingDrives: true,
+    openedArchive: false,
+    filterZipFiles: false,
+    currentDir: '',
+    previousDir: null,
+    previousDirExists: false,
+}
+
+export default {
+    state: initialState,
+    namespaced: true,
+    mutations: {
+        ...makeMutations(initialState),
+    },
+    actions: {
+        getDrives() {
+            const platforms = {
+                win32: async () => {
+                    // const drives = await getWinDrives()
+                    // context.commit('drives', drives)
+                },
+            }
+            platforms[process.platform]?.()
+        },
+
+        readDir: async function (context, dir) {
+            const path = require('path')
+            const os = require('os')
+            if (!dir) {
+                dir = os.homedir()
+            }
+            context.commit('loading', true)
+            const response = await window.api.readDir({ dir })
+            if (!response.handledDefault) {
+                context.commit('files', response.files)
+                context.commit('currentDir', response.targetDir)
+                context.commit('previousDir', response.previousDir)
+            }
+            window.api.dirWatcher({
+                dir,
+                callback: (response) => {
+                    context.commit('files', response.files)
+                },
+            })
+            context.commit('loading', false)
+        },
+        sortFiles(context, payload) {
+            const { orderBy } = require('lodash')
+
+            context.commit('files', orderBy(context.rootState.browser.files, payload))
+        },
+        async unzip(context, payload) {
+            await window.api.unzip(payload)
+        },
+        async zip(context, payload) {
+            await window.api.zip(payload)
+        },
+        async delete(context, payload) {
+            await window.api.delete(payload)
+        },
+        async move(context, payload) {
+            await window.api.move(payload)
+        },
+        async getCWD(context) {
+            const dir = await window.api.readStore({ name: 'cwd' })
+            context.commit('currentDir', dir)
+        },
+    },
+}
diff --git a/src/store/filters.js b/src/store/filters.js
index 46af8ed..1a31494 100644
--- a/src/store/filters.js
+++ b/src/store/filters.js
@@ -1,51 +1,53 @@
-import { makeMutations } from '../utilities/store'
-
-export const sortEnum = {
-    NAME: 'name',
-    SIZE: 'size',
-    TIME: 'time',
-}
-export const directionsEnum = {
-    ASCENDING: 'asc',
-    DESCENDING: 'desc',
-    EMPTY: '',
-}
-
-const initialState = {
-    sortType: sortEnum[0],
-    sort: {
-        [sortEnum.NAME]: { direction: 'asc' },
-        [sortEnum.SIZE]: { direction: '' },
-        [sortEnum.TIME]: { direction: '' },
-    },
-}
-export default {
-    state: initialState,
-    mutations: {
-        ...makeMutations(initialState),
-        sortDirection(state, payload) {
-            state.sort[payload.type] = payload.direction
-        },
-    },
-    actions: {
-        sortFiles(context, type) {
-            const direction = sortEnum[type] || 'desc'
-            context.commit('sortDirection', { type, direction })
-            context.commit('sortType', type)
-
-            const sortMode = {
-                name: 'name',
-                size: 'data.size',
-                time: 'data.mtime',
-            }
-
-            context.state.sort.forEach((sort, sortTypeKey) => {
-                if (sortTypeKey !== type) {
-                    context.commit('sortDirection', { type, direction: directionsEnum.EMPTY })
-                }
-            })
-
-            context.dispatch('filters/sortFiles', { sort: sortMode[type], direction })
-        },
-    },
-}
+import { makeMutations } from '../utilities/store'
+import { forEach } from 'lodash'
+
+export const sortEnum = {
+    NAME: 'name',
+    SIZE: 'size',
+    TIME: 'time',
+}
+export const directionsEnum = {
+    ASCENDING: 'asc',
+    DESCENDING: 'desc',
+    EMPTY: '',
+}
+
+const initialState = {
+    sortType: sortEnum.NAME,
+    sort: {
+        [sortEnum.NAME]: { direction: 'asc' },
+        [sortEnum.SIZE]: { direction: '' },
+        [sortEnum.TIME]: { direction: '' },
+    },
+}
+export default {
+    state: initialState,
+    namespaced: true,
+    mutations: {
+        ...makeMutations(initialState),
+        sortDirection(state, payload) {
+            state.sort[payload.type] = payload.direction
+        },
+    },
+    actions: {
+        sortFiles(context, type) {
+            const direction = sortEnum[type] || 'desc'
+            context.commit('sortDirection', { type, direction })
+            context.commit('sortType', type)
+
+            const sortMode = {
+                name: 'name',
+                size: 'data.size',
+                time: 'data.mtime',
+            }
+
+            forEach(context.state.sort, (sort, sortTypeKey) => {
+                if (sortTypeKey !== type) {
+                    context.commit('sortDirection', { type, direction: directionsEnum.EMPTY })
+                }
+            })
+
+            // context.dispatch('sortFiles', { sort: sortMode[type], direction })
+        },
+    },
+}
diff --git a/src/store/index.js b/src/store/index.js
index a59e635..665d7eb 100644
--- a/src/store/index.js
+++ b/src/store/index.js
@@ -1,13 +1,13 @@
-import { createStore } from 'vuex'
-
-const files = require.context('.', false, /\.js$/)
-const modules = {}
-
-files.keys().forEach((key) => {
-    if (key === './index.js') return
-    modules[key.replace(/(\.\/|\.js)/g, '')] = files(key).default
-})
-
-export default createStore({
-    modules,
-})
+import { createStore } from 'vuex'
+
+const files = require.context('.', false, /\.js$/)
+const modules = {}
+
+files.keys().forEach((key) => {
+    if (key === './index.js') return
+    modules[key.replace(/(\.\/|\.js)/g, '')] = files(key).default
+})
+
+export default createStore({
+    modules,
+})
diff --git a/src/utilities/store.js b/src/utilities/store.js
index 7b6d7dc..51a55c8 100644
--- a/src/utilities/store.js
+++ b/src/utilities/store.js
@@ -1,10 +1,10 @@
-module.exports = {
-    makeMutations(state) {
-        return Object.keys(state).reduce((obj, key) => {
-            obj[key] = function (state, value) {
-                state[key] = value
-            }
-            return obj
-        }, {})
-    },
-}
+module.exports = {
+    makeMutations(state) {
+        return Object.keys(state).reduce((obj, key) => {
+            obj[key] = function (state, value) {
+                state[key] = value
+            }
+            return obj
+        }, {})
+    },
+}
diff --git a/vue.config.js b/vue.config.js
index 531896a..44236a7 100644
--- a/vue.config.js
+++ b/vue.config.js
@@ -1,15 +1,18 @@
+const glob = require('glob')
+const electronFiles = 'service/browser.js, service/ipc.js, utilities/file.js, /utilities/service.js'
 module.exports = {
     pluginOptions: {
         electronBuilder: {
             preload: 'src/electron/preload.js',
+            mainProcessWatch: electronFiles.split(', ').map((file) => `src/electron/${file}`),
             mainProcessFile: 'src/electron/background.js',
             builderOptions: {
                 appId: 'com.zippy.app',
                 productName: 'zippy',
                 win: {
-                    icon: './public/zippy.ico'
-                }
-            }
-        }
-    }
+                    icon: 'public/zippy.ico',
+                },
+            },
+        },
+    },
 }