Get help on Discord

Difficulty creating a Dashboard Widget in Sanity

1 replies
Last updated: Sep 7, 2020
Hi. I’m having difficulties creating my first Dashboard Widget using the process described in the Sanity documentation — https://www.sanity.io/docs/creating-your-own-widget I have been able to install all the reference widgets like dashboard-widget-cats and dashboard-widget-document-list with no problem or issues, but when I create my new widget using the cats one as baseline, I went through all the steps of renaming, but I still get the error of:
Not found: “cats2”
Make sure your 
sanity.json
 file mentions such a widget and that it’s an implementation of 
part:@sanity/dashboard/widget
.
My root 
sanity.json
has “cats2" noted in the “plugins” area.
My plugin 
sanity.json
(located in plugins/cats2/) has the following:
{
  "parts": [
    {
      "name": "part:@sanity/dashboard/widget/cats2",
      "implements": "part:@sanity/dashboard/widget",
      "path": "index.js"
    }
  ]
}
My 
dashboardConfig.js
has this cited for my widget:
{
   name: 'cats2'
},
I just can’t figure out if there is another place that “cats2” will need to be noted. Or any other place that I would need to allow for customs widgets? Any help would be super appreciated. Thanks!
AI Update

I can see you're working with Sanity Studio v2 (based on the sanity.json and parts system you're referencing). The issue you're experiencing is a common configuration problem when creating custom dashboard widgets in v2.

Based on your setup, the problem is likely in your dashboardConfig.js. When you reference a custom widget, you need to use the full part name, not just the short name.

In your dashboardConfig.js, change this:

{
  name: 'cats2'
}

To this:

{
  name: 'part:@sanity/dashboard/widget/cats2'
}

The widget configuration needs to reference the complete part name that you defined in your plugin's sanity.json file. The built-in widgets (like the document-list widget) have shorthand names that are pre-registered, but custom widgets need the full part path.

Your plugin structure looks correct otherwise:

  • ✅ Root sanity.json lists "cats2" in plugins array
  • ✅ Plugin sanity.json at plugins/cats2/sanity.json defines the part correctly
  • ✅ The part implements part:@sanity/dashboard/widget
  • ✅ Path points to index.js

Additional things to verify:

  1. Make sure your plugins/cats2/index.js file exists and exports a valid widget component
  2. Restart your development server after making these changes
  3. Check that your root sanity.json has the dashboard plugin installed:
{
  "plugins": [
    "@sanity/dashboard",
    "cats2"
  ]
}

Note about Studio versions: If you're starting a new project, be aware that Sanity Studio v3 (the current version) uses a completely different configuration system without sanity.json or the parts system. The dashboard plugin and custom widgets work differently in v3, using standard JavaScript/TypeScript modules and the new configuration format. According to the dashboard GitHub repository, v3 widgets are configured by importing widget functions directly and passing configuration as function arguments rather than using the parts system. If you have flexibility in your project, you might want to consider using Studio v3, which has a more straightforward plugin architecture.

Huzzah! I found the culprit. I didn’t realize that 
name
was also present within the 
index.js
file at the very bottom. In using the cat2 example, I had to change that to:

export default {
  name: 'cats2',
  component: Cats
}

Sanity – Build the way you think, not the way your CMS thinks

Sanity is the developer-first content operating system that gives you complete control. Schema-as-code, GROQ queries, and real-time APIs mean no more workarounds or waiting for deployments. Free to start, scale as you grow.

Get started for freeExplore the demo

Was this answer helpful?