✨ Adds widget compatibility into workspace view

src/components/Workspace/SideBar.vue

@@ -55,6 +55,7 @@ export default {
     /* Toggles the section clicked, and closes all other sections */
     openSection(index) {
       this.isOpen = this.isOpen.map((val, ind) => (ind !== index ? false : !val));
+      if (this.sections[index].widgets) this.$emit('launch-widget', this.sections[index].widgets);
     },
     /* When item clicked, emit a launch event */
     launchApp(options) {

src/components/Workspace/WidgetView.vue

@@ -0,0 +1,39 @@
+<template>
+  <div class="workspace-widget-view" v-if="widgets">
+    <WidgetBase
+      v-for="(widget, widgetIndx) in widgets"
+      :key="widgetIndx"
+      :widget="widget"
+      :index="widgetIndx"
+      class="workspace-widget"
+    />
+  </div>
+</template>
+
+<script>
+import WidgetBase from '@/components/Widgets/WidgetBase';
+
+export default {
+  components: {
+    WidgetBase,
+  },
+  props: {
+    widgets: Array,
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.workspace-widget-view {
+  padding: 1rem 0;
+  background: var(--background);
+  position: absolute;
+  left: var(--side-bar-width);
+  height: calc(100% - var(--header-height) - 1rem);
+  width: calc(100% - var(--side-bar-width));
+  .workspace-widget {
+    max-width: 800px;
+    margin: 0 auto;
+  }
+}
+</style>