From f3c7413f529be4a00dba7b0ab23904b48ea13a35 Mon Sep 17 00:00:00 2001
From: undergroundwires <undergroundwires@users.noreply.github.com>
Date: Sun, 7 Mar 2021 19:33:05 +0100
Subject: [PATCH] restructure presentation layer

- Move most GUI related code to /presentation
- Move components to /components (separate from bootstrap and style)
- Move shared components helpers to /components/shared
- Rename Bootstrapping to bootstrapping to enforce same naming
  convention in /presentation
---
 docs/presentation.md                          | 20 ++++++++++++++++---
 src/{ => presentation}/background.ts          |  4 ++++
 .../ApplicationBootstrapper.ts                |  0
 .../IVueBootstrapper.ts                       |  0
 .../Modules/IconBootstrapper.ts               |  0
 .../Modules/TooltipBootstrapper.ts            |  0
 .../Modules/TreeBootstrapper.ts               |  0
 .../Modules/VModalBootstrapper.ts             |  0
 .../Modules/VueBootstrapper.ts                |  0
 src/{ => presentation/components}/App.vue     | 10 +++++-----
 .../Code/CodeButtons/Code.vue                 |  0
 .../Code/CodeButtons/IconButton.vue           |  0
 .../Code/CodeButtons/MacOsInstructions.vue    |  0
 .../Code/CodeButtons/TheCodeButtons.vue       |  2 +-
 .../{ => components}/Code/TheCodeArea.vue     |  4 ++--
 .../Scripts/Cards/CardList.vue                |  4 ++--
 .../Scripts/Cards/CardListItem.vue            |  4 ++--
 .../Scripts/Cards/NonCollapsingDirective.ts   |  0
 .../Scripts/Menu/Grouping/Grouping.ts         |  0
 .../Scripts/Menu/Grouping/TheGrouper.vue      |  0
 .../Menu/Selector/SelectableOption.vue        |  2 +-
 .../Scripts/Menu/Selector/TheSelector.vue     |  2 +-
 .../Scripts/Menu/TheOsChanger.vue             |  2 +-
 .../Scripts/Menu/TheScriptsMenu.vue           |  2 +-
 .../Scripts/ScriptsTree/ScriptNodeParser.ts   |  0
 .../Scripts/ScriptsTree/ScriptsTree.vue       |  2 +-
 .../SelectableTree/INodeSelectedEvent.ts      |  0
 .../SelectableTree/LiquorTree/LiquorTree.d.ts |  0
 .../LiquorTree/LiquorTreeOptions.ts           |  0
 .../NodeWrapper/NodePredicateFilter.ts        |  0
 .../NodeWrapper/NodeStateUpdater.ts           |  0
 .../LiquorTree/NodeWrapper/NodeTranslator.ts  |  0
 .../SelectableTree/Node/DocumentationUrls.vue |  0
 .../ScriptsTree/SelectableTree/Node/INode.ts  |  0
 .../ScriptsTree/SelectableTree/Node/Node.vue  |  0
 .../SelectableTree/Node/RevertToggle.vue      |  2 +-
 .../Node/Reverter/CategoryReverter.ts         |  0
 .../SelectableTree/Node/Reverter/IReverter.ts |  0
 .../Node/Reverter/ReverterFactory.ts          |  0
 .../Node/Reverter/ScriptReverter.ts           |  0
 .../SelectableTree/SelectableTree.vue         |  0
 .../Scripts/Slider/Handle.vue                 |  0
 .../Scripts/Slider/HorizontalResizeSlider.vue |  0
 .../Scripts/TheScriptArea.vue                 | 10 +++++-----
 .../Scripts/TheScriptsList.vue                | 10 +++++-----
 .../{ => components/Shared}/Responsive.vue    |  0
 .../{ => components/Shared}/StatefulVue.ts    |  2 +-
 .../{ => components/Shared}/Throttle.ts       |  0
 .../TheFooter/DownloadUrlList.vue             |  0
 .../TheFooter/DownloadUrlListItem.vue         |  0
 .../TheFooter/PrivacyPolicy.vue               |  0
 .../{ => components}/TheFooter/TheFooter.vue  |  0
 .../{ => components}/TheHeader.vue            |  0
 .../{ => components}/TheSearchBar.vue         |  4 ++--
 src/{ => presentation}/main.ts                |  4 ++--
 src/{ => presentation}/shims-tsx.d.ts         |  0
 src/{ => presentation}/shims-vue.d.ts         |  0
 .../Cards/NonCollapsingDirective.spec.ts      |  4 ++--
 .../ScriptsTree/ScriptNodeParser.spec.ts      | 13 ++++++------
 .../NodeWrapper/NodePredicateFilter.spec.ts   |  4 ++--
 .../NodeWrapper/NodeStateUpdater.spec.ts      |  4 ++--
 .../NodeWrapper/NodeTranslator.spec.ts        |  4 ++--
 .../Node/Reverter/CategoryReverter.spec.ts    | 10 +++++-----
 .../Node/Reverter/ReverterFactory.spec.ts     | 17 ++++++++--------
 .../Node/Reverter/ScriptReverter.spec.ts      | 12 +++++------
 .../{ => components/Shared}/Throttle.spec.ts  |  2 +-
 vue.config.js                                 | 11 +++++++++-
 67 files changed, 100 insertions(+), 71 deletions(-)
 rename src/{ => presentation}/background.ts (94%)
 rename src/presentation/{Bootstrapping => bootstrapping}/ApplicationBootstrapper.ts (100%)
 rename src/presentation/{Bootstrapping => bootstrapping}/IVueBootstrapper.ts (100%)
 rename src/presentation/{Bootstrapping => bootstrapping}/Modules/IconBootstrapper.ts (100%)
 rename src/presentation/{Bootstrapping => bootstrapping}/Modules/TooltipBootstrapper.ts (100%)
 rename src/presentation/{Bootstrapping => bootstrapping}/Modules/TreeBootstrapper.ts (100%)
 rename src/presentation/{Bootstrapping => bootstrapping}/Modules/VModalBootstrapper.ts (100%)
 rename src/presentation/{Bootstrapping => bootstrapping}/Modules/VueBootstrapper.ts (100%)
 rename src/{ => presentation/components}/App.vue (76%)
 rename src/presentation/{ => components}/Code/CodeButtons/Code.vue (100%)
 rename src/presentation/{ => components}/Code/CodeButtons/IconButton.vue (100%)
 rename src/presentation/{ => components}/Code/CodeButtons/MacOsInstructions.vue (100%)
 rename src/presentation/{ => components}/Code/CodeButtons/TheCodeButtons.vue (98%)
 rename src/presentation/{ => components}/Code/TheCodeArea.vue (97%)
 rename src/presentation/{ => components}/Scripts/Cards/CardList.vue (95%)
 rename src/presentation/{ => components}/Scripts/Cards/CardListItem.vue (97%)
 rename src/presentation/{ => components}/Scripts/Cards/NonCollapsingDirective.ts (100%)
 rename src/presentation/{ => components}/Scripts/Menu/Grouping/Grouping.ts (100%)
 rename src/presentation/{ => components}/Scripts/Menu/Grouping/TheGrouper.vue (100%)
 rename src/presentation/{ => components}/Scripts/Menu/Selector/SelectableOption.vue (88%)
 rename src/presentation/{ => components}/Scripts/Menu/Selector/TheSelector.vue (98%)
 rename src/presentation/{ => components}/Scripts/Menu/TheOsChanger.vue (96%)
 rename src/presentation/{ => components}/Scripts/Menu/TheScriptsMenu.vue (96%)
 rename src/presentation/{ => components}/Scripts/ScriptsTree/ScriptNodeParser.ts (100%)
 rename src/presentation/{ => components}/Scripts/ScriptsTree/ScriptsTree.vue (98%)
 rename src/presentation/{ => components}/Scripts/ScriptsTree/SelectableTree/INodeSelectedEvent.ts (100%)
 rename src/presentation/{ => components}/Scripts/ScriptsTree/SelectableTree/LiquorTree/LiquorTree.d.ts (100%)
 rename src/presentation/{ => components}/Scripts/ScriptsTree/SelectableTree/LiquorTree/LiquorTreeOptions.ts (100%)
 rename src/presentation/{ => components}/Scripts/ScriptsTree/SelectableTree/LiquorTree/NodeWrapper/NodePredicateFilter.ts (100%)
 rename src/presentation/{ => components}/Scripts/ScriptsTree/SelectableTree/LiquorTree/NodeWrapper/NodeStateUpdater.ts (100%)
 rename src/presentation/{ => components}/Scripts/ScriptsTree/SelectableTree/LiquorTree/NodeWrapper/NodeTranslator.ts (100%)
 rename src/presentation/{ => components}/Scripts/ScriptsTree/SelectableTree/Node/DocumentationUrls.vue (100%)
 rename src/presentation/{ => components}/Scripts/ScriptsTree/SelectableTree/Node/INode.ts (100%)
 rename src/presentation/{ => components}/Scripts/ScriptsTree/SelectableTree/Node/Node.vue (100%)
 rename src/presentation/{ => components}/Scripts/ScriptsTree/SelectableTree/Node/RevertToggle.vue (98%)
 rename src/presentation/{ => components}/Scripts/ScriptsTree/SelectableTree/Node/Reverter/CategoryReverter.ts (100%)
 rename src/presentation/{ => components}/Scripts/ScriptsTree/SelectableTree/Node/Reverter/IReverter.ts (100%)
 rename src/presentation/{ => components}/Scripts/ScriptsTree/SelectableTree/Node/Reverter/ReverterFactory.ts (100%)
 rename src/presentation/{ => components}/Scripts/ScriptsTree/SelectableTree/Node/Reverter/ScriptReverter.ts (100%)
 rename src/presentation/{ => components}/Scripts/ScriptsTree/SelectableTree/SelectableTree.vue (100%)
 rename src/presentation/{ => components}/Scripts/Slider/Handle.vue (100%)
 rename src/presentation/{ => components}/Scripts/Slider/HorizontalResizeSlider.vue (100%)
 rename src/presentation/{ => components}/Scripts/TheScriptArea.vue (67%)
 rename src/presentation/{ => components}/Scripts/TheScriptsList.vue (91%)
 rename src/presentation/{ => components/Shared}/Responsive.vue (100%)
 rename src/presentation/{ => components/Shared}/StatefulVue.ts (94%)
 rename src/presentation/{ => components/Shared}/Throttle.ts (100%)
 rename src/presentation/{ => components}/TheFooter/DownloadUrlList.vue (100%)
 rename src/presentation/{ => components}/TheFooter/DownloadUrlListItem.vue (100%)
 rename src/presentation/{ => components}/TheFooter/PrivacyPolicy.vue (100%)
 rename src/presentation/{ => components}/TheFooter/TheFooter.vue (100%)
 rename src/presentation/{ => components}/TheHeader.vue (100%)
 rename src/presentation/{ => components}/TheSearchBar.vue (93%)
 rename src/{ => presentation}/main.ts (51%)
 rename src/{ => presentation}/shims-tsx.d.ts (100%)
 rename src/{ => presentation}/shims-vue.d.ts (100%)
 rename tests/unit/presentation/{ => components}/Scripts/Cards/NonCollapsingDirective.spec.ts (90%)
 rename tests/unit/presentation/{ => components}/Scripts/ScriptsTree/ScriptNodeParser.spec.ts (91%)
 rename tests/unit/presentation/{ => components}/Scripts/ScriptsTree/SelectableTree/LiquorTree/NodeWrapper/NodePredicateFilter.spec.ts (88%)
 rename tests/unit/presentation/{ => components}/Scripts/ScriptsTree/SelectableTree/LiquorTree/NodeWrapper/NodeStateUpdater.spec.ts (97%)
 rename tests/unit/presentation/{ => components}/Scripts/ScriptsTree/SelectableTree/LiquorTree/NodeWrapper/NodeTranslator.spec.ts (95%)
 rename tests/unit/presentation/{ => components}/Scripts/ScriptsTree/SelectableTree/Node/Reverter/CategoryReverter.spec.ts (90%)
 rename tests/unit/presentation/{ => components}/Scripts/ScriptsTree/SelectableTree/Node/Reverter/ReverterFactory.spec.ts (66%)
 rename tests/unit/presentation/{ => components}/Scripts/ScriptsTree/SelectableTree/Node/Reverter/ScriptReverter.spec.ts (87%)
 rename tests/unit/presentation/{ => components/Shared}/Throttle.spec.ts (96%)

