fix: config issues (#1041)

Author: cazala

packages/@dcl/inspector/src/components/EntityInspector/SmartItemBasicView/SmartItemBasicView.tsx

@@ -1,7 +1,6 @@
 import React, { useCallback, useMemo } from 'react'
 import { BsFillLightningChargeFill as SmartItemIcon } from 'react-icons/bs'
 import { withSdk } from '../../../hoc/withSdk'
-import { useHasComponent } from '../../../hooks/sdk/useHasComponent'
 import { ConfigComponent } from '../../../lib/sdk/components'
 import { Container } from '../../Container'
 import { NftView } from './NftView'
@@ -17,7 +16,6 @@ import './SmartItemBasicView.css'
 
 const SmartItemBasicView = withSdk<Props>(({ sdk, entity }) => {
   const { Config } = sdk.components
-  const hasConfig = useHasComponent(entity, Config)
 
   const renderField = useCallback(
     (field: ConfigComponent['fields'][0], idx: number) => {
@@ -52,12 +50,12 @@ const SmartItemBasicView = withSdk<Props>(({ sdk, entity }) => {
     )
   }, [])
 
-  if (!hasConfig) return null
-
   const config = useMemo(() => {
-    return Config.get(entity)
+    return Config.getOrNull(entity)
   }, [entity])
 
+  if (!config) return null
+
   return (
     <Container
       label={config.componentName}

packages/@dcl/inspector/src/hooks/sdk/useHasComponent.ts

@@ -1,5 +1,5 @@
 import { Entity } from '@dcl/ecs'
-import { useState } from 'react'
+import { useEffect, useState } from 'react'
 
 import { Component } from '../../lib/sdk/components'
 import { useChange } from './useChange'
@@ -13,5 +13,9 @@ export const useHasComponent = (entity: Entity, component: Component) => {
     }
   })
 
+  useEffect(() => {
+    setHasComponent(component.has(entity))
+  }, [entity, component])
+
   return hasComponent
 }