@sanity/dashboard 2.30.2-shopify.2 → 3.0.0-studio-v3.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (49) hide show
  1. package/README.md +123 -44
  2. package/lib/cjs/index.js +1005 -0
  3. package/lib/cjs/index.js.map +1 -0
  4. package/lib/esm/index.js +980 -0
  5. package/lib/esm/index.js.map +1 -0
  6. package/lib/types/index.d.ts +42 -0
  7. package/lib/types/index.d.ts.map +1 -0
  8. package/package.json +63 -16
  9. package/sanity.json +2 -53
  10. package/src/components/DashboardLayout.tsx +10 -0
  11. package/src/components/DashboardWidgetContainer.tsx +69 -0
  12. package/src/components/NotFoundWidget.tsx +30 -0
  13. package/src/components/WidgetGroup.tsx +108 -0
  14. package/src/containers/Dashboard.tsx +19 -0
  15. package/src/containers/DashboardContext.tsx +8 -0
  16. package/src/containers/WidgetContainer.tsx +21 -0
  17. package/src/index.tsx +62 -0
  18. package/src/types.ts +21 -0
  19. package/src/versionedClient.ts +7 -0
  20. package/src/widgets/projectInfo/ProjectInfo.tsx +233 -0
  21. package/src/widgets/projectInfo/index.ts +10 -0
  22. package/src/widgets/projectUsers/ProjectUsers.tsx +170 -0
  23. package/src/widgets/projectUsers/index.ts +10 -0
  24. package/src/widgets/sanityTutorials/SanityTutorials.tsx +77 -0
  25. package/src/widgets/sanityTutorials/Tutorial.tsx +111 -0
  26. package/src/widgets/sanityTutorials/dataAdapter.ts +48 -0
  27. package/src/widgets/sanityTutorials/index.ts +10 -0
  28. package/v2-incompatible.js +11 -0
  29. package/.babelrc +0 -4
  30. package/lib/DashboardTool.js +0 -59
  31. package/lib/components/DashboardLayout.js +0 -35
  32. package/lib/components/NotFoundWidget.js +0 -51
  33. package/lib/components/WidgetGroup.js +0 -67
  34. package/lib/components/dashboardWidget.js +0 -51
  35. package/lib/containers/Dashboard.js +0 -32
  36. package/lib/containers/WidgetContainer.js +0 -56
  37. package/lib/dashboardConfig.js +0 -16
  38. package/lib/legacyParts.js +0 -55
  39. package/lib/versionedClient.js +0 -20
  40. package/lib/widget.css +0 -62
  41. package/lib/widgets/projectInfo/ProjectInfo.js +0 -265
  42. package/lib/widgets/projectInfo/index.js +0 -19
  43. package/lib/widgets/projectUsers/ProjectUsers.js +0 -188
  44. package/lib/widgets/projectUsers/index.js +0 -16
  45. package/lib/widgets/sanityTutorials/SanityTutorials.js +0 -115
  46. package/lib/widgets/sanityTutorials/Tutorial.js +0 -111
  47. package/lib/widgets/sanityTutorials/dataAdapter.js +0 -28
  48. package/lib/widgets/sanityTutorials/index.js +0 -19
  49. package/tsconfig.json +0 -17
