gwchq-textjam 0.2.10 → 0.2.11

package/dist/index.js

@@ -68344,8 +68344,8 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */ __webpack_require__.d(__webpack_exports__, {
 /* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
 /* harmony export */ });
-/* harmony import */ var C_Project_source_gwchq_textjam_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(89379);
-/* harmony import */ var C_Project_source_gwchq_textjam_node_modules_babel_runtime_helpers_esm_objectWithoutProperties_js__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(53986);
+/* harmony import */ var D_gwc_gwchq_textjam_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(89379);
+/* harmony import */ var D_gwc_gwchq_textjam_node_modules_babel_runtime_helpers_esm_objectWithoutProperties_js__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(53986);
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(51649);
 /* harmony import */ var _hello_pangea_dnd__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(98850);
 /* harmony import */ var react_redux__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(14062);
@@ -68369,7 +68369,7 @@ var DraggableTab = _ref => {
       panelIndex,
       fileIndex
     } = _ref,
-    otherProps = (0,C_Project_source_gwchq_textjam_node_modules_babel_runtime_helpers_esm_objectWithoutProperties_js__WEBPACK_IMPORTED_MODULE_5__/* ["default"] */ .A)(_ref, _excluded);
+    otherProps = (0,D_gwc_gwchq_textjam_node_modules_babel_runtime_helpers_esm_objectWithoutProperties_js__WEBPACK_IMPORTED_MODULE_5__/* ["default"] */ .A)(_ref, _excluded);
   var openFiles = (0,react_redux__WEBPACK_IMPORTED_MODULE_1__.useSelector)(state => state.editor.openedFiles);
   var openFilesCount = openFiles[panelIndex].length;
   var dispatch = (0,react_redux__WEBPACK_IMPORTED_MODULE_1__.useDispatch)();
@@ -68386,7 +68386,7 @@ var DraggableTab = _ref => {
       switchToFileTab(panelIndex, (fileIndex + openFilesCount - 1) % openFilesCount);
     }
   };
-  var InnerTab = () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(react_tabs__WEBPACK_IMPORTED_MODULE_2__.Tab, (0,C_Project_source_gwchq_textjam_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_7__/* ["default"] */ .A)((0,C_Project_source_gwchq_textjam_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_7__/* ["default"] */ .A)({
+  var InnerTab = () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(react_tabs__WEBPACK_IMPORTED_MODULE_2__.Tab, (0,D_gwc_gwchq_textjam_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_7__/* ["default"] */ .A)((0,D_gwc_gwchq_textjam_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_7__/* ["default"] */ .A)({
     onClick: e => {
       e.stopPropagation();
       switchToFileTab(panelIndex, fileIndex);
@@ -68404,7 +68404,7 @@ var DraggableTab = _ref => {
         draggableProps,
         dragHandleProps
       } = _ref2;
-      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("div", (0,C_Project_source_gwchq_textjam_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_7__/* ["default"] */ .A)((0,C_Project_source_gwchq_textjam_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_7__/* ["default"] */ .A)((0,C_Project_source_gwchq_textjam_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_7__/* ["default"] */ .A)({
+      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("div", (0,D_gwc_gwchq_textjam_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_7__/* ["default"] */ .A)((0,D_gwc_gwchq_textjam_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_7__/* ["default"] */ .A)((0,D_gwc_gwchq_textjam_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_7__/* ["default"] */ .A)({
         className: "draggable-tab",
         ref: innerRef
       }, draggableProps), dragHandleProps), {}, {
@@ -68426,8 +68426,8 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */ __webpack_require__.d(__webpack_exports__, {
 /* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
 /* harmony export */ });
-/* harmony import */ var C_Project_source_gwchq_textjam_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(89379);
-/* harmony import */ var C_Project_source_gwchq_textjam_node_modules_babel_runtime_helpers_esm_objectWithoutProperties_js__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(53986);
+/* harmony import */ var D_gwc_gwchq_textjam_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(89379);
+/* harmony import */ var D_gwc_gwchq_textjam_node_modules_babel_runtime_helpers_esm_objectWithoutProperties_js__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(53986);
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(51649);
 /* harmony import */ var _hello_pangea_dnd__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(98850);
 /* harmony import */ var react_tabs__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(39243);
@@ -68446,8 +68446,8 @@ var DroppableTabList = _ref => {
       children: _children,
       index
     } = _ref,
-    otherProps = (0,C_Project_source_gwchq_textjam_node_modules_babel_runtime_helpers_esm_objectWithoutProperties_js__WEBPACK_IMPORTED_MODULE_4__/* ["default"] */ .A)(_ref, _excluded);
-  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_tabs__WEBPACK_IMPORTED_MODULE_1__.TabList, (0,C_Project_source_gwchq_textjam_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_5__/* ["default"] */ .A)((0,C_Project_source_gwchq_textjam_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_5__/* ["default"] */ .A)({}, otherProps), {}, {
+    otherProps = (0,D_gwc_gwchq_textjam_node_modules_babel_runtime_helpers_esm_objectWithoutProperties_js__WEBPACK_IMPORTED_MODULE_4__/* ["default"] */ .A)(_ref, _excluded);
+  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_tabs__WEBPACK_IMPORTED_MODULE_1__.TabList, (0,D_gwc_gwchq_textjam_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_5__/* ["default"] */ .A)((0,D_gwc_gwchq_textjam_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_5__/* ["default"] */ .A)({}, otherProps), {}, {
     children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_hello_pangea_dnd__WEBPACK_IMPORTED_MODULE_6__.Droppable, {
       direction: "horizontal",
       droppableId: index.toString(),
@@ -68457,7 +68457,7 @@ var DroppableTabList = _ref => {
           droppableProps,
           placeholder
         } = _ref2;
-        return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", (0,C_Project_source_gwchq_textjam_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_5__/* ["default"] */ .A)((0,C_Project_source_gwchq_textjam_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_5__/* ["default"] */ .A)({
+        return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", (0,D_gwc_gwchq_textjam_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_5__/* ["default"] */ .A)((0,D_gwc_gwchq_textjam_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_5__/* ["default"] */ .A)({
           className: "droppable-tab-list"
         }, droppableProps), {}, {
           ref: innerRef,
@@ -103011,7 +103011,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */ __webpack_require__.d(__webpack_exports__, {
 /* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
 /* harmony export */ });
-/* harmony import */ var C_Project_source_gwchq_textjam_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(89379);
+/* harmony import */ var D_gwc_gwchq_textjam_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(89379);
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(51649);
 /* harmony import */ var react_redux__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(14062);
 /* harmony import */ var _redux_EditorSlice__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(68512);
@@ -103091,7 +103091,7 @@ var ProjectName = _ref => {
       id: "project_name_label",
       className: _styles_module_scss__WEBPACK_IMPORTED_MODULE_3__["default"].projectLabel,
       children: "Project Name"
-    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("div", (0,C_Project_source_gwchq_textjam_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_7__/* ["default"] */ .A)((0,C_Project_source_gwchq_textjam_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_7__/* ["default"] */ .A)({
+    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("div", (0,D_gwc_gwchq_textjam_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_7__/* ["default"] */ .A)((0,D_gwc_gwchq_textjam_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_7__/* ["default"] */ .A)({
       className: classnames__WEBPACK_IMPORTED_MODULE_2___default()(_styles_module_scss__WEBPACK_IMPORTED_MODULE_3__["default"].projectName, className)
     }, hoverProps), {}, {
       children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)((components_Tooltip_Tooltip__WEBPACK_IMPORTED_MODULE_8___default()), {
@@ -369195,7 +369195,7 @@ function HtmlConsole({ consoleLogs, }) {
     return ((0, jsx_runtime_1.jsx)("pre", { className: (0, classnames_1.default)(styles_module_scss_1.default.console, styles_module_scss_1.default.webConsole), children: consoleLogs.length === 0 ? ((0, jsx_runtime_1.jsx)("span", { children: "No logs received yet" })) : (consoleLogs.map((log, i) => {
             return ((0, jsx_runtime_1.jsxs)("div", { className: (0, classnames_1.default)(styles_module_scss_1.default.webConsoleLine, styles_module_scss_1.default[log.method]), children: [(0, jsx_runtime_1.jsxs)("span", { children: [(log.method === "error" || log.method === "warn") && ((0, jsx_runtime_1.jsx)(SvgIcon_1.SvgIcon, { SvgElement: log.method === "error" ? alert_svg_1.default : alertTriangle_svg_1.default, size: 12, className: log.method === "error"
                                     ? styles_module_scss_1.default.errorIcon
-                                    : styles_module_scss_1.default.warnIcon })), log.timestamp && ((0, jsx_runtime_1.jsx)("span", { className: styles_module_scss_1.default.timestamp, children: log.timestamp }))] }), log.data?.map((node, idx) => ((0, jsx_runtime_1.jsxs)("span", { children: [(0, jsx_runtime_1.jsx)(LogRenderer_1.default, { node: node }), log.data && idx < log.data.length - 1 && " "] }, idx)))] }, i));
+                                    : styles_module_scss_1.default.warnIcon })), log.timestamp && ((0, jsx_runtime_1.jsx)("span", { className: styles_module_scss_1.default.timestamp, children: log.timestamp }))] }), (0, jsx_runtime_1.jsx)("span", { className: styles_module_scss_1.default.consoleMessageContent, children: (0, jsx_runtime_1.jsxs)("span", { className: styles_module_scss_1.default.consoleMessageInline, children: [log.data?.map((node, idx) => ((0, jsx_runtime_1.jsxs)("span", { children: [(0, jsx_runtime_1.jsx)(LogRenderer_1.default, { node: node }), log.data && idx < log.data.length - 1 && " "] }, idx))), log.count && log.count > 1 && ((0, jsx_runtime_1.jsx)("span", { className: styles_module_scss_1.default.consoleCount, children: log.count }))] }) })] }, i));
         })) }));
 }
 exports["default"] = HtmlConsole;
@@ -372495,7 +372495,7 @@ const WebComponentProject = ({ nameEditable = false, sidebarOptions = [], packag
         return () => clearTimeout(timeout);
     }, [project]);
     renderer.link = function (data) {
-        return `<a href="${data.href}" target="_blank" rel="noreferrer"
+        return `<a href="${data.href}" target="_blank" rel="noreferrer"
     }">${data.text}</a>`;
     };
     marked_1.marked.setOptions({
@@ -373511,6 +373511,7 @@ const useProject = ({ projectData, projectContent = null, isContentLoaded = null
     const isPreview = (0, stores_1.useAppSelector)((state) => state.editor.isOutputOnly);
     const commitIdLoadTriggered = (0, stores_1.useAppSelector)((state) => state.editor.commitIdLoadTriggered);
     const isLoadingCommit = (0, stores_1.useAppSelector)((state) => state.editor.isLoadingCommit);
+    const saveTriggered = (0, stores_1.useAppSelector)((state) => state.editor.saveTriggered);
     const isMounted = (0, useIsMounted_1.useIsMounted)();
     const dispatch = (0, react_redux_1.useDispatch)();
     const cacheKey = project.identifier ?? projectData?.identifier;
@@ -373585,15 +373586,11 @@ const useProject = ({ projectData, projectContent = null, isContentLoaded = null
         }
         // if user has chosen start new for a draft, ignore cache completely
         if (!projectData?.commitId && shouldBypassCachedDraft) {
-            if (!loadTemplateProjectData || isTemplateDataLoaded) {
-                setProjectDataFromTemplate(projectData);
-                dispatch((0, EditorSlice_1.setCommits)({ commits: projectData?.commits ?? [] }));
-            }
-            else {
+            if (loadTemplateProjectData && !isTemplateDataLoaded) {
                 dispatch((0, EditorSlice_1.setLoading)(types_1.LoadingState.IDLE));
-                loadTemplateProjectData?.();
+                loadTemplateProjectData();
+                return;
             }
-            return;
         }
         // same draft project - show modal before normal cache flow
         if (shouldShowUnsavedDraftModal && cachedProject) {
@@ -373608,8 +373605,16 @@ const useProject = ({ projectData, projectContent = null, isContentLoaded = null
             dispatch((0, EditorSlice_1.setCommits)({ commits: projectData?.commits ?? [] }));
             return;
         }
+        const isSaveInProgressOrSettling = saveTriggered ||
+            savingState === types_1.SavingState.PROCESS ||
+            savingState === types_1.SavingState.SUCCESS;
+        if (isSaveInProgressOrSettling) {
+            return;
+        }
         // if no local data found or cache should not be used, and commitId provided, try to load from commit
-        if ((hasNoData || !shouldUseCache) && projectData?.commitId) {
+        if ((hasNoData || !shouldUseCache) &&
+            projectData?.commitId &&
+            project.commitId !== projectData.commitId) {
             // if we need to load content, but the loading is failed, set failed state and stop
             if (isContentLoaded === false) {
                 dispatch((0, EditorSlice_1.setLoading)(types_1.LoadingState.FAILED));
@@ -373650,6 +373655,9 @@ const useProject = ({ projectData, projectContent = null, isContentLoaded = null
         shouldBypassCachedDraft,
         shouldShowUnsavedDraftModal,
         openUnsavedDraftModal,
+        project.commitId,
+        saveTriggered,
+        savingState,
     ]);
     // Load commit data when commitIdLoadTriggered is set
     (0, react_1.useEffect)(() => {
@@ -373821,6 +373829,7 @@ const useProjectPersistence = ({ user, projectData, hasShownSavePrompt, saveProj
     const justLoaded = (0, stores_1.useAppSelector)((state) => state.editor.justLoaded);
     const leaveFlow = (0, stores_1.useAppSelector)((state) => state.leaveFlow);
     const codeRunTriggered = (0, stores_1.useAppSelector)((state) => state.editor.codeRunTriggered);
+    const existingCommits = (0, stores_1.useAppSelector)((state) => state.editor.commits);
     const dispatch = (0, react_redux_1.useDispatch)();
     const { deleteValueFromCache, upsertCacheValue } = (0, useProjectCache_1.useProjectCache)();
     const handleSave = (0, react_1.useCallback)(async () => {
@@ -373867,7 +373876,21 @@ const useProjectPersistence = ({ user, projectData, hasShownSavePrompt, saveProj
                 }));
             return;
         }
-        const commits = projectData.commits ?? [];
+        const incomingCommits = projectData.commits ?? [];
+        const commitsById = new Map();
+        [...existingCommits, ...incomingCommits].forEach((commit) => {
+            if (!commit?.id)
+                return;
+            commitsById.set(commit.id, {
+                ...commitsById.get(commit.id),
+                ...commit,
+            });
+        });
+        const commits = Array.from(commitsById.values()).sort((a, b) => {
+            const aTime = new Date(a.createdAt || 0).getTime();
+            const bTime = new Date(b.createdAt || 0).getTime();
+            return bTime - aTime;
+        });
         // first save: new commitId incoming, but no commitId were set before
         const isFirstSave = commits.length === 1 && !project.commitId && projectData.commitId;
         // commit different: new commitId incoming, but another commitId is set before
@@ -373895,6 +373918,8 @@ const useProjectPersistence = ({ user, projectData, hasShownSavePrompt, saveProj
             hasStructureChanges: false,
             components: cleanedComponents,
             identifier: projectData.identifier,
+            commitId: projectData.commitId,
+            commits,
         };
         const newLastSavedSnapshot = (0, buildProjectSnapshot_1.buildProjectSnapshot)(cleanedProject);
         const updatedProjectSnapshot = {
@@ -373920,6 +373945,7 @@ const useProjectPersistence = ({ user, projectData, hasShownSavePrompt, saveProj
         saving,
         leaveFlow.requestId,
         leaveFlow.status,
+        existingCommits,
     ]);
     (0, react_1.useEffect)(() => {
         if (!saveTriggered || saving !== types_1.SavingState.IDLE)
@@ -374109,6 +374135,11 @@ const useUnsavedDraftResolution = ({ projectData, cachedProject, isCurrentOutdat
     // flag to ignore cached draft after Start New
     const [shouldBypassCachedDraft, setShouldBypassCachedDraft] = (0, react_1.useState)(false);
     const isSameDraftType = (0, react_1.useMemo)(() => isSameDraftProjectType(projectData, cachedProject), [projectData, cachedProject]);
+    (0, react_1.useEffect)(() => {
+        if (projectData?.commitId && shouldBypassCachedDraft) {
+            setShouldBypassCachedDraft(false);
+        }
+    }, [projectData?.commitId, shouldBypassCachedDraft]);
     // show modal only for matching draft when cache is valid and not bypassed
     const shouldShowUnsavedDraftModal = !!cachedProject &&
         !isCurrentOutdated &&

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "gwchq-textjam",
   "description": "Embeddable React editor used in Raspberry Pi text-based projects.",
-  "version": "0.2.10",
+  "version": "0.2.11",
   "license": "Apache-2.0",
   "homepage": "https://github.com/GirlsFirst/gwchq-textjam",
   "author": "Girls Who Code HQ",