@sanity/dashboard - npm Package Compare versions

Comparing version 0.140.10-canary.85 to 0.140.10

lib/components/DashboardGrid.js

@@ -20,3 +20,3 @@ "use strict";
   render() {
-    const children = this.props.children;
+    var children = this.props.children;
     return _react.default.createElement("div", {
@@ -23,0 +23,0 @@ className: _DashboardGrid.default.root

lib/components/DashboardLayout.js

@@ -20,2 +20,4 @@ "use strict";
 
+var _DashboardLayout = _interopRequireDefault(require("./DashboardLayout.css"));
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -34,15 +36,16 @@
 
-  const widgetConfigs = (0, _get2.default)(_config.default, 'widgets', []);
+  var widgetConfigs = (0, _get2.default)(_config.default, 'widgets', []);
   return _react.default.createElement(_DashboardGrid.default, null, widgetConfigs.map((widgetConfig, index) => {
-    const name = widgetConfig.name;
+    var name = widgetConfig.name;
 
-    const widgetDefinition = _widget.default.find(wid => wid.name === name);
+    var widgetDefinition = _widget.default.find(wid => wid.name === name);
 
-    const widgetOptions = _objectSpread({}, widgetDefinition.options || {}, widgetConfig.options || {});
+    var key = `${name}_${index}`;
 
-    const widgetLayout = _objectSpread({}, widgetDefinition.layout || {}, widgetConfig.layout || {});
+    if (widgetDefinition) {
+      var widgetOptions = _objectSpread({}, widgetDefinition.options || {}, widgetConfig.options || {});
 
-    if (widgetDefinition) {
-      const Widget = widgetDefinition.component;
-      const key = `${name}_${index}`;
+      var widgetLayout = _objectSpread({}, widgetDefinition.layout || {}, widgetConfig.layout || {});
+
+      var Widget = widgetDefinition.component;
       return _react.default.createElement(_WidgetWrapper.default, _extends({
@@ -53,4 +56,7 @@ key: key
 
-    console.error(`Unable to locate widget with name ${name} among ${_widget.default.map(wid => wid.name).join(', ')}`);
-    return null;
+    return _react.default.createElement(_WidgetWrapper.default, {
+      key: key
+    }, _react.default.createElement("div", {
+      className: _DashboardLayout.default.missingWidget
+    }, _react.default.createElement("h4", null, `Could not find the Dashboard Widget named "${name}" `), _react.default.createElement("p", null, "Make sure your ", _react.default.createElement("code", null, "sanity.json"), " file mentions such a widget and that it's an implementaion of ", _react.default.createElement("code", null, "part:@sanity/dashboard/widget"))));
   }));
@@ -57,0 +63,0 @@ }

lib/components/story.js

@@ -21,4 +21,4 @@ "use strict";
 
-const chance = new _chance.default();
-const para = chance.paragraph({
+var chance = new _chance.default();
+var para = chance.paragraph({
   sentences: 2
@@ -28,4 +28,4 @@ });
 class StoryWidget extends _react.default.Component {
-  constructor(...args) {
-    super(...args);
+  constructor() {
+    super(...arguments);
 
@@ -68,3 +68,3 @@ _defineProperty(this, "state", {
 (0, _storybook.storiesOf)('Dashboard').addDecorator(_knobs.withKnobs).add('Grid', () => {
-  const widgets = (0, _range2.default)((0, _knobs.number)('widgets', 7));
+  var widgets = (0, _range2.default)((0, _knobs.number)('widgets', 7));
   return _react.default.createElement(_DashboardGrid.default, null, widgets.map(widget => _react.default.createElement(StoryWidget, {
@@ -71,0 +71,0 @@ key: widget,

lib/components/WidgetWrapper.js

@@ -20,7 +20,7 @@ "use strict";
   render() {
-    const _this$props = this.props,
-          width = _this$props.width,
-          height = _this$props.height,
-          style = _this$props.style,
-          children = _this$props.children;
+    var _this$props = this.props,
+        width = _this$props.width,
+        height = _this$props.height,
+        style = _this$props.style,
+        children = _this$props.children;
     return _react.default.createElement("div", {
@@ -27,0 +27,0 @@ className: _WidgetWrapper.default.root,

lib/DashboardTool.js

@@ -14,3 +14,3 @@ "use strict";
 
-const Icon = () => _react.default.createElement("svg", {
+var Icon = () => _react.default.createElement("svg", {
   width: "25",
@@ -17,0 +17,0 @@ height: "25",

lib/widgets/projectInfo/ProjectInfo.js

@@ -24,5 +24,5 @@ "use strict";
 
-const _sanityClient$config = _client.default.config(),
-      projectId = _sanityClient$config.projectId,
-      dataset = _sanityClient$config.dataset;
+var _sanityClient$config = _client.default.config(),
+    projectId = _sanityClient$config.projectId,
+    dataset = _sanityClient$config.dataset;
 
@@ -46,4 +46,4 @@ function isUrl(url) {
 class ProjectInfo extends _react.default.Component {
-  constructor(...args) {
-    super(...args);
+  constructor() {
+    super(...arguments);
 
@@ -59,3 +59,3 @@ _defineProperty(this, "state", {
     _client.default.projects.getById(projectId).then(result => {
-      const studioHost = result.studioHost;
+      var studioHost = result.studioHost;
       this.setState({
@@ -98,7 +98,7 @@ studioHost: studioHost ? `https://${studioHost}.sanity.studio` : null
   assembleTableRows() {
-    const _this$state = this.state,
-          graphqlApi = _this$state.graphqlApi,
-          studioHost = _this$state.studioHost;
-    const propsData = this.props.data;
-    let result = [{
+    var _this$state = this.state,
+        graphqlApi = _this$state.graphqlApi,
+        studioHost = _this$state.studioHost;
+    var propsData = this.props.data;
+    var result = [{
       title: 'Sanity project',
@@ -114,3 +114,3 @@ rows: [{
 
-    const apps = [studioHost ? {
+    var apps = [studioHost ? {
       title: 'Studio',
@@ -139,3 +139,3 @@ value: studioHost
 
-    const otherStuff = {};
+    var otherStuff = {};
     propsData.forEach(item => {
@@ -142,0 +142,0 @@ if (item.category !== 'apps' && item.category !== 'apis') {

lib/widgets/projectUsers/ProjectUsers.js

@@ -33,4 +33,4 @@ "use strict";
 class ProjectUsers extends _react.default.Component {
-  constructor(...args) {
-    super(...args);
+  constructor() {
+    super(...arguments);
 
@@ -44,5 +44,5 @@ _defineProperty(this, "state", {
     _defineProperty(this, "sortUsersByRobotStatus", (userA, userB) => {
-      const members = this.state.project.members;
-      const membershipA = members.find(member => member.id === userA.id);
-      const membershipB = members.find(member => member.id === userB.id);
+      var members = this.state.project.members;
+      var membershipA = members.find(member => member.id === userA.id);
+      var membershipB = members.find(member => member.id === userB.id);
 
@@ -70,4 +70,4 @@ if (membershipA.isRobot) {
   fetchData() {
-    const _sanityClient$config = _client.default.config(),
-          projectId = _sanityClient$config.projectId;
+    var _sanityClient$config = _client.default.config(),
+        projectId = _sanityClient$config.projectId;
 
@@ -87,7 +87,7 @@ _client.default.projects.getById(projectId).then(project => {
   render() {
-    const _this$state = this.state,
-          error = _this$state.error,
-          project = _this$state.project,
-          users = _this$state.users;
-    const isLoading = !users || !project;
+    var _this$state = this.state,
+        error = _this$state.error,
+        project = _this$state.project,
+        users = _this$state.users;
+    var isLoading = !users || !project;
 
@@ -116,4 +116,4 @@ if (error) {
     }, users.sort(this.sortUsersByRobotStatus).map(user => {
-      const membership = project.members.find(member => member.id === user.id);
-      const media = membership.isRobot ? _react.default.createElement(_tools.default, {
+      var membership = project.members.find(member => member.id === user.id);
+      var media = membership.isRobot ? _react.default.createElement(_tools.default, {
         className: _ProjectUsers.default.profileImage
@@ -120,0 +120,0 @@ }) : _react.default.createElement("div", {

lib/widgets/sanityTutorials/dataAdapter.js

@@ -15,3 +15,3 @@ "use strict";
 // We're connecting to
-const client = (0, _client.default)({
+var client = (0, _client.default)({
   projectId: '3do82whm',
@@ -21,3 +21,3 @@ dataset: 'production',
 });
-const query = `
+var query = `
   *[_id == 'dashboardFeed-v1'] {
@@ -24,0 +24,0 @@ items[]-> {

lib/widgets/sanityTutorials/SanityTutorials.js

@@ -24,4 +24,4 @@ "use strict";
 
-const urlBuilder = _dataAdapter.default.urlBuilder,
-      getFeed = _dataAdapter.default.getFeed;
+var urlBuilder = _dataAdapter.default.urlBuilder,
+    getFeed = _dataAdapter.default.getFeed;
 
@@ -33,4 +33,4 @@ function createUrl(slug) {
 class SanityTutorials extends _react.default.Component {
-  constructor(...args) {
-    super(...args);
+  constructor() {
+    super(...arguments);
 
@@ -62,3 +62,3 @@ _defineProperty(this, "state", {
   render() {
-    const feedItems = this.state.feedItems;
+    var feedItems = this.state.feedItems;
     return _react.default.createElement(_react.default.Fragment, null, _react.default.createElement("header", {
@@ -75,4 +75,4 @@ className: _SanityTutorials.default.header
 
-      const presenter = feedItem.presenter || (0, _get2.default)(feedItem, 'guideOrTutorial.presenter') || {};
-      const date = (0, _get2.default)(feedItem, 'guideOrTutorial._createdAt');
+      var presenter = feedItem.presenter || (0, _get2.default)(feedItem, 'guideOrTutorial.presenter') || {};
+      var date = (0, _get2.default)(feedItem, 'guideOrTutorial._createdAt');
       return _react.default.createElement("li", {
@@ -79,0 +79,0 @@ key: feedItem._id

lib/widgets/sanityTutorials/Tutorial.js

@@ -20,8 +20,8 @@ "use strict";
   render() {
-    const _this$props = this.props,
-          title = _this$props.title,
-          posterURL = _this$props.posterURL,
-          href = _this$props.href,
-          presenterName = _this$props.presenterName,
-          presenterSubtitle = _this$props.presenterSubtitle;
+    var _this$props = this.props,
+        title = _this$props.title,
+        posterURL = _this$props.posterURL,
+        href = _this$props.href,
+        presenterName = _this$props.presenterName,
+        presenterSubtitle = _this$props.presenterSubtitle;
     return _react.default.createElement("a", {
@@ -28,0 +28,0 @@ className: _Tutorial.default.root,

package.json

 {
   "name": "@sanity/dashboard",
-  "version": "0.140.10-canary.85+f7563c66e",
+  "version": "0.140.10",
   "description": "Tool for rendering dashboard widgets",
@@ -28,3 +28,3 @@ "main": "src/DashboardTool.js",
     "@sanity/base": "0.140.8",
-    "@sanity/check": "0.140.10-canary.85+f7563c66e",
+    "@sanity/check": "0.140.3",
     "history": "^4.6.3",
@@ -50,3 +50,3 @@ "jest": "^23.6.0",
   "homepage": "https://www.sanity.io/",
-  "gitHead": "f7563c66e75cd82d06c62210a677e96f614ed69a"
+  "gitHead": "171529d7d20b312b159862fe65eea26aef8e56b1"
 }

README.md

 # Dashboard
 
-Dashboard is a Tool which picks up and renders any widgets implementing `part:@sanity/dashboard/widget`. Install this plugin in your Content Studio to display stats about your project, number of edits last 24 hours, etc.
+Dashboard is a Sanity Content Studio Tool which picks up and renders any widgets which implement `part:@sanity/dashboard/widget`. Install this plugin in your Studio to display stats about your project, recently edited documents, etc.
 
@@ -31,3 +31,3 @@ The Dashboard tool has been designed to be as generic as possible, making few assumptions about its widgets. The Dashboard itself is mostly concerned about the layout of the configured widgets.
 
-```javascript
+```js
 export default {
@@ -46,6 +46,10 @@ widgets: [{name: 'sanity-tutorials'}, {name: 'project-info'}, {name: 'project-users'}]
 
-Install a Dashboard widget as you would any other [Sanity Studio plugin](https://www.sanity.io/docs/plugins).
+Install a Dashboard widget as you would any other [Sanity Studio plugin](https://www.sanity.io/docs/extending/plugins).
 
-E.g. if you want to install the cats example widget mentioned below, just type `sanity install dashboard-widget-cats` (this works because it's published on npm under the name `sanity-plugin-dashboard-widget-cats`) and update your `src/dashboardConfig.js` file by adding `{name: 'cats'}` to the `widgets` array. Poof, you've got 🐱 in your Studio.
+E.g. if you want to install the cats example widget mentioned below, proceed as follows:
 
+1. Type `sanity install dashboard-widget-cats` in your terminal (this works because it's published on npm under the name `sanity-plugin-dashboard-widget-cats`)
+2. Update your `src/dashboardConfig.js` file by adding `{name: 'cats'}` to the `widgets` array
+3. You've got 🐱 in your Studio
+
 Some widgets allow options to change aspects of their behavior. If you install the document-list widget mentioned below, it can be configured with:
@@ -57,2 +61,16 @@
 
+Thus, if you want your dashboard to display both newest documents across all document types and another widget showing the last edited books, your dashboardConfig would look like this:
+
+```js
+export default {
+  widgets: [
+    {name: 'document-list', options: {title: 'New', order: '_createdAt desc'}},
+    {
+      name: 'document-list',
+      options: {title: 'Last edited books', order: '_updatedAt desc', types: ['book']}
+    }
+  ]
+}
+```
+
 ## How to create a widget
@@ -62,2 +80,30 @@
 
+When writing your widget components, it's recommended to use the styles defined in `./src/widgets.css` for your basic building blocks:
+
+```
+@import 'part:@sanity/base/theme/variables-style';
+
+.container {
+  composes: container from 'part:@sanity/dashboard/widget-styles';
+}
+
+.containerWithPadding {
+  composes: containerWithPadding from 'part:@sanity/dashboard/widget-styles';
+}
+
+.header {
+  composes: header from "part:@sanity/dashboard/widget-styles";
+}
+
+.title {
+  composes: title from 'part:@sanity/dashboard/widget-styles';
+}
+
+.buttonContainer {
+  composes: bottomButtonContainer from 'part:@sanity/dashboard/widget-styles';
+}
+```
+
+Your widget root element should aways be wrapped with the `container` style from `part:@sanity/dashboard/widget-styles`
+
 ---

src/components/DashboardLayout.js

@@ -8,2 +8,3 @@ /* eslint-disable class-methods-use-this, no-console */
 import WidgetWrapper from './WidgetWrapper'
+import styles from './DashboardLayout.css'
 
@@ -21,8 +22,11 @@ function DashboardLayout(props) {
         const widgetDefinition = widgetDefinitions.find(wid => wid.name === name)
-        const widgetOptions = {...(widgetDefinition.options || {}), ...(widgetConfig.options || {})}
-        const widgetLayout = {...(widgetDefinition.layout || {}), ...(widgetConfig.layout || {})}
+        const key = `${name}_${index}`
 
         if (widgetDefinition) {
+          const widgetOptions = {
+            ...(widgetDefinition.options || {}),
+            ...(widgetConfig.options || {})
+          }
+          const widgetLayout = {...(widgetDefinition.layout || {}), ...(widgetConfig.layout || {})}
           const Widget = widgetDefinition.component
-          const key = `${name}_${index}`
           return (
@@ -35,8 +39,13 @@ <WidgetWrapper key={key} {...widgetLayout}>
 
-        console.error(
-          `Unable to locate widget with name ${name} among ${widgetDefinitions
-            .map(wid => wid.name)
-            .join(', ')}`
+        return (
+          <WidgetWrapper key={key}>
+            <div className={styles.missingWidget}>
+              <h4>{`Could not find the Dashboard Widget named "${name}" `}</h4>
+              <p>
+                Make sure your <code>sanity.json</code> file mentions such a widget and that it's an
+                implementaion of <code>part:@sanity/dashboard/widget</code>
+              </p>
+            </div>
+          </WidgetWrapper>
         )
-        return null
       })}
@@ -43,0 +52,0 @@ </DashboardGrid>

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

New author

Supply chain risk

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Native code

Supply chain risk

Contains native code (e.g., compiled binaries or shared libraries). Including native code can obscure malicious behavior.

Found 1 instance in 1 package

Manifest confusion

Supply chain risk

This package has inconsistent metadata. This could be malicious or caused by an error when publishing the package.

Found 1 instance in 1 package

Improved metrics

Lines of code

1899

increased by1.28%

Number of lines in readme file

106

increased by76.67%

Number of medium supply chain risk alerts

1

decreased by-50%

Worsened metrics

Total package byte prevSize

67370

decreased by-15.26%

No dependency changes