From e7ba7386864d550c9348b91ca509b071a3af6002 Mon Sep 17 00:00:00 2001
From: Barunes Padhy <contact@barunes.io>
Date: Thu, 27 Jun 2024 18:38:49 +0300
Subject: [PATCH] fixed small issues with rendering and accessibility fixes

---
 .../viewable-ui/src/components/blog-list.jsx  |  2 +-
 .../src/components/shared/navbar.jsx          | 27 +++++++++----------
 2 files changed, 13 insertions(+), 16 deletions(-)

diff --git a/frontend/viewable-ui/src/components/blog-list.jsx b/frontend/viewable-ui/src/components/blog-list.jsx
index ce1084a..2818496 100755
--- a/frontend/viewable-ui/src/components/blog-list.jsx
+++ b/frontend/viewable-ui/src/components/blog-list.jsx
@@ -70,7 +70,7 @@ function BlogList(props) {
               <Row>
                 {categoryData ?
                   categoryData.blogMetadata.map((item) => (
-                    <Col key={item.blog_id}>
+                    <Col key={`blogitem.${item.blog_id}`}>
                       <div className={`p-2 ml-2 ${ThemeConfig[GlobalTheme].textColor}`}>
                         <CardListViewer
                           totalItems={categoryData.blogMetadata.length}
diff --git a/frontend/viewable-ui/src/components/shared/navbar.jsx b/frontend/viewable-ui/src/components/shared/navbar.jsx
index 949b5ff..977f9d8 100755
--- a/frontend/viewable-ui/src/components/shared/navbar.jsx
+++ b/frontend/viewable-ui/src/components/shared/navbar.jsx
@@ -1,7 +1,6 @@
 // Update import paths based on your Argon source location
 import {
   Navbar,
-  NavbarBrand,
   Nav,
   NavItem,
   Container,
@@ -36,20 +35,18 @@ function Header(props) {
         <Navbar className={`navbar-horizontal ${ThemeConfig[GlobalTheme].navBar['navBarTheme']} ${ThemeConfig[GlobalTheme].navBar['background']}`}
           expand='lg'>
           <Container>
-            <NavbarBrand>
-              {
-                UserData.profilePhoto !== '' ?
-                  <img
-                    style={{ width: '40px', height: '40px', objectFit: 'cover', 'marginRight': '10px' }}
-                    className='rounded-circle'
-                    alt={UserData.name}
-                    src={MediaService.getMedia(UserData.profilePhoto)}
-                  /> : ''
-              }
-              <Button onClick={() => navigate('/')} aria-label='Go to Home page' color={`${ThemeConfig ? ThemeConfig[GlobalTheme].navBar['buttonColor'] : ''}`} size='lg'>
-                { UserData ? UserData.name : <Spinner> Loading... </Spinner> }
-              </Button>
-            </NavbarBrand>
+            {
+              UserData.profilePhoto !== '' ?
+                <img
+                  style={{ width: '40px', height: '40px', objectFit: 'cover', 'marginRight': '10px' }}
+                  className='rounded-circle'
+                  alt={UserData.name}
+                  src={MediaService.getMedia(UserData.profilePhoto)}
+                /> : ''
+            }
+            <Button onClick={() => navigate('/')} aria-label='Go to Home page' color={`${ThemeConfig ? ThemeConfig[GlobalTheme].navBar['buttonColor'] : ''}`} size='lg'>
+              { UserData ? UserData.name : <Spinner> Loading... </Spinner> }
+            </Button>
             <Nav className='ml-lg-auto' navbar>
               <NavItem>
                 <ButtonGroup style={{marginTop: '15px', marginBottom: '15px'}}>