@openstack_dev/gatsby-theme-marketing-oif-core 1.0.35-beta.6 → 1.0.36

package/.nvmrc

@@ -1 +1 @@
-20.19.4
+22.22.1

package/docs/plans/2026-03-20-yarn-install-warnings.md

@@ -0,0 +1,80 @@
+# Yarn Install Warnings Fix Plan
+
+Created: 2026-03-20
+Status: VERIFIED
+Approved: Yes
+Iterations: 0
+Worktree: No
+Type: Bugfix
+
+## Summary
+
+**Symptom:** ~80 warnings during `yarn install` — duplicate dependencies, unmet peer deps, incorrect peer dep versions, workspaces misconfiguration.
+**Trigger:** Running `yarn install` on the project.
+**Root Cause:** Multiple independent issues in `package.json`:
+
+1. `babel-preset-gatsby` listed in BOTH `dependencies` (^3.13.2) AND `devDependencies` (^3.14.0) — collision (2 warnings)
+2. `core-js` at ^2.6.11 but `babel-preset-gatsby` needs ^3.0.0 (1 warning)
+3. `immutable` at ^5.0.0-beta.5 — beta version, netlify-cms-lib-widgets wants ^3.7.6 (1 warning — not fixable, but beta should be upgraded to stable)
+4. Missing `"private": true` — workspaces warning (1 warning)
+5. `react-dnd` pinned at 15.1.1 but `openstack-uicore-foundation` peer dep wants ^16.0.0, and `react-dnd-html5-backend` is already at 16.0.1 (1 warning)
+
+**Remaining ~74 warnings are upstream issues** — packages declaring old peer deps (React 16/17, redux 3, etc.) that must be fixed in their respective repositories. These include:
+- `openstack-uicore-foundation@4.1.70` — 14 warnings (declares React ^16, redux ^3, redux-persist ^5, plus 6 unmet optional peer deps)
+- `decap-cms-app` internals — ~15 warnings (old react/redux peer deps in transitive deps)
+- `@ncwidgets/file-relation` + `@ncwidgets/id` — 5 warnings (declare React ^16, netlify-cms-app ^2)
+- `gatsby` internals — ~5 warnings (eslint-config-react-app, experimental react-server-dom-webpack)
+- `gatsby-plugin-decap-cms` — 4 warnings (webpack peer deps provided internally by gatsby)
+- `gatsby-plugin-google-fonts-v2@1.0.1` — 6 warnings (declares gatsby ^3||^4, no newer version exists)
+- `gatsby-plugin-netlify`, `gatsby-plugin-sass` — 2 warnings (webpack peer deps)
+- Direct deps providing openstack-uicore-foundation peer deps (react-select@2, react-tooltip@3, react-tabs@3, react-slick@0.27, react-avatar-editor@11, react-block-image@1, react-rte@0.16) — ~15 warnings (declare React <18, but exist to satisfy openstack-uicore-foundation peer deps)
+- `slick-carousel@1.8.1` — 1 warning (unmet jquery peer dep)
+- `navigation-widget@1.0.27` — 1 warning (declares React ^16)
+- `geotiff@2.0.4` — 1 warning (invalid "browsers" engine — transitive dep)
+
+## Investigation
+
+- None of the warning-causing direct dependencies (react-select, react-tooltip, react-tabs, react-slick, react-avatar-editor, react-block-image, react-rte, react-dnd, sweetalert2, core-js, immutable, netlify-cms-lib-widgets) are imported anywhere in `src/`. They exist solely as peer dep providers for `openstack-uicore-foundation`.
+- This is a Gatsby theme (`@openstack_dev/gatsby-theme-marketing-oif-core`) — child projects inherit its dependencies. Removing peer dep providers would break child themes.
+- `@ncwidgets/file-relation` and `@ncwidgets/id` ARE used in `src/cms/cms.js` for CMS widget registration.
+- Yarn v1 (classic) has no mechanism to suppress peer dependency warnings.
+
+## Fix Approach
+
+**Files:** `package.json`
+**Strategy:** Fix the 5 actionable issues in `package.json`. Document upstream issues for future reference.
+
+**Changes:**
+1. Remove `"babel-preset-gatsby": "^3.13.2"` from `dependencies` (keep `"^3.14.0"` in `devDependencies`)
+2. Upgrade `"core-js"` from `"^2.6.11"` to `"^3.0.0"` (satisfies babel-preset-gatsby peer dep)
+3. Upgrade `"immutable"` from `"^5.0.0-beta.5"` to `"^5.1.5"` (stable release)
+4. Add `"private": true` to package.json (suppresses workspaces warning)
+5. Upgrade `"react-dnd"` from `"15.1.1"` to `"^16.0.1"` (matches openstack-uicore-foundation peer dep and existing react-dnd-html5-backend@16.0.1)
+
+**Expected result:** Reduces warnings from ~80 to ~74. The remaining warnings require upstream package updates.
+
+## Progress
+
+- [x] Task 1: Fix actionable package.json warnings
+- [x] Task 2: Verify yarn install and build
+      **Tasks:** 2 | **Done:** 2
+
+## Tasks
+
+### Task 1: Fix actionable package.json warnings
+
+**Objective:** Apply the 5 package.json changes to eliminate actionable warnings
+**Files:** `package.json`
+**Changes:**
+1. Remove `babel-preset-gatsby` from `dependencies` (line 53)
+2. Change `core-js` from `"^2.6.11"` to `"^3.0.0"` (line 60)
+3. Change `immutable` from `"^5.0.0-beta.5"` to `"^5.1.5"` (line 95)
+4. Add `"private": true` after `"description"` field
+5. Change `react-dnd` from `"15.1.1"` to `"^16.0.1"` (line 115)
+**TDD:** N/A (configuration change, no unit tests applicable)
+**Verify:** `yarn install 2>&1 | grep -c "^warning"` — count should decrease by ~6
+
+### Task 2: Verify yarn install and build
+
+**Objective:** Confirm reduced warnings and no regressions
+**Verify:** `yarn install` (count warnings), `yarn build` or `yarn develop` (confirm no build breakage from core-js/react-dnd upgrade)