diff --git a/docs/presentation.md b/docs/presentation.md
index 9c984b63..8b023696 100644
--- a/docs/presentation.md
+++ b/docs/presentation.md
@@ -4,6 +4,20 @@
 - Desktop application is created using [Electron](https://www.electronjs.org/).
 - Event driven as in components simply listens to events from the state and act accordingly.
 
+## Structure
+
+- [`/src/` **`presentation/`**](./../src/presentation/): Contains all presentation related code including Vue and Electron configurations
+  - [**`bootstrapping/`**](./../src/presentation/bootstrapping/): Registers Vue global objects including components and plugins.
+  - [**`components/`**](./../src/presentation/components/): Contains all Vue components and their helper classes.
+    - [**`Shared/`**](./../src/presentation/components/Shared): Contains Vue components and component helpers that are shared across other components.
+  - [**`styles/`**](./../src/presentation/styles/): Contains shared styles used throughout different components.
+  - [**`main.ts`**](./../src/presentation/main.ts): Application entry point that mounts and starts Vue application.
+  - [**`background.ts`**](./../src/presentation/background.ts): Main process of Electron, started as first thing when app starts.
+- [**`/public/`**](./../public/): Contains static assets that will simply be copied and not go through webpack.
+- [**`/vue.config.js`**](./../vue.config.js): Global Vue CLI configurations loaded by `@vue/cli-service`
+- [**`/postcss.config.js`**](./../postcss.config.js): PostCSS configurations that are used by Vue CLI internally
+- [**`/babel.config.js`**](./../babel.config.js): Babel configurations for polyfills used by `@vue/cli-plugin-babel`
+
 ## Application data
 
 - Components and should use [ApplicationFactory](./../src/application/ApplicationFactory.ts) singleton to reach the application domain.
@@ -16,9 +30,9 @@
 
 - Stateful components mutate or/and react to state changes in [ApplicationContext](./../src/application/Context/ApplicationContext.ts).
 - Stateless components that does not handle state extends `Vue`
-- Stateful components that depends on the collection state such as user selection, search queries and more extends [`StatefulVue`](./../src/presentation/StatefulVue.ts)
-- The single source of truth is a singleton of the state created and made available to presentation layer by [`StatefulVue`](./../src/presentation/StatefulVue.ts)
+- Stateful components that depends on the collection state such as user selection, search queries and more extends [`StatefulVue`](./../src/presentation/components/Shared/StatefulVue.ts)
+- The single source of truth is a singleton of the state created and made available to presentation layer by [`StatefulVue`](./../src/presentation/components/Shared/StatefulVue.ts)
 - `StatefulVue` includes abstract `handleCollectionState` that is fired once the component is loaded and also each time [collection](./collection-files.md) is changed.
 - Do not forget to subscribe from events when component is destroyed or if needed [collection](./collection-files.md) is changed.
-  - 💡 `events` in base class [`StatefulVue`](./../src/presentation/StatefulVue.ts) makes lifecycling easier
+  - 💡 `events` in base class [`StatefulVue`](./../src/presentation/components/Shared/StatefulVue.ts) makes lifecycling easier
 - 📖 See [Application state | Application layer](./presentation.md#application-state) where the state is implemented using using state pattern.
diff --git a/src/background.ts b/src/presentation/background.ts
similarity index 94%
rename from src/background.ts
rename to src/presentation/background.ts
index cb542cfc..3625bdfa 100644
--- a/src/background.ts
+++ b/src/presentation/background.ts
@@ -1,5 +1,9 @@
 'use strict';
 
+// This is main process of Electron, started as first thing when app starts.
+// This script is running through entire life of the application.
+// It doesn't have any windows which you can see on screen, opens the main window from here.
+
 import { app, protocol, BrowserWindow, shell } from 'electron';
 import { createProtocol } from 'vue-cli-plugin-electron-builder/lib';
 import installExtension, { VUEJS_DEVTOOLS } from 'electron-devtools-installer';
diff --git a/src/presentation/Bootstrapping/ApplicationBootstrapper.ts b/src/presentation/bootstrapping/ApplicationBootstrapper.ts
similarity index 100%
rename from src/presentation/Bootstrapping/ApplicationBootstrapper.ts
rename to src/presentation/bootstrapping/ApplicationBootstrapper.ts
diff --git a/src/presentation/Bootstrapping/IVueBootstrapper.ts b/src/presentation/bootstrapping/IVueBootstrapper.ts
similarity index 100%
rename from src/presentation/Bootstrapping/IVueBootstrapper.ts
rename to src/presentation/bootstrapping/IVueBootstrapper.ts
diff --git a/src/presentation/Bootstrapping/Modules/IconBootstrapper.ts b/src/presentation/bootstrapping/Modules/IconBootstrapper.ts
similarity index 100%
rename from src/presentation/Bootstrapping/Modules/IconBootstrapper.ts
rename to src/presentation/bootstrapping/Modules/IconBootstrapper.ts
diff --git a/src/presentation/Bootstrapping/Modules/TooltipBootstrapper.ts b/src/presentation/bootstrapping/Modules/TooltipBootstrapper.ts
similarity index 100%
rename from src/presentation/Bootstrapping/Modules/TooltipBootstrapper.ts
rename to src/presentation/bootstrapping/Modules/TooltipBootstrapper.ts
diff --git a/src/presentation/Bootstrapping/Modules/TreeBootstrapper.ts b/src/presentation/bootstrapping/Modules/TreeBootstrapper.ts
similarity index 100%
rename from src/presentation/Bootstrapping/Modules/TreeBootstrapper.ts
rename to src/presentation/bootstrapping/Modules/TreeBootstrapper.ts
diff --git a/src/presentation/Bootstrapping/Modules/VModalBootstrapper.ts b/src/presentation/bootstrapping/Modules/VModalBootstrapper.ts
similarity index 100%
rename from src/presentation/Bootstrapping/Modules/VModalBootstrapper.ts
rename to src/presentation/bootstrapping/Modules/VModalBootstrapper.ts
diff --git a/src/presentation/Bootstrapping/Modules/VueBootstrapper.ts b/src/presentation/bootstrapping/Modules/VueBootstrapper.ts
similarity index 100%
rename from src/presentation/Bootstrapping/Modules/VueBootstrapper.ts
rename to src/presentation/bootstrapping/Modules/VueBootstrapper.ts
diff --git a/src/App.vue b/src/presentation/components/App.vue
similarity index 76%
rename from src/App.vue
rename to src/presentation/components/App.vue
index 7a923939..a0cd601a 100644
--- a/src/App.vue
+++ b/src/presentation/components/App.vue
@@ -12,11 +12,11 @@
 
 <script lang="ts">
 import { Component, Vue } from 'vue-property-decorator';
-import TheHeader from '@/presentation/TheHeader.vue';
-import TheFooter from '@/presentation/TheFooter/TheFooter.vue';
-import TheCodeButtons from '@/presentation/Code/CodeButtons/TheCodeButtons.vue';
-import TheScriptArea from '@/presentation/Scripts/TheScriptArea.vue';
-import TheSearchBar from '@/presentation/TheSearchBar.vue';
+import TheHeader from '@/presentation/components/TheHeader.vue';
+import TheFooter from '@/presentation/components/TheFooter/TheFooter.vue';
+import TheCodeButtons from '@/presentation/components/Code/CodeButtons/TheCodeButtons.vue';
+import TheScriptArea from '@/presentation/components/Scripts/TheScriptArea.vue';
+import TheSearchBar from '@/presentation/components/TheSearchBar.vue';
 
 @Component({
   components: {
diff --git a/src/presentation/Code/CodeButtons/Code.vue b/src/presentation/components/Code/CodeButtons/Code.vue
similarity index 100%
rename from src/presentation/Code/CodeButtons/Code.vue
rename to src/presentation/components/Code/CodeButtons/Code.vue
diff --git a/src/presentation/Code/CodeButtons/IconButton.vue b/src/presentation/components/Code/CodeButtons/IconButton.vue
similarity index 100%
rename from src/presentation/Code/CodeButtons/IconButton.vue
rename to src/presentation/components/Code/CodeButtons/IconButton.vue
diff --git a/src/presentation/Code/CodeButtons/MacOsInstructions.vue b/src/presentation/components/Code/CodeButtons/MacOsInstructions.vue
similarity index 100%
rename from src/presentation/Code/CodeButtons/MacOsInstructions.vue
rename to src/presentation/components/Code/CodeButtons/MacOsInstructions.vue
diff --git a/src/presentation/Code/CodeButtons/TheCodeButtons.vue b/src/presentation/components/Code/CodeButtons/TheCodeButtons.vue
similarity index 98%
rename from src/presentation/Code/CodeButtons/TheCodeButtons.vue
rename to src/presentation/components/Code/CodeButtons/TheCodeButtons.vue
index 99f50aac..a200f332 100644
--- a/src/presentation/Code/CodeButtons/TheCodeButtons.vue
+++ b/src/presentation/components/Code/CodeButtons/TheCodeButtons.vue
@@ -33,7 +33,7 @@
 
 <script lang="ts">
 import { Component } from 'vue-property-decorator';
-import { StatefulVue } from '@/presentation/StatefulVue';
+import { StatefulVue } from '@/presentation/components/Shared/StatefulVue';
 import { SaveFileDialog, FileType } from '@/infrastructure/SaveFileDialog';
 import { Clipboard } from '@/infrastructure/Clipboard';
 import IconButton from './IconButton.vue';
diff --git a/src/presentation/Code/TheCodeArea.vue b/src/presentation/components/Code/TheCodeArea.vue
similarity index 97%
rename from src/presentation/Code/TheCodeArea.vue
rename to src/presentation/components/Code/TheCodeArea.vue
index 565844b9..acf3da53 100644
--- a/src/presentation/Code/TheCodeArea.vue
+++ b/src/presentation/components/Code/TheCodeArea.vue
@@ -9,7 +9,7 @@
 
 <script lang="ts">
 import { Component, Prop } from 'vue-property-decorator';
-import { StatefulVue } from '@/presentation/StatefulVue';
+import { StatefulVue } from '@/presentation/components/Shared/StatefulVue';
 import ace from 'ace-builds';
 import 'ace-builds/webpack-resolver';
 import { ICodeChangedEvent } from '@/application/Context/State/Code/Event/ICodeChangedEvent';
@@ -17,7 +17,7 @@ import { IScript } from '@/domain/IScript';
 import { ScriptingLanguage } from '@/domain/ScriptingLanguage';
 import { ICategoryCollectionState } from '@/application/Context/State/ICategoryCollectionState';
 import { CodeBuilderFactory } from '@/application/Context/State/Code/Generation/CodeBuilderFactory';
-import Responsive from '@/presentation/Responsive.vue';
+import Responsive from '@/presentation/components/Shared/Responsive.vue';
 
 @Component({
   components: {
diff --git a/src/presentation/Scripts/Cards/CardList.vue b/src/presentation/components/Scripts/Cards/CardList.vue
similarity index 95%
rename from src/presentation/Scripts/Cards/CardList.vue
rename to src/presentation/components/Scripts/Cards/CardList.vue
index 89c58448..055fdc8b 100644
--- a/src/presentation/Scripts/Cards/CardList.vue
+++ b/src/presentation/components/Scripts/Cards/CardList.vue
@@ -26,9 +26,9 @@
 
 <script lang="ts">
 import CardListItem from './CardListItem.vue';
-import Responsive from '@/presentation/Responsive.vue';
+import Responsive from '@/presentation/components/Shared/Responsive.vue';
 import { Component } from 'vue-property-decorator';
-import { StatefulVue } from '@/presentation/StatefulVue';
+import { StatefulVue } from '@/presentation/components/Shared/StatefulVue';
 import { ICategory } from '@/domain/ICategory';
 import { hasDirective } from './NonCollapsingDirective';
 import { ICategoryCollectionState } from '@/application/Context/State/ICategoryCollectionState';
diff --git a/src/presentation/Scripts/Cards/CardListItem.vue b/src/presentation/components/Scripts/Cards/CardListItem.vue
similarity index 97%
rename from src/presentation/Scripts/Cards/CardListItem.vue
rename to src/presentation/components/Scripts/Cards/CardListItem.vue
index 85e819b4..2bd6b709 100644
--- a/src/presentation/Scripts/Cards/CardListItem.vue
+++ b/src/presentation/components/Scripts/Cards/CardListItem.vue
@@ -33,8 +33,8 @@
 
 <script lang="ts">
 import { Component, Prop, Watch, Emit } from 'vue-property-decorator';
-import ScriptsTree from '@/presentation/Scripts/ScriptsTree/ScriptsTree.vue';
-import { StatefulVue } from '@/presentation/StatefulVue';
+import ScriptsTree from '@/presentation/components/Scripts/ScriptsTree/ScriptsTree.vue';
+import { StatefulVue } from '@/presentation/components/Shared/StatefulVue';
 
 @Component({
   components: {
diff --git a/src/presentation/Scripts/Cards/NonCollapsingDirective.ts b/src/presentation/components/Scripts/Cards/NonCollapsingDirective.ts
similarity index 100%
rename from src/presentation/Scripts/Cards/NonCollapsingDirective.ts
rename to src/presentation/components/Scripts/Cards/NonCollapsingDirective.ts
diff --git a/src/presentation/Scripts/Menu/Grouping/Grouping.ts b/src/presentation/components/Scripts/Menu/Grouping/Grouping.ts
similarity index 100%
rename from src/presentation/Scripts/Menu/Grouping/Grouping.ts
rename to src/presentation/components/Scripts/Menu/Grouping/Grouping.ts
diff --git a/src/presentation/Scripts/Menu/Grouping/TheGrouper.vue b/src/presentation/components/Scripts/Menu/Grouping/TheGrouper.vue
similarity index 100%
rename from src/presentation/Scripts/Menu/Grouping/TheGrouper.vue
rename to src/presentation/components/Scripts/Menu/Grouping/TheGrouper.vue
diff --git a/src/presentation/Scripts/Menu/Selector/SelectableOption.vue b/src/presentation/components/Scripts/Menu/Selector/SelectableOption.vue
similarity index 88%
rename from src/presentation/Scripts/Menu/Selector/SelectableOption.vue
rename to src/presentation/components/Scripts/Menu/Selector/SelectableOption.vue
index d3d2b41c..4fdf434b 100644
--- a/src/presentation/Scripts/Menu/Selector/SelectableOption.vue
+++ b/src/presentation/components/Scripts/Menu/Selector/SelectableOption.vue
@@ -7,7 +7,7 @@
 
 <script lang="ts">
 import { Component, Prop, Emit, Vue } from 'vue-property-decorator';
-import { NonCollapsing } from '@/presentation/Scripts/Cards/NonCollapsingDirective';
+import { NonCollapsing } from '@/presentation/components/Scripts/Cards/NonCollapsingDirective';
 
 @Component({
     directives: { NonCollapsing },
diff --git a/src/presentation/Scripts/Menu/Selector/TheSelector.vue b/src/presentation/components/Scripts/Menu/Selector/TheSelector.vue
similarity index 98%
rename from src/presentation/Scripts/Menu/Selector/TheSelector.vue
rename to src/presentation/components/Scripts/Menu/Selector/TheSelector.vue
index 906855d7..02edb76b 100644
--- a/src/presentation/Scripts/Menu/Selector/TheSelector.vue
+++ b/src/presentation/components/Scripts/Menu/Selector/TheSelector.vue
@@ -50,7 +50,7 @@
 
 <script lang="ts">
 import { Component } from 'vue-property-decorator';
-import { StatefulVue } from '@/presentation/StatefulVue';
+import { StatefulVue } from '@/presentation/components/Shared/StatefulVue';
 import SelectableOption from './SelectableOption.vue';
 import { IScript } from '@/domain/IScript';
 import { SelectedScript } from '@/application/Context/State/Selection/SelectedScript';
diff --git a/src/presentation/Scripts/Menu/TheOsChanger.vue b/src/presentation/components/Scripts/Menu/TheOsChanger.vue
similarity index 96%
rename from src/presentation/Scripts/Menu/TheOsChanger.vue
rename to src/presentation/components/Scripts/Menu/TheOsChanger.vue
index 95df8282..86b71ede 100644
--- a/src/presentation/Scripts/Menu/TheOsChanger.vue
+++ b/src/presentation/components/Scripts/Menu/TheOsChanger.vue
@@ -17,7 +17,7 @@
 <script lang="ts">
 import { Component } from 'vue-property-decorator';
 import { OperatingSystem } from '@/domain/OperatingSystem';
-import { StatefulVue } from '@/presentation/StatefulVue';
+import { StatefulVue } from '@/presentation/components/Shared/StatefulVue';
 import { ICategoryCollectionState } from '@/application/Context/State/ICategoryCollectionState';
 import { ApplicationFactory } from '@/application/ApplicationFactory';
 
diff --git a/src/presentation/Scripts/Menu/TheScriptsMenu.vue b/src/presentation/components/Scripts/Menu/TheScriptsMenu.vue
similarity index 96%
rename from src/presentation/Scripts/Menu/TheScriptsMenu.vue
rename to src/presentation/components/Scripts/Menu/TheScriptsMenu.vue
index 30a0cd23..052e7450 100644
--- a/src/presentation/Scripts/Menu/TheScriptsMenu.vue
+++ b/src/presentation/components/Scripts/Menu/TheScriptsMenu.vue
@@ -14,7 +14,7 @@ import { Component } from 'vue-property-decorator';
 import TheOsChanger from './TheOsChanger.vue';
 import TheSelector from './Selector/TheSelector.vue';
 import TheGrouper from './Grouping/TheGrouper.vue';
-import { StatefulVue } from '@/presentation/StatefulVue';
+import { StatefulVue } from '@/presentation/components/Shared/StatefulVue';
 import { ICategoryCollectionState } from '@/application/Context/State/ICategoryCollectionState';
 import { IEventSubscription } from '@/infrastructure/Events/IEventSource';
 
diff --git a/src/presentation/Scripts/ScriptsTree/ScriptNodeParser.ts b/src/presentation/components/Scripts/ScriptsTree/ScriptNodeParser.ts
similarity index 100%
rename from src/presentation/Scripts/ScriptsTree/ScriptNodeParser.ts
rename to src/presentation/components/Scripts/ScriptsTree/ScriptNodeParser.ts
diff --git a/src/presentation/Scripts/ScriptsTree/ScriptsTree.vue b/src/presentation/components/Scripts/ScriptsTree/ScriptsTree.vue
similarity index 98%
rename from src/presentation/Scripts/ScriptsTree/ScriptsTree.vue
rename to src/presentation/components/Scripts/ScriptsTree/ScriptsTree.vue
index 7d53af09..7180c7b8 100644
--- a/src/presentation/Scripts/ScriptsTree/ScriptsTree.vue
+++ b/src/presentation/components/Scripts/ScriptsTree/ScriptsTree.vue
@@ -16,7 +16,7 @@
 
 <script lang="ts">
 import { Component, Prop, Watch } from 'vue-property-decorator';
-import { StatefulVue } from '@/presentation/StatefulVue';
+import { StatefulVue } from '@/presentation/components/Shared/StatefulVue';
 import { IScript } from '@/domain/IScript';
 import { ICategory } from '@/domain/ICategory';
 import { ICategoryCollectionState } from '@/application/Context/State/ICategoryCollectionState';
diff --git a/src/presentation/Scripts/ScriptsTree/SelectableTree/INodeSelectedEvent.ts b/src/presentation/components/Scripts/ScriptsTree/SelectableTree/INodeSelectedEvent.ts
similarity index 100%
rename from src/presentation/Scripts/ScriptsTree/SelectableTree/INodeSelectedEvent.ts
rename to src/presentation/components/Scripts/ScriptsTree/SelectableTree/INodeSelectedEvent.ts
diff --git a/src/presentation/Scripts/ScriptsTree/SelectableTree/LiquorTree/LiquorTree.d.ts b/src/presentation/components/Scripts/ScriptsTree/SelectableTree/LiquorTree/LiquorTree.d.ts
similarity index 100%
rename from src/presentation/Scripts/ScriptsTree/SelectableTree/LiquorTree/LiquorTree.d.ts
rename to src/presentation/components/Scripts/ScriptsTree/SelectableTree/LiquorTree/LiquorTree.d.ts
diff --git a/src/presentation/Scripts/ScriptsTree/SelectableTree/LiquorTree/LiquorTreeOptions.ts b/src/presentation/components/Scripts/ScriptsTree/SelectableTree/LiquorTree/LiquorTreeOptions.ts
similarity index 100%
rename from src/presentation/Scripts/ScriptsTree/SelectableTree/LiquorTree/LiquorTreeOptions.ts
rename to src/presentation/components/Scripts/ScriptsTree/SelectableTree/LiquorTree/LiquorTreeOptions.ts
diff --git a/src/presentation/Scripts/ScriptsTree/SelectableTree/LiquorTree/NodeWrapper/NodePredicateFilter.ts b/src/presentation/components/Scripts/ScriptsTree/SelectableTree/LiquorTree/NodeWrapper/NodePredicateFilter.ts
similarity index 100%
rename from src/presentation/Scripts/ScriptsTree/SelectableTree/LiquorTree/NodeWrapper/NodePredicateFilter.ts
rename to src/presentation/components/Scripts/ScriptsTree/SelectableTree/LiquorTree/NodeWrapper/NodePredicateFilter.ts
diff --git a/src/presentation/Scripts/ScriptsTree/SelectableTree/LiquorTree/NodeWrapper/NodeStateUpdater.ts b/src/presentation/components/Scripts/ScriptsTree/SelectableTree/LiquorTree/NodeWrapper/NodeStateUpdater.ts
similarity index 100%
rename from src/presentation/Scripts/ScriptsTree/SelectableTree/LiquorTree/NodeWrapper/NodeStateUpdater.ts
rename to src/presentation/components/Scripts/ScriptsTree/SelectableTree/LiquorTree/NodeWrapper/NodeStateUpdater.ts
diff --git a/src/presentation/Scripts/ScriptsTree/SelectableTree/LiquorTree/NodeWrapper/NodeTranslator.ts b/src/presentation/components/Scripts/ScriptsTree/SelectableTree/LiquorTree/NodeWrapper/NodeTranslator.ts
similarity index 100%
rename from src/presentation/Scripts/ScriptsTree/SelectableTree/LiquorTree/NodeWrapper/NodeTranslator.ts
rename to src/presentation/components/Scripts/ScriptsTree/SelectableTree/LiquorTree/NodeWrapper/NodeTranslator.ts
diff --git a/src/presentation/Scripts/ScriptsTree/SelectableTree/Node/DocumentationUrls.vue b/src/presentation/components/Scripts/ScriptsTree/SelectableTree/Node/DocumentationUrls.vue
similarity index 100%
rename from src/presentation/Scripts/ScriptsTree/SelectableTree/Node/DocumentationUrls.vue
rename to src/presentation/components/Scripts/ScriptsTree/SelectableTree/Node/DocumentationUrls.vue
diff --git a/src/presentation/Scripts/ScriptsTree/SelectableTree/Node/INode.ts b/src/presentation/components/Scripts/ScriptsTree/SelectableTree/Node/INode.ts
similarity index 100%
rename from src/presentation/Scripts/ScriptsTree/SelectableTree/Node/INode.ts
rename to src/presentation/components/Scripts/ScriptsTree/SelectableTree/Node/INode.ts
diff --git a/src/presentation/Scripts/ScriptsTree/SelectableTree/Node/Node.vue b/src/presentation/components/Scripts/ScriptsTree/SelectableTree/Node/Node.vue
similarity index 100%
rename from src/presentation/Scripts/ScriptsTree/SelectableTree/Node/Node.vue
rename to src/presentation/components/Scripts/ScriptsTree/SelectableTree/Node/Node.vue
diff --git a/src/presentation/Scripts/ScriptsTree/SelectableTree/Node/RevertToggle.vue b/src/presentation/components/Scripts/ScriptsTree/SelectableTree/Node/RevertToggle.vue
similarity index 98%
rename from src/presentation/Scripts/ScriptsTree/SelectableTree/Node/RevertToggle.vue
rename to src/presentation/components/Scripts/ScriptsTree/SelectableTree/Node/RevertToggle.vue
index e43d38f9..6d9b94cf 100644
--- a/src/presentation/Scripts/ScriptsTree/SelectableTree/Node/RevertToggle.vue
+++ b/src/presentation/components/Scripts/ScriptsTree/SelectableTree/Node/RevertToggle.vue
@@ -15,7 +15,7 @@
 <script lang="ts">
 import { Component, Prop, Watch } from 'vue-property-decorator';
 import { IReverter } from './Reverter/IReverter';
-import { StatefulVue } from '@/presentation/StatefulVue';
+import { StatefulVue } from '@/presentation/components/Shared/StatefulVue';
 import { INode } from './INode';
 import { SelectedScript } from '@/application/Context/State/Selection/SelectedScript';
 import { getReverter } from './Reverter/ReverterFactory';
diff --git a/src/presentation/Scripts/ScriptsTree/SelectableTree/Node/Reverter/CategoryReverter.ts b/src/presentation/components/Scripts/ScriptsTree/SelectableTree/Node/Reverter/CategoryReverter.ts
similarity index 100%
rename from src/presentation/Scripts/ScriptsTree/SelectableTree/Node/Reverter/CategoryReverter.ts
rename to src/presentation/components/Scripts/ScriptsTree/SelectableTree/Node/Reverter/CategoryReverter.ts
diff --git a/src/presentation/Scripts/ScriptsTree/SelectableTree/Node/Reverter/IReverter.ts b/src/presentation/components/Scripts/ScriptsTree/SelectableTree/Node/Reverter/IReverter.ts
similarity index 100%
rename from src/presentation/Scripts/ScriptsTree/SelectableTree/Node/Reverter/IReverter.ts
rename to src/presentation/components/Scripts/ScriptsTree/SelectableTree/Node/Reverter/IReverter.ts
diff --git a/src/presentation/Scripts/ScriptsTree/SelectableTree/Node/Reverter/ReverterFactory.ts b/src/presentation/components/Scripts/ScriptsTree/SelectableTree/Node/Reverter/ReverterFactory.ts
similarity index 100%
rename from src/presentation/Scripts/ScriptsTree/SelectableTree/Node/Reverter/ReverterFactory.ts
rename to src/presentation/components/Scripts/ScriptsTree/SelectableTree/Node/Reverter/ReverterFactory.ts
diff --git a/src/presentation/Scripts/ScriptsTree/SelectableTree/Node/Reverter/ScriptReverter.ts b/src/presentation/components/Scripts/ScriptsTree/SelectableTree/Node/Reverter/ScriptReverter.ts
similarity index 100%
rename from src/presentation/Scripts/ScriptsTree/SelectableTree/Node/Reverter/ScriptReverter.ts
rename to src/presentation/components/Scripts/ScriptsTree/SelectableTree/Node/Reverter/ScriptReverter.ts
diff --git a/src/presentation/Scripts/ScriptsTree/SelectableTree/SelectableTree.vue b/src/presentation/components/Scripts/ScriptsTree/SelectableTree/SelectableTree.vue
similarity index 100%
rename from src/presentation/Scripts/ScriptsTree/SelectableTree/SelectableTree.vue
rename to src/presentation/components/Scripts/ScriptsTree/SelectableTree/SelectableTree.vue
diff --git a/src/presentation/Scripts/Slider/Handle.vue b/src/presentation/components/Scripts/Slider/Handle.vue
similarity index 100%
rename from src/presentation/Scripts/Slider/Handle.vue
rename to src/presentation/components/Scripts/Slider/Handle.vue
diff --git a/src/presentation/Scripts/Slider/HorizontalResizeSlider.vue b/src/presentation/components/Scripts/Slider/HorizontalResizeSlider.vue
similarity index 100%
rename from src/presentation/Scripts/Slider/HorizontalResizeSlider.vue
rename to src/presentation/components/Scripts/Slider/HorizontalResizeSlider.vue
diff --git a/src/presentation/Scripts/TheScriptArea.vue b/src/presentation/components/Scripts/TheScriptArea.vue
similarity index 67%
rename from src/presentation/Scripts/TheScriptArea.vue
rename to src/presentation/components/Scripts/TheScriptArea.vue
index 318c5327..edbc9b9d 100644
--- a/src/presentation/Scripts/TheScriptArea.vue
+++ b/src/presentation/components/Scripts/TheScriptArea.vue
@@ -14,11 +14,11 @@
 
 <script lang="ts">
 import { Component, Vue } from 'vue-property-decorator';
-import TheCodeArea from '@/presentation/Code/TheCodeArea.vue';
-import TheScriptsList from '@/presentation/Scripts/TheScriptsList.vue';
-import TheScriptsMenu from '@/presentation/Scripts/Menu/TheScriptsMenu.vue';
-import HorizontalResizeSlider from '@/presentation/Scripts/Slider/HorizontalResizeSlider.vue';
-import { Grouping } from '@/presentation/Scripts/Menu/Grouping/Grouping';
+import TheCodeArea from '@/presentation/components/Code/TheCodeArea.vue';
+import TheScriptsList from '@/presentation/components/Scripts/TheScriptsList.vue';
+import TheScriptsMenu from '@/presentation/components/Scripts/Menu/TheScriptsMenu.vue';
+import HorizontalResizeSlider from '@/presentation/components/Scripts/Slider/HorizontalResizeSlider.vue';
+import { Grouping } from '@/presentation/components/Scripts/Menu/Grouping/Grouping';
 
 @Component({
   components: {
diff --git a/src/presentation/Scripts/TheScriptsList.vue b/src/presentation/components/Scripts/TheScriptsList.vue
similarity index 91%
rename from src/presentation/Scripts/TheScriptsList.vue
rename to src/presentation/components/Scripts/TheScriptsList.vue
index be2497ca..227b2d62 100644
--- a/src/presentation/Scripts/TheScriptsList.vue
+++ b/src/presentation/components/Scripts/TheScriptsList.vue
@@ -29,12 +29,12 @@
 </template>
 
 <script lang="ts">
-import TheGrouper from '@/presentation/Scripts/Menu/Grouping/TheGrouper.vue';
-import ScriptsTree from '@/presentation/Scripts/ScriptsTree/ScriptsTree.vue';
-import CardList from '@/presentation/Scripts/Cards/CardList.vue';
+import TheGrouper from '@/presentation/components/Scripts/Menu/Grouping/TheGrouper.vue';
+import ScriptsTree from '@/presentation/components/Scripts/ScriptsTree/ScriptsTree.vue';
+import CardList from '@/presentation/components/Scripts/Cards/CardList.vue';
 import { Component, Prop } from 'vue-property-decorator';
-import { StatefulVue } from '@/presentation/StatefulVue';
-import { Grouping } from '@/presentation/Scripts/Menu/Grouping/Grouping';
+import { StatefulVue } from '@/presentation/components/Shared/StatefulVue';
+import { Grouping } from '@/presentation/components/Scripts/Menu/Grouping/Grouping';
 import { IFilterResult } from '@/application/Context/State/Filter/IFilterResult';
 import { ICategoryCollectionState } from '@/application/Context/State/ICategoryCollectionState';
 import { ApplicationFactory } from '@/application/ApplicationFactory';
diff --git a/src/presentation/Responsive.vue b/src/presentation/components/Shared/Responsive.vue
similarity index 100%
rename from src/presentation/Responsive.vue
rename to src/presentation/components/Shared/Responsive.vue
diff --git a/src/presentation/StatefulVue.ts b/src/presentation/components/Shared/StatefulVue.ts
similarity index 94%
rename from src/presentation/StatefulVue.ts
rename to src/presentation/components/Shared/StatefulVue.ts
index 61db812c..bb334009 100644
--- a/src/presentation/StatefulVue.ts
+++ b/src/presentation/components/Shared/StatefulVue.ts
@@ -4,7 +4,7 @@ import { IApplicationContext } from '@/application/Context/IApplicationContext';
 import { buildContextAsync } from '@/application/Context/ApplicationContextFactory';
 import { IApplicationContextChangedEvent } from '@/application/Context/IApplicationContext';
 import { ICategoryCollectionState } from '@/application/Context/State/ICategoryCollectionState';
-import { EventSubscriptionCollection } from '../infrastructure/Events/EventSubscriptionCollection';
+import { EventSubscriptionCollection } from '@/infrastructure/Events/EventSubscriptionCollection';
 
 // @ts-ignore because https://github.com/vuejs/vue-class-component/issues/91
 @Component
diff --git a/src/presentation/Throttle.ts b/src/presentation/components/Shared/Throttle.ts
similarity index 100%
rename from src/presentation/Throttle.ts
rename to src/presentation/components/Shared/Throttle.ts
diff --git a/src/presentation/TheFooter/DownloadUrlList.vue b/src/presentation/components/TheFooter/DownloadUrlList.vue
similarity index 100%
rename from src/presentation/TheFooter/DownloadUrlList.vue
rename to src/presentation/components/TheFooter/DownloadUrlList.vue
diff --git a/src/presentation/TheFooter/DownloadUrlListItem.vue b/src/presentation/components/TheFooter/DownloadUrlListItem.vue
similarity index 100%
rename from src/presentation/TheFooter/DownloadUrlListItem.vue
rename to src/presentation/components/TheFooter/DownloadUrlListItem.vue
diff --git a/src/presentation/TheFooter/PrivacyPolicy.vue b/src/presentation/components/TheFooter/PrivacyPolicy.vue
similarity index 100%
rename from src/presentation/TheFooter/PrivacyPolicy.vue
rename to src/presentation/components/TheFooter/PrivacyPolicy.vue
diff --git a/src/presentation/TheFooter/TheFooter.vue b/src/presentation/components/TheFooter/TheFooter.vue
similarity index 100%
rename from src/presentation/TheFooter/TheFooter.vue
rename to src/presentation/components/TheFooter/TheFooter.vue
diff --git a/src/presentation/TheHeader.vue b/src/presentation/components/TheHeader.vue
similarity index 100%
rename from src/presentation/TheHeader.vue
rename to src/presentation/components/TheHeader.vue
diff --git a/src/presentation/TheSearchBar.vue b/src/presentation/components/TheSearchBar.vue
similarity index 93%
rename from src/presentation/TheSearchBar.vue
rename to src/presentation/components/TheSearchBar.vue
index efc5971e..ffcf5137 100644
--- a/src/presentation/TheSearchBar.vue
+++ b/src/presentation/components/TheSearchBar.vue
@@ -11,8 +11,8 @@
 
 <script lang="ts">
 import { Component, Watch } from 'vue-property-decorator';
-import { StatefulVue } from './StatefulVue';
-import { NonCollapsing } from '@/presentation/Scripts/Cards/NonCollapsingDirective';
+import { StatefulVue } from '@/presentation/components/Shared/StatefulVue';
+import { NonCollapsing } from '@/presentation/components/Scripts/Cards/NonCollapsingDirective';
 import { IUserFilter } from '@/application/Context/State/Filter/IUserFilter';
 import { IFilterResult } from '@/application/Context/State/Filter/IFilterResult';
 import { ICategoryCollectionState } from '@/application/Context/State/ICategoryCollectionState';
diff --git a/src/main.ts b/src/presentation/main.ts
similarity index 51%
rename from src/main.ts
rename to src/presentation/main.ts
index 54209de5..bc003063 100644
--- a/src/main.ts
+++ b/src/presentation/main.ts
@@ -1,6 +1,6 @@
 import Vue from 'vue';
-import App from './App.vue';
-import { ApplicationBootstrapper } from './presentation/Bootstrapping/ApplicationBootstrapper';
+import App from './components/App.vue';
+import { ApplicationBootstrapper } from './bootstrapping/ApplicationBootstrapper';
 
 new ApplicationBootstrapper()
     .bootstrap(Vue);
diff --git a/src/shims-tsx.d.ts b/src/presentation/shims-tsx.d.ts
similarity index 100%
rename from src/shims-tsx.d.ts
rename to src/presentation/shims-tsx.d.ts
diff --git a/src/shims-vue.d.ts b/src/presentation/shims-vue.d.ts
similarity index 100%
rename from src/shims-vue.d.ts
rename to src/presentation/shims-vue.d.ts
diff --git a/tests/unit/presentation/Scripts/Cards/NonCollapsingDirective.spec.ts b/tests/unit/presentation/components/Scripts/Cards/NonCollapsingDirective.spec.ts
similarity index 90%
rename from tests/unit/presentation/Scripts/Cards/NonCollapsingDirective.spec.ts
rename to tests/unit/presentation/components/Scripts/Cards/NonCollapsingDirective.spec.ts
index 704c8c5f..775bb1b2 100644
--- a/tests/unit/presentation/Scripts/Cards/NonCollapsingDirective.spec.ts
+++ b/tests/unit/presentation/components/Scripts/Cards/NonCollapsingDirective.spec.ts
@@ -1,7 +1,7 @@
 import 'mocha';
 import { expect } from 'chai';
-import { NonCollapsing } from '@/presentation/Scripts/Cards/NonCollapsingDirective';
-import { hasDirective } from '@/presentation/Scripts/Cards/NonCollapsingDirective';
+import { NonCollapsing } from '@/presentation/components/Scripts/Cards/NonCollapsingDirective';
+import { hasDirective } from '@/presentation/components/Scripts/Cards/NonCollapsingDirective';
 
 const expectedAttributeName = 'data-interaction-does-not-collapse';
 
diff --git a/tests/unit/presentation/Scripts/ScriptsTree/ScriptNodeParser.spec.ts b/tests/unit/presentation/components/Scripts/ScriptsTree/ScriptNodeParser.spec.ts
similarity index 91%
rename from tests/unit/presentation/Scripts/ScriptsTree/ScriptNodeParser.spec.ts
rename to tests/unit/presentation/components/Scripts/ScriptsTree/ScriptNodeParser.spec.ts
index 51c0e093..1660f39d 100644
--- a/tests/unit/presentation/Scripts/ScriptsTree/ScriptNodeParser.spec.ts
+++ b/tests/unit/presentation/components/Scripts/ScriptsTree/ScriptNodeParser.spec.ts
@@ -1,13 +1,14 @@
 import 'mocha';
 import { expect } from 'chai';
-import { getScriptNodeId, getScriptId, getCategoryNodeId, getCategoryId } from '@/presentation/Scripts/ScriptsTree/ScriptNodeParser';
-import { CategoryStub } from '../../../stubs/CategoryStub';
-import { ScriptStub } from '../../../stubs/ScriptStub';
-import { parseSingleCategory, parseAllCategories } from '@/presentation/Scripts/ScriptsTree/ScriptNodeParser';
-import { CategoryCollectionStub } from '../../../stubs/CategoryCollectionStub';
-import { INode, NodeType } from '@/presentation/Scripts/ScriptsTree/SelectableTree/Node/INode';
+import { getScriptNodeId, getScriptId, getCategoryNodeId, getCategoryId } from '@/presentation/components/Scripts/ScriptsTree/ScriptNodeParser';
+import { parseSingleCategory,
+    parseAllCategories } from '@/presentation/components/Scripts/ScriptsTree/ScriptNodeParser';
+import { INode, NodeType } from '@/presentation/components/Scripts/ScriptsTree/SelectableTree/Node/INode';
 import { IScript } from '@/domain/IScript';
 import { ICategory } from '@/domain/ICategory';
+import { CategoryStub } from '../../../../stubs/CategoryStub';
+import { ScriptStub } from '../../../../stubs/ScriptStub';
+import { CategoryCollectionStub } from '../../../../stubs/CategoryCollectionStub';
 
 describe('ScriptNodeParser', () => {
     it('can convert script id and back', () => {
diff --git a/tests/unit/presentation/Scripts/ScriptsTree/SelectableTree/LiquorTree/NodeWrapper/NodePredicateFilter.spec.ts b/tests/unit/presentation/components/Scripts/ScriptsTree/SelectableTree/LiquorTree/NodeWrapper/NodePredicateFilter.spec.ts
similarity index 88%
rename from tests/unit/presentation/Scripts/ScriptsTree/SelectableTree/LiquorTree/NodeWrapper/NodePredicateFilter.spec.ts
rename to tests/unit/presentation/components/Scripts/ScriptsTree/SelectableTree/LiquorTree/NodeWrapper/NodePredicateFilter.spec.ts
index 7c0535cd..a1d1f283 100644
--- a/tests/unit/presentation/Scripts/ScriptsTree/SelectableTree/LiquorTree/NodeWrapper/NodePredicateFilter.spec.ts
+++ b/tests/unit/presentation/components/Scripts/ScriptsTree/SelectableTree/LiquorTree/NodeWrapper/NodePredicateFilter.spec.ts
@@ -1,7 +1,7 @@
 import 'mocha';
 import { expect } from 'chai';
-import { NodeType, INode } from '@/presentation/Scripts/ScriptsTree/SelectableTree/Node/INode';
-import { NodePredicateFilter } from '@/presentation/Scripts/ScriptsTree/SelectableTree/LiquorTree/NodeWrapper/NodePredicateFilter';
+import { NodeType, INode } from '@/presentation/components/Scripts/ScriptsTree/SelectableTree/Node/INode';
+import { NodePredicateFilter } from '@/presentation/components/Scripts/ScriptsTree/SelectableTree/LiquorTree/NodeWrapper/NodePredicateFilter';
 import { ILiquorTreeExistingNode } from 'liquor-tree';
 
 describe('NodePredicateFilter', () => {
diff --git a/tests/unit/presentation/Scripts/ScriptsTree/SelectableTree/LiquorTree/NodeWrapper/NodeStateUpdater.spec.ts b/tests/unit/presentation/components/Scripts/ScriptsTree/SelectableTree/LiquorTree/NodeWrapper/NodeStateUpdater.spec.ts
similarity index 97%
rename from tests/unit/presentation/Scripts/ScriptsTree/SelectableTree/LiquorTree/NodeWrapper/NodeStateUpdater.spec.ts
rename to tests/unit/presentation/components/Scripts/ScriptsTree/SelectableTree/LiquorTree/NodeWrapper/NodeStateUpdater.spec.ts
index d5e5cd72..ccb37f52 100644
--- a/tests/unit/presentation/Scripts/ScriptsTree/SelectableTree/LiquorTree/NodeWrapper/NodeStateUpdater.spec.ts
+++ b/tests/unit/presentation/components/Scripts/ScriptsTree/SelectableTree/LiquorTree/NodeWrapper/NodeStateUpdater.spec.ts
@@ -1,8 +1,8 @@
 import 'mocha';
 import { expect } from 'chai';
 import { ILiquorTreeNode } from 'liquor-tree';
-import { NodeType } from '@/presentation/Scripts/ScriptsTree/SelectableTree/Node/INode';
-import { getNewState } from '@/presentation/Scripts/ScriptsTree/SelectableTree/LiquorTree/NodeWrapper/NodeStateUpdater';
+import { NodeType } from '@/presentation/components/Scripts/ScriptsTree/SelectableTree/Node/INode';
+import { getNewState } from '@/presentation/components/Scripts/ScriptsTree/SelectableTree/LiquorTree/NodeWrapper/NodeStateUpdater';
 
 describe('NodeStateUpdater', () => {
     describe('getNewState', () => {
diff --git a/tests/unit/presentation/Scripts/ScriptsTree/SelectableTree/LiquorTree/NodeWrapper/NodeTranslator.spec.ts b/tests/unit/presentation/components/Scripts/ScriptsTree/SelectableTree/LiquorTree/NodeWrapper/NodeTranslator.spec.ts
similarity index 95%
rename from tests/unit/presentation/Scripts/ScriptsTree/SelectableTree/LiquorTree/NodeWrapper/NodeTranslator.spec.ts
rename to tests/unit/presentation/components/Scripts/ScriptsTree/SelectableTree/LiquorTree/NodeWrapper/NodeTranslator.spec.ts
index c183ea81..cb37e1c1 100644
--- a/tests/unit/presentation/Scripts/ScriptsTree/SelectableTree/LiquorTree/NodeWrapper/NodeTranslator.spec.ts
+++ b/tests/unit/presentation/components/Scripts/ScriptsTree/SelectableTree/LiquorTree/NodeWrapper/NodeTranslator.spec.ts
@@ -1,8 +1,8 @@
 import 'mocha';
 import { expect } from 'chai';
-import { NodeType, INode } from '@/presentation/Scripts/ScriptsTree/SelectableTree/Node/INode';
+import { NodeType, INode } from '@/presentation/components/Scripts/ScriptsTree/SelectableTree/Node/INode';
 import { ILiquorTreeExistingNode, ILiquorTreeNewNode, ILiquorTreeNodeData, ICustomLiquorTreeData } from 'liquor-tree';
-import { convertExistingToNode, toNewLiquorTreeNode } from '@/presentation/Scripts/ScriptsTree/SelectableTree/LiquorTree/NodeWrapper/NodeTranslator';
+import { convertExistingToNode, toNewLiquorTreeNode } from '@/presentation/components/Scripts/ScriptsTree/SelectableTree/LiquorTree/NodeWrapper/NodeTranslator';
 
 describe('NodeTranslator', () => {
     it('convertExistingToNode', () => {
diff --git a/tests/unit/presentation/Scripts/ScriptsTree/SelectableTree/Node/Reverter/CategoryReverter.spec.ts b/tests/unit/presentation/components/Scripts/ScriptsTree/SelectableTree/Node/Reverter/CategoryReverter.spec.ts
similarity index 90%
rename from tests/unit/presentation/Scripts/ScriptsTree/SelectableTree/Node/Reverter/CategoryReverter.spec.ts
rename to tests/unit/presentation/components/Scripts/ScriptsTree/SelectableTree/Node/Reverter/CategoryReverter.spec.ts
index b680d65c..61c0bdf3 100644
--- a/tests/unit/presentation/Scripts/ScriptsTree/SelectableTree/Node/Reverter/CategoryReverter.spec.ts
+++ b/tests/unit/presentation/components/Scripts/ScriptsTree/SelectableTree/Node/Reverter/CategoryReverter.spec.ts
@@ -1,12 +1,12 @@
 import 'mocha';
 import { expect } from 'chai';
-import { ScriptStub } from '../../../../../../stubs/ScriptStub';
-import { CategoryReverter } from '@/presentation/Scripts/ScriptsTree/SelectableTree/Node/Reverter/CategoryReverter';
-import { getCategoryNodeId } from '@/presentation/Scripts/ScriptsTree/ScriptNodeParser';
-import { CategoryStub } from '../../../../../../stubs/CategoryStub';
-import { CategoryCollectionStub } from '../../../../../../stubs/CategoryCollectionStub';
+import { CategoryReverter } from '@/presentation/components/Scripts/ScriptsTree/SelectableTree/Node/Reverter/CategoryReverter';
+import { getCategoryNodeId } from '@/presentation/components/Scripts/ScriptsTree/ScriptNodeParser';
 import { SelectedScript } from '@/application/Context/State/Selection/SelectedScript';
 import { UserSelection } from '@/application/Context/State/Selection/UserSelection';
+import { CategoryStub } from '../../../../../../../stubs/CategoryStub';
+import { CategoryCollectionStub } from '../../../../../../../stubs/CategoryCollectionStub';
+import { ScriptStub } from '../../../../../../../stubs/ScriptStub';
 
 describe('CategoryReverter', () => {
     describe('getState', () => {
diff --git a/tests/unit/presentation/Scripts/ScriptsTree/SelectableTree/Node/Reverter/ReverterFactory.spec.ts b/tests/unit/presentation/components/Scripts/ScriptsTree/SelectableTree/Node/Reverter/ReverterFactory.spec.ts
similarity index 66%
rename from tests/unit/presentation/Scripts/ScriptsTree/SelectableTree/Node/Reverter/ReverterFactory.spec.ts
rename to tests/unit/presentation/components/Scripts/ScriptsTree/SelectableTree/Node/Reverter/ReverterFactory.spec.ts
index 0b4d983d..ee17c0b6 100644
--- a/tests/unit/presentation/Scripts/ScriptsTree/SelectableTree/Node/Reverter/ReverterFactory.spec.ts
+++ b/tests/unit/presentation/components/Scripts/ScriptsTree/SelectableTree/Node/Reverter/ReverterFactory.spec.ts
@@ -1,13 +1,14 @@
 import 'mocha';
 import { expect } from 'chai';
-import { INode, NodeType } from '@/presentation/Scripts/ScriptsTree/SelectableTree/Node/INode';
-import { getReverter } from '@/presentation/Scripts/ScriptsTree/SelectableTree/Node/Reverter/ReverterFactory';
-import { ScriptReverter } from '@/presentation/Scripts/ScriptsTree/SelectableTree/Node/Reverter/ScriptReverter';
-import { CategoryReverter } from '@/presentation/Scripts/ScriptsTree/SelectableTree/Node/Reverter/CategoryReverter';
-import { CategoryCollectionStub } from '../../../../../../stubs/CategoryCollectionStub';
-import { CategoryStub } from '../../../../../../stubs/CategoryStub';
-import { getScriptNodeId, getCategoryNodeId } from '@/presentation/Scripts/ScriptsTree/ScriptNodeParser';
-import { ScriptStub } from '../../../../../../stubs/ScriptStub';
+import { INode, NodeType } from '@/presentation/components/Scripts/ScriptsTree/SelectableTree/Node/INode';
+import {
+    getReverter } from '@/presentation/components/Scripts/ScriptsTree/SelectableTree/Node/Reverter/ReverterFactory';
+import { ScriptReverter } from '@/presentation/components/Scripts/ScriptsTree/SelectableTree/Node/Reverter/ScriptReverter';
+import { CategoryReverter } from '@/presentation/components/Scripts/ScriptsTree/SelectableTree/Node/Reverter/CategoryReverter';
+import { getScriptNodeId, getCategoryNodeId } from '@/presentation/components/Scripts/ScriptsTree/ScriptNodeParser';
+import { CategoryCollectionStub } from '../../../../../../../stubs/CategoryCollectionStub';
+import { CategoryStub } from '../../../../../../../stubs/CategoryStub';
+import { ScriptStub } from '../../../../../../../stubs/ScriptStub';
 
 describe('ReverterFactory', () => {
     describe('getReverter', () => {
diff --git a/tests/unit/presentation/Scripts/ScriptsTree/SelectableTree/Node/Reverter/ScriptReverter.spec.ts b/tests/unit/presentation/components/Scripts/ScriptsTree/SelectableTree/Node/Reverter/ScriptReverter.spec.ts
similarity index 87%
rename from tests/unit/presentation/Scripts/ScriptsTree/SelectableTree/Node/Reverter/ScriptReverter.spec.ts
rename to tests/unit/presentation/components/Scripts/ScriptsTree/SelectableTree/Node/Reverter/ScriptReverter.spec.ts
index 3e281e29..ea8929a8 100644
--- a/tests/unit/presentation/Scripts/ScriptsTree/SelectableTree/Node/Reverter/ScriptReverter.spec.ts
+++ b/tests/unit/presentation/components/Scripts/ScriptsTree/SelectableTree/Node/Reverter/ScriptReverter.spec.ts
@@ -1,13 +1,13 @@
 import 'mocha';
 import { expect } from 'chai';
-import { ScriptReverter } from '@/presentation/Scripts/ScriptsTree/SelectableTree/Node/Reverter/ScriptReverter';
-import { getScriptNodeId } from '@/presentation/Scripts/ScriptsTree/ScriptNodeParser';
+import { ScriptReverter } from '@/presentation/components/Scripts/ScriptsTree/SelectableTree/Node/Reverter/ScriptReverter';
+import { getScriptNodeId } from '@/presentation/components/Scripts/ScriptsTree/ScriptNodeParser';
 import { UserSelection } from '@/application/Context/State/Selection/UserSelection';
 import { SelectedScript } from '@/application/Context/State/Selection/SelectedScript';
-import { CategoryCollectionStub } from '../../../../../../stubs/CategoryCollectionStub';
-import { CategoryStub } from '../../../../../../stubs/CategoryStub';
-import { ScriptStub } from '../../../../../../stubs/ScriptStub';
-import { SelectedScriptStub } from '../../../../../../stubs/SelectedScriptStub';
+import { CategoryCollectionStub } from '../../../../../../../stubs/CategoryCollectionStub';
+import { CategoryStub } from '../../../../../../../stubs/CategoryStub';
+import { ScriptStub } from '../../../../../../../stubs/ScriptStub';
+import { SelectedScriptStub } from '../../../../../../../stubs/SelectedScriptStub';
 
 describe('ScriptReverter', () => {
     describe('getState', () => {
diff --git a/tests/unit/presentation/Throttle.spec.ts b/tests/unit/presentation/components/Shared/Throttle.spec.ts
similarity index 96%
rename from tests/unit/presentation/Throttle.spec.ts
rename to tests/unit/presentation/components/Shared/Throttle.spec.ts
index bd81075b..ccc77a8f 100644
--- a/tests/unit/presentation/Throttle.spec.ts
+++ b/tests/unit/presentation/components/Shared/Throttle.spec.ts
@@ -1,6 +1,6 @@
 import 'mocha';
 import { expect } from 'chai';
-import { throttle, ITimer } from '@/presentation/Throttle';
+import { throttle, ITimer } from '@/presentation/components/Shared/Throttle';
 import { EventSource } from '@/infrastructure/Events/EventSource';
 import { IEventSubscription } from '@/infrastructure/Events/IEventSource';
 
diff --git a/vue.config.js b/vue.config.js
index 6c2d404b..7540e808 100644
--- a/vue.config.js
+++ b/vue.config.js
@@ -1,14 +1,19 @@
 const packageJson = require('./package.json');
 
+// Send data to application runtime
 process.env.VUE_APP_VERSION         = packageJson.version;
 process.env.VUE_APP_NAME            = packageJson.name;
 process.env.VUE_APP_REPOSITORY_URL  = packageJson.repository.url;
 process.env.VUE_APP_HOMEPAGE_URL    = packageJson.homepage;
 
 module.exports = {
+    chainWebpack: (config) => {
+        changeAppEntryPoint('./src/presentation/main.ts', config);
+    },
     pluginOptions: {
         // https://nklayman.github.io/vue-cli-plugin-electron-builder/guide/guide.html#native-modules
         electronBuilder: {
+            mainProcessFile: './src/presentation/background.ts', // https://nklayman.github.io/vue-cli-plugin-electron-builder/guide/configuration.html#webpack-configuration
             nodeIntegration: true, // required to reach Node.js APIs for environment specific logic
             // https://www.electron.build/configuration/configuration
             builderOptions: {
@@ -31,4 +36,8 @@ module.exports = {
             }
         }
     }
-}
\ No newline at end of file
+}
+
+function changeAppEntryPoint(entryPath, config) {
+    config.entry('app').clear().add(entryPath).end();
+}