@sanity/form-builder
Version:
Sanity form builder
138 lines (135 loc) • 8.24 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.ReferencePreview = ReferencePreview;
var _react = _interopRequireWildcard(require("react"));
var _ui = require("@sanity/ui");
var _icons = require("@sanity/icons");
var _components = require("@sanity/base/components");
var _presence = require("@sanity/base/presence");
var _hooks = require("@sanity/base/hooks");
var _Preview = _interopRequireDefault(require("../../Preview"));
var _TimeAgo = require("./utils/TimeAgo");
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
function UnavailableMessage(props) {
var Icon = props.icon;
return /*#__PURE__*/_react.default.createElement(_ui.Flex, {
padding: 3
}, /*#__PURE__*/_react.default.createElement(_ui.Box, null, /*#__PURE__*/_react.default.createElement(_ui.Text, {
size: 1
}, /*#__PURE__*/_react.default.createElement(Icon, null))), /*#__PURE__*/_react.default.createElement(_ui.Box, {
flex: 1,
marginLeft: 3
}, /*#__PURE__*/_react.default.createElement(_ui.Text, {
size: 1,
weight: "semibold"
}, props.title), /*#__PURE__*/_react.default.createElement(_ui.Box, {
marginTop: 3
}, /*#__PURE__*/_react.default.createElement(_ui.Text, {
as: "p",
muted: true,
size: 1
}, props.children))));
}
/**
* Used to preview a referenced type
* Takes the reference type as props
* @param props
* @constructor
*/
function ReferencePreview(props) {
var _preview$draft, _preview$published, _preview$draft2;
var availability = props.availability,
id = props.id,
layout = props.layout,
preview = props.preview,
refType = props.refType,
showTypeLabel = props.showTypeLabel;
var theme = (0, _ui.useRootTheme)();
var documentPresence = (0, _hooks.useDocumentPresenceUsers)(id);
var notFound = availability.reason === 'NOT_FOUND';
var insufficientPermissions = availability.reason === 'PERMISSION_DENIED';
var previewId = ((_preview$draft = preview.draft) === null || _preview$draft === void 0 ? void 0 : _preview$draft._id) || ((_preview$published = preview.published) === null || _preview$published === void 0 ? void 0 : _preview$published._id) ||
// note: during publish of the referenced document we might have both a missing draft and a missing published version
// this happens because the preview system tries to optimistically re-fetch as soon as it sees a mutation, but
// when publishing, the draft is deleted, and therefore both the draft and the published may be missing for a brief
// moment before the published version appears. In this case, it's safe to fallback to the given id, which is always
// the published id
id;
// Note: we can't pass the preview values as-is to the Preview-component here since it's a "prepared" value and the
// Preview component expects the "raw"/unprepared value. By passing only _id and _type we make sure the Preview-component
// resolve the preview value it needs (this is cached in the runtime, so not likely to cause any fetch overhead)
var previewStub = (0, _react.useMemo)(() => ({
_id: previewId,
_type: refType.name
}), [previewId, refType.name]);
return /*#__PURE__*/_react.default.createElement(_ui.Flex, {
align: "center"
}, availability.available ? /*#__PURE__*/_react.default.createElement(_ui.Box, {
flex: 1
}, /*#__PURE__*/_react.default.createElement(_Preview.default, {
type: refType,
value: previewStub,
layout: layout
})) : /*#__PURE__*/_react.default.createElement(_ui.Box, {
flex: 1
}, /*#__PURE__*/_react.default.createElement(_ui.Flex, {
align: "center"
}, /*#__PURE__*/_react.default.createElement(_ui.Box, {
flex: 1,
paddingY: 2
}, /*#__PURE__*/_react.default.createElement(_ui.Text, {
muted: true
}, "Document unavailable")))), /*#__PURE__*/_react.default.createElement(_ui.Box, {
paddingLeft: 3
}, /*#__PURE__*/_react.default.createElement(_ui.Inline, {
space: 3
}, showTypeLabel && /*#__PURE__*/_react.default.createElement(_ui.Label, {
size: 1,
muted: true
}, refType.title), insufficientPermissions || notFound ? /*#__PURE__*/_react.default.createElement(_ui.Box, null, /*#__PURE__*/_react.default.createElement(_ui.Tooltip, {
portal: true,
content: notFound ? /*#__PURE__*/_react.default.createElement(UnavailableMessage, {
title: "Not found",
icon: _icons.HelpCircleIcon
}, "The referenced document does not exist", /*#__PURE__*/_react.default.createElement("br", null), "(id: ", /*#__PURE__*/_react.default.createElement("code", null, id), ")") : /*#__PURE__*/_react.default.createElement(UnavailableMessage, {
title: "Insufficcient permissions",
icon: _icons.AccessDeniedIcon
}, "The referenced document could not be accessed due to insufficient permissions")
}, /*#__PURE__*/_react.default.createElement(_components.TextWithTone, {
tone: "default"
}, /*#__PURE__*/_react.default.createElement(_icons.HelpCircleIcon, null)))) : null, documentPresence && documentPresence.length > 0 && /*#__PURE__*/_react.default.createElement(_presence.DocumentPreviewPresence, {
presence: documentPresence
}), /*#__PURE__*/_react.default.createElement(_ui.Inline, {
space: 4
}, /*#__PURE__*/_react.default.createElement(_ui.Box, null, /*#__PURE__*/_react.default.createElement(_ui.Tooltip, {
content: /*#__PURE__*/_react.default.createElement(_ui.Box, {
padding: 2
}, /*#__PURE__*/_react.default.createElement(_ui.Text, {
size: 1
}, preview.published ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, "Published ", /*#__PURE__*/_react.default.createElement(_TimeAgo.TimeAgo, {
time: preview.published._updatedAt
})) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, "Not published")))
}, /*#__PURE__*/_react.default.createElement(_components.TextWithTone, {
tone: theme.tone === 'default' ? 'positive' : 'default',
size: 1,
dimmed: !preview.published,
muted: !preview.published
}, /*#__PURE__*/_react.default.createElement(_icons.PublishIcon, null)))), /*#__PURE__*/_react.default.createElement(_ui.Box, null, /*#__PURE__*/_react.default.createElement(_ui.Tooltip, {
content: /*#__PURE__*/_react.default.createElement(_ui.Box, {
padding: 2
}, /*#__PURE__*/_react.default.createElement(_ui.Text, {
size: 1
}, preview.draft ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, "Edited ", /*#__PURE__*/_react.default.createElement(_TimeAgo.TimeAgo, {
time: (_preview$draft2 = preview.draft) === null || _preview$draft2 === void 0 ? void 0 : _preview$draft2._updatedAt
})) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, "No unpublished edits")))
}, /*#__PURE__*/_react.default.createElement(_components.TextWithTone, {
tone: theme.tone === 'default' ? 'caution' : 'default',
size: 1,
dimmed: !preview.draft,
muted: !preview.draft
}, /*#__PURE__*/_react.default.createElement(_icons.EditIcon, null))))))));
}