Add: get reviews and fix bug

web/src/component/Common.js

@@ -35,6 +35,30 @@ function numberWithCommas(x) {
   return x;
 }
 
+// convert unix timestamp to %Y-%m-%d %H:%M:%S
+export function convertIntToDateTime(timestamp) {
+  var date = new Date(timestamp * 1000);
+  var year = date.getFullYear();
+  var month = date.getMonth() + 1;
+  var day = date.getDate();
+  var hour = date.getHours();
+  var minute = date.getMinutes();
+  var second = date.getSeconds();
+  var time =
+    year +
+    "-" +
+    (month < 10 ? "0" + month : month) +
+    "-" +
+    (day < 10 ? "0" + day : day) +
+    " " +
+    (hour < 10 ? "0" + hour : hour) +
+    ":" +
+    (minute < 10 ? "0" + minute : minute) +
+    ":" +
+    (second < 10 ? "0" + second : second);
+  return time;
+}
+
 export function SayHello() {
   return "Hello";
 }

web/src/component/ReviewPage.js

@@ -1,9 +1,36 @@
-import { useState } from "react";
+import { useState, useEffect } from "react";
 import { useParams } from "react-router";
+import { Link } from "react-router-dom";
+import { convertIntToDateTime } from "./Common";
 
 function ReviewPage() {
   let params = useParams();
   const [newReview, setNewReview] = useState("");
+  const [reviews, setReviews] = useState([]);
+
+  function refresh() {
+    fetch("/api/v1/get_reviews_on_file", {
+      method: "POST",
+      headers: {
+        "Content-Type": "application/json",
+      },
+      body: JSON.stringify({
+        id: parseInt(params.id),
+      }),
+    })
+      .then((response) => response.json())
+      .then((data) => {
+        if (data.error) {
+          alert(data.error);
+        } else {
+          setReviews(data.reviews);
+        }
+      });
+  }
+
+  useEffect(() => {
+    refresh();
+  }, []);
 
   function submitReview() {
     fetch("/api/v1/insert_review", {
@@ -22,6 +49,7 @@ function ReviewPage() {
           alert(data.error);
         } else {
           setNewReview("");
+          refresh();
         }
       });
   }
@@ -29,6 +57,17 @@ function ReviewPage() {
   return (
     <div className="page">
       <h3>Review Page</h3>
+      <div>
+        {reviews.map((review) => (
+          <div key={review.id}>
+            <h4>
+              <Link to={`/manage/users/${review.user.id}`}>@{review.user.username}</Link> wrote on{" "}
+              {convertIntToDateTime(review.created_at)}{" "}
+            </h4>
+            <p>{review.content}</p>
+          </div>
+        ))}
+      </div>
       <div>
         <textarea
           value={newReview}