feat: added thingconnectpulse logo to the login page.

Author: hemanandr

thingconnect.pulse.client/src/assets/ThingConnect Icon.png

@@ -1,5 +1,6 @@
-import { Box, VStack, HStack, Heading, Text, Icon } from '@chakra-ui/react';
+import { Box, VStack, HStack, Heading, Text, Icon, Image } from '@chakra-ui/react';
 import { Check, Activity, TrendingUp, Shield, Zap } from 'lucide-react';
+import thingConnectLogo from '@/assets/thingconnect-pulse-logo.svg';
 
 const benefits = [
   {
@@ -40,9 +41,7 @@ export function BenefitsSection() {
       <VStack align='start' gap={8} maxW='lg' mx='auto'>
         <Box>
           <Box mb={6}>
-            <Heading size='lg' color='#076bb3' fontWeight='bold'>
-              ThingConnect Pulse
-            </Heading>
+            <Image src={thingConnectLogo} alt='ThingConnect' h='50px' />
           </Box>
           <Heading size='2xl' color='gray.800' lineHeight='1.2' mb={4} fontWeight='bold'>
             Network Availability Monitoring for Manufacturing Sites

thingconnect.pulse.client/src/assets/ThingConnect Icon.svg

@@ -1,7 +1,7 @@
 import { Box, VStack, Text, Icon, Image, HStack, Badge, Button } from '@chakra-ui/react';
 import { Link as RouterLink, useLocation } from 'react-router-dom';
 import { Wifi, Activity, LogOut, Users } from 'lucide-react';
-import thingConnectIcon from '@/assets/ThingConnectPulseLogo.svg';
+import thingConnectIcon from '@/assets/thingconnect-pulse-logo.svg';
 import { Clock, Wrench, Settings, Info, Dashboard, Help } from '@/icons';
 import { useAuth } from '@/features/auth/context/AuthContext';
 interface NavigationProps {
@@ -57,49 +57,49 @@ export function Navigation({ onItemClick }: NavigationProps) {
         {navigationItems
           .filter(item => !item.adminOnly || isAdmin)
           .map(item => {
-          const isActive = !item.external && isActiveRoute(item.path);
-          const ItemContent = (
-            <HStack
-              px={3}
-              py={2.5}
-              borderRadius='lg'
-              color={isActive ? 'blue.600' : 'gray.600'}
-              bg={isActive ? 'whiteAlpha.950' : 'transparent'}
-              border={isActive ? '1px solid' : undefined}
-              borderColor={isActive ? 'border' : undefined}
-              _hover={
-                isActive
-                  ? undefined
-                  : {
-                      bg: 'blackAlpha.50',
-                      _dark: { bg: 'gray.700' },
-                    }
-              }
-              _dark={{
-                color: isActive ? 'blue.200' : 'gray.200',
-                bg: isActive ? 'blackAlpha.200' : undefined,
-                border: isActive ? '1px solid rgba(255,255,255,0.1)' : undefined,
-              }}
-            >
-              <Icon as={item.icon} boxSize={4} />
-              <Text fontSize='sm' fontWeight='medium' letterSpacing='0.025em' lineHeight='1.2'>
-                {item.label}
-              </Text>
-            </HStack>
-          );
+            const isActive = !item.external && isActiveRoute(item.path);
+            const ItemContent = (
+              <HStack
+                px={3}
+                py={2.5}
+                borderRadius='lg'
+                color={isActive ? 'blue.600' : 'gray.600'}
+                bg={isActive ? 'whiteAlpha.950' : 'transparent'}
+                border={isActive ? '1px solid' : undefined}
+                borderColor={isActive ? 'border' : undefined}
+                _hover={
+                  isActive
+                    ? undefined
+                    : {
+                        bg: 'blackAlpha.50',
+                        _dark: { bg: 'gray.700' },
+                      }
+                }
+                _dark={{
+                  color: isActive ? 'blue.200' : 'gray.200',
+                  bg: isActive ? 'blackAlpha.200' : undefined,
+                  border: isActive ? '1px solid rgba(255,255,255,0.1)' : undefined,
+                }}
+              >
+                <Icon as={item.icon} boxSize={4} />
+                <Text fontSize='sm' fontWeight='medium' letterSpacing='0.025em' lineHeight='1.2'>
+                  {item.label}
+                </Text>
+              </HStack>
+            );
 
-          return item.external ? (
-            <Box as='a' key={item.path} asChild onClick={onItemClick}>
-              <a href={item.path} target='_blank' rel='noopener noreferrer'>
+            return item.external ? (
+              <Box as='a' key={item.path} asChild onClick={onItemClick}>
+                <a href={item.path} target='_blank' rel='noopener noreferrer'>
+                  {ItemContent}
+                </a>
+              </Box>
+            ) : (
+              <RouterLink key={item.path} to={item.path} onClick={onItemClick}>
                 {ItemContent}
-              </a>
-            </Box>
-          ) : (
-            <RouterLink key={item.path} to={item.path} onClick={onItemClick}>
-              {ItemContent}
-            </RouterLink>
-          );
-        })}
+              </RouterLink>
+            );
+          })}
       </VStack>
       <Box p={4} borderTop='1px' borderColor='gray.200' _dark={{ borderColor: 'gray.700' }}>
         <VStack align='stretch' gap={4}>

thingconnect.pulse.client/src/assets/ThingConnect Logo.png

@@ -26,7 +26,7 @@ import {
   ExternalLink,
 } from 'lucide-react';
 import { PageHeader } from '@/components/layout/PageHeader';
-import thingConnectLogo from '@/assets/thingconnect-logo.svg';
+import thingConnectLogo from '@/assets/thingconnect-pulse-logo.svg';
 
 export default function About() {
   return (
@@ -68,7 +68,7 @@ export default function About() {
                   IT/OT infrastructure with ease.
                 </Text>
                 <HStack justify='center' gap={3}>
-                  <Image src={thingConnectLogo} alt='ThingConnect' h='50px' />
+                  <Image src={thingConnectLogo} alt='ThingConnect' h='50px' width={'100%'} />
                   <HStack gap={2}>
                     <Badge colorPalette='blue' variant='solid' size='sm'>
                       v1.0.0
@@ -224,7 +224,7 @@ export default function About() {
                       title: 'Discord',
                       desc: 'Community support and real-time help',
                       tags: ['Community Support', 'Q&A', 'General Chat', 'Networking'],
-                      link: 'https://discord.gg',
+                      link: 'https://discord.gg/ZvhWncwv3J',
                     },
                     {
                       icon: MessageCircle,
@@ -238,14 +238,14 @@ export default function About() {
                       title: 'LinkedIn',
                       desc: 'Professional community for industry leaders',
                       tags: ['Networking', 'Hiring', 'Case Studies'],
-                      link: 'https://linkedin.com',
+                      link: 'https://www.linkedin.com/company/thingconnect/',
                     },
                     {
                       icon: Instagram,
                       title: 'Instagram',
                       desc: 'Stories, highlights, and community moments',
                       tags: ['Updates', 'Events', 'Highlights'],
-                      link: 'https://instagram.com',
+                      link: 'https://www.instagram.com/thingconnect/',
                     },
                   ].map((c, i) => (
                     <Link key={i} href={c.link} target='_blank' _hover={{ textDecoration: 'none' }}>