rewrote the Anime.svelte to move out helper functions and clean up code

frontend/src/helperComponents/Rating.svelte

@@ -0,0 +1,50 @@
+<script lang="ts">
+    import StarRatting from "../star-rating/Stars.svelte";
+
+    export let score
+
+    let config = {
+        readOnly: false,
+        countStars: 5,
+        range: {
+            min: 0,
+            max: 5,
+            step: 0.5
+        },
+        score: score / 2,
+        showScore: false,
+        name: "rating",
+        scoreFormat: function(){ return `(${this.score.toFixed(0)}/${this.countStars})` },
+        starConfig: {
+            size: 32,
+            fillColor: '#F9ED4F',
+            strokeColor: "#e2c714",
+            unfilledColor: '#FFF',
+            strokeUnfilledColor: '#000'
+        }
+    }
+
+    const ratingInWords = {
+        0: "Not Reviewed",
+        1: "Appalling",
+        2: "Horrible",
+        3: "Very Bad",
+        4: "Bad",
+        5: "Average",
+        6: "Fine",
+        7: "Good",
+        8: "Very Good",
+        9: "Great",
+        10: "Masterpiece",
+    }
+
+    const changeRating = (e: any) => {
+        score = e.target.valueAsNumber * 2
+    }
+</script>
+
+<div>
+    <StarRatting bind:config on:change={changeRating}/>
+    <p>Rating:  {config.score * 2}</p>
+    <p>{ratingInWords[config.score * 2]}</p>
+</div>