src/components/AppBar/AppBar.tsx

@@ -45,8 +45,10 @@ export const AppBar = () => {
   useEffect(() => {
     if (metadataState) {
       if (metadataState.content) {
-        const { picture, display_name, name } = JSON.parse(metadataState.content)
+        const { picture, display_name, name } = JSON.parse(
-  
+          metadataState.content
+        )
+
         if (picture || userRobotImage) {
           setUserAvatar(picture || userRobotImage)
         }
@@ -85,12 +87,8 @@ export const AppBar = () => {
         nsecBunkerPubkey: undefined
       })
     )
-    dispatch(
+    dispatch(setMetadataEvent(metadataController.getEmptyMetadataEvent()))
-      setMetadataEvent(metadataController.getEmptyMetadataEvent())
+    dispatch(setUserRobotImage(null))
-    )
-    dispatch(
-      setUserRobotImage(null)
-    )
 
     // clear authToken saved in local storage
     clearAuthToken()

src/layouts/Main.tsx

@@ -5,7 +5,13 @@ import { useDispatch, useSelector } from 'react-redux'
 import { Outlet } from 'react-router-dom'
 import { AppBar } from '../components/AppBar/AppBar'
 import { restoreState, setAuthState, setMetadataEvent } from '../store/actions'
-import { clearAuthToken, clearState, getRoboHashPicture, loadState, saveNsecBunkerDelegatedKey } from '../utils'
+import {
+  clearAuthToken,
+  clearState,
+  getRoboHashPicture,
+  loadState,
+  saveNsecBunkerDelegatedKey
+} from '../utils'
 import { LoadingSpinner } from '../components/LoadingSpinner'
 import { Dispatch } from '../store/store'
 import { MetadataController, NostrController } from '../controllers'
@@ -76,11 +82,9 @@ export const MainLayout = () => {
   useEffect(() => {
     if (authState && authState.loggedIn) {
       const pubkey = authState.usersPubkey || authState.keyPair?.public
-      
+
       if (pubkey) {
-        dispatch(
+        dispatch(setUserRobotImage(getRoboHashPicture(pubkey)))
-          setUserRobotImage(getRoboHashPicture(pubkey))
-        )
       }
     }
   }, [authState])

src/pages/login/index.tsx

@@ -47,9 +47,9 @@ export const Login = () => {
    * Call login function when enter is pressed
    */
   const handleInputKeyDown = (event: any) => {
-    if (event.code === "Enter" || event.code === "NumpadEnter") {
+    if (event.code === 'Enter' || event.code === 'NumpadEnter') {
-      event.preventDefault();
+      event.preventDefault()
-      login()  
+      login()
     }
   }
 

src/pages/profile/index.tsx

@@ -246,14 +246,14 @@ export const ProfilePage = () => {
   /**
    * Handles the logic for Image URL.
    * If no picture in kind 0 found - use robohash avatar
-   * 
+   *
    * @returns robohash image url
    */
   const getProfileImage = (metadata: ProfileMetadata) => {
     if (!isUsersOwnProfile) {
       return metadata.picture || getRoboHashPicture(npub!)
     }
-    
+
     // userRobotImage is used only when visiting own profile
     // while kind 0 picture is not set
     return metadata.picture || userRobotImage || getRoboHashPicture(npub!)
@@ -293,7 +293,7 @@ export const ProfilePage = () => {
                 <img
                   onError={(event: any) => {
                     event.target.src = getRoboHashPicture(npub!)
-                  }}                
+                  }}
                   className={styles.img}
                   src={getProfileImage(profileMetadata)}
                   alt="Profile Image"

src/store/userRobotImage/action.ts

@@ -1,7 +1,9 @@
 import * as ActionTypes from '../actionTypes'
 import { SetUserRobotImage } from './types'
 
-export const setUserRobotImage = (payload: string | null): SetUserRobotImage => ({
+export const setUserRobotImage = (
+  payload: string | null
+): SetUserRobotImage => ({
   type: ActionTypes.SET_USER_ROBOT_IMAGE,
   payload
 })

src/utils/nostr.ts

@@ -143,7 +143,10 @@ export const base64DecodeAuthToken = (authToken: string): SignedEvent => {
  * @param pubkey in hex or npub format
  * @returns robohash.org url for the avatar
  */
-export const getRoboHashPicture = (pubkey?: string, set: number = 1): string => {
+export const getRoboHashPicture = (
+  pubkey?: string,
+  set: number = 1
+): string => {
   if (!pubkey) return ''
   const npub = hexToNpub(pubkey)
   return `https://robohash.org/${npub}.png?set=set${set}`