@riboseinc/paneron-registry-kit 2.0.0 → 2.0.1

package/compiled/views/detail/RegisterItem/index.js

@@ -0,0 +1,277 @@
+/** @jsx jsx */
+/** @jsxFrag React.Fragment */
+import React, { useContext, useState, useCallback } from 'react';
+import { jsx, css } from '@emotion/react';
+import styled from '@emotion/styled';
+import { Button, ButtonGroup, Card, Classes, FormGroup as BaseFormGroup, ControlGroup, InputGroup, NonIdealState, UL, H5, } from '@blueprintjs/core';
+import { DatasetContext } from '@riboseinc/paneron-extension-kit/context';
+import HelpTooltip from '@riboseinc/paneron-extension-kit/widgets/HelpTooltip';
+import useItemRef from '../../hooks/useItemRef';
+import useSingleRegisterItemData from '../../hooks/useSingleRegisterItemData';
+import useItemClassConfig from '../../hooks/useItemClassConfig';
+import { Protocols } from '../../protocolRegistry';
+import { isRegisterItem, } from '../../../types';
+import { BrowserCtx } from '../../BrowserCtx';
+import { RegisterHelmet as Helmet, maybeEllipsizeString, TabContentsWithActions, } from '../../util';
+import { crIDToCRPath, getCRIDFromProposedItemPath } from '../../itemPathUtils';
+import { updateCRObjectChangeset, } from '../../change-request/objectChangeset';
+import { ChangeRequestContext } from '../../change-request/ChangeRequestContext';
+import { RelatedItems } from './RelatedItems';
+/**
+ * Main register item view.
+ *
+ * NOTE: while generally intended as tab content handler,
+ * is also reused within change request view.
+ */
+const ItemDetail = function ({ uri, inProposalWithID }) {
+    const { value: ref } = useItemRef(uri);
+    const { value: clsConfig } = useItemClassConfig(ref?.classID ?? 'NONEXISTENT_CLASS_ID');
+    //const { value: itemData } = useSingleRegisterItemData(ref);
+    const { updateObjects, performOperation, operationKey } = useContext(DatasetContext);
+    const isBusy = operationKey !== undefined;
+    const { jumpTo, subregisters, useRegisterItemData, activeChangeRequestID: globallyActiveCRID, } = useContext(BrowserCtx);
+    const { changeRequest: activeCR, canEdit: activeCRIsEditable } = useContext(ChangeRequestContext);
+    const itemClass = clsConfig;
+    const itemClassID = itemClass?.meta?.id;
+    const itemRef = ref ?? dummyRef;
+    const { itemID, subregisterID } = itemRef;
+    const _itemPath = `${itemClassID ?? 'NONEXISTENT_CLASS'}/${itemID}.yaml`;
+    const itemPath = subregisterID ? `/subregisters/${subregisterID}/${_itemPath}` : `/${_itemPath}`;
+    const itemRequest = {
+        itemPaths: [itemPath],
+    };
+    const itemResponse = useRegisterItemData(itemRequest);
+    const itemData = itemResponse.value[itemPath];
+    const [editedClarification, setEditedClarification] = useState(null);
+    //const [ diffMode, setDiffMode ] = useState<boolean>(false);
+    // TODO: Implement diff mode
+    const diffMode = false;
+    const proposal = ((activeCR && activeCR.items[itemPath])
+        ? activeCR.items[itemPath]
+        : null) ?? null;
+    const handleClearProposal = () => performProposalOperation("draft: clear proposal", null);
+    const handleRetire = () => performProposalOperation("draft: propose retirement", {
+        type: 'amendment',
+        amendmentType: 'retirement',
+    });
+    const handleInvalidate = () => performProposalOperation("draft: propose invalidation", {
+        type: 'amendment',
+        amendmentType: 'invalidation',
+    });
+    const handleSupersedeWith = (items) => performProposalOperation("draft: propose supersession", {
+        type: 'amendment',
+        amendmentType: 'supersession',
+        supersedingItemIDs: items,
+    });
+    const handleClarify = async () => {
+        await performProposalOperation("draft: clarify item", {
+            type: 'clarification',
+        });
+        setEditedClarification(null);
+    };
+    const handleEditAddition = async () => {
+        await performProposalOperation("draft: edit added item", {
+            type: 'addition',
+        });
+        setEditedClarification(null);
+    };
+    async function performProposalOperation(summary, proposal) {
+        return await performOperation(summary, handleSetProposal)(summary, proposal);
+    }
+    const handleSetProposal = useCallback(async function _handleSetProposal(summary, proposal) {
+        if (!activeCRIsEditable || !updateObjects || !isRegisterItem(itemData)) {
+            throw new Error("Proposal isn’t editable");
+        }
+        if (proposal && proposal?.type !== 'amendment' && !editedClarification) {
+            throw new Error("Missing item data");
+        }
+        await updateObjects({
+            commitMessage: `${summary} for ${itemPath}`,
+            objectChangeset: updateCRObjectChangeset(
+            // TODO: We are sure it’s editable already, but casting should be avoided
+            activeCR, { [itemPath]: proposal }, ((proposal && proposal?.type !== 'amendment') && editedClarification)
+                ? { [itemPath]: { ...itemData, data: editedClarification } }
+                : {}),
+            // We need this because updateCRObjectChangeset
+            // omits oldValue for item data payloads.
+            _dangerouslySkipValidation: true,
+        });
+    }, [
+        updateObjects,
+        activeCRIsEditable,
+        JSON.stringify(activeCR),
+        JSON.stringify(itemData),
+        JSON.stringify(editedClarification),
+    ]);
+    if (!itemClass) {
+        return jsx(NonIdealState, { icon: "heart-broken", title: "Unable to show item", description: `View for ${ref?.itemID ?? uri} cannot be retrieved from item class configuration` });
+    }
+    else if (isRegisterItem(itemData)) {
+        let details;
+        if (editedClarification !== null && activeCRIsEditable) {
+            const EditView = itemClass.views.editView;
+            details = (jsx(EditView, { itemData: editedClarification, itemRef: itemRef, onChange: !isBusy
+                    ? (newData) => {
+                        setEditedClarification(newData);
+                    }
+                    : undefined }));
+        }
+        else {
+            const DetailView = itemClass.views.detailView ?? itemClass.views.editView;
+            details = (jsx(DetailView, { itemRef: itemRef, itemData: itemData.data }));
+        }
+        //const canAmend = activeCR && itemData.status === 'valid';
+        const itemStatus = jsx(FormGroup, { inline: true, label: "status:", css: css `margin: 0;` },
+            jsx(ControlGroup, { fill: true },
+                jsx(InputGroup, { value: proposal?.type === 'amendment'
+                        ? `${proposal.amendmentType} proposed`
+                        : proposal?.type === 'addition'
+                            ? "addition proposed"
+                            : itemData.status, intent: proposal?.type === 'amendment'
+                        ? 'warning'
+                        : proposal?.type === 'addition'
+                            ? 'primary'
+                            : itemData.status === 'valid'
+                                ? 'success'
+                                : undefined, leftIcon: proposal && (proposal.type === 'amendment' || proposal.type === 'addition')
+                        ? 'asterisk'
+                        : itemData.status === 'valid'
+                            ? 'tick'
+                            : itemData.status === 'invalid'
+                                ? 'ban-circle'
+                                : 'warning-sign', readOnly: true }),
+                activeCRIsEditable && !editedClarification
+                    ? jsx(React.Fragment, null,
+                        proposal?.type === 'addition'
+                            ? jsx(Button, { intent: "warning", title: "Remove the proposal to add this new item.", disabled: isBusy, onClick: handleClearProposal }, "Remove proposed addition")
+                            : null,
+                        proposal?.type === 'amendment'
+                            ? jsx(Button, { intent: "warning", title: `Remove amendment (${proposal.amendmentType}) for this item from current proposal.`, disabled: isBusy, onClick: handleClearProposal }, "Clear proposed amendment")
+                            : !proposal && itemData.status === 'valid'
+                                ? jsx(ButtonGroup, null,
+                                    jsx(Button, { intent: "primary", disabled: isBusy, onClick: handleRetire }, "Retire"),
+                                    jsx(Button, { intent: "primary", disabled: isBusy, onClick: handleInvalidate }, "Invalidate"))
+                                : null)
+                    : null));
+        const supersedingItems = (
+        // It’s superseded (whether in current proposal or not)
+        itemData.status === 'superseded'
+            // Item is valid, proposal is editable, and no change to this item is proposed yet
+            || (activeCRIsEditable && !proposal && !editedClarification && itemData.status === 'valid')
+            // This item is being superseded in active proposal
+            // XXX: Redundant condition with the first one?
+            || (proposal?.type === 'amendment' && proposal.amendmentType === 'supersession'))
+            ? jsx(FormGroup, { inline: true, label: "superseded by: ", css: css `margin: 0;` },
+                jsx(RelatedItems, { availableClassIDs: [itemClass.meta.id], itemRefs: proposal?.type === 'amendment' && proposal.amendmentType === 'supersession'
+                        ? proposal.supersedingItemIDs.
+                            map(id => ({ itemID: id, classID: itemClass.meta.id, subregisterID }))
+                        : (itemData.supersededBy ?? []), onChange: !isBusy && activeCRIsEditable && ((proposal?.type === 'amendment' && proposal.amendmentType === 'supersession') ||
+                        (!proposal && itemData.status === 'valid'))
+                        ? (items) => items.length > 0
+                            ? handleSupersedeWith(items.map(ref => ref.itemID))
+                            : handleClearProposal()
+                        : undefined }))
+            : null;
+        const clarificationHasChanges = JSON.stringify(editedClarification) !== JSON.stringify(itemData.data);
+        const clarificationAction = ((proposal && proposal?.type !== 'amendment')
+            || (activeCRIsEditable && !proposal && itemData.status === 'valid'))
+            ? jsx(FormGroup, { inline: true, label: `${proposal?.type ?? "clarification"}: `, css: css `margin: 0;` }, activeCRIsEditable
+                ? jsx(ButtonGroup, null, editedClarification
+                    ? jsx(React.Fragment, null,
+                        jsx(Button, { intent: clarificationHasChanges ? "primary" : undefined, 
+                            // TODO(perf): this is expensive if renders are frequent…
+                            disabled: !clarificationHasChanges || isBusy, onClick: (!proposal || proposal?.type === 'clarification')
+                                ? handleClarify
+                                : handleEditAddition }, "Save"),
+                        jsx(Button, { onClick: () => setEditedClarification(null) }, "Do not save"))
+                    : jsx(React.Fragment, null,
+                        jsx(Button, { disabled: diffMode || isBusy, intent: "primary", outlined: true, onClick: () => setEditedClarification(itemData.data) }, !proposal ? "Clarify" : "Edit"),
+                        proposal?.type === 'clarification'
+                            ? jsx(React.Fragment, null,
+                                jsx(Button, { disabled: diffMode || isBusy || proposal?.type !== 'clarification', intent: "warning", onClick: handleClearProposal }, "Clear"))
+                            : null))
+                : jsx(Button, { disabled: true },
+                    proposal?.type === 'clarification' ? "Clarified" : "Added",
+                    " in active proposal"))
+            : null;
+        // If there’s a CR context without active CR,
+        // or active CR isn’t the same as the one in CR context,
+        // then we can assume that the item is shown in proposal window
+        // and we’d set window title to proposal’s title rather than item’s.
+        // If there’s a CR context and active CR and they’re the same
+        // then it *could* be that the item is shown in its own tab;
+        // we will render proposal’s title if the item appears in the change request
+        // (makes sense because the user *is* technically viewing a proposal then).
+        const windowTitle = (activeCR && (!globallyActiveCRID
+            || activeCR.id !== globallyActiveCRID
+            || activeCR.items[itemPath])) ? `Proposal ${maybeEllipsizeString(activeCR.justification, 20)}…`
+            : `${itemClass.meta.title ?? 'register item'} #${itemData.id}`;
+        return (jsx(TabContentsWithActions, { actions: jsx(React.Fragment, null,
+                jsx(FormGroup, { inline: true, labelInfo: jsx(HelpTooltip, { icon: 'info-sign', content: jsx(React.Fragment, null,
+                            jsx(H5, null, itemClass.meta.title),
+                            itemClass.meta.description ?? "No description is provided for this register item class.",
+                            jsx(UL, null,
+                                jsx("li", null,
+                                    "Class ID: ",
+                                    itemClassID),
+                                jsx("li", null,
+                                    "Subregister ID: ",
+                                    subregisterID ?? 'N/A'),
+                                jsx("li", null,
+                                    "UUID: ",
+                                    itemID))) }), label: jsx(React.Fragment, null,
+                        jsx("strong", null, itemClass.meta.title),
+                        subregisterID
+                            ? jsx("span", { title: "Subregister" },
+                                " in ",
+                                subregisters?.[subregisterID]?.title ?? subregisterID)
+                            : null), css: css `margin: 0; .bp4-form-content { display: flex; flex-flow: row wrap; gap: 10px; }` },
+                    itemStatus,
+                    supersedingItems,
+                    clarificationAction)), main: jsx(Card, { css: css `position: absolute; inset: ${inProposalWithID ? '0' : '10px'}; overflow-y: auto;` },
+                jsx(Helmet, null,
+                    jsx("title", null, windowTitle)),
+                details) }));
+    }
+    else if (itemResponse.isUpdating) {
+        return jsx("div", { className: Classes.SKELETON }, "Loading\u2026");
+    }
+    else {
+        const inCRWithID = getCRIDFromProposedItemPath(uri);
+        if (inCRWithID !== null && activeCR?.id !== inCRWithID) {
+            return jsx(NonIdealState, { icon: "help", title: "This item does not exist\u2026", description: jsx(React.Fragment, null,
+                    "\u2026but it might be proposed.",
+                    jsx("br", null),
+                    jumpTo
+                        ? jsx(Button, { css: css `margin: 10px;`, intent: "primary", onClick: () => jumpTo?.(`${Protocols.CHANGE_REQUEST}:${crIDToCRPath(inCRWithID)}`) }, "Go to proposal")
+                        : null) });
+        }
+        else {
+            return jsx(NonIdealState, { icon: "heart-broken", title: "Unable to show item", description: "Item may not exist, or use unexpected data format." });
+        }
+    }
+};
+const ItemTitle = function ({ uri }) {
+    const { value: ref } = useItemRef(uri);
+    const { value: clsConfig } = useItemClassConfig(ref?.classID ?? 'NONEXISTENT_CLASS_ID');
+    const { value: itemData } = useSingleRegisterItemData(ref);
+    const fallbackView = (() => jsx(React.Fragment, null, ref?.itemID ?? uri));
+    const View = itemData ? (clsConfig?.views.listItemView ?? fallbackView) : fallbackView;
+    return jsx(View, { itemRef: ref ?? dummyRef, itemData: itemData });
+};
+export default {
+    main: ItemDetail,
+    title: ItemTitle,
+};
+const dummyRef = {
+    itemID: 'NONEXISTENT_ITEM_ID',
+    classID: 'NONEXISTENT_CLASS_ID',
+    subregisterID: undefined,
+};
+const FormGroup = styled(BaseFormGroup) `
+  margin: 0;
+  label.bp4-label {
+    white-space: nowrap;
+  }
+`;
+//# sourceMappingURL=index.js.map

