Added proxy to backend API and typescript errors to browser overview

src/components/Channel_Add.vue

@@ -197,31 +197,32 @@ export default Vue.extend({
 
         GetChannelFromYT(Channel: string) : void {
             // Say it failed first so if we exit early then correctly marked fail.
-            this.Valid = false;
-
-            // Copy over to internal ID box.
-            this.ID = Channel;
-
-            // Remove any potential youtube URL from the field.
-            const ytchurl = "https://www.youtube.com/channel/";
-            if (this.ID.startsWith(ytchurl))
-                this.ID = this.ID.replace(ytchurl, "");
-
-            // Check if what remains looks like a youtube channel ID.
-            if (this.ID.length != "UCyS4xQE6DK4_p3qXQwJQAyA".length){
             this.Title = "";
             this.Description = "";
             this.ID = "";
             this.Thumbnail = "";
             this.Valid = false;
-            }
+
+            // Remove possible channel inputs.
+            // https://www.youtube.com/channel/UC2DjFE7Xf11URZqWBigcVOQ
+            // UC2DjFE7Xf11URZqWBigcVOQ
+            // https://www.youtube.com/user/EEVblog <-- Take first channel found
+            // EEVblog                              <-- Take first channel found
+
+            // Remove any potential youtube URL from the field.
+            Channel = Channel.replace("https://www.youtube.com", "");
+            Channel = Channel.replace("/channel/", "");
+            Channel = Channel.replace("/user/", "");
 
             // Get channel metadata.
-            const API = 'https://www.googleapis.com/youtube/v3/channels?';
-            const API_Parts = 'part=snippet%2CcontentDetails%2Cstatistics';
+            const API = 'https://www.googleapis.com/youtube/v3/channels/?';
+            const API_Parts = 'part=snippet';
             const API_Key = '&key=AIzaSyCuIYkMc5SktlnXRXNaDf2ObX-fQvtWCnQ'
-            const API_Search_ID = '&id=' + this.ID;
-            Axios.get(API + API_Parts + API_Search_ID + API_Key).then((resp) => {
+            const API_Search_Query =
+                ((Channel.length == "UCyS4xQE6DK4_p3qXQwJQAyA".length) ? "&id=" : "&forUsername=")
+                + Channel;
+            Axios.get(API + API_Parts + API_Search_Query + API_Key).then((resp) => {
+                this.ID = resp.data.items[0].id;
                 this.Description = _.truncate(resp.data.items[0].snippet.description, {length: 70});
                 this.Title = resp.data.items[0].snippet.title;
                 this.Thumbnail = resp.data.items[0].snippet.thumbnails.high.url;

webpack.config.js

@@ -55,8 +55,17 @@ module.exports = {
         }
     },
     devServer: {
+        overlay: {
+            warnings: true,
+            errors: true
+        },
         historyApiFallback: true,
-        noInfo: true
+        proxy: {
+            "/api": {
+                target: "https://dumbyt.hak8or.com",
+                changeOrigin: true
+              }
+        }
     },
     performance: {
         hints: false