Handling Error 401

+ typo fix

src/app/clientApp/Devices/Detail/DevicesDetailsPage/DevicesDetailsPage.tsx

@@ -28,7 +28,7 @@ import FirstTimeOnboardingModal from '../FirstTimeOnboardingModal/FirstTimeOnboa
 import Tab1 from './Tabs/Tab1'
 import Tab2 from './Tabs/Tab2'
 import { Props } from './DevicesDetailsPage.types'
-import { getWellKnowConfig } from '../../../utils'
+import { getWellKnownConfig } from '../../../utils'
 import notificationId from '../../../notificationId'
 import AppContext from '../../../../share/AppContext'
 
@@ -78,7 +78,7 @@ const DevicesDetailsPage: FC<Props> = (props) => {
         deviceId: id,
     })
 
-    const wellKnownConfig = getWellKnowConfig()
+    const wellKnownConfig = getWellKnownConfig()
     const parseOnboardingData = useCallback(() => getOnboardingDataFromConfig(wellKnownConfig), [wellKnownConfig])
     const handleOpenEditDeviceNameModal = useCallback(() => setShowEditNameModal(true), [])
 

src/app/clientApp/Devices/FooterVersion/FooterVersion.tsx

@@ -14,7 +14,7 @@ const FooterVersion: FC<Props> = (props) => {
     const { formatMessage: _ } = useIntl()
 
     const appStore = useSelector((state: any) => state.app)
-    const wellKnownConfig = security.getWellKnowConfig()
+    const wellKnownConfig = security.getWellKnownConfig()
 
     const versionMarkData = useMemo(
         () =>

src/app/clientApp/Devices/List/DevicesListPage/Tabs/Tab1.tsx

@@ -23,7 +23,7 @@ import AppContext from '../../../../../share/AppContext'
 import { messages as app } from '../../../../App/App.i18n'
 import { useDevicesListCache } from '../../../hooks'
 import { getApiErrorMessage } from '../../../../../../common/utils'
-import { getWellKnowConfig } from '../../../../utils'
+import { getWellKnownConfig } from '../../../../utils'
 
 const { OWNED, UNSUPPORTED } = devicesOwnerships
 
@@ -41,7 +41,7 @@ const Tab1 = forwardRef<Tab1RefType, Props>((props, ref) => {
         useDevicesList: useDevicesListProp,
     } = { ...defaultProps, ...props }
     const { formatMessage: _ } = useIntl()
-    const wellKnownConfig = getWellKnowConfig()
+    const wellKnownConfig = getWellKnownConfig()
     const [deleteModalOpen, setDeleteModalOpen] = useState(false)
     const [selectedDevices, setSelectedDevices] = useState([])
     const [isAllSelected, setIsAllSelected] = useState(false)

src/app/clientApp/Devices/List/DevicesListPage/Tabs/Tab2.tsx

@@ -41,7 +41,7 @@ const Tab2: FC<Props> = (props) => {
     const isMounted = useIsMounted()
     const { isHub, updateRemoteClient, updateAppWellKnownConfig, reFetchConfig } = useContext(AppContext)
     const dispatch = useDispatch()
-    const wellKnownConfig = security.getWellKnowConfig()
+    const wellKnownConfig = security.getWellKnownConfig()
     const appStore = useSelector((state: any) => state.app)
 
     const optionsBool = useMemo(

src/app/clientApp/Devices/rest.ts

@@ -3,7 +3,7 @@ import { devicesApiEndpoints } from './constants'
 import { interfaceGetParam } from './utils'
 import { signIdentityCsr } from '../App/AppRest'
 import { DEVICE_AUTH_MODE, DEVICE_AUTH_CODE_SESSION_KEY, DEVICE_AUTH_CODE_REMOTE_CLIENT_ID, DEVICE_AUTH_CODE_DEVICE_ID } from '../constants'
-import { getHttpGatewayAddress, getUseToken, getWebOAuthConfig, getWellKnowConfig } from '../utils'
+import { getHttpGatewayAddress, getUseToken, getWebOAuthConfig, getWellKnownConfig } from '../utils'
 
 /**
  * Get a single thing by its ID Rest Api endpoint
@@ -140,10 +140,11 @@ export const PLGD_BROWSER_USED = 'plgdBrowserUsed'
 /**
  * Returns an async function which resolves with a authorization code gathered from a rendered iframe, used for onboarding of a device.
  * @param {*} deviceId
+ * @param {*} remoteClientId
  */
 export const getDeviceAuthCode = (deviceId: string, remoteClientId?: string) =>
     new Promise((resolve, reject) => {
-        const wellKnownConfig = getWellKnowConfig()
+        const wellKnownConfig = getWellKnownConfig()
 
         if (!wellKnownConfig.remoteProvisioning) {
             return reject(new Error('remoteProvisioning is missing in wellKnowConfig'))

src/app/clientApp/Devices/utils.ts

@@ -21,7 +21,7 @@ import {
 import { ResourcesType } from './Devices.types'
 import { getDevicesResourcesApi, updateDevicesResourceApi } from './rest'
 import { messages as t } from './Devices.i18n'
-import { getWellKnowConfig } from '../utils'
+import { getWellKnownConfig } from '../utils'
 import notificationId from '../notificationId'
 
 const time = converter.time
@@ -442,7 +442,7 @@ export const getOnboardingEndpoint = (resources: ResourcesType[]) => {
 }
 
 export const hasOnboardingFeature = () => {
-    const wellKnowConfig = getWellKnowConfig()
+    const wellKnowConfig = getWellKnownConfig()
 
     if (!wellKnowConfig.remoteProvisioning) {
         return false

src/app/clientApp/MockApp/MockApp.tsx

@@ -4,7 +4,7 @@ import { useSearchParams } from 'react-router-dom'
 import { detect } from 'detect-browser'
 
 import { messages as t } from './MockApp.i18n'
-import { getWellKnowConfig, getClientUrl } from '../utils'
+import { getWellKnownConfig, getClientUrl } from '../utils'
 import { DEVICE_AUTH_CODE_DEVICE_ID, DEVICE_AUTH_CODE_REMOTE_CLIENT_ID, DEVICE_AUTH_CODE_SESSION_KEY } from '../constants'
 import { useClientAppPage } from '../RemoteClients/use-client-app-page'
 import { clientAppSettings, security } from '../../../common/services'
@@ -13,13 +13,13 @@ import { isEdge } from '../../../components/Atomic/_utils/browser'
 
 const MockApp = () => {
     const { formatMessage: _ } = useIntl()
-    const wellKnowConfigHub = getWellKnowConfig()
+    const wellKnowConfigHub = getWellKnownConfig()
     const [searchParams] = useSearchParams()
     const code = searchParams.get('code')
 
     const remoteClientId = localStorage.getItem(DEVICE_AUTH_CODE_REMOTE_CLIENT_ID)
     const deviceId = localStorage.getItem(DEVICE_AUTH_CODE_DEVICE_ID)
-    const hubWellKnownConfig = security.getWellKnowConfig()
+    const hubWellKnownConfig = security.getWellKnownConfig()
     const isEdgeBrowser = isEdge(detect())
 
     const [clientData, error, errorElement] = useClientAppPage({

src/app/clientApp/utils.ts

@@ -7,7 +7,7 @@ type SecurityConfig = {
     authority: string
 }
 
-export const getWellKnowConfig = (): WellKnownConfigType => clientAppSettings.getWellKnowConfig() || security.getWellKnowConfig()
+export const getWellKnownConfig = (): WellKnownConfigType => clientAppSettings.getWellKnownConfig() || security.getWellKnownConfig()
 
 export const getHttpGatewayAddress = () => {
     const getConfig = () => security.getGeneralConfig() as SecurityConfig

src/common/services/api-utils.ts

@@ -5,10 +5,10 @@ import { v5 as uuidv5 } from 'uuid'
 import { clientAppSettings } from './client-app-settings'
 import { security } from './security'
 import { DEVICE_AUTH_MODE } from '../../app/clientApp/constants'
-import { getWellKnowConfig } from '../../app/clientApp/utils'
+import { getWellKnownConfig } from '../../app/clientApp/utils'
 import { checkIfValidUUID } from '../utils'
 
-export const hasDifferentOwner = (wellKnownConfig = getWellKnowConfig(), clientData = clientAppSettings.getClientData(), modeCheck = false) => {
+export const hasDifferentOwner = (wellKnownConfig = getWellKnownConfig(), clientData = clientAppSettings.getClientData(), modeCheck = false) => {
     if (!wellKnownConfig || !wellKnownConfig?.isInitialized || !clientData) {
         return false
     }

src/common/services/client-app-settings.js

@@ -11,8 +11,8 @@ export const clientAppSettings = {
     setGeneralConfig: (config) => (generalConfig = config),
     getWebOAuthConfig: () => webOAuthConfig,
     setWebOAuthConfig: (config) => (webOAuthConfig = config),
-    getWellKnowConfig: () => wellKnowConfig,
-    setWellKnowConfig: (config) => (wellKnowConfig = config),
+    getWellKnownConfig: () => wellKnowConfig,
+    setWellKnownConfig: (config) => (wellKnowConfig = config),
     getSignOutRedirect: () => signOutRedirect,
     setSignOutRedirect: (data) => (signOutRedirect = data),
     getUseToken: () => useToken,

src/common/services/security.js

@@ -4,7 +4,7 @@ let deviceOAuthConfig = {}
 let webOAuthConfig = {}
 let getAccessToken = null
 let userManager = null
-let wellKnowConfig = null
+let wellKnownConfig = null
 
 // This singleton contains the method getAccessTokenSilently exposed globally, so that we can use this in our interceptors.
 export const security = {
@@ -20,6 +20,6 @@ export const security = {
     setDeviceOAuthConfig: (config) => (deviceOAuthConfig = config),
     getUserManager: () => userManager,
     setUserManager: (data) => (userManager = data),
-    getWellKnowConfig: () => wellKnowConfig,
-    setWellKnowConfig: (config) => (wellKnowConfig = config),
+    getWellKnownConfig: () => wellKnownConfig,
+    setWellKnownConfig: (config) => (wellKnownConfig = config),
 }

src/common/services/stream-api.js

@@ -3,6 +3,7 @@ import { security } from './security'
 import { clientAppSettings } from './client-app-settings'
 import { errorCodes } from './fetch-api'
 import { hasDifferentOwner } from './api-utils'
+import isFunction from 'lodash/isFunction'
 
 export const streamApi = async (url, options = {}) => {
     const defaultOptions = {
@@ -89,7 +90,8 @@ export const streamApi = async (url, options = {}) => {
         .catch((error) => {
             console.error(error)
             if (errorCode === 401) {
-                unauthorizedCallback()
+                isFunction(unauthorizedCallback) && unauthorizedCallback()
+                return new Error(errorCodes.UNAUTHORIZED)
             }
 
             return { data: null }