add Rewardview Panel

src/view/Components/Taskview/Rewardview/RewardItem.tsx

@@ -0,0 +1,13 @@
+import Emoji from "react-emoji-render";
+import * as React from "react";
+
+function RewardItem(props: any) {
+    return (
+        <div className="reward-item" id={props.id}>
+            <button className="reward-click" id={props.id} onClick={props.onChange}>-{props.reward_value}</button>
+            <p className="reward-text"><Emoji text={props.reward_text}></Emoji></p>
+        </div>
+    )
+}
+
+export default RewardItem

src/view/Components/Taskview/Rewardview/index.tsx

@@ -0,0 +1,21 @@
+import * as React from "react";
+import RewardItem from "./RewardItem"
+
+export default function Index(props: any){
+    if(props.rewards == undefined) {
+        return (<div id="classDisplay">
+                    No Rewards present.
+                </div>)
+    }
+    else {
+        const allRewards = props.rewards.map((reward: any) => {
+            return <RewardItem key={reward.id} id={reward.id} reward_text={reward.text} reward_value={reward.value} onChange={props.onChange}/>
+        })
+        const display = <div id="classDisplay">
+                            <ul>{allRewards}</ul>
+                        </div>
+
+        return(display);
+    }
+}
+