package/lib/widget.css DELETED
@@ -1,62 +0,0 @@
1
- @import 'part:@sanity/base/theme/variables-style';
2
-
3
- .container {
4
- display: flex;
5
- flex-direction: column;
6
- justify-content: stretch;
7
- height: 100%;
8
- border-radius: var(--border-radius-base);
9
- background-color: var(--component-bg);
10
- box-sizing: border-box;
11
- position: relative;
12
- }
13
-
14
- .containerWithPadding {
15
- composes: container;
16
- padding: var(--medium-padding);
17
- }
18
-
19
- .header {
20
- padding: var(--small-padding) 0;
21
- }
22
-
23
- .title {
24
- composes: heading4 from 'part:@sanity/base/theme/typography/headings-style';
25
- margin: var(--small-padding) var(--medium-padding);
26
- }
27
-
28
- .content {
29
- display: block;
30
- margin: 0;
31
- padding: 0;
32
- min-height: 21.5em;
33
-
34
- @media (--screen-medium) {
35
- height: stretch;
36
- overflow-y: auto;
37
- }
38
- }
39
-
40
- .footer {
41
- display: flex;
42
- text-align: center;
43
- font-weight: 600;
44
- min-height: 4em;
45
- height: 4em;
46
- margin-top: auto;
47
- overflow: hidden;
48
-
49
- @nest & > * {
50
- width: 100%;
51
- }
52
- }
53
-
54
- /* TODO: remove after changing document list plugin */
55
- .listContainer {
56
- composes: content;
57
- }
58
-
59
- /* TODO: remove after changing document list plugin */
60
- .bottomButtonContainer {
61
- composes: footer;
62
- }
@@ -1,265 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.default = void 0;
7
-
8
- var _isPlainObject2 = _interopRequireDefault(require("lodash/isPlainObject"));
9
-
10
- var _react = _interopRequireDefault(require("react"));
11
-
12
- var _propTypes = _interopRequireDefault(require("prop-types"));
13
-
14
- var _ui = require("@sanity/ui");
15
-
16
- var _versionedClient = require("../../versionedClient");
17
-
18
- var _DashboardTool = require("../../DashboardTool");
19
-
20
- var _legacyParts = require("../../legacyParts");
21
-
22
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
23
-
24
- function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
25
-
26
- var _versionedClient$conf = _versionedClient.versionedClient.config(),
27
- projectId = _versionedClient$conf.projectId,
28
- dataset = _versionedClient$conf.dataset;
29
-
30
- function isUrl(url) {
31
- return /^https?:\/\//.test("".concat(url));
32
- }
33
-
34
- function getGraphQlUrl() {
35
- return "https://".concat(projectId, ".api.sanity.io/v1/graphql/").concat(dataset, "/default");
36
- }
37
-
38
- function getGroqUrl() {
39
- return "https://".concat(projectId, ".api.sanity.io/v1/groq/").concat(dataset);
40
- }
41
-
42
- function getManageUrl() {
43
- return "https://manage.sanity.io/projects/".concat(projectId);
44
- }
45
-
46
- class ProjectInfo extends _react.default.PureComponent {
47
- constructor() {
48
- super(...arguments);
49
-
50
- _defineProperty(this, "state", {
51
- studioHost: null,
52
- graphqlApi: null
53
- });
54
- }
55
-
56
- componentDidMount() {
57
- // fetch project data
58
- this.subscriptions = [];
59
- this.subscriptions.push(_versionedClient.versionedClient.observable.request({
60
- uri: "/projects/".concat(projectId)
61
- }).subscribe({
62
- next: result => {
63
- var studioHost = result.studioHost;
64
- this.setState({
65
- studioHost: studioHost ? "https://".concat(studioHost, ".sanity.studio") : null
66
- });
67
- },
68
- error: _error => {
69
- console.log('Error while looking for studioHost', _error);
70
- this.setState({
71
- studioHost: {
72
- error: 'Something went wrong while looking up studioHost. See console.'
73
- }
74
- });
75
- }
76
- })); // ping assumed graphql endpoint
77
-
78
- this.subscriptions.push(_versionedClient.versionedClient.observable.request({
79
- method: 'HEAD',
80
- uri: "/graphql/".concat(dataset, "/default")
81
- }).subscribe({
82
- next: () => this.setState({
83
- graphqlApi: getGraphQlUrl()
84
- }),
85
- error: _error2 => {
86
- if (_error2.statusCode === 404) {
87
- this.setState({
88
- graphqlApi: null
89
- });
90
- } else {
91
- console.log('Error while looking for graphqlApi', _error2);
92
- this.setState({
93
- graphqlApi: {
94
- error: 'Something went wrong while looking up graphqlApi. See console.'
95
- }
96
- });
97
- }
98
- }
99
- }));
100
- }
101
-
102
- componentWillUnmount() {
103
- this.subscriptions.forEach(sub => sub.unsubscribe());
104
- }
105
-
106
- assembleTableRows() {
107
- var _this$state = this.state,
108
- graphqlApi = _this$state.graphqlApi,
109
- studioHost = _this$state.studioHost;
110
- var propsData = this.props.data;
111
- var result = [{
112
- title: 'Sanity project',
113
- rows: [{
114
- title: 'Project ID',
115
- value: projectId
116
- }, {
117
- title: 'Dataset',
118
- value: dataset
119
- }]
120
- }]; // Handle any apps
121
-
122
- var apps = [studioHost ? {
123
- title: 'Studio',
124
- value: studioHost
125
- } : null].concat(propsData.filter(item => item.category === 'apps')).filter(Boolean);
126
-
127
- if (apps.length > 0) {
128
- result = result.concat([{
129
- title: 'Apps',
130
- rows: apps
131
- }]);
132
- } // Handle APIs
133
-
134
-
135
- result = result.concat([{
136
- title: 'APIs',
137
- rows: [{
138
- title: 'GROQ',
139
- value: getGroqUrl()
140
- }, {
141
- title: 'GraphQL',
142
- value: graphqlApi || 'Not deployed'
143
- }]
144
- }], propsData.filter(item => item.category === 'apis')); // Handle whatever else there might be
145
-
146
- var otherStuff = {};
147
- propsData.forEach(item => {
148
- if (item.category !== 'apps' && item.category !== 'apis') {
149
- if (!otherStuff[item.category]) {
150
- otherStuff[item.category] = [];
151
- }
152
-
153
- otherStuff[item.category].push(item);
154
- }
155
- });
156
- Object.keys(otherStuff).forEach(category => {
157
- result.push({
158
- title: category,
159
- rows: otherStuff[category]
160
- });
161
- });
162
- return result;
163
- }
164
-
165
- render() {
166
- var _this$props$__experim;
167
-
168
- return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, this.props.__experimental_before && this.props.__experimental_before.map((widgetConfig, idx) => /*#__PURE__*/_react.default.createElement(_legacyParts.WidgetContainer, {
169
- key: String(idx),
170
- config: widgetConfig
171
- })), /*#__PURE__*/_react.default.createElement(_ui.Box, {
172
- height: "fill",
173
- marginTop: ((_this$props$__experim = this.props.__experimental_before) === null || _this$props$__experim === void 0 ? void 0 : _this$props$__experim.length) > 0 ? 4 : 0
174
- }, /*#__PURE__*/_react.default.createElement(_DashboardTool.DashboardWidget, {
175
- footer: /*#__PURE__*/_react.default.createElement(_ui.Button, {
176
- style: {
177
- width: '100%'
178
- },
179
- paddingX: 2,
180
- paddingY: 4,
181
- mode: "bleed",
182
- tone: "primary",
183
- text: "Manage project",
184
- as: "a",
185
- href: getManageUrl()
186
- })
187
- }, /*#__PURE__*/_react.default.createElement(_ui.Card, {
188
- paddingY: 4,
189
- radius: 2,
190
- role: "table",
191
- "aria-label": "Project info",
192
- "aria-describedby": "project_info_table"
193
- }, /*#__PURE__*/_react.default.createElement(_ui.Stack, {
194
- space: 4
195
- }, /*#__PURE__*/_react.default.createElement(_ui.Box, {
196
- paddingX: 3,
197
- as: "header"
198
- }, /*#__PURE__*/_react.default.createElement(_ui.Heading, {
199
- size: 1,
200
- as: "h2",
201
- id: "project_info_table"
202
- }, "Project info")), this.assembleTableRows().map(item => {
203
- if (!item || !item.rows) {
204
- return null;
205
- }
206
-
207
- return /*#__PURE__*/_react.default.createElement(_ui.Stack, {
208
- key: item.title,
209
- space: 3
210
- }, /*#__PURE__*/_react.default.createElement(_ui.Card, {
211
- borderBottom: true,
212
- padding: 3
213
- }, /*#__PURE__*/_react.default.createElement(_ui.Label, {
214
- size: 0,
215
- muted: true,
216
- role: "columnheader"
217
- }, item.title)), /*#__PURE__*/_react.default.createElement(_ui.Stack, {
218
- space: 4,
219
- paddingX: 3,
220
- role: "rowgroup"
221
- }, item.rows.map(row => {
222
- return /*#__PURE__*/_react.default.createElement(_ui.Grid, {
223
- key: row.title,
224
- columns: 2,
225
- role: "row"
226
- }, /*#__PURE__*/_react.default.createElement(_ui.Text, {
227
- weight: "medium",
228
- role: "rowheader"
229
- }, row.title), (0, _isPlainObject2.default)(row.value) && /*#__PURE__*/_react.default.createElement(_ui.Text, {
230
- size: 1
231
- }, row.value.error), !(0, _isPlainObject2.default)(row.value) && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, isUrl(row.value) ? /*#__PURE__*/_react.default.createElement(_ui.Text, {
232
- size: 1,
233
- role: "cell",
234
- style: {
235
- wordBreak: 'break-word'
236
- }
237
- }, /*#__PURE__*/_react.default.createElement("a", {
238
- href: row.value
239
- }, row.value)) : /*#__PURE__*/_react.default.createElement(_ui.Code, {
240
- size: 1,
241
- role: "cell",
242
- style: {
243
- wordBreak: 'break-word'
244
- }
245
- }, row.value)));
246
- })));
247
- }))))));
248
- }
249
-
250
- }
251
-
252
- _defineProperty(ProjectInfo, "propTypes", {
253
- // eslint-disable-next-line camelcase
254
- __experimental_before: _propTypes.default.array,
255
- data: _propTypes.default.array
256
- });
257
-
258
- _defineProperty(ProjectInfo, "defaultProps", {
259
- // eslint-disable-next-line camelcase
260
- __experimental_before: [],
261
- data: []
262
- });
263
-
264
- var _default = ProjectInfo;
265
- exports.default = _default;
@@ -1,19 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.default = void 0;
7
-
8
- var _ProjectInfo = _interopRequireDefault(require("./ProjectInfo"));
9
-
10
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
11
-
12
- var _default = {
13
- name: 'project-info',
14
- component: _ProjectInfo.default,
15
- layout: {
16
- width: 'medium'
17
- }
18
- };
19
- exports.default = _default;
@@ -1,188 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.default = void 0;
7
-
8
- var _react = _interopRequireDefault(require("react"));
9
-
10
- var _operators = require("rxjs/operators");
11
-
12
- var _ui = require("@sanity/ui");
13
-
14
- var _icons = require("@sanity/icons");
15
-
16
- var _styledComponents = _interopRequireDefault(require("styled-components"));
17
-
18
- var _components = require("@sanity/base/components");
19
-
20
- var _versionedClient = require("../../versionedClient");
21
-
22
- var _DashboardTool = require("../../DashboardTool");
23
-
24
- var _legacyParts = require("../../legacyParts");
25
-
26
- var _templateObject;
27
-
28
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
29
-
30
- function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
31
-
32
- function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
33
-
34
- var AvatarWrapper = (0, _styledComponents.default)(_ui.Card)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n box-sizing: border-box;\n border-radius: 50%;\n border-color: transparent;\n overflow: hidden;\n width: 100%;\n height: 100%;\n\n & > img {\n width: 100%;\n height: auto;\n }\n"])));
35
-
36
- function getInviteUrl(projectId) {
37
- return "https://manage.sanity.io/projects/".concat(projectId, "/team/invite");
38
- }
39
-
40
- function sortUsersByRobotStatus(userA, userB, project) {
41
- var members = project.members;
42
- var membershipA = members.find(member => member.id === userA.id);
43
- var membershipB = members.find(member => member.id === userB.id);
44
-
45
- if (membershipA.isRobot) {
46
- return 1;
47
- }
48
-
49
- if (membershipB.isRobot) {
50
- return -1;
51
- }
52
-
53
- return 0;
54
- }
55
-
56
- class ProjectUsers extends _react.default.PureComponent {
57
- constructor() {
58
- super(...arguments);
59
-
60
- _defineProperty(this, "state", {
61
- project: null,
62
- users: null,
63
- error: null
64
- });
65
-
66
- _defineProperty(this, "handleRetryFetch", () => {
67
- this.fetchData();
68
- });
69
- }
70
-
71
- componentDidMount() {
72
- this.fetchData();
73
- }
74
-
75
- componentWillUnmount() {
76
- if (this.subscription) {
77
- this.subscription.unsubscribe();
78
- }
79
- }
80
-
81
- fetchData() {
82
- if (this.subscription) {
83
- this.subscription.unsubscribe();
84
- }
85
-
86
- var _versionedClient$conf = _versionedClient.versionedClient.config(),
87
- projectId = _versionedClient$conf.projectId;
88
-
89
- this.subscription = _versionedClient.versionedClient.observable.request({
90
- uri: "/projects/".concat(projectId)
91
- }).pipe((0, _operators.switchMap)(project => _legacyParts.userStore.observable.getUsers(project.members.map(mem => mem.id)).pipe((0, _operators.map)(users => ({
92
- project,
93
- users
94
- }))))).subscribe({
95
- next: _ref => {
96
- var users = _ref.users,
97
- project = _ref.project;
98
- return this.setState({
99
- project,
100
- users: (Array.isArray(users) ? users : [users]).sort((userA, userB) => sortUsersByRobotStatus(userA, userB, project))
101
- });
102
- },
103
- error: _error => this.setState({
104
- error: _error
105
- })
106
- });
107
- }
108
-
109
- render() {
110
- var _this$state = this.state,
111
- error = _this$state.error,
112
- project = _this$state.project,
113
- users = _this$state.users;
114
- var isLoading = !users || !project;
115
-
116
- if (error) {
117
- return /*#__PURE__*/_react.default.createElement(_DashboardTool.DashboardWidget, {
118
- header: "Project users"
119
- }, /*#__PURE__*/_react.default.createElement(_ui.Box, {
120
- padding: 4
121
- }, /*#__PURE__*/_react.default.createElement(_ui.Text, null, "Something went wrong while fetching data. You could", ' ', /*#__PURE__*/_react.default.createElement("a", {
122
- onClick: this.handleRetryFetch,
123
- title: "Retry users fetch",
124
- style: {
125
- cursor: 'pointer'
126
- }
127
- }, "retry"), "..?")));
128
- }
129
-
130
- return /*#__PURE__*/_react.default.createElement(_DashboardTool.DashboardWidget, {
131
- header: "Project users",
132
- footer: /*#__PURE__*/_react.default.createElement(_ui.Button, {
133
- style: {
134
- width: '100%'
135
- },
136
- paddingX: 2,
137
- paddingY: 4,
138
- mode: "bleed",
139
- tone: "primary",
140
- text: "Invite members",
141
- as: "a",
142
- loading: isLoading,
143
- href: isLoading ? undefined : getInviteUrl(project.id)
144
- })
145
- }, isLoading && /*#__PURE__*/_react.default.createElement(_ui.Box, {
146
- paddingY: 5,
147
- paddingX: 2
148
- }, /*#__PURE__*/_react.default.createElement(_ui.Stack, {
149
- space: 4
150
- }, /*#__PURE__*/_react.default.createElement(_ui.Text, {
151
- align: "center",
152
- muted: true,
153
- size: 1
154
- }, /*#__PURE__*/_react.default.createElement(_ui.Spinner, null)), /*#__PURE__*/_react.default.createElement(_ui.Text, {
155
- align: "center",
156
- size: 1,
157
- muted: true
158
- }, "Loading items..."))), !isLoading && /*#__PURE__*/_react.default.createElement(_ui.Stack, {
159
- space: 3,
160
- padding: 3
161
- }, users.map(user => {
162
- var membership = project.members.find(member => member.id === user.id);
163
- var media = membership.isRobot ? /*#__PURE__*/_react.default.createElement(_ui.Text, {
164
- size: 3
165
- }, /*#__PURE__*/_react.default.createElement(_icons.RobotIcon, null)) : /*#__PURE__*/_react.default.createElement(AvatarWrapper, {
166
- tone: "transparent"
167
- }, (user === null || user === void 0 ? void 0 : user.imageUrl) && /*#__PURE__*/_react.default.createElement("img", {
168
- src: user.imageUrl,
169
- alt: user === null || user === void 0 ? void 0 : user.displayName
170
- }));
171
- return /*#__PURE__*/_react.default.createElement(_ui.Box, {
172
- key: user.id
173
- }, /*#__PURE__*/_react.default.createElement(_components.DefaultPreview, {
174
- title: user.displayName,
175
- subtitle: membership.role,
176
- media: media
177
- }));
178
- })));
179
- }
180
-
181
- }
182
-
183
- _defineProperty(ProjectUsers, "propTypes", {});
184
-
185
- _defineProperty(ProjectUsers, "defaultProps", {});
186
-
187
- var _default = ProjectUsers;
188
- exports.default = _default;
@@ -1,16 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.default = void 0;
7
-
8
- var _ProjectUsers = _interopRequireDefault(require("./ProjectUsers"));
9
-
10
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
11
-
12
- var _default = {
13
- name: 'project-users',
14
- component: _ProjectUsers.default
15
- };
16
- exports.default = _default;
@@ -1,115 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.default = void 0;
7
-
8
- var _get2 = _interopRequireDefault(require("lodash/get"));
9
-
10
- var _react = _interopRequireDefault(require("react"));
11
-
12
- var _propTypes = _interopRequireDefault(require("prop-types"));
13
-
14
- var _ui = require("@sanity/ui");
15
-
16
- var _DashboardTool = require("../../DashboardTool");
17
-
18
- var _Tutorial = _interopRequireDefault(require("./Tutorial"));
19
-
20
- var _dataAdapter = _interopRequireDefault(require("./dataAdapter"));
21
-
22
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
23
-
24
- function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
25
-
26
- var urlBuilder = _dataAdapter.default.urlBuilder,
27
- getFeed = _dataAdapter.default.getFeed;
28
-
29
- function createUrl(slug, type) {
30
- if (type === 'tutorial') {
31
- return "https://www.sanity.io/docs/tutorials/".concat(slug.current);
32
- } else if (type === 'guide') {
33
- return "https://www.sanity.io/docs/guides/".concat(slug.current);
34
- }
35
-
36
- return false;
37
- }
38
-
39
- class SanityTutorials extends _react.default.Component {
40
- constructor() {
41
- super(...arguments);
42
-
43
- _defineProperty(this, "state", {
44
- feedItems: []
45
- });
46
- }
47
-
48
- componentDidMount() {
49
- var templateRepoId = this.props.templateRepoId;
50
- this.subscription = getFeed(templateRepoId).subscribe(response => {
51
- this.setState({
52
- feedItems: response.items
53
- });
54
- });
55
- }
56
-
57
- componentWillUnmount() {
58
- if (this.subscription) {
59
- this.subscription.unsubscribe();
60
- }
61
- }
62
-
63
- render() {
64
- var feedItems = this.state.feedItems;
65
- var title = 'Learn about Sanity';
66
- return /*#__PURE__*/_react.default.createElement(_DashboardTool.DashboardWidget, {
67
- header: title
68
- }, /*#__PURE__*/_react.default.createElement(_ui.Flex, {
69
- as: "ul",
70
- overflow: "auto",
71
- align: "stretch",
72
- paddingY: 2
73
- }, feedItems === null || feedItems === void 0 ? void 0 : feedItems.map((feedItem, index) => {
74
- if (!feedItem.title || !feedItem.guideOrTutorial && !feedItem.externalLink) {
75
- return null;
76
- }
77
-
78
- var presenter = feedItem.presenter || (0, _get2.default)(feedItem, 'guideOrTutorial.presenter') || {};
79
- var subtitle = (0, _get2.default)(feedItem, 'category');
80
- var _feedItem$guideOrTuto = feedItem.guideOrTutorial,
81
- guideOrTutorial = _feedItem$guideOrTuto === void 0 ? {} : _feedItem$guideOrTuto;
82
- return /*#__PURE__*/_react.default.createElement(_ui.Flex, {
83
- as: "li",
84
- key: feedItem._id,
85
- paddingRight: index < (feedItems === null || feedItems === void 0 ? void 0 : feedItems.length) - 1 ? 1 : 3,
86
- paddingLeft: index === 0 ? 3 : 0,
87
- align: "stretch",
88
- flex: "0 0 27.5%",
89
- style: {
90
- minWidth: 272,
91
- width: '30%'
92
- }
93
- }, /*#__PURE__*/_react.default.createElement(_Tutorial.default, {
94
- title: feedItem.title,
95
- href: createUrl(guideOrTutorial.slug, guideOrTutorial._type) || feedItem.externalLink,
96
- presenterName: presenter.name,
97
- presenterSubtitle: subtitle,
98
- showPlayIcon: feedItem.hasVideo,
99
- posterURL: urlBuilder.image(feedItem.poster).height(360).url()
100
- }));
101
- })));
102
- }
103
-
104
- }
105
-
106
- _defineProperty(SanityTutorials, "propTypes", {
107
- templateRepoId: _propTypes.default.string
108
- });
109
-
110
- _defineProperty(SanityTutorials, "defaultProps", {
111
- templateRepoId: null
112
- });
113
-
114
- var _default = SanityTutorials;
115
- exports.default = _default;