added route protection and additional routes to update entries

import React from "react";

import { BrowserRouter as Router, Routes, Route, Link } from "react-router-dom";

import { BrowserRouter as Router, Routes, Route } from "react-router-dom";

import HomeComponent from "./components/HomeComponent"; 

import MessageComponent from "./components/MessageComponent";

import Home from "./components/Home";

import { UserRoleProvider } from './contexts/UserRoleContext';

import ProtectedRoute from "./components/ProtectedRoute";

import Logo from './components/Logo';

import Navbar from "./components/Navbar";

import Register from "./components/Register";

import Login from "./components/Login";

import BlogEntries from "./components/BlogEntries";

import CreateBlogEntry from "./components/CreateBlogEntry";

import UpdateBlogEntry from "./components/UpdateBlogEntry";

import 'bootstrap/dist/css/bootstrap.min.css';

import './assets/mystyle.css'

    // </div>

    <UserRoleProvider>

    <Router>

      <Logo />

      <Navbar />

      <div className="container mt-5">

      <Routes>

        {/* Home route */}

        {/* Public Routes */}

        <Route path="/home" element={<HomeComponent />} />

        {/* Home route */}

        <Route path="/" element={<Home />} />

        {/* Blog entries route */}

        <Route path="/blog-entries" element={<BlogEntries />} />

        {/* Create blog entries route */}

        <Route path="/create-blog-entry" element={<CreateBlogEntry />} />

        {/* Message route */}

        <Route path="/message" element={<MessageComponent />} />

        {/* Login route */}

        <Route path="/login" element={<Login />} />

        {/* Register route */}

        <Route path="/register" element={<Register />} />

        {/* Protected Routes */}

        <Route

          path="/blog-entries"

          element={

            <ProtectedRoute allowedRoles={['author']}>

              <BlogEntries />

            </ProtectedRoute>

          }

        />

        <Route

          path="/create-blog-entry"

          element={

            <ProtectedRoute allowedRoles={['author']}>

              <CreateBlogEntry />

            </ProtectedRoute>

          }

        />

        <Route

          path="/update-blog-entry"

          element={

            <ProtectedRoute allowedRoles={['author']}>

              <UpdateBlogEntry />

            </ProtectedRoute>

          }

        />

      </Routes>

      </div>

    </Router>