package/gatsby-browser.js

@@ -1,6 +1,3 @@
-import React from "react";
-import { ReduxWrapper } from "./src/state/ReduxWrapper";
+import { ReduxWrapperWithCacheProvider } from "./src/state/ReduxWrapper";
 
-export const wrapRootElement = ({ element }) => (
-  <ReduxWrapper element={element} />
-);
+export const wrapRootElement = ReduxWrapperWithCacheProvider;

package/gatsby-ssr.js

@@ -1,9 +1,7 @@
-import React from "react";
-
 import { JSDOM } from "jsdom";
 import { XMLHttpRequest } from "xmlhttprequest";
-import { HeadComponents } from "./src/components/head-components";
 import { ReduxWrapper } from "./src/state/ReduxWrapper";
+import { HeadComponents } from "./src/components/head-components";
 
 export const onRenderBody = ({ setHeadComponents }) => {
   if (process.env.NODE_ENV === "production") {
@@ -11,15 +9,13 @@ export const onRenderBody = ({ setHeadComponents }) => {
   }
 };
 
-export const wrapRootElement = ({ element }) => (
-  <ReduxWrapper element={element} />
-);
+export const wrapRootElement = ReduxWrapper;
 
 // build enabler polyfills
 global.dom = new JSDOM("...");
 global.window = global.dom.window;
 global.document = global.dom.window.document;
-global.navigator = global.window.navigator;
+
 global.window.matchMedia = () => ({
   matches: false,
   addListener: () => {},

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@openstack_dev/gatsby-theme-marketing-oif-core",
-  "version": "1.0.35-beta.6",
+  "version": "1.0.36",
   "description": "Base theme for Marketing Sites",
   "author": "smarcet",
   "keywords": [
@@ -50,14 +50,13 @@
     "@types/markerclustererplus": "^2.1.33",
     "@types/react": "^16.9.42",
     "axios": "^0.19.2",
-    "babel-preset-gatsby": "^3.13.2",
     "browser-tabs-lock": "^1.2.15",
     "buffer": "^6.0.3",
     "chain-function": "^1.0.1",
     "classnames": "^2.3.1",
     "clean-html": "^1.5.0",
     "codemirror": "^5.55.0",
-    "core-js": "^2.6.11",
+    "core-js": "^3.0.0",
     "cross-env": "^7.0.3",
     "crypto-js": "^4.1.1",
     "decap-cms-app": "^3.1.9",
@@ -65,7 +64,7 @@
     "dropzone": "^5.7.2",
     "final-form": "4.20.7",
     "formik": "^2.2.9",
-    "gatsby": "^5.8.1",
+    "gatsby": "5.16.0",
     "gatsby-alias-imports": "^1.0.6",
     "gatsby-plugin-cookiebot": "^1.0.3",
     "gatsby-plugin-decap-cms": "^4.0.4",
@@ -92,7 +91,7 @@
     "idtoken-verifier": "^2.2.2",
     "image-size": "^1.0.1",
     "immutability-helper": "2.9.1",
-    "immutable": "^5.0.0-beta.5",
+    "immutable": "^5.1.5",
     "js-cookie": "^3.0.5",
     "js-yaml": "^4.1.0",
     "jsdom": "^16.2.2",
@@ -112,7 +111,7 @@
     "react-block-image": "^1.0.0",
     "react-bootstrap": "^0.33.1",
     "react-datetime": "^2.16.3",
-    "react-dnd": "15.1.1",
+    "react-dnd": "^16.0.1",
     "react-dnd-html5-backend": "^16.0.1",
     "react-dom": "^18.2.0",
     "react-final-form": "6.5.9",

package/src/components/AuthBootstrap.js

@@ -7,46 +7,47 @@ export default function AuthBootstrap() {
   const isLoggedUser = useSelector(
     (state) => state.loggedUserState.isLoggedUser
   );
+  const rehydrated = useSelector((state) => state._persist?.rehydrated);
   const ranRef = useRef(false);
-
-  useEffect(() => {
-    // already ran
-    if (ranRef.current || isLoggedUser) return;
-    ranRef.current = true;
-
-    const controller = new AbortController();
-
-    const run = async () => {
-      try {
-        const response = await fetch("/oidc/session/whoami", {
-          method: "GET",
-          credentials: "same-origin",
-          signal: controller.signal
-        });
-
-        if (!response.ok) return;
-
-        const data = await response.json();
-        const email = data?.email;
-
-        if (typeof email === "string" && /\S+@\S+\.\S+/.test(email)) {
-          doLoginBasicLogin(getBackURL(), email);
-        }
-      } catch (err) {
-        if (err?.name !== "AbortError") {
-          console.error("AuthBootstrap whoami failed", err);
-        }
+  const MIN_EMAIL_LENGTH = 3;
+
+  const checkLoginStatus = async () => {
+    try {
+      const response = await fetch("/oidc/session/whoami", {
+        method: "GET",
+        credentials: "same-origin"
+      });
+
+      if (!response.ok) return;
+      const data = await response.json();
+      if (
+        data.email &&
+        typeof data.email === "string" &&
+        data.email.includes("@") &&
+        data.email.includes(".") &&
+        data.email.length > MIN_EMAIL_LENGTH
+      ) {
+        ranRef.current = true;
+        doLoginBasicLogin(getBackURL(), data.email);
+        return;
       }
-    };
-
-    if (typeof window !== "undefined" && "requestIdleCallback" in window) {
-      window.requestIdleCallback(run, { timeout: 1000 });
-    } else {
-      setTimeout(run, 0);
+      console.warn("Invalid or missing email in login response:", data.email);
+    } catch (error) {
+      console.error(
+        "Failed to check login status. Possible network error or invalid response.",
+        {
+          error,
+          attemptedUrl: "/oidc/session/whoami"
+        }
+      );
     }
+  };
 
-    return () => controller.abort();
-  }, [isLoggedUser]);
+  useEffect(() => {
+    if (rehydrated !== undefined && !rehydrated) return; // Only wait if persist exists
+    if (isLoggedUser || ranRef.current) return;
+    checkLoginStatus();
+  }, [rehydrated, isLoggedUser]);
 
   return null;
 }

package/src/content/site-settings/index.json

@@ -1 +1 @@
-{ "staticJsonFilesBuildTime": [], "lastBuild": 1740420798753 }
+{"staticJsonFilesBuildTime":[],"lastBuild":1774023818781}

package/src/state/ReduxWrapper.js

@@ -2,36 +2,25 @@ import * as React from "react";
 import { Provider } from "react-redux";
 import { PersistGate } from "redux-persist/integration/react";
 import { CacheProvider } from "@emotion/react";
-
-import { store, getPersistor } from "./store";
+import { store, persistor } from "./store";
 import createEmotionCache from "../utils/createEmotionCache";
 import AuthBootstrap from "../components/AuthBootstrap";
 
-const isBrowser = typeof window !== "undefined";
-
 export function ReduxWrapper({ element }) {
-  const [persistor, setPersistor] = React.useState(null);
-  const cacheRef = React.useRef(null);
-  if (!cacheRef.current) cacheRef.current = createEmotionCache();
-
-  React.useEffect(() => {
-    setPersistor(getPersistor());
-  }, []);
+  return (
+    <Provider store={store}>
+      <PersistGate persistor={persistor}>{() => element}</PersistGate>
+    </Provider>
+  );
+}
 
+export function ReduxWrapperWithCacheProvider({ element }) {
+  const cache = createEmotionCache();
   return (
-    <CacheProvider value={cacheRef.current}>
+    <CacheProvider value={cache}>
       <Provider store={store}>
-        {isBrowser && persistor ? (
-          <PersistGate persistor={persistor} loading={element}>
-            <>
-              <AuthBootstrap />
-              {element}
-            </>
-          </PersistGate>
-        ) : (
-          // first render SSR === Client
-          element
-        )}
+        <AuthBootstrap />
+        <PersistGate persistor={persistor}>{() => element}</PersistGate>
       </Provider>
     </CacheProvider>
   );

package/src/state/store.js

@@ -1,40 +1,39 @@
 import { applyMiddleware, compose, createStore } from "redux";
 import { persistCombineReducers, persistStore } from "redux-persist";
+import storage from "redux-persist/lib/storage";
 import thunk from "redux-thunk";
-import * as reducers from "../reducers";
-
-const isBrowser = typeof window !== "undefined";
 
-const createNoopStorage = () => ({
-  getItem: () => Promise.resolve(null),
-  setItem: () => Promise.resolve(),
-  removeItem: () => Promise.resolve()
-});
-
-const storage = isBrowser
-  ? require("redux-persist/lib/storage").default
-  : createNoopStorage();
+import * as reducers from "../reducers";
 
+// Get from process.env because window is not set yet
 const clientId = process.env.GATSBY_OAUTH2_CLIENT_ID;
 
-const config = { key: `root_${clientId}`, storage };
-const states = { loggedUserState: reducers.loggedUserReducer };
+const config = {
+  key: `root_${clientId}`,
+  storage,
+  blacklist: [
+    // this will be not saved to persistent storage see
+    // https://github.com/rt2zz/redux-persist#blacklist--whitelist
+  ],
+};
+
+const states = {
+  loggedUserState: reducers.loggedUserReducer,
+};
 
-const composeEnhancers =
-  typeof window === "object" && window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__
-    ? window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__
-    : compose;
+const composeEnhancers = typeof window === "object" && window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__
+  ? window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__
+  : compose;
 
 const enhancer = composeEnhancers(applyMiddleware(thunk));
 
-const persistedReducers = persistCombineReducers(config, states);
+// Create store with persistor
+export const { store, persistor } = (() => {
+  const persistedReducers = persistCombineReducers(config, states);
 
-export const store = createStore(persistedReducers, enhancer);
+  const store = createStore(persistedReducers, enhancer);
+  const onRehydrateComplete = () => {};
+  const persistor = persistStore(store, null, onRehydrateComplete);
 
-// lazy persistor
-let _persistor = null;
-export const getPersistor = () => {
-  if (!isBrowser) return null;
-  if (!_persistor) _persistor = persistStore(store);
-  return _persistor;
-};
+  return { store, persistor };
+})();

package/src/utils/url.js

@@ -1,7 +1,8 @@
 export const getBackURL = () => {
   let backUrl = "/";
   if (typeof window !== "undefined") {
-    backUrl = window.location.pathname;
+    backUrl =
+      window.location.pathname + window.location.search + window.location.hash;
   }
   return backUrl;
 };