Implemented a workspace feature

src/views/Workspace.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="work-space">
-    <SideBar :sections="sections" />
+    <SideBar :sections="sections" @launch-app="launchApp" />
     <WebContent :url="url" />
   </div>
 </template>
@@ -9,11 +9,13 @@
 
 import SideBar from '@/components/Workspace/SideBar';
 import WebContent from '@/components/Workspace/WebContent';
+import Defaults, { localStorageKeys } from '@/utils/defaults';
 
 export default {
   name: 'Workspace',
   props: {
     sections: Array,
+    appConfig: Object,
   },
   data: () => ({
     url: '',
@@ -22,6 +24,27 @@ export default {
     SideBar,
     WebContent,
   },
+  methods: {
+    launchApp(url) {
+      this.url = url;
+    },
+    setTheme() {
+      const theme = localStorage[localStorageKeys.THEME] || this.confTheme || Defaults.theme;
+      const htmlTag = document.getElementsByTagName('html')[0];
+      if (htmlTag.hasAttribute('data-theme')) htmlTag.removeAttribute('data-theme');
+      htmlTag.setAttribute('data-theme', theme);
+    },
+    initiateFontAwesome() {
+      const fontAwesomeScript = document.createElement('script');
+      const faKey = this.appConfig.fontAwesomeKey || Defaults.fontAwesomeKey;
+      fontAwesomeScript.setAttribute('src', `https://kit.fontawesome.com/${faKey}.js`);
+      document.head.appendChild(fontAwesomeScript);
+    },
+  },
+  mounted() {
+    this.setTheme();
+    this.initiateFontAwesome();
+  },
 };
 
 </script>