Issue with loading documents in local Sanity Studio due to incorrect image field setup
10 replies
Last updated: Jan 11, 2022
V
Hi! In my Sanity Studio (local, not deployed) my documents won’t load. I am using React on the frontend to dynamically create a new User and Pins etc but it’s just stuck on “Loading documents…” for a long time. What can be the issue?
Jan 6, 2022, 2:36 PM
Are you performing any fetches or calls to external API's that may not be resolving in these documents?
Jan 6, 2022, 6:16 PM
V
Np. I don’t think so that there is any other third-party API call. I am just connecting Sanity to React with a client file:
And then using it to save a new user via Google login:
I am able to login but that user is not showing in Sanity Studio it’s stuck in login and here’s what it says on Network tab:
export const client = sanityClient({
projectId: process.env.REACT_APP_SANITY_PROJECT_ID,
dataset: 'production',
apiVersion: '2021-11-16',
useCdn: true,
token: process.env.REACT_APP_SANITY_TOKEN,
});const responseGoogle = (response) => {
localStorage.setItem('user', JSON.stringify(response.profileObj));
const { name, googleId, imageUrl } = response.profileObj;
const doc = {
_id: googleId,
_type: 'user',
userName: name,
image: imageUrl,
};
client.createIfNotExists(doc).then(() => {
// Navigate to homepage
});
};Jan 7, 2022, 2:12 PM
V
Np. I don’t think so that there is any other third-party API call. I am just connecting Sanity to React with a client file:
And then using it to save a new user via Google login:
export const client = sanityClient({
projectId: process.env.REACT_APP_SANITY_PROJECT_ID,
dataset: 'production',
apiVersion: '2021-11-16',
useCdn: true,
token: process.env.REACT_APP_SANITY_TOKEN,
});const responseGoogle = (response) => {
localStorage.setItem('user', JSON.stringify(response.profileObj));
const { name, googleId, imageUrl } = response.profileObj;
const doc = {
_id: googleId,
_type: 'user',
userName: name,
image: imageUrl,
};
client.createIfNotExists(doc).then(() => {
// Navigate to homepage
});
};Jan 7, 2022, 2:12 PM
V
After some minutes I get this and then when I click clicking “Retry” it does the same thing. You can also see there’s an error on console:
Jan 7, 2022, 2:26 PM
V
After some minutes I get this and then when I click clicking “Retry” it does the same thing. You can also see there’s an error on console:
Jan 7, 2022, 2:26 PM
I think the issue is that your
imageproperty is not shaped correctly. You need to first upload the asset to Sanity, then use an object like this to work in the schema:
image: {
_type: 'image',
asset: {
_type: 'reference',
_ref: '<id-of-the-uploaded-asset>'
}
}Jan 7, 2022, 6:37 PM
V
It’s strange because when I deploy Sanity Studio and open it on my phone it does display the content.
Also, when I fetch the data using the query under the Vision tab it does show!
Also, when I fetch the data using the query under the Vision tab it does show!
Jan 10, 2022, 2:46 PM
V
It’s strange because when I deploy Sanity Studio and open it on my phone it does display the content.
Also, when I fetch the data using the query under the Vision tab it does show!
Also, when I fetch the data using the query under the Vision tab it does show!
Jan 10, 2022, 2:46 PM
Yes, but it's not set up correctly to work with an image schema in a document. You've set a field called
imageto a url, but your Studio won't be able to work with that.
Jan 10, 2022, 5:15 PM
V
Hey thanks! I just rewrote the image field in my Sanity backend code and now it shows the data. You can mark it solved. 😊
Jan 11, 2022, 2:25 PM
Sanity– build remarkable experiences at scale
Sanity is a modern headless CMS that treats content as data to power your digital business. Free to get started, and pay-as-you-go on all plans.