diff --git a/CHANGELOG.md b/CHANGELOG.md index b289f8902..d60d5d823 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -6,6 +6,10 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/), ## Unreleased +### Fixed + +- Log in to save and log in now preserve the cache (#1137) + ## [0.28.12] - 2024-12-09 ### Fixed diff --git a/src/components/SaveButton/SaveButton.test.js b/src/components/SaveButton/SaveButton.test.js index 0905857c2..146720e0d 100644 --- a/src/components/SaveButton/SaveButton.test.js +++ b/src/components/SaveButton/SaveButton.test.js @@ -149,6 +149,7 @@ describe("When project is loaded", () => { expect(logInHandler).toHaveBeenCalled(); }); }); + describe("with webComponent=false", () => { let store; diff --git a/src/containers/WebComponentLoader.jsx b/src/containers/WebComponentLoader.jsx index 9d8daedc1..204ebdc5a 100644 --- a/src/containers/WebComponentLoader.jsx +++ b/src/containers/WebComponentLoader.jsx @@ -37,6 +37,7 @@ const WebComponentLoader = (props) => { hostStyles, // Pass in styles from the host identifier, instructions, + theme, loadRemixDisabled = false, outputOnly = false, outputPanels = ["text", "visual"], @@ -47,10 +48,10 @@ const WebComponentLoader = (props) => { senseHatAlwaysEnabled = false, showSavePrompt = false, sidebarOptions = [], - theme, useEditorStyles = false, // If true use the standard editor styling for the web component withProjectbar = false, withSidebar = false, + loadCache = true, // Always use cache unless explicitly disabled } = props; const dispatch = useDispatch(); const { t } = useTranslation(); @@ -60,7 +61,6 @@ const WebComponentLoader = (props) => { ? JSON.parse(localStorage.getItem(authKey)) : null; const user = useSelector((state) => state.auth.user || localStorageUser); - const [loadCache, setLoadCache] = useState(!!!user); const [loadRemix, setLoadRemix] = useState(!!user); const project = useSelector((state) => state.editor.project); const projectOwner = useSelector((state) => state.editor.project.user_name); @@ -99,10 +99,8 @@ const WebComponentLoader = (props) => { useEffect(() => { if (remixLoadFailed) { - setLoadCache(true); setLoadRemix(false); } else { - setLoadCache(!!!user); setLoadRemix(!!user); } }, [user, project, remixLoadFailed]); diff --git a/src/containers/WebComponentLoader.test.js b/src/containers/WebComponentLoader.test.js index c118a625d..34c5bac4f 100644 --- a/src/containers/WebComponentLoader.test.js +++ b/src/containers/WebComponentLoader.test.js @@ -315,6 +315,7 @@ describe("When no user is in state", () => { instructions={instructions} authKey={authKey} theme="light" + loadCache={true} /> , @@ -328,7 +329,7 @@ describe("When no user is in state", () => { code, accessToken: "my_token", loadRemix: true, - loadCache: false, + loadCache: true, remixLoadFailed: false, reactAppApiEndpoint: "http://localhost:3009", }); @@ -456,7 +457,7 @@ describe("When user is in state", () => { code: undefined, accessToken: "my_token", loadRemix: true, - loadCache: false, + loadCache: true, remixLoadFailed: false, reactAppApiEndpoint: "http://localhost:3009", }); @@ -486,7 +487,7 @@ describe("When user is in state", () => { code: undefined, accessToken: "my_token", loadRemix: false, - loadCache: false, + loadCache: true, remixLoadFailed: false, reactAppApiEndpoint: "http://localhost:3009", }); diff --git a/src/hooks/useProjectPersistence.js b/src/hooks/useProjectPersistence.js index 5e7b5462b..115d9a0f2 100644 --- a/src/hooks/useProjectPersistence.js +++ b/src/hooks/useProjectPersistence.js @@ -38,36 +38,24 @@ export const useProjectPersistence = ({ useEffect(() => { const saveProject = async () => { if (Object.keys(project).length !== 0) { - if (saveTriggered || (user && localStorage.getItem("awaitingSave"))) { + const identifier = project?.identifier; + const accessToken = user?.access_token; + const params = { reactAppApiEndpoint, accessToken }; + + if (saveTriggered) { if (isOwner(user, project)) { - dispatch( - syncProject("save")({ - reactAppApiEndpoint, - project, - accessToken: user.access_token, - autosave: false, - }), - ); - } else if (user && project.identifier) { await dispatch( - syncProject("remix")({ - reactAppApiEndpoint, - project, - accessToken: user.access_token, - }), + syncProject("save")({ ...params, project, autosave: false }), ); - // Ensure the remixed project is loaded, otherwise we'll get in a mess + } else if (user && identifier) { + await dispatch(syncProject("remix")({ ...params, project })); if (loadRemix) { - dispatch( - syncProject("loadRemix")({ - reactAppApiEndpoint, - identifier: project.identifier, - accessToken: user.access_token, - }), + // Ensure the remixed project is loaded, otherwise we'll get in a mess + await dispatch( + syncProject("loadRemix")({ ...params, identifier }), ); } } - localStorage.removeItem("awaitingSave"); } } }; diff --git a/src/hooks/useProjectPersistence.test.js b/src/hooks/useProjectPersistence.test.js index a80731a34..0ec078cbc 100644 --- a/src/hooks/useProjectPersistence.test.js +++ b/src/hooks/useProjectPersistence.test.js @@ -195,28 +195,6 @@ describe("When logged in", () => { }); }); - describe("When project has identifier and awaiting save", () => { - beforeEach(() => { - localStorage.setItem("awaitingSave", "true"); - syncProject.mockImplementationOnce(jest.fn((_) => remixProject)); - syncProject.mockImplementationOnce(jest.fn((_) => loadProject)); - renderHook(() => - useProjectPersistence({ - user: user2, - project: project, - }), - ); - jest.runAllTimers(); - }); - - test("Project remixed and saved to database", () => { - expect(remixProject).toHaveBeenCalledWith({ - project, - accessToken: user2.access_token, - }); - }); - }); - describe("When project has identifier and save triggered", () => { beforeEach(() => { syncProject.mockImplementationOnce(jest.fn((_) => remixProject)); @@ -277,28 +255,6 @@ describe("When logged in", () => { }); }); - describe("When project has no identifier and awaiting save", () => { - beforeEach(() => { - localStorage.setItem("awaitingSave", "true"); - syncProject.mockImplementationOnce(jest.fn((_) => saveProject)); - renderHook(() => - useProjectPersistence({ - user: user2, - project: { ...project, identifier: null }, - }), - ); - jest.runAllTimers(); - }); - - test("Project saved to database", () => { - expect(saveProject).toHaveBeenCalledWith({ - project: { ...project, identifier: null }, - accessToken: user2.access_token, - autosave: false, - }); - }); - }); - describe("When project has no identifier and save triggered", () => { beforeEach(() => { syncProject.mockImplementationOnce(jest.fn((_) => saveProject)); diff --git a/src/web-component.html b/src/web-component.html index a607aa1be..178c7c623 100644 --- a/src/web-component.html +++ b/src/web-component.html @@ -52,7 +52,6 @@ "download", "settings", "info", - "use_editor_styles" ]), ); diff --git a/src/web-component.js b/src/web-component.js index 9a8006752..885bbd96f 100644 --- a/src/web-component.js +++ b/src/web-component.js @@ -67,6 +67,7 @@ class WebComponent extends HTMLElement { "use_editor_styles", "with_projectbar", "with_sidebar", + "load_cache", ]; } @@ -86,6 +87,7 @@ class WebComponent extends HTMLElement { "use_editor_styles", "with_projectbar", "with_sidebar", + "load_cache", ].includes(name) ) { value = newVal !== "false";