Change "grouping" to "view"

1. *Grouping* becomes *view*. Because *view* is more clear and extensible than *grouping*. It increases flexibility to extend by e.g. adding *flat* as a new view as discussed in #50, in this case "flat *view*" would make more sense than "flat *grouping*".
2. *None* becomes *tree*. Because *tree* is more descriptive than *none*.

Updates labels on top menu. As labels are updated, the file structure/names are refactored to follow the same concept. `TheScriptsList` is renamed to `TheScriptsView`. Also refactors `ViewChanger` so view types are presented in same way.

src/presentation/components/Scripts/Menu/TheScriptsMenu.vue

@@ -2,9 +2,9 @@
     <div id="container">
         <TheSelector class="item" />
         <TheOsChanger class="item"  />
-        <TheGrouper
+        <TheViewChanger
             class="item"
-            v-on:groupingChanged="$emit('groupingChanged', $event)"
+            v-on:viewChanged="$emit('viewChanged', $event)"
             v-if="!this.isSearching" />
     </div>
 </template>
@@ -13,7 +13,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 TheViewChanger from './View/TheViewChanger.vue';
 import { StatefulVue } from '@/presentation/components/Shared/StatefulVue';
 import { ICategoryCollectionState } from '@/application/Context/State/ICategoryCollectionState';
 import { IEventSubscription } from '@/infrastructure/Events/IEventSource';
@@ -22,7 +22,7 @@ import { IEventSubscription } from '@/infrastructure/Events/IEventSource';
   components: {
     TheSelector,
     TheOsChanger,
-    TheGrouper,
+    TheViewChanger,
   },
 })
 export default class TheScriptsMenu extends StatefulVue {