♻ Move project source files to top level from src, update Sentry dependency (#630)

Co-authored-by: Sebastián Ramírez <tiangolo@gmail.com>

frontend/src/components/NotificationsManager.vue

@@ -0,0 +1,77 @@
+<template>
+    <div>
+        <v-snackbar auto-height :color="currentNotificationColor" v-model="show">
+            <v-progress-circular class="ma-2" indeterminate v-show="showProgress"></v-progress-circular>{{ currentNotificationContent }}
+            <v-btn flat @click.native="close">Close</v-btn>
+        </v-snackbar>
+    </div>
+</template>
+<script lang="ts">
+import { Vue, Component, Prop, Watch } from 'vue-property-decorator';
+import { AppNotification } from '@/store/main/state';
+import { commitRemoveNotification } from '@/store/main/mutations';
+import { readFirstNotification } from '@/store/main/getters';
+import { dispatchRemoveNotification } from '@/store/main/actions';
+
+@Component
+export default class NotificationsManager extends Vue {
+    public show: boolean = false;
+    public text: string = '';
+    public showProgress: boolean = false;
+    public currentNotification: AppNotification | false = false;
+
+    public async hide() {
+        this.show = false;
+        await new Promise((resolve, reject) => setTimeout(() => resolve(), 500));
+    }
+
+    public async close() {
+        await this.hide();
+        await this.removeCurrentNotification();
+    }
+
+    public async removeCurrentNotification() {
+        if (this.currentNotification) {
+            commitRemoveNotification(this.$store, this.currentNotification);
+        }
+    }
+
+    public get firstNotification() {
+        return readFirstNotification(this.$store);
+    }
+
+    public async setNotification(notification: AppNotification | false) {
+        if (this.show) {
+            await this.hide();
+        }
+        if (notification) {
+            this.currentNotification = notification;
+            this.showProgress = notification.showProgress || false;
+            this.show = true;
+        } else {
+            this.currentNotification = false;
+        }
+    }
+
+    @Watch('firstNotification')
+    public async onNotificationChange(
+        newNotification: AppNotification | false,
+        oldNotification: AppNotification | false,
+    ) {
+        if (newNotification !== this.currentNotification) {
+            await this.setNotification(newNotification);
+            if (newNotification) {
+                dispatchRemoveNotification(this.$store, { notification: newNotification, timeout: 6500 });
+            }
+        }
+    }
+
+    public get currentNotificationContent() {
+        return this.currentNotification && this.currentNotification.content || '';
+    }
+
+    public get currentNotificationColor() {
+        return this.currentNotification && this.currentNotification.color || 'info';
+    }
+}
+</script>

frontend/src/components/RouterComponent.vue

@@ -0,0 +1,11 @@
+<template>
+  <router-view></router-view>
+</template>
+
+<script lang="ts">
+import { Component, Vue } from 'vue-property-decorator';
+
+@Component
+export default class RouterComponent extends Vue {
+}
+</script>

frontend/src/components/UploadButton.vue

@@ -0,0 +1,34 @@
+<template>
+  <div>
+    <v-btn :color="color" @click="trigger"><slot>Choose File</slot></v-btn>
+    <input :multiple="multiple" class="visually-hidden" type="file" v-on:change="files" ref="fileInput">
+  </div>
+</template>
+
+<script lang="ts">
+import { Component, Vue, Prop, Emit } from 'vue-property-decorator';
+
+@Component
+export default class UploadButton extends Vue {
+  @Prop(String) public color: string | undefined;
+  @Prop({default: false}) public multiple!: boolean;
+  @Emit()
+  public files(e): FileList {
+    return e.target.files;
+  }
+
+  public trigger() {
+    (this.$refs.fileInput as HTMLElement).click();
+  }
+}
+</script>
+
+<style scoped>
+.visually-hidden {
+  position: absolute !important;
+  height: 1px;
+  width: 1px;
+  overflow: hidden;
+  clip: rect(1px, 1px, 1px, 1px);
+}
+</style>