From b585bca6aae467c451c757797334a58bd2c88105 Mon Sep 17 00:00:00 2001
From: komal gavasane <komalgavasane10@gmail.com>
Date: Mon, 4 Nov 2024 20:00:00 +0530
Subject: [PATCH] converted the manage reviews html page into reactjs

---
 .../src/pages/bootcamps/ManageReviewsPage.jsx | 75 ++++++++++---------
 1 file changed, 38 insertions(+), 37 deletions(-)

diff --git a/src/webapp/src/pages/bootcamps/ManageReviewsPage.jsx b/src/webapp/src/pages/bootcamps/ManageReviewsPage.jsx
index d33064f..019d075 100644
--- a/src/webapp/src/pages/bootcamps/ManageReviewsPage.jsx
+++ b/src/webapp/src/pages/bootcamps/ManageReviewsPage.jsx
@@ -1,5 +1,6 @@
 import React from 'react';
 import { Link } from 'react-router-dom';
+import { Table, Container, Row, Col, Card, Button } from 'react-bootstrap';
 import { GrEdit, GrClose } from 'react-icons/gr';
 
 const bootcamps = [
@@ -17,44 +18,44 @@ const bootcamps = [
 
 const ManageReviewsPage = () => {
   return (
-    <section className="container mt-5">
-      <div className="container">
-        <div className="row">
-          <div className="col-md-8 m-auto">
-            <div className="card bg-white py-2 px-4">
-              <div className="card-body">
-                <h1 className="mb-4">Manage Reviews</h1>
-                <table className="table table-striped">
-                  <thead>
-                    <tr>
-                      <th scope="col">Bootcamp</th>
-                      <th scope="col">Rating</th>
-                      <th scope="col"></th>
-                    </tr>
-                  </thead>
-                  <tbody>
-                    {bootcamps.map((b) => (
-                      <tr key={b.id}>
-                        <td>{b.bootCampName}</td>
-                        <td>{b.bootCampRating}</td>
-                        <td>
-                          <Link to={`/bootcamps/${b.id}/reviews/add`} className="btn btn-secondary me-2 mb-1">
+    <Container className="mt-5">
+      <Row className="justify-content-center">
+        <Col md={8}>
+          <Card className="bg-white py-2 px-4">
+            <Card.Body>
+              <h1 className="mb-4">Manage Reviews</h1>
+              <Table striped bordered hover>
+                <thead>
+                  <tr>
+                    <th>Bootcamp</th>
+                    <th>Rating</th>
+                    <th></th>
+                  </tr>
+                </thead>
+                <tbody>
+                  {bootcamps.map((b) => (
+                    <tr key={b.id}>
+                      <td>{b.name}</td>
+                      <td>{b.rating}</td>
+                      <td>
+                        <Link to={`/bootcamps/${b.id}/reviews/add`}>
+                          <Button variant="secondary" className="me-2 mb-1">
                             <GrEdit />
-                          </Link>
-                          <button className="btn btn-danger mb-1">
-                            <GrClose />
-                          </button>
-                        </td>
-                      </tr>
-                    ))}
-                  </tbody>
-                </table>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-    </section>
+                          </Button>
+                        </Link>
+                        <Button variant="danger" className="mb-1">
+                          <GrClose />
+                        </Button>
+                      </td>
+                    </tr>
+                  ))}
+                </tbody>
+              </Table>
+            </Card.Body>
+          </Card>
+        </Col>
+      </Row>
+    </Container>
   );
 };