Skip to content
See Sanity in action 👀 Join us for a live product demo + Q&A →
Get help on SlackWatch Sanity demo

React Development - Warning: Failed Prop SanityLogo

9 replies
Last updated: Jul 21, 2021
When using a custom logo for the Sanity studio since the last update I am getting the following error:
`react.development.js:220 Warning: Failed prop type: Invalid prop 
SanityLogo
of type 
object
supplied to 
LoginWrapper
, expected 
function
.`
My code:


import React from 'react'
import styled, { css } from 'styled-components'

const Logo = ({ projectName }) => {
   return (
      <Icon isLogin={projectName}>
         <!-- SVG LOGO INLINE -->  
      </Icon>
   )
}

const Icon = styled.div`
   display: block;
   width: auto;
   height: 2em;
   max-width: 100%;
   margin: -0.25em auto;
   color: #fff;

   ${(props) =>
      props.isLogin &&
      css`
         display: block;
         margin: 0 auto;
         height: 4em;
         color: black;
      `}

   svg {
      display: block;
      margin: 0 auto;
      height: 100%;
      width: auto;
      fill: currentColor;
   }
`

export default Logo

Jul 21, 2021, 11:24 AM
Pretty sure I had the same in the past, I just re-started the Studio.
Jul 21, 2021, 12:31 PM
Restarted multiple times but the error keeps popping up very weird
Jul 21, 2021, 12:32 PM
Does the problem persist if you remove/reinstall 
node_modules
?
Jul 21, 2021, 5:16 PM
user M
tried multiple times keep getting same error
Jul 21, 2021, 5:27 PM
Didn’t have it before the Sanity update maybe it just the update which is giving this error
Jul 21, 2021, 5:35 PM
In 2.13.0, there was a migration from the parts system to Sanity UI in LoginWrapper.js. I think that’s the source of the error.
Jul 21, 2021, 5:36 PM
Oke cool
Jul 21, 2021, 5:37 PM
If you go to 
node_modules/@sanity/default-login/lib/LoginWrapper.js
and change 
SanityLogo: _propTypes.default.func,
to 
SanityLogo: _propTypes.default.object,
then restart your studio, you can see if the error disappears even if you leave your custom logo code intact.
Jul 21, 2021, 5:41 PM
If you go to 
node_modules/@sanity/default-login/lib/LoginWrapper.js
and change 
SanityLogo: _propTypes.default.func,
to 
SanityLogo: _propTypes.default.object,
, you can see if the error disappears even if you leave your custom logo code intact.
Jul 21, 2021, 5:41 PM

Sanity.io – build remarkable experiences at scale

Sanity is a customizable solution that treats content as data to power your digital business. Free to get started, and pay-as-you-go on all plans.

Get startedWatch demo

Categorized in