package/compiled/views/detail/RegisterItem/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/views/detail/RegisterItem/index.tsx"],"names":[],"mappings":"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","sourcesContent":["/** @jsx jsx */\n/** @jsxFrag React.Fragment */\n\nimport React, { useContext, useState, useCallback } from 'react';\nimport { jsx, css } from '@emotion/react';\nimport styled from '@emotion/styled';\nimport {\n  Button, ButtonGroup,\n  Card,\n  Classes,\n  FormGroup as BaseFormGroup,\n  ControlGroup,\n  InputGroup,\n  NonIdealState,\n  UL,\n  H5,\n} from '@blueprintjs/core';\nimport { DatasetContext } from '@riboseinc/paneron-extension-kit/context';\nimport HelpTooltip from '@riboseinc/paneron-extension-kit/widgets/HelpTooltip';\nimport useItemRef from '../../hooks/useItemRef';\nimport useSingleRegisterItemData from '../../hooks/useSingleRegisterItemData';\nimport useItemClassConfig from '../../hooks/useItemClassConfig';\nimport { Protocols } from '../../protocolRegistry';\nimport {\n  type ChangeProposal,\n  type InternalItemReference,\n  type RegisterItem,\n  isRegisterItem,\n} from '../../../types';\nimport { BrowserCtx } from '../../BrowserCtx';\nimport {\n  RegisterHelmet as Helmet,\n  maybeEllipsizeString,\n  TabContentsWithActions,\n} from '../../util';\nimport { crIDToCRPath, getCRIDFromProposedItemPath } from '../../itemPathUtils';\nimport { updateCRObjectChangeset, } from '../../change-request/objectChangeset';\nimport { ChangeRequestContext } from '../../change-request/ChangeRequestContext';\nimport { RelatedItems } from './RelatedItems';\n\n\n/**\n * Main register item view.\n *\n * NOTE: while generally intended as tab content handler,\n * is also reused within change request view.\n */\nconst ItemDetail: React.FC<{ uri: string, inProposalWithID?: string }> = function ({ uri, inProposalWithID }) {\n  const { value: ref } = useItemRef(uri);\n  const { value: clsConfig } = useItemClassConfig(ref?.classID ?? 'NONEXISTENT_CLASS_ID');\n  //const { value: itemData } = useSingleRegisterItemData(ref);\n  const { updateObjects, performOperation, operationKey } = useContext(DatasetContext);\n  const isBusy = operationKey !== undefined;\n  const {\n    jumpTo,\n    subregisters,\n    useRegisterItemData,\n    activeChangeRequestID: globallyActiveCRID,\n  } = useContext(BrowserCtx);\n\n  const { changeRequest: activeCR, canEdit: activeCRIsEditable } = useContext(ChangeRequestContext);\n\n  const itemClass = clsConfig;\n  const itemClassID = itemClass?.meta?.id;\n  const itemRef = ref ?? dummyRef;\n  const { itemID, subregisterID } = itemRef;\n\n  const _itemPath = `${itemClassID ?? 'NONEXISTENT_CLASS'}/${itemID}.yaml`;\n  const itemPath = subregisterID ? `/subregisters/${subregisterID}/${_itemPath}` : `/${_itemPath}`;\n  const itemRequest = {\n    itemPaths: [itemPath],\n  };\n  const itemResponse = useRegisterItemData(itemRequest);\n  const itemData = itemResponse.value[itemPath];\n\n  const [ editedClarification, setEditedClarification ] = useState<RegisterItem<any>[\"data\"] | null>(null);\n\n  //const [ diffMode, setDiffMode ] = useState<boolean>(false);\n  // TODO: Implement diff mode\n  const diffMode = false;\n\n  const proposal = ((activeCR && activeCR.items[itemPath])\n    ? activeCR.items[itemPath]\n    : null) ?? null;\n\n  const handleClearProposal = () => performProposalOperation(\"draft: clear proposal\", null);\n  const handleRetire = () => performProposalOperation(\"draft: propose retirement\", {\n    type: 'amendment',\n    amendmentType: 'retirement',\n  });\n  const handleInvalidate = () => performProposalOperation(\"draft: propose invalidation\", {\n    type: 'amendment',\n    amendmentType: 'invalidation',\n  });\n  const handleSupersedeWith = (items: string[]) => performProposalOperation(\"draft: propose supersession\", {\n    type: 'amendment',\n    amendmentType: 'supersession',\n    supersedingItemIDs: items,\n  });\n  const handleClarify = async () => {\n    await performProposalOperation(\"draft: clarify item\", {\n      type: 'clarification',\n    });\n    setEditedClarification(null);\n  };\n  const handleEditAddition = async () => {\n    await performProposalOperation(\"draft: edit added item\", {\n      type: 'addition',\n    });\n    setEditedClarification(null);\n  };\n\n  async function performProposalOperation(summary: string, proposal: ChangeProposal | null) {\n    return await performOperation(summary, handleSetProposal)(summary, proposal);\n  }\n\n  const handleSetProposal = useCallback(async function _handleSetProposal(\n    summary: string,\n    proposal: ChangeProposal | null,\n  ): Promise<void> {\n    if (!activeCRIsEditable || !updateObjects || !isRegisterItem(itemData)) {\n      throw new Error(\"Proposal isn’t editable\")\n    }\n    if (proposal && proposal?.type !== 'amendment' && !editedClarification) {\n      throw new Error(\"Missing item data\");\n    }\n    await updateObjects({\n      commitMessage: `${summary} for ${itemPath}`,\n      objectChangeset: updateCRObjectChangeset(\n        // TODO: We are sure it’s editable already, but casting should be avoided\n        activeCR as any,\n        { [itemPath]: proposal },\n        ((proposal && proposal?.type !== 'amendment') && editedClarification)\n          ? { [itemPath]: { ...itemData, data: editedClarification } }\n          : {},\n      ),\n      // We need this because updateCRObjectChangeset\n      // omits oldValue for item data payloads.\n      _dangerouslySkipValidation: true,\n    });\n  }, [\n    updateObjects,\n    activeCRIsEditable,\n    JSON.stringify(activeCR),\n    JSON.stringify(itemData),\n    JSON.stringify(editedClarification),\n  ]);\n\n  if (!itemClass) {\n    return <NonIdealState\n      icon=\"heart-broken\"\n      title=\"Unable to show item\"\n      description={`View for ${ref?.itemID ?? uri} cannot be retrieved from item class configuration`}\n    />;\n\n  } else if (isRegisterItem(itemData)) {\n    let details: JSX.Element;\n\n    if (editedClarification !== null && activeCRIsEditable) {\n      const EditView = itemClass.views.editView;\n      details = (\n        <EditView\n          itemData={editedClarification}\n          itemRef={itemRef}\n          onChange={!isBusy\n            ? (newData) => {\n                setEditedClarification(newData);\n              }\n            : undefined}\n        />\n      );\n\n    } else {\n      const DetailView = itemClass.views.detailView ?? itemClass.views.editView;\n      details = (\n        <DetailView\n          itemRef={itemRef}\n          itemData={itemData.data}\n        />\n      );\n    }\n\n    //const canAmend = activeCR && itemData.status === 'valid';\n    const itemStatus =\n      <FormGroup inline label=\"status:\" css={css`margin: 0;`}>\n        <ControlGroup fill>\n          <InputGroup\n            value={proposal?.type === 'amendment'\n              ? `${proposal.amendmentType} proposed`\n              : proposal?.type === 'addition'\n                ? \"addition proposed\"\n                : itemData.status}\n            intent={proposal?.type === 'amendment'\n              ? 'warning'\n              : proposal?.type === 'addition'\n                ? 'primary'\n                : itemData.status === 'valid'\n                  ? 'success'\n                  : undefined}\n            leftIcon={proposal && (proposal.type === 'amendment' || proposal.type === 'addition')\n              ? 'asterisk'\n              : itemData.status === 'valid'\n                ? 'tick'\n                : itemData.status === 'invalid'\n                  ? 'ban-circle'\n                  : 'warning-sign'}\n            readOnly\n          />\n          {activeCRIsEditable && !editedClarification\n            ? <>\n                {proposal?.type === 'addition'\n                  ? <Button\n                        intent=\"warning\"\n                        title=\"Remove the proposal to add this new item.\"\n                        disabled={isBusy}\n                        onClick={handleClearProposal}>\n                      Remove proposed addition\n                    </Button>\n                  : null}\n                {proposal?.type === 'amendment'\n                  ? <Button\n                        intent=\"warning\"\n                        title={`Remove amendment (${proposal.amendmentType}) for this item from current proposal.`}\n                        disabled={isBusy}\n                        onClick={handleClearProposal}>\n                      Clear proposed amendment\n                    </Button>\n                  : !proposal && itemData.status === 'valid'\n                    ? <ButtonGroup>\n                        <Button\n                            intent=\"primary\"\n                            disabled={isBusy}\n                            onClick={handleRetire}>\n                          Retire\n                        </Button>\n                        <Button\n                            intent=\"primary\"\n                            disabled={isBusy}\n                            onClick={handleInvalidate}>\n                          Invalidate\n                        </Button>\n                      </ButtonGroup>\n                    : null}\n              </>\n            : null}\n        </ControlGroup>\n      </FormGroup>;\n\n    const supersedingItems = (\n      // It’s superseded (whether in current proposal or not)\n      itemData.status === 'superseded'\n      // Item is valid, proposal is editable, and no change to this item is proposed yet\n      || (activeCRIsEditable && !proposal && !editedClarification && itemData.status === 'valid')\n      // This item is being superseded in active proposal\n      // XXX: Redundant condition with the first one?\n      || (proposal?.type === 'amendment' && proposal.amendmentType === 'supersession'))\n      ? <FormGroup inline label=\"superseded by: \" css={css`margin: 0;`}>\n          <RelatedItems\n            availableClassIDs={[itemClass.meta.id]}\n            itemRefs={proposal?.type === 'amendment' && proposal.amendmentType === 'supersession'\n              ? proposal.supersedingItemIDs.\n                map(id => ({ itemID: id, classID: itemClass.meta.id, subregisterID }))\n              : (itemData.supersededBy ?? [])}\n            onChange={!isBusy && activeCRIsEditable && (\n              (proposal?.type === 'amendment' && proposal.amendmentType === 'supersession') ||\n              (!proposal && itemData.status === 'valid'))\n              ? (items) => items.length > 0\n                  ? handleSupersedeWith(items.map(ref => ref.itemID))\n                  : handleClearProposal()\n              : undefined}\n          />\n        </FormGroup>\n      : null;\n\n    const clarificationHasChanges = JSON.stringify(editedClarification) !== JSON.stringify(itemData.data);\n\n    const clarificationAction = (\n      (proposal && proposal?.type !== 'amendment')\n      || (activeCRIsEditable && !proposal && itemData.status === 'valid'))\n      ? <FormGroup inline label={`${proposal?.type ?? \"clarification\"}: `} css={css`margin: 0;`}>\n          {activeCRIsEditable\n            ? <ButtonGroup>\n                {editedClarification\n                  ? <>\n                      <Button\n                          intent={clarificationHasChanges ? \"primary\" : undefined}\n                          // TODO(perf): this is expensive if renders are frequent…\n                          disabled={!clarificationHasChanges || isBusy}\n                          onClick={(!proposal || proposal?.type === 'clarification')\n                            ? handleClarify\n                            : handleEditAddition}>\n                        Save\n                      </Button>\n                      <Button onClick={() => setEditedClarification(null)}>Do not save</Button>\n                    </>\n                  : <>\n                      <Button\n                          disabled={diffMode || isBusy}\n                          intent=\"primary\"\n                          outlined\n                          onClick={() => setEditedClarification(itemData.data)}>\n                        {!proposal ? \"Clarify\" : \"Edit\"}\n                      </Button>\n                      {proposal?.type === 'clarification'\n                        ? <>\n                            <Button\n                                disabled={diffMode || isBusy || proposal?.type !== 'clarification'}\n                                intent=\"warning\"\n                                onClick={handleClearProposal}>\n                              Clear\n                            </Button>\n                          </>\n                        : null}\n                    </>}\n              </ButtonGroup>\n            : <Button disabled>\n                {proposal?.type === 'clarification' ? \"Clarified\" : \"Added\"} in active proposal\n              </Button>}\n        </FormGroup>\n      : null;\n\n    // If there’s a CR context without active CR,\n    // or active CR isn’t the same as the one in CR context,\n    // then we can assume that the item is shown in proposal window\n    // and we’d set window title to proposal’s title rather than item’s.\n    // If there’s a CR context and active CR and they’re the same\n    // then it *could* be that the item is shown in its own tab;\n    // we will render proposal’s title if the item appears in the change request\n    // (makes sense because the user *is* technically viewing a proposal then).\n    const windowTitle: string = (\n      activeCR && (\n        !globallyActiveCRID\n        || activeCR.id !== globallyActiveCRID\n        || activeCR.items[itemPath]\n      )\n    ) ? `Proposal ${maybeEllipsizeString(activeCR.justification, 20)}…`\n      : `${itemClass.meta.title ?? 'register item'} #${itemData.id}`;\n\n    return (\n      <TabContentsWithActions\n        actions={<>\n          <FormGroup\n              inline\n              labelInfo={<HelpTooltip\n                icon='info-sign'\n                content={<>\n                  <H5>{itemClass.meta.title}</H5>\n                  {itemClass.meta.description ?? \"No description is provided for this register item class.\"}\n                  <UL>\n                    <li>Class ID: {itemClassID}</li>\n                    <li>Subregister ID: {subregisterID ?? 'N/A'}</li>\n                    <li>UUID: {itemID}</li>\n                  </UL>\n                </>}\n              />}\n              label={<>\n                <strong>{itemClass.meta.title}</strong>\n                {subregisterID\n                  ? <span title=\"Subregister\"> in {subregisters?.[subregisterID]?.title ?? subregisterID}</span>\n                  : null}\n              </>}\n              css={css`margin: 0; .bp4-form-content { display: flex; flex-flow: row wrap; gap: 10px; }`}>\n            {itemStatus}\n            {supersedingItems}\n            {clarificationAction}\n          </FormGroup>\n        </>}\n        main={\n          <Card css={css`position: absolute; inset: ${inProposalWithID ? '0' : '10px'}; overflow-y: auto;`}>\n            <Helmet><title>{windowTitle}</title></Helmet>\n            {details}\n          </Card>\n        }\n      />\n    );\n\n  } else if (itemResponse.isUpdating) {\n    return <div className={Classes.SKELETON}>Loading…</div>;\n\n  } else {\n    const inCRWithID = getCRIDFromProposedItemPath(uri);\n    if (inCRWithID !== null && activeCR?.id !== inCRWithID) {\n      return <NonIdealState\n        icon=\"help\"\n        title=\"This item does not exist…\"\n        description={\n          <>\n            …but it might be proposed.\n            <br />\n            {jumpTo\n              ? <Button\n                    css={css`margin: 10px;`}\n                    intent=\"primary\"\n                    onClick={() => jumpTo?.(`${Protocols.CHANGE_REQUEST}:${crIDToCRPath(inCRWithID)}`)}>\n                  Go to proposal\n                </Button>\n              : null}\n          </>\n        }\n      />;\n    } else {\n      return <NonIdealState\n        icon=\"heart-broken\"\n        title=\"Unable to show item\"\n        description=\"Item may not exist, or use unexpected data format.\"\n      />;\n    }\n  }\n};\n\n\nconst ItemTitle: React.FC<{ uri: string }> = function ({ uri }) {\n  const { value: ref } = useItemRef(uri);\n  const { value: clsConfig } = useItemClassConfig(ref?.classID ?? 'NONEXISTENT_CLASS_ID');\n  const { value: itemData } = useSingleRegisterItemData(ref);\n  const fallbackView = (() => <>{ref?.itemID ?? uri}</>);\n  const View = itemData ? (clsConfig?.views.listItemView ?? fallbackView) : fallbackView;\n  return <View\n    itemRef={ref ?? dummyRef}\n    itemData={itemData}\n  />;\n}\n\n\nexport default {\n  main: ItemDetail,\n  title: ItemTitle,\n};\n\n\nconst dummyRef: InternalItemReference = {\n  itemID: 'NONEXISTENT_ITEM_ID',\n  classID: 'NONEXISTENT_CLASS_ID',\n  subregisterID: undefined,\n};\n\n\nconst FormGroup = styled(BaseFormGroup)`\n  margin: 0;\n  label.bp4-label {\n    white-space: nowrap;\n  }\n`;\n"]}

package/compiled/views/detail/RegisterMeta/RegisterMetaForm.js

@@ -0,0 +1,135 @@
+/** @jsx jsx */
+/** @jsxFrag React.Fragment */
+import update from 'immutability-helper';
+import React from 'react';
+import { jsx, css } from '@emotion/react';
+import styled from '@emotion/styled';
+import { FormGroup as BaseFormGroup, Classes, ControlGroup, InputGroup, TextArea, HTMLTable, HTMLSelect, Button, ButtonGroup, } from '@blueprintjs/core';
+import { DatePicker, TimePrecision } from '@blueprintjs/datetime';
+import HelpTooltip from '@riboseinc/paneron-extension-kit/widgets/HelpTooltip';
+import { isStakeholderRole } from '../../../types';
+import { STAKEHOLDER_ROLES, StakeholderRole } from '../../../types/stakeholder';
+const DUMMY_VERSION = { id: '', timestamp: new Date() };
+const DUMMY_CONTACT = {
+    label: 'email',
+    value: ''
+};
+const DUMMY_PARTY = {
+    name: '',
+    contacts: [DUMMY_CONTACT],
+};
+const DUMMY_STAKEHOLDER = {
+    role: StakeholderRole.Submitter,
+    name: '',
+    gitServerUsername: undefined,
+    parties: [DUMMY_PARTY],
+};
+const RegisterMetaForm = function ({ value, onChange, className }) {
+    function handleOperatingLanguageChange(fieldName) {
+        return (evt) => {
+            const newValue = update(value, { operatingLanguage: op => update(op ?? {}, { [fieldName]: { $set: evt.currentTarget.value } }) });
+            onChange(newValue);
+        };
+    }
+    function makeFormEventHandler(func) {
+        return (evt) => {
+            const spec = func(evt.currentTarget.value);
+            if (spec) {
+                onChange(update(value, spec));
+            }
+        };
+    }
+    const stakeholders = value.stakeholders ?? [];
+    function makeStakeholderChangeHandler(idx, func) {
+        return makeFormEventHandler(val => ({ stakeholders: { [idx]: func(val) } }));
+    }
+    function handleStakeholderAdd() {
+        onChange({ ...value, stakeholders: [...stakeholders, DUMMY_STAKEHOLDER] });
+    }
+    return (jsx("div", { css: css `display: flex; flex-flow: row wrap; align-content: flex-start; align-items: flex-start; gap: 10px;`, className: className },
+        jsx(SuperFormGroup, { label: "Basics:" },
+            jsx(FormGroup, { label: "Name:" },
+                jsx(InputGroup, { fill: true, value: value.name || '', readOnly: !onChange, onChange: makeFormEventHandler(val => ({ name: { $set: val } })) })),
+            jsx(FormGroup, { label: "Uniform resource identifier:" },
+                jsx(InputGroup, { fill: true, type: "url", value: value.uniformResourceIdentifier || '', readOnly: !onChange, onChange: makeFormEventHandler(val => ({ uniformResourceIdentifier: { $set: val } })) })),
+            jsx(FormGroup, { label: "Content summary:" },
+                jsx(TextArea, { fill: true, value: value.contentSummary || '', readOnly: !onChange, onChange: makeFormEventHandler(val => ({ contentSummary: { $set: val } })) })),
+            jsx(FormGroup, { label: "Operating language (locale):", helperText: "Name, country and ISO 639-2 language code." },
+                jsx(ControlGroup, { vertical: true },
+                    jsx(InputGroup, { readOnly: !onChange, placeholder: "E.g., Welsh", value: value.operatingLanguage?.name ?? '', onChange: handleOperatingLanguageChange('name') }),
+                    jsx(InputGroup, { readOnly: !onChange, placeholder: "3-character numerical country code from ISO 3166-1", value: value.operatingLanguage?.country ?? '', onChange: handleOperatingLanguageChange('country') }),
+                    jsx(InputGroup, { readOnly: !onChange, placeholder: "3-character language code from ISO 639-2", value: value.operatingLanguage?.languageCode ?? '', onChange: handleOperatingLanguageChange('languageCode') })))),
+        jsx(SuperFormGroup, { label: "Version: ", css: css `padding-bottom: 0;` },
+            jsx(FormGroup, { label: "Identifier: " },
+                jsx(InputGroup, { value: value.version?.id ?? '', readOnly: !onChange, placeholder: "E.g., 1.2", onChange: makeFormEventHandler(val => ({ version: v => update(v ?? DUMMY_VERSION, { id: { $set: val } }) })) })),
+            jsx(FormGroup, { label: "Published on: ", helperText: jsx(React.Fragment, null,
+                    "Date and time are",
+                    jsx("br", null),
+                    "in ",
+                    Intl.DateTimeFormat().resolvedOptions().timeZone,
+                    ".",
+                    " ",
+                    jsx(HelpTooltip, { content: jsx(React.Fragment, null,
+                            "Times are in your computer\u2019s current time zone.",
+                            onChange
+                                ? " When specifying, make sure to offset accordingly if it is different than register publication time zone."
+                                : null) })) },
+                jsx(DatePicker, { css: css `margin: 0 -${PADDING};`, timePrecision: TimePrecision.MINUTE, value: value.version?.timestamp ?? null, showActionsBar: onChange ? true : false, onChange: (val) => onChange(update(value, val !== null
+                        ? { version: v => update(v ?? DUMMY_VERSION, { timestamp: { $set: val } }) }
+                        : { $unset: ['version'] })) }))),
+        jsx(SuperFormGroup, { label: "Stakeholders:", helperText: onChange
+                ? jsx(Button, { onClick: handleStakeholderAdd, icon: "add" }, "Add")
+                : null }, stakeholders.length > 0
+            ? jsx(HTMLTable, { css: css `margin: 0 -${PADDING};` },
+                jsx("thead", null,
+                    jsx("tr", { css: css `& > * { white-space: nowrap }` },
+                        jsx("th", null, "Role"),
+                        jsx("th", null, "Name"),
+                        jsx("th", null, "Git server username"),
+                        jsx("th", null, "Parties"),
+                        jsx("th", null, "Name"),
+                        jsx("th", null, "Email"))),
+                jsx("tbody", null, [...stakeholders.entries()].map(([idx, s]) => jsx("tr", { key: idx },
+                    jsx("td", null,
+                        jsx(HTMLSelect, { options: STAKEHOLDER_ROLES.map(r => ({ value: r, label: r })), disabled: !onChange, onChange: makeStakeholderChangeHandler(idx, (val) => isStakeholderRole(val)
+                                ? { role: { $set: val } } // Why do we need to cast this
+                                : {}), value: s.role })),
+                    jsx("td", null,
+                        jsx(InputGroup, { readOnly: !onChange, onChange: makeStakeholderChangeHandler(idx, (val) => ({ name: { $set: val } })), value: s.name })),
+                    jsx("td", null,
+                        jsx(InputGroup, { readOnly: !onChange, onChange: makeStakeholderChangeHandler(idx, (val) => ({ gitServerUsername: { $set: val || undefined } })), value: s.gitServerUsername || '' })),
+                    jsx("td", null,
+                        jsx(ControlGroup, { vertical: s.parties.length > 1 }, s.parties.map((party, partyIdx) => jsx(ButtonGroup, { key: partyIdx },
+                            jsx(Button, { key: "delete", outlined: true, disabled: !onChange || s.parties.length < 2 || party.name !== '', title: "Delete this party", onClick: () => onChange(update(value, { stakeholders: { [idx]: { parties: { $splice: [[partyIdx, 1]] } } } })), icon: "cross" }),
+                            partyIdx === s.parties.length - 1
+                                ? jsx(Button, { key: "add", outlined: true, disabled: !onChange, onClick: () => onChange(update(value, { stakeholders: { [idx]: { parties: { $push: [DUMMY_PARTY] } } } })), title: "Append a party", icon: "plus" })
+                                : null)))),
+                    jsx("td", null,
+                        jsx(ControlGroup, { vertical: s.parties.length > 1 }, s.parties.map((party, partyIdx) => jsx(InputGroup, { key: partyIdx, readOnly: !onChange, placeholder: "Individual or organization", onChange: makeStakeholderChangeHandler(idx, (val) => ({ parties: { [partyIdx]: { name: { $set: val } } } })), value: party.name })))),
+                    jsx("td", null,
+                        jsx(ControlGroup, { vertical: s.parties.length > 1 }, s.parties.map((party, partyIdx) => jsx(InputGroup, { key: partyIdx, type: "email", placeholder: "Contact email", readOnly: !onChange, onChange: makeStakeholderChangeHandler(idx, (val) => ({ parties: { [partyIdx]: { contacts: { 0: { value: { $set: val } } } } } })), value: party.contacts[0].value || '' }))))))))
+            : null)));
+};
+const PADDING = '11px';
+const FormGroup = styled(BaseFormGroup) `
+  margin: 0;
+`;
+const SuperFormGroup_ = styled(FormGroup) `
+  border-radius: 5px;
+  padding: ${PADDING};
+  background: white;
+  > label.bp4-label {
+    font-weight: bold;
+    margin-bottom: ${PADDING};
+  }
+  > .bp4-form-content {
+    display: flex;
+    flex-flow: column nowrap;
+    gap: ${PADDING};
+  }
+`;
+const SuperFormGroup = function (props) {
+    return jsx(SuperFormGroup_, { ...props, className: Classes.ELEVATION_3 });
+};
+export default RegisterMetaForm;
+//# sourceMappingURL=RegisterMetaForm.js.map

package/compiled/views/detail/RegisterMeta/index.js

@@ -0,0 +1,61 @@
+/** @jsx jsx */
+/** @jsxFrag React.Fragment */
+import React, { useState, useContext } from 'react';
+import { jsx } from '@emotion/react';
+import { Button, ButtonGroup, NonIdealState, Spinner } from '@blueprintjs/core';
+import { DatasetContext } from '@riboseinc/paneron-extension-kit/context';
+import { BrowserCtx } from '../../BrowserCtx';
+import { isRegisterMetadata } from '../../../types';
+import { isOwner } from '../../../types/stakeholder';
+import { REGISTER_METADATA_FILENAME } from '../../../common';
+import { TabContentsWithActions } from '../../util';
+import RegisterMetaForm from './RegisterMetaForm';
+const RegisterMeta = function () {
+    const { updateObjects, performOperation } = useContext(DatasetContext);
+    const { registerMetadata, stakeholder } = useContext(BrowserCtx);
+    const [editedMetadata, setEditedMetadata] = useState(null);
+    const canChange = updateObjects ? true : false;
+    const didChange = registerMetadata && editedMetadata && JSON.stringify(editedMetadata) !== JSON.stringify(registerMetadata);
+    function handleClear() {
+        setEditedMetadata(null);
+    }
+    async function handleSave() {
+        if (!updateObjects) {
+            throw new Error("Dataset is read-only");
+        }
+        if (!stakeholder || !isOwner(stakeholder)) {
+            throw new Error("Register meta is only meant to be edited by owner");
+        }
+        if (!isRegisterMetadata(editedMetadata)) {
+            throw new Error("Invalid register metadata");
+        }
+        await performOperation('saving register meta', updateObjects)({
+            commitMessage: "edited register metadata",
+            objectChangeset: {
+                [REGISTER_METADATA_FILENAME]: {
+                    oldValue: registerMetadata,
+                    newValue: editedMetadata,
+                },
+            },
+        });
+        setEditedMetadata(null);
+    }
+    if (registerMetadata) {
+        return (jsx(TabContentsWithActions, { actions: jsx(React.Fragment, null,
+                jsx(ButtonGroup, null,
+                    jsx(Button, { onClick: handleSave, disabled: !didChange || !canChange, intent: didChange && canChange ? "primary" : undefined }, "Save"),
+                    jsx(Button, { onClick: handleClear, disabled: !didChange || !canChange }, "Clear changes"))), main: jsx(RegisterMetaForm, { value: editedMetadata ?? registerMetadata, onChange: updateObjects ? setEditedMetadata : undefined }) }));
+    }
+    else if (registerMetadata === undefined) {
+        return jsx(NonIdealState, { icon: jsx(Spinner, null) });
+    }
+    else {
+        return jsx(NonIdealState, { icon: "heart-broken", description: "Failed to read registry metadata." });
+    }
+};
+export default {
+    main: RegisterMeta,
+    title: () => jsx(React.Fragment, null, "Register Metadata"),
+    plainTitle: async () => "register metadata",
+};
+//# sourceMappingURL=index.js.map

package/compiled/views/detail/index.js

@@ -0,0 +1,11 @@
+import protocolRegistry, { isValidProtocol } from '../protocolRegistry';
+export async function getPlainTitle(uri) {
+    const [proto, _path] = uri.split(':');
+    if (isValidProtocol(proto)) {
+        return await protocolRegistry[proto].plainTitle?.(_path) ?? 'N/A';
+    }
+    else {
+        throw new Error("Invalid protocol");
+    }
+}
+//# sourceMappingURL=index.js.map

package/compiled/views/diffing/InlineDiff.js

@@ -0,0 +1,20 @@
+/** @jsx jsx */
+/** @jsxFrag React.Fragment */
+import { jsx } from '@emotion/react';
+import React from 'react';
+import ReactDOM from 'react-dom/server';
+import VisualDiff from 'react-visual-diff';
+import AnnotatedChange from '../AnnotatedChange';
+const InlineDiff = React.memo(({ DetailView, sharedRefComponents, item1, item2 }) => {
+    // TODO: Make VisualDiff work. Currently, it doesn’t apparently when item detail views use hooks.
+    // Which is often. Either make item views hook-free
+    // (which means primarily eliminating useRegisterItemData() by inferring and pre-fetching
+    // related item data), or work out another way to diff two React elements.
+    console.debug(item1.description, item2.description);
+    const left = jsx("div", { dangerouslySetInnerHTML: { __html: ReactDOM.renderToString(jsx(DetailView, { itemRef: sharedRefComponents, itemData: item1 })) } });
+    const right = jsx("div", { dangerouslySetInnerHTML: { __html: ReactDOM.renderToString(jsx(DetailView, { itemRef: sharedRefComponents, itemData: item2 })) } });
+    return jsx(VisualDiff, { left: left, right: right, renderChange: AnnotatedChange });
+}, (prevProps, nextProps) => JSON.stringify(prevProps.item2) === JSON.stringify(nextProps.item2) &&
+    JSON.stringify(prevProps.item1) === JSON.stringify(nextProps.item1));
+export default InlineDiff;
+//# sourceMappingURL=InlineDiff.js.map

package/compiled/views/diffing/StructuredDiff.js

@@ -0,0 +1,38 @@
+/** @jsx jsx */
+/** @jsxFrag React.Fragment */
+import { diff, formatters } from 'jsondiffpatch';
+import { jsx, css } from '@emotion/react';
+import React, { useEffect, useRef, useState } from 'react';
+import { Switch } from '@blueprintjs/core';
+const StructuredDiff = React.memo(({ item1, item2, showUnchanged, className }) => {
+    const diffContainerRef = useRef(null);
+    // Is ignored if managed via prop.
+    const [_showUnchanged, setShowUnchanged] = useState(false);
+    const item1json = JSON.stringify(item1);
+    const item2json = JSON.stringify(item2);
+    useEffect(() => {
+        if (diffContainerRef.current) {
+            const delta = diff(item1, item2);
+            formatters.html.showUnchanged(showUnchanged ?? _showUnchanged);
+            if (delta) {
+                diffContainerRef.current.innerHTML = formatters.html.format(delta, item1);
+            }
+            else {
+                diffContainerRef.current.innerHTML = formatters.html.format({}, item1);
+            }
+        }
+    }, [item1json, item2json, diffContainerRef.current, showUnchanged, _showUnchanged]);
+    // TODO: Make VisualDiff work. Currently, it doesn’t apparently when item detail views use hooks.
+    // Which is often. Either make item views hook-free
+    // (which means primarily eliminating useRegisterItemData() by inferring and pre-fetching
+    // related item data), or work out another way to diff two React elements.
+    return jsx("div", { css: css `display: flex; flex-flow: column nowrap;`, className: className },
+        showUnchanged === undefined
+            ? jsx(Switch, { checked: _showUnchanged, onChange: evt => setShowUnchanged(evt.currentTarget.checked), label: "Show unchanged properties" })
+            : null,
+        jsx("div", { ref: diffContainerRef, css: css `flex: 1; overflow: auto;` }));
+}, (prevProps, nextProps) => JSON.stringify(prevProps.item2) === JSON.stringify(nextProps.item2) &&
+    JSON.stringify(prevProps.item1) === JSON.stringify(nextProps.item1) &&
+    prevProps.showUnchanged === nextProps.showUnchanged);
+export default StructuredDiff;
+//# sourceMappingURL=StructuredDiff.js.map

package/compiled/views/hooks/useCustomView.js

@@ -0,0 +1,14 @@
+import { useContext } from 'react';
+import { BrowserCtx } from '../BrowserCtx';
+export default function useCustomView(viewID) {
+    const { customViews } = useContext(BrowserCtx);
+    const view = customViews.find(v => v.id === viewID);
+    return {
+        value: view,
+        errors: [],
+        refresh: () => void 0,
+        isUpdating: false,
+        _reqCounter: 0,
+    };
+}
+//# sourceMappingURL=useCustomView.js.map