diff --git a/src/renderer/components/SideNavbar.tsx b/src/renderer/components/SideNavbar.tsx
index 3752e2b..606ae89 100644
--- a/src/renderer/components/SideNavbar.tsx
+++ b/src/renderer/components/SideNavbar.tsx
@@ -16,18 +16,15 @@ import iconTrend from '../assets/img/icon_trend.svg'
 import shakeHands from '../assets/img/shake-hands.svg'
 import { AccountService } from '../services/account.service'
 
-export function SideNavbar(props: any) {
+export const SideNavbar = () => {
   const [login, setLogin] = useState('')
   const [myChannelLink, setMyChannelLink] = useState('')
 
   useEffect(() => {
     const load = async () => {
       const login = localStorage.getItem('SNProfileID')
-      console.log('login debug', login)
       if (login) {
         const user = (await AccountService.getAccount(login)) as any
-        console.log('login debug 2', user)
-
         const ringItem = user.keyring[0]
         setLogin(user.nickname)
         setMyChannelLink(`${ringItem.type}:${ringItem.username}`)
@@ -45,7 +42,6 @@ export function SideNavbar(props: any) {
     const user = await AccountService.logout(profileID)
     const accountsInit = (await AccountService.getAccounts()) as any
     localStorage.removeItem('SNProfileID')
-    console.log(accountsInit)
     if (accountsInit.length > 0) {
       localStorage.setItem('SNProfileID', accountsInit[0]._id)
     }
@@ -53,7 +49,13 @@ export function SideNavbar(props: any) {
   }
 
   return (
-    <Navbar bg="white" expand="lg" id="layoutNav" className="bg_white fixed-left"  style={{overflow:'scroll'}}>
+    <Navbar
+      bg="white"
+      expand="lg"
+      id="layoutNav"
+      className="bg_white fixed-left"
+      style={{ overflow: 'scroll' }}
+    >
       <Navbar.Brand>
         <img src={SpeakLogo} />
       </Navbar.Brand>
diff --git a/src/renderer/services/accountServices/login.ts b/src/renderer/services/accountServices/login.ts
index bcd1889..9fbdef5 100644
--- a/src/renderer/services/accountServices/login.ts
+++ b/src/renderer/services/accountServices/login.ts
@@ -16,7 +16,7 @@ export async function login(data) {
       if (Valid) {
         const profile = {
           _id: userAccounts[0].id.toString(),
-          nickname: data.profile,
+          nickname: data.username,
           keyring: [
             {
               type: 'hive',
diff --git a/src/renderer/views/LoginView.tsx b/src/renderer/views/LoginView.tsx
index 11812d6..4973811 100644
--- a/src/renderer/views/LoginView.tsx
+++ b/src/renderer/views/LoginView.tsx
@@ -61,11 +61,10 @@ export function LoginView() {
       event.preventDefault()
 
       const login = {
-        username: username,
-        key: key,
-        profile: profile,
-        accountType: accountType,
-        symKey: symKey,
+        username,
+        key,
+        accountType,
+        symKey,
         isEncrypted: encryption,
       }
 
@@ -143,17 +142,6 @@ export function LoginView() {
               overlay={<Tooltip id="coming-soon">Disabled (Coming Soon!)</Tooltip>}
             >
               <div>
-                <Form.Group>
-                  <Form.Label className="text-secondary">Profile name</Form.Label>
-                  <Form.Control
-                    type="text"
-                    value={profile}
-                    onChange={onProfileChange}
-                    className="bg-secondary text-light"
-                    disabled
-                    required
-                  />
-                </Form.Group>
                 <Form.Group>
                   <Form.Label className="text-secondary">Username</Form.Label>
                   <Form.Control
@@ -170,24 +158,38 @@ export function LoginView() {
           ) : (
             <>
               <Form.Group>
-                <Form.Label className="text-secondary">Profile name</Form.Label>
-                <Form.Control
-                  type="text"
-                  value={profile}
-                  onChange={onProfileChange}
-                  className="bg-secondary text-light"
-                  required
-                />
-              </Form.Group>
-              <Form.Group>
-                <Form.Label className="text-secondary">Username</Form.Label>
-                <Form.Control
-                  type="text"
-                  value={username}
-                  onChange={onUsernameChange}
-                  className="bg-secondary text-light"
-                  required
-                />
+                <Form.Label className="text-secondary">HIVE Username</Form.Label>
+                <div
+                  style={{
+                    display: 'flex',
+                    alignItems: 'center',
+                  }}
+                >
+                  <div
+                    style={{
+                      backgroundColor: '#d1d1d1',
+                      width: '45px',
+                      height: '45px',
+                      display: 'flex',
+                      justifyContent: 'center',
+                      alignItems: 'center',
+                      fontSize: '20px',
+                      borderRadius: '2px 0 0 2px',
+                    }}
+                  >
+                    @
+                  </div>
+                  <Form.Control
+                    type="text"
+                    value={username}
+                    onChange={onUsernameChange}
+                    className="bg-secondary text-light"
+                    style={{
+                      borderRadius: '0 2px 2px 0',
+                    }}
+                    required
+                  />
+                </div>
               </Form.Group>
             </>
           )}