npm - @verdaccio/ui-components - Versions diffs - 5.0.0-next-9.19 → 5.0.0-next-9.21 - Mend

@verdaccio/ui-components 5.0.0-next-9.19 → 5.0.0-next-9.21

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (312) hide show

package/build/providers/VersionProvider/VersionProvider.mjs CHANGED Viewed

@@ -18,8 +18,8 @@ var VersionProvider = ({ children }) => {
 	const readmeData = useData(basePath, APIRoute.README, packageName, packageVersion);
 	const sidebarData = useData(basePath, APIRoute.SIDEBAR, packageName, packageVersion);
 	const isLoading = readmeData.isLoading || sidebarData.isLoading;
-	const error = readmeData.error || sidebarData.error;
-	const errorCode = readmeData.error?.code ?? sidebarData.error?.code;
+	const error = sidebarData.error;
+	const errorCode = sidebarData.error?.code;
 	const value = useMemo(() => ({
 		packageMeta: sidebarData.data,
 		readMe: readmeData.data,
@@ -29,7 +29,7 @@ var VersionProvider = ({ children }) => {
 		isForbidden: errorCode === 403,
 		isUnAuthorized: errorCode === 401,
 		hasNotBeenFound: errorCode === 404,
-		isError: errorCode !== void 0,
+		isError: error !== void 0,
 		error
 	}), [
 		sidebarData.data,

package/build/providers/VersionProvider/VersionProvider.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"VersionProvider.mjs","names":[],"sources":["../../../src/providers/VersionProvider/VersionProvider.tsx"],"sourcesContent":["import React, { createContext, useContext, useMemo } from 'react';\nimport { useParams } from 'react-router';\n\nimport { useData } from '../../api/use-data';\nimport { getConfiguration } from '../../configuration';\nimport { APIRoute } from '../../store/routes';\nimport { stripTrailingSlash } from '../../store/utils';\nimport type { PackageMetaInterface } from '../../types/packageMeta';\n\nfunction getRouterPackageName(packageName: string, scope?: string): string {\n return scope ? `${scope}/${packageName}` : packageName;\n}\n\nexport interface ApiError extends Error {\n code?: number;\n}\n\nexport interface DetailContextProps {\n error: ApiError \| undefined;\n hasNotBeenFound: boolean;\n isForbidden: boolean;\n isUnAuthorized: boolean;\n isError: boolean;\n isLoading: boolean;\n packageMeta?: PackageMetaInterface;\n packageName: string;\n packageVersion?: string;\n readMe?: string;\n}\n\nexport const DetailContext = createContext<DetailContextProps \| undefined>(undefined);\n\nconst VersionProvider: React.FC<{ children: React.ReactNode }> = ({ children }) => {\n const {\n scope,\n package: pkgName,\n version: packageVersion,\n } = useParams<Record<'scope' \| 'package' \| 'version', string \| undefined>>();\n\n const configuration = getConfiguration();\n const basePath = stripTrailingSlash(configuration.base);\n const packageName = getRouterPackageName(pkgName ?? '', scope);\n\n const readmeData = useData<string>(basePath, APIRoute.README, packageName, packageVersion);\n\n const sidebarData = useData<PackageMetaInterface>(\n basePath,\n APIRoute.SIDEBAR,\n packageName,\n packageVersion\n );\n const isLoading = readmeData.isLoading \|\| sidebarData.isLoading;\n const error: ApiError \| undefined = ~~readmeData.error \|\|~~ sidebarData.error;\n const errorCode = (~~readmeData.error as ApiError)?.code ?? (~~sidebarData.error as ApiError)?.code;\n\n const value = useMemo<DetailContextProps>(\n () => ({\n packageMeta: sidebarData.data,\n readMe: readmeData.data,\n packageName,\n packageVersion,\n isLoading,\n isForbidden: errorCode === 403,\n isUnAuthorized: errorCode === 401,\n hasNotBeenFound: errorCode === 404,\n isError: ~~errorCode~~ !== undefined,\n error,\n }),\n [sidebarData.data, readmeData.data, packageName, packageVersion, isLoading, errorCode, error]\n );\n\n return <DetailContext.Provider value={value}>{children}</DetailContext.Provider>;\n};\n\nexport default VersionProvider;\n\nexport const useVersion = (): DetailContextProps => {\n const context = useContext(DetailContext);\n if (context === undefined) {\n throw new Error('useVersion must be used within a VersionProvider');\n }\n return context;\n};\n"],"mappings":";;;;;;;;AASA,SAAS,qBAAqB,aAAqB,OAAwB;CACzE,OAAO,QAAQ,GAAG,MAAM,GAAG,gBAAgB;AAC7C;AAmBA,IAAa,gBAAgB,cAA8C,KAAA,CAAS;AAEpF,IAAM,mBAA4D,EAAE,eAAe;CACjF,MAAM,EACJ,OACA,SAAS,SACT,SAAS,mBACP,UAAuE;CAE3E,MAAM,gBAAgB,iBAAiB;CACvC,MAAM,WAAW,mBAAmB,cAAc,IAAI;CACtD,MAAM,cAAc,qBAAqB,WAAW,IAAI,KAAK;CAE7D,MAAM,aAAa,QAAgB,UAAU,SAAS,QAAQ,aAAa,cAAc;CAEzF,MAAM,cAAc,QAClB,UACA,SAAS,SACT,aACA,cACF;CACA,MAAM,YAAY,WAAW,aAAa,YAAY;~~CACtD~~,MAAM,QAA8B,~~WAAW,SAAS,~~YAAY;~~CACpE~~,MAAM,YAAa,~~WAAW,OAAoB,QAAS,~~YAAY,OAAoB;~~CAE3F~~,MAAM,QAAQ,eACL;EACL,aAAa,YAAY;EACzB,QAAQ,WAAW;EACnB;EACA;EACA;EACA,aAAa,cAAc;EAC3B,gBAAgB,cAAc;EAC9B,iBAAiB,cAAc;~~EAC~~/B,SAAS,~~cAAc~~,KAAA;~~EACvB~~;CACF,IACA;EAAC,YAAY;EAAM,WAAW;EAAM;EAAa;EAAgB;EAAW;EAAW;CAAK,CAC9F;CAEA,OAAO,oBAAC,cAAc,UAAf;EAA+B;EAAQ;CAAiC,CAAA;AACjF;AAIA,IAAa,mBAAuC;CAClD,MAAM,UAAU,WAAW,aAAa;CACxC,IAAI,YAAY,KAAA,GACd,MAAM,IAAI,MAAM,kDAAkD;CAEpE,OAAO;AACT"}
1	+ {"version":3,"file":"VersionProvider.mjs","names":[],"sources":["../../../src/providers/VersionProvider/VersionProvider.tsx"],"sourcesContent":["import React, { createContext, useContext, useMemo } from 'react';\nimport { useParams } from 'react-router';\n\nimport { useData } from '../../api/use-data';\nimport { getConfiguration } from '../../configuration';\nimport { APIRoute } from '../../store/routes';\nimport { stripTrailingSlash } from '../../store/utils';\nimport type { PackageMetaInterface } from '../../types/packageMeta';\n\nfunction getRouterPackageName(packageName: string, scope?: string): string {\n return scope ? `${scope}/${packageName}` : packageName;\n}\n\nexport interface ApiError extends Error {\n code?: number;\n}\n\nexport interface DetailContextProps {\n error: ApiError \| undefined;\n hasNotBeenFound: boolean;\n isForbidden: boolean;\n isUnAuthorized: boolean;\n isError: boolean;\n isLoading: boolean;\n packageMeta?: PackageMetaInterface;\n packageName: string;\n packageVersion?: string;\n readMe?: string;\n}\n\nexport const DetailContext = createContext<DetailContextProps \| undefined>(undefined);\n\nconst VersionProvider: React.FC<{ children: React.ReactNode }> = ({ children }) => {\n const {\n scope,\n package: pkgName,\n version: packageVersion,\n } = useParams<Record<'scope' \| 'package' \| 'version', string \| undefined>>();\n\n const configuration = getConfiguration();\n const basePath = stripTrailingSlash(configuration.base);\n const packageName = getRouterPackageName(pkgName ?? '', scope);\n\n const readmeData = useData<string>(basePath, APIRoute.README, packageName, packageVersion);\n\n const sidebarData = useData<PackageMetaInterface>(\n basePath,\n APIRoute.SIDEBAR,\n packageName,\n packageVersion\n );\n const isLoading = readmeData.isLoading \|\| sidebarData.isLoading;\n // only the sidebar data drives the whole page; a readme-only failure must\n // not blank a page that can render from sidebar data\n const error: ApiError \| undefined = sidebarData.error;\n const errorCode = (sidebarData.error as ApiError)?.code;\n\n const value = useMemo<DetailContextProps>(\n () => ({\n packageMeta: sidebarData.data,\n readMe: readmeData.data,\n packageName,\n packageVersion,\n isLoading,\n isForbidden: errorCode === 403,\n isUnAuthorized: errorCode === 401,\n hasNotBeenFound: errorCode === 404,\n // network failures reject without a `.code`, they are still errors\n isError: error !== undefined,\n error,\n }),\n [sidebarData.data, readmeData.data, packageName, packageVersion, isLoading, errorCode, error]\n );\n\n return <DetailContext.Provider value={value}>{children}</DetailContext.Provider>;\n};\n\nexport default VersionProvider;\n\nexport const useVersion = (): DetailContextProps => {\n const context = useContext(DetailContext);\n if (context === undefined) {\n throw new Error('useVersion must be used within a VersionProvider');\n }\n return context;\n};\n"],"mappings":";;;;;;;;AASA,SAAS,qBAAqB,aAAqB,OAAwB;CACzE,OAAO,QAAQ,GAAG,MAAM,GAAG,gBAAgB;AAC7C;AAmBA,IAAa,gBAAgB,cAA8C,KAAA,CAAS;AAEpF,IAAM,mBAA4D,EAAE,eAAe;CACjF,MAAM,EACJ,OACA,SAAS,SACT,SAAS,mBACP,UAAuE;CAE3E,MAAM,gBAAgB,iBAAiB;CACvC,MAAM,WAAW,mBAAmB,cAAc,IAAI;CACtD,MAAM,cAAc,qBAAqB,WAAW,IAAI,KAAK;CAE7D,MAAM,aAAa,QAAgB,UAAU,SAAS,QAAQ,aAAa,cAAc;CAEzF,MAAM,cAAc,QAClB,UACA,SAAS,SACT,aACA,cACF;CACA,MAAM,YAAY,WAAW,aAAa,YAAY;CAGtD,MAAM,QAA8B,YAAY;CAChD,MAAM,YAAa,YAAY,OAAoB;CAEnD,MAAM,QAAQ,eACL;EACL,aAAa,YAAY;EACzB,QAAQ,WAAW;EACnB;EACA;EACA;EACA,aAAa,cAAc;EAC3B,gBAAgB,cAAc;EAC9B,iBAAiB,cAAc;EAE/B,SAAS,UAAU,KAAA;EACnB;CACF,IACA;EAAC,YAAY;EAAM,WAAW;EAAM;EAAa;EAAgB;EAAW;EAAW;CAAK,CAC9F;CAEA,OAAO,oBAAC,cAAc,UAAf;EAA+B;EAAQ;CAAiC,CAAA;AACjF;AAIA,IAAa,mBAAuC;CAClD,MAAM,UAAU,WAAW,aAAa;CACxC,IAAI,YAAY,KAAA,GACd,MAAM,IAAI,MAAM,kDAAkD;CAEpE,OAAO;AACT"}

package/build/sections/Detail/Tabs.js CHANGED Viewed

@@ -3,8 +3,8 @@ let _emotion_styled = require("@emotion/styled");
 _emotion_styled = require_runtime.__toESM(_emotion_styled);
 let react = require("react");
 react = require_runtime.__toESM(react);
-let react_jsx_runtime = require("react/jsx-runtime");
 let react_i18next = require("react-i18next");
+let react_jsx_runtime = require("react/jsx-runtime");
 let _mui_material_Tab = require("@mui/material/Tab");
 _mui_material_Tab = require_runtime.__toESM(_mui_material_Tab);
 let _mui_material_Tabs = require("@mui/material/Tabs");

package/build/sections/Detail/Tabs.mjs CHANGED Viewed

@@ -1,7 +1,7 @@
 import styled from "@emotion/styled";
 import "react";
-import { jsx, jsxs } from "react/jsx-runtime";
 import { useTranslation } from "react-i18next";
+import { jsx, jsxs } from "react/jsx-runtime";
 import Tab from "@mui/material/Tab";
 import Tabs from "@mui/material/Tabs";
 import useMediaQuery from "@mui/material/useMediaQuery";

package/build/sections/Footer/Footer.js CHANGED Viewed

@@ -9,8 +9,8 @@ let _emotion_styled = require("@emotion/styled");
 _emotion_styled = require_runtime.__toESM(_emotion_styled);
 let react = require("react");
 react = require_runtime.__toESM(react);
-let react_jsx_runtime = require("react/jsx-runtime");
 let react_i18next = require("react-i18next");
+let react_jsx_runtime = require("react/jsx-runtime");
 let country_flag_icons_react_3x2 = require("country-flag-icons/react/3x2");
 country_flag_icons_react_3x2 = require_runtime.__toESM(country_flag_icons_react_3x2);
 //#region src/sections/Footer/Footer.tsx

package/build/sections/Footer/Footer.mjs CHANGED Viewed

@@ -6,8 +6,8 @@ import { Inner, Left, Love, Right, Wrapper } from "./styles.mjs";
 import "../../index.mjs";
 import styled from "@emotion/styled";
 import "react";
-import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 import { Trans, useTranslation } from "react-i18next";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 import * as FlagsIcon from "country-flag-icons/react/3x2";
 //#region src/sections/Footer/Footer.tsx
 function goToVerdaccioWebsite() {

package/build/sections/Header/Header.d.ts CHANGED Viewed

@@ -2,7 +2,6 @@ import React from 'react';
 type Props = {
     HeaderInfoDialog?: React.FC<any>;
     isPlainHeader?: boolean;
-    tokenCheckIntervalMs?: number;
 };
 declare const Header: React.FC<Props>;
 export default Header;

package/build/sections/Header/Header.js CHANGED Viewed

@@ -11,12 +11,12 @@ const require_HeaderSettingsDialog = require("./HeaderSettingsDialog.js");
 require("../../index.js");
 let react = require("react");
 react = require_runtime.__toESM(react);
-let react_jsx_runtime = require("react/jsx-runtime");
 let react_i18next = require("react-i18next");
+let react_jsx_runtime = require("react/jsx-runtime");
 let _mui_material_Button = require("@mui/material/Button");
 _mui_material_Button = require_runtime.__toESM(_mui_material_Button);
 //#region src/sections/Header/Header.tsx
-var Header = ({ HeaderInfoDialog, isPlainHeader, tokenCheckIntervalMs = 36e5 }) => {
+var Header = ({ HeaderInfoDialog, isPlainHeader }) => {
 	const { t } = (0, react_i18next.useTranslation)();
 	const [isInfoDialogOpen, setOpenInfoDialog] = (0, react.useState)(false);
 	const [isSettingsDialogOpen, setSettingsDialogOpen] = (0, react.useState)(false);
@@ -24,23 +24,25 @@ var Header = ({ HeaderInfoDialog, isPlainHeader, tokenCheckIntervalMs = 36e5 })
 	const [showLoginModal, setShowLoginModal] = (0, react.useState)(false);
 	const { configOptions } = require_AppConfigurationProvider.useConfig();
 	const { userState, logOutUser } = require_AuthProvider.useAuth();
-	const tokenRef = (0, react.useRef)(userState?.token);
 	const logOutUserRef = (0, react.useRef)(logOutUser);
-	(0, react.useEffect)(() => {
-		tokenRef.current = userState?.token;
-	}, [userState?.token]);
 	(0, react.useEffect)(() => {
 		logOutUserRef.current = logOutUser;
 	}, [logOutUser]);
 	(0, react.useEffect)(() => {
-		function checkToken() {
-			const token = tokenRef.current;
-			if (token && require_token.isTokenExpire(token)) logOutUserRef.current?.();
-		}
-		checkToken();
-		const interval = setInterval(checkToken, tokenCheckIntervalMs);
-		return () => clearInterval(interval);
-	}, [tokenCheckIntervalMs]);
+		const token = userState?.token;
+		if (!token) return;
+		let timer;
+		const arm = () => {
+			const remaining = require_token.tokenExpireInMs(token);
+			if (remaining === null || remaining <= 0) {
+				logOutUserRef.current?.();
+				return;
+			}
+			timer = setTimeout(arm, Math.min(remaining, 2 ** 31 - 1));
+		};
+		arm();
+		return () => clearTimeout(timer);
+	}, [userState?.token]);
 	const handleLogout = () => {
 		logOutUser?.();
 		setShowLoginModal(false);

package/build/sections/Header/Header.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Header.js","names":[],"sources":["../../../src/sections/Header/Header.tsx"],"sourcesContent":["import Button from '@mui/material/Button';\nimport React, { useEffect, useRef, useState } from 'react';\nimport { useTranslation } from 'react-i18next';\n\nimport { LoginDialog, Search, useAuth, useConfig } from '../../';\nimport { ~~isTokenExpire~~ } from '../../utils/token';\nimport HeaderLeft from './HeaderLeft';\nimport HeaderRight from './HeaderRight';\nimport HeaderSettingsDialog from './HeaderSettingsDialog';\nimport { InnerMobileNavBar, InnerNavBar, MobileNavBar, NavBar } from './styles';\n\ntype Props = {\n HeaderInfoDialog?: React.FC<any>;\n isPlainHeader?: boolean;\n ~~tokenCheckIntervalMs?: number;\n~~};\n\~~n// Session timeout default is 1 hour\~~nconst Header: React.FC<Props> = ({\n HeaderInfoDialog~~,\n~~ isPlainHeader~~,\n tokenCheckIntervalMs~~ ~~= 60 * 60 * 1000,\n~~}) => {\n const { t } = useTranslation();\n const [isInfoDialogOpen, setOpenInfoDialog] = useState<boolean>(false);\n const [isSettingsDialogOpen, setSettingsDialogOpen] = useState<boolean>(false);\n const [showMobileNavBar, setShowMobileNavBar] = useState<boolean>(false);\n const [showLoginModal, setShowLoginModal] = useState<boolean>(false);\n const { configOptions } = useConfig();\n const { userState, logOutUser } = useAuth();\n\n // Use ~~refs~~ to always have the latest ~~token/~~logout in the ~~interval~~ callback\n const ~~tokenRef = useRef(userState?.token);\n const~~ logOutUserRef = useRef(logOutUser);\n useEffect(() => {\n ~~tokenRef~~.current = ~~userState?.token~~;\n }, [~~userState?.token~~]);\n useEffect(() => {\n ~~logOutUserRef.current~~ = ~~logOutUser~~;\n }, ~~[logOutUser]~~);\n\n ~~useEffect(()~~ => {\n ~~function~~ ~~checkToken~~() {\n const ~~token~~ = ~~tokenRef.current~~;\n if (~~token~~ && ~~isTokenExpire(token~~)) {\n logOutUserRef.current?.();\n }\n }\n ~~checkToken();\n const~~ ~~interval~~ = ~~setInterval~~(~~checkToken~~, ~~tokenCheckIntervalMs~~);\n return () => ~~clearInterval~~(~~interval~~);\n }, [~~tokenCheckIntervalMs~~]);\n\n const handleLogout = () => {\n logOutUser?.();\n setShowLoginModal(false);\n };\n if (isPlainHeader) {\n return (\n <NavBar data-testid=\"header\" position=\"static\">\n <InnerNavBar data-testid=\"inner-nav-bar\">\n <HeaderLeft showSearch={false} />\n <HeaderRight\n hasLogin={false}\n onLogout={() => {}}\n onOpenRegistryInfoDialog={() => {}}\n onOpenSettingsDialog={() => {}}\n onToggleLogin={() => {}}\n onToggleMobileNav={() => {}}\n showInfo={false}\n showSearch={false}\n showSettings={false}\n showThemeSwitch={false}\n username={''}\n />\n </InnerNavBar>\n </NavBar>\n );\n }\n\n return (\n <>\n <NavBar data-testid=\"header\" position=\"static\">\n <InnerNavBar data-testid=\"inner-nav-bar\">\n <HeaderLeft showSearch={configOptions.showSearch} />\n <HeaderRight\n hasLogin={configOptions?.login}\n onLogout={handleLogout}\n onOpenRegistryInfoDialog={() => setOpenInfoDialog(true)}\n onOpenSettingsDialog={() => setSettingsDialogOpen(true)}\n onToggleLogin={() => setShowLoginModal(!showLoginModal)}\n onToggleMobileNav={() => setShowMobileNavBar(!showMobileNavBar)}\n showInfo={configOptions.showInfo}\n showSearch={configOptions.showSearch}\n showSettings={configOptions.showSettings}\n showThemeSwitch={configOptions.showThemeSwitch}\n username={userState?.username}\n />\n </InnerNavBar>\n <HeaderSettingsDialog\n isOpen={isSettingsDialogOpen}\n onCloseDialog={() => setSettingsDialogOpen(false)}\n />\n {HeaderInfoDialog ? (\n <HeaderInfoDialog\n dialogTitle={t('dialog.registry-info.title')}\n isOpen={isInfoDialogOpen}\n onCloseDialog={() => setOpenInfoDialog(false)}\n />\n ) : null}\n </NavBar>\n {showMobileNavBar && (\n <MobileNavBar data-testid=\"mobile-nav-bar\">\n <InnerMobileNavBar>\n <Search />\n </InnerMobileNavBar>\n <Button color=\"inherit\" onClick={() => setShowMobileNavBar(false)}>\n {t('button.cancel')}\n </Button>\n </MobileNavBar>\n )}\n {!userState?.username && (\n <LoginDialog onClose={() => setShowLoginModal(false)} open={showLoginModal} />\n )}\n </>\n );\n};\n\nexport default Header;\n"],"mappings":";;;;;;;;;;;;;;;;;;~~AAkBA~~,IAAM,UAA2B,~~EAC/B~~,~~kBACA~~,~~eACA,uBAAuB,WACnB~~;~~CACJ~~,MAAM,EAAE,OAAA,GAAM,cAAA,eAAA,CAAe;CAC7B,MAAM,CAAC,kBAAkB,sBAAA,GAAqB,MAAA,SAAA,CAAkB,KAAK;CACrE,MAAM,CAAC,sBAAsB,0BAAA,GAAyB,MAAA,SAAA,CAAkB,KAAK;CAC7E,MAAM,CAAC,kBAAkB,wBAAA,GAAuB,MAAA,SAAA,CAAkB,KAAK;CACvE,MAAM,CAAC,gBAAgB,sBAAA,GAAqB,MAAA,SAAA,CAAkB,KAAK;CACnE,MAAM,EAAE,kBAAkB,iCAAA,UAAU;CACpC,MAAM,EAAE,WAAW,eAAe,qBAAA,QAAQ;CAG1C,MAAM,~~YAAA,GAAW,MAAA,OAAA,CAAO,WAAW,KAAK;CACxC,MAAM,~~iBAAA,GAAgB,MAAA,OAAA,CAAO,UAAU;CACvC,CAAA,GAAA,MAAA,UAAA,OAAgB;EACd,~~SAAS~~,UAAU~~,WAAW~~;~~CAChC~~,GAAG,CAAC,~~WAAW~~,~~KAAK,~~CAAC;~~CACrB~~,CAAA,GAAA,MAAA,UAAA,OAAgB;EACd,~~cAAc~~,~~UAAU~~;~~CAC1B~~,~~GAAG~~,CAAC,~~UAAU,CAAC~~;~~CAEf~~,~~CAAA,GAAA,MAAA,UAAA,OAAgB~~;~~EACd~~,~~SAAS~~,~~aAAa~~;~~GACpB~~,MAAM,~~QAAQ~~,~~SAAS~~;~~GACvB~~,IAAI,~~SAAS~~,~~cAAA~~,~~cAAc~~,~~KAAK~~,~~GAC9B,~~cAAc,UAAU;~~EAE5B~~;~~EACA~~,WAAW~~;EACX~~,~~MAAM~~,WAAW,~~YAAY~~,~~YAAY~~,~~oBAAoB~~;~~EAC7D~~,aAAa,~~cAAc~~,~~QAAQ~~;~~CACrC~~,GAAG,CAAC,~~oBAAoB~~,CAAC;~~CAEzB~~,MAAM,qBAAqB;EACzB,aAAa;EACb,kBAAkB,KAAK;CACzB;CACA,IAAI,eACF,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,eAAA,QAAD;EAAQ,eAAY;EAAS,UAAS;EACpC,UAAA,iBAAA,GAAA,kBAAA,KAAA,CAAC,eAAA,aAAD;GAAa,eAAY;GAAzB,UAAA,CACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,mBAAA,SAAD,EAAY,YAAY,MAAQ,CAAA,GAChC,iBAAA,GAAA,kBAAA,IAAA,CAAC,oBAAA,SAAD;IACE,UAAU;IACV,gBAAgB,CAAC;IACjB,gCAAgC,CAAC;IACjC,4BAA4B,CAAC;IAC7B,qBAAqB,CAAC;IACtB,yBAAyB,CAAC;IAC1B,UAAU;IACV,YAAY;IACZ,cAAc;IACd,iBAAiB;IACjB,UAAU;GACX,CAAA,CACU;;CACP,CAAA;CAIZ,OACE,iBAAA,GAAA,kBAAA,KAAA,CAAA,kBAAA,UAAA,EAAA,UAAA;EACE,iBAAA,GAAA,kBAAA,KAAA,CAAC,eAAA,QAAD;GAAQ,eAAY;GAAS,UAAS;GAAtC,UAAA;IACE,iBAAA,GAAA,kBAAA,KAAA,CAAC,eAAA,aAAD;KAAa,eAAY;KAAzB,UAAA,CACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,mBAAA,SAAD,EAAY,YAAY,cAAc,WAAa,CAAA,GACnD,iBAAA,GAAA,kBAAA,IAAA,CAAC,oBAAA,SAAD;MACE,UAAU,eAAe;MACzB,UAAU;MACV,gCAAgC,kBAAkB,IAAI;MACtD,4BAA4B,sBAAsB,IAAI;MACtD,qBAAqB,kBAAkB,CAAC,cAAc;MACtD,yBAAyB,oBAAoB,CAAC,gBAAgB;MAC9D,UAAU,cAAc;MACxB,YAAY,cAAc;MAC1B,cAAc,cAAc;MAC5B,iBAAiB,cAAc;MAC/B,UAAU,WAAW;KACtB,CAAA,CACU;;IACb,iBAAA,GAAA,kBAAA,IAAA,CAAC,6BAAA,SAAD;KACE,QAAQ;KACR,qBAAqB,sBAAsB,KAAK;IACjD,CAAA;IACA,mBACC,iBAAA,GAAA,kBAAA,IAAA,CAAC,kBAAD;KACE,aAAa,EAAE,4BAA4B;KAC3C,QAAQ;KACR,qBAAqB,kBAAkB,KAAK;IAC7C,CAAA,IACC;GACE;;EACP,oBACC,iBAAA,GAAA,kBAAA,KAAA,CAAC,eAAA,cAAD;GAAc,eAAY;GAA1B,UAAA,CACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,eAAA,mBAAD,EAAA,UACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,eAAA,SAAD,CAAS,CAAA,EACQ,CAAA,GACnB,iBAAA,GAAA,kBAAA,IAAA,CAAC,qBAAA,SAAD;IAAQ,OAAM;IAAU,eAAe,oBAAoB,KAAK;IAC7D,UAAA,EAAE,eAAe;GACZ,CAAA,CACI;;EAEf,CAAC,WAAW,YACX,iBAAA,GAAA,kBAAA,IAAA,CAAC,oBAAA,SAAD;GAAa,eAAe,kBAAkB,KAAK;GAAG,MAAM;EAAiB,CAAA;CAE/E,EAAA,CAAA;AAEN"}
1	+ {"version":3,"file":"Header.js","names":[],"sources":["../../../src/sections/Header/Header.tsx"],"sourcesContent":["import Button from '@mui/material/Button';\nimport React, { useEffect, useRef, useState } from 'react';\nimport { useTranslation } from 'react-i18next';\n\nimport { LoginDialog, Search, useAuth, useConfig } from '../../';\nimport { tokenExpireInMs } from '../../utils/token';\nimport HeaderLeft from './HeaderLeft';\nimport HeaderRight from './HeaderRight';\nimport HeaderSettingsDialog from './HeaderSettingsDialog';\nimport { InnerMobileNavBar, InnerNavBar, MobileNavBar, NavBar } from './styles';\n\ntype Props = {\n HeaderInfoDialog?: React.FC<any>;\n isPlainHeader?: boolean;\n};\n\nconst Header: React.FC<Props> = ({ HeaderInfoDialog, isPlainHeader }) => {\n const { t } = useTranslation();\n const [isInfoDialogOpen, setOpenInfoDialog] = useState<boolean>(false);\n const [isSettingsDialogOpen, setSettingsDialogOpen] = useState<boolean>(false);\n const [showMobileNavBar, setShowMobileNavBar] = useState<boolean>(false);\n const [showLoginModal, setShowLoginModal] = useState<boolean>(false);\n const { configOptions } = useConfig();\n const { userState, logOutUser } = useAuth();\n\n // Use a ref to always have the latest logout in the timer callback\n const logOutUserRef = useRef(logOutUser);\n useEffect(() => {\n logOutUserRef.current = logOutUser;\n }, [logOutUser]);\n\n // log out exactly when the token expires; polling reloaded the page at an\n // arbitrary moment up to a minute later, mid-interaction\n useEffect(() => {\n const token = userState?.token;\n if (!token) {\n return;\n }\n let timer: ReturnType<typeof setTimeout> \| undefined;\n const arm = () => {\n const remaining = tokenExpireInMs(token);\n if (remaining === null \|\| remaining <= 0) {\n logOutUserRef.current?.();\n return;\n }\n // setTimeout overflows above 2^31-1 ms; re-arm for far-away expiries\n timer = setTimeout(arm, Math.min(remaining, 2 ** 31 - 1));\n };\n arm();\n return () => clearTimeout(timer);\n }, [userState?.token]);\n\n const handleLogout = () => {\n logOutUser?.();\n setShowLoginModal(false);\n };\n if (isPlainHeader) {\n return (\n <NavBar data-testid=\"header\" position=\"static\">\n <InnerNavBar data-testid=\"inner-nav-bar\">\n <HeaderLeft showSearch={false} />\n <HeaderRight\n hasLogin={false}\n onLogout={() => {}}\n onOpenRegistryInfoDialog={() => {}}\n onOpenSettingsDialog={() => {}}\n onToggleLogin={() => {}}\n onToggleMobileNav={() => {}}\n showInfo={false}\n showSearch={false}\n showSettings={false}\n showThemeSwitch={false}\n username={''}\n />\n </InnerNavBar>\n </NavBar>\n );\n }\n\n return (\n <>\n <NavBar data-testid=\"header\" position=\"static\">\n <InnerNavBar data-testid=\"inner-nav-bar\">\n <HeaderLeft showSearch={configOptions.showSearch} />\n <HeaderRight\n hasLogin={configOptions?.login}\n onLogout={handleLogout}\n onOpenRegistryInfoDialog={() => setOpenInfoDialog(true)}\n onOpenSettingsDialog={() => setSettingsDialogOpen(true)}\n onToggleLogin={() => setShowLoginModal(!showLoginModal)}\n onToggleMobileNav={() => setShowMobileNavBar(!showMobileNavBar)}\n showInfo={configOptions.showInfo}\n showSearch={configOptions.showSearch}\n showSettings={configOptions.showSettings}\n showThemeSwitch={configOptions.showThemeSwitch}\n username={userState?.username}\n />\n </InnerNavBar>\n <HeaderSettingsDialog\n isOpen={isSettingsDialogOpen}\n onCloseDialog={() => setSettingsDialogOpen(false)}\n />\n {HeaderInfoDialog ? (\n <HeaderInfoDialog\n dialogTitle={t('dialog.registry-info.title')}\n isOpen={isInfoDialogOpen}\n onCloseDialog={() => setOpenInfoDialog(false)}\n />\n ) : null}\n </NavBar>\n {showMobileNavBar && (\n <MobileNavBar data-testid=\"mobile-nav-bar\">\n <InnerMobileNavBar>\n <Search />\n </InnerMobileNavBar>\n <Button color=\"inherit\" onClick={() => setShowMobileNavBar(false)}>\n {t('button.cancel')}\n </Button>\n </MobileNavBar>\n )}\n {!userState?.username && (\n <LoginDialog onClose={() => setShowLoginModal(false)} open={showLoginModal} />\n )}\n </>\n );\n};\n\nexport default Header;\n"],"mappings":";;;;;;;;;;;;;;;;;;AAgBA,IAAM,UAA2B,EAAE,kBAAkB,oBAAoB;CACvE,MAAM,EAAE,OAAA,GAAM,cAAA,eAAA,CAAe;CAC7B,MAAM,CAAC,kBAAkB,sBAAA,GAAqB,MAAA,SAAA,CAAkB,KAAK;CACrE,MAAM,CAAC,sBAAsB,0BAAA,GAAyB,MAAA,SAAA,CAAkB,KAAK;CAC7E,MAAM,CAAC,kBAAkB,wBAAA,GAAuB,MAAA,SAAA,CAAkB,KAAK;CACvE,MAAM,CAAC,gBAAgB,sBAAA,GAAqB,MAAA,SAAA,CAAkB,KAAK;CACnE,MAAM,EAAE,kBAAkB,iCAAA,UAAU;CACpC,MAAM,EAAE,WAAW,eAAe,qBAAA,QAAQ;CAG1C,MAAM,iBAAA,GAAgB,MAAA,OAAA,CAAO,UAAU;CACvC,CAAA,GAAA,MAAA,UAAA,OAAgB;EACd,cAAc,UAAU;CAC1B,GAAG,CAAC,UAAU,CAAC;CAIf,CAAA,GAAA,MAAA,UAAA,OAAgB;EACd,MAAM,QAAQ,WAAW;EACzB,IAAI,CAAC,OACH;EAEF,IAAI;EACJ,MAAM,YAAY;GAChB,MAAM,YAAY,cAAA,gBAAgB,KAAK;GACvC,IAAI,cAAc,QAAQ,aAAa,GAAG;IACxC,cAAc,UAAU;IACxB;GACF;GAEA,QAAQ,WAAW,KAAK,KAAK,IAAI,WAAW,KAAK,KAAK,CAAC,CAAC;EAC1D;EACA,IAAI;EACJ,aAAa,aAAa,KAAK;CACjC,GAAG,CAAC,WAAW,KAAK,CAAC;CAErB,MAAM,qBAAqB;EACzB,aAAa;EACb,kBAAkB,KAAK;CACzB;CACA,IAAI,eACF,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,eAAA,QAAD;EAAQ,eAAY;EAAS,UAAS;EACpC,UAAA,iBAAA,GAAA,kBAAA,KAAA,CAAC,eAAA,aAAD;GAAa,eAAY;GAAzB,UAAA,CACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,mBAAA,SAAD,EAAY,YAAY,MAAQ,CAAA,GAChC,iBAAA,GAAA,kBAAA,IAAA,CAAC,oBAAA,SAAD;IACE,UAAU;IACV,gBAAgB,CAAC;IACjB,gCAAgC,CAAC;IACjC,4BAA4B,CAAC;IAC7B,qBAAqB,CAAC;IACtB,yBAAyB,CAAC;IAC1B,UAAU;IACV,YAAY;IACZ,cAAc;IACd,iBAAiB;IACjB,UAAU;GACX,CAAA,CACU;;CACP,CAAA;CAIZ,OACE,iBAAA,GAAA,kBAAA,KAAA,CAAA,kBAAA,UAAA,EAAA,UAAA;EACE,iBAAA,GAAA,kBAAA,KAAA,CAAC,eAAA,QAAD;GAAQ,eAAY;GAAS,UAAS;GAAtC,UAAA;IACE,iBAAA,GAAA,kBAAA,KAAA,CAAC,eAAA,aAAD;KAAa,eAAY;KAAzB,UAAA,CACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,mBAAA,SAAD,EAAY,YAAY,cAAc,WAAa,CAAA,GACnD,iBAAA,GAAA,kBAAA,IAAA,CAAC,oBAAA,SAAD;MACE,UAAU,eAAe;MACzB,UAAU;MACV,gCAAgC,kBAAkB,IAAI;MACtD,4BAA4B,sBAAsB,IAAI;MACtD,qBAAqB,kBAAkB,CAAC,cAAc;MACtD,yBAAyB,oBAAoB,CAAC,gBAAgB;MAC9D,UAAU,cAAc;MACxB,YAAY,cAAc;MAC1B,cAAc,cAAc;MAC5B,iBAAiB,cAAc;MAC/B,UAAU,WAAW;KACtB,CAAA,CACU;;IACb,iBAAA,GAAA,kBAAA,IAAA,CAAC,6BAAA,SAAD;KACE,QAAQ;KACR,qBAAqB,sBAAsB,KAAK;IACjD,CAAA;IACA,mBACC,iBAAA,GAAA,kBAAA,IAAA,CAAC,kBAAD;KACE,aAAa,EAAE,4BAA4B;KAC3C,QAAQ;KACR,qBAAqB,kBAAkB,KAAK;IAC7C,CAAA,IACC;GACE;;EACP,oBACC,iBAAA,GAAA,kBAAA,KAAA,CAAC,eAAA,cAAD;GAAc,eAAY;GAA1B,UAAA,CACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,eAAA,mBAAD,EAAA,UACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,eAAA,SAAD,CAAS,CAAA,EACQ,CAAA,GACnB,iBAAA,GAAA,kBAAA,IAAA,CAAC,qBAAA,SAAD;IAAQ,OAAM;IAAU,eAAe,oBAAoB,KAAK;IAC7D,UAAA,EAAE,eAAe;GACZ,CAAA,CACI;;EAEf,CAAC,WAAW,YACX,iBAAA,GAAA,kBAAA,IAAA,CAAC,oBAAA,SAAD;GAAa,eAAe,kBAAkB,KAAK;GAAG,MAAM;EAAiB,CAAA;CAE/E,EAAA,CAAA;AAEN"}

package/build/sections/Header/Header.mjs CHANGED Viewed

@@ -1,4 +1,4 @@
-import { isTokenExpire } from "../../utils/token.mjs";
+import { tokenExpireInMs } from "../../utils/token.mjs";
 import { useConfig } from "../../providers/AppConfigurationProvider/AppConfigurationProvider.mjs";
 import { useAuth } from "../../providers/AuthProvider/AuthProvider.mjs";
 import LoginDialog from "../../components/LoginDialog/LoginDialog.mjs";
@@ -9,11 +9,11 @@ import HeaderRight from "./HeaderRight.mjs";
 import HeaderSettingsDialog from "./HeaderSettingsDialog.mjs";
 import "../../index.mjs";
 import { useEffect, useRef, useState } from "react";
-import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 import { useTranslation } from "react-i18next";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 import Button from "@mui/material/Button";
 //#region src/sections/Header/Header.tsx
-var Header = ({ HeaderInfoDialog, isPlainHeader, tokenCheckIntervalMs = 36e5 }) => {
+var Header = ({ HeaderInfoDialog, isPlainHeader }) => {
 	const { t } = useTranslation();
 	const [isInfoDialogOpen, setOpenInfoDialog] = useState(false);
 	const [isSettingsDialogOpen, setSettingsDialogOpen] = useState(false);
@@ -21,23 +21,25 @@ var Header = ({ HeaderInfoDialog, isPlainHeader, tokenCheckIntervalMs = 36e5 })
 	const [showLoginModal, setShowLoginModal] = useState(false);
 	const { configOptions } = useConfig();
 	const { userState, logOutUser } = useAuth();
-	const tokenRef = useRef(userState?.token);
 	const logOutUserRef = useRef(logOutUser);
-	useEffect(() => {
-		tokenRef.current = userState?.token;
-	}, [userState?.token]);
 	useEffect(() => {
 		logOutUserRef.current = logOutUser;
 	}, [logOutUser]);
 	useEffect(() => {
-		function checkToken() {
-			const token = tokenRef.current;
-			if (token && isTokenExpire(token)) logOutUserRef.current?.();
-		}
-		checkToken();
-		const interval = setInterval(checkToken, tokenCheckIntervalMs);
-		return () => clearInterval(interval);
-	}, [tokenCheckIntervalMs]);
+		const token = userState?.token;
+		if (!token) return;
+		let timer;
+		const arm = () => {
+			const remaining = tokenExpireInMs(token);
+			if (remaining === null || remaining <= 0) {
+				logOutUserRef.current?.();
+				return;
+			}
+			timer = setTimeout(arm, Math.min(remaining, 2 ** 31 - 1));
+		};
+		arm();
+		return () => clearTimeout(timer);
+	}, [userState?.token]);
 	const handleLogout = () => {
 		logOutUser?.();
 		setShowLoginModal(false);

package/build/sections/Header/Header.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Header.mjs","names":[],"sources":["../../../src/sections/Header/Header.tsx"],"sourcesContent":["import Button from '@mui/material/Button';\nimport React, { useEffect, useRef, useState } from 'react';\nimport { useTranslation } from 'react-i18next';\n\nimport { LoginDialog, Search, useAuth, useConfig } from '../../';\nimport { ~~isTokenExpire~~ } from '../../utils/token';\nimport HeaderLeft from './HeaderLeft';\nimport HeaderRight from './HeaderRight';\nimport HeaderSettingsDialog from './HeaderSettingsDialog';\nimport { InnerMobileNavBar, InnerNavBar, MobileNavBar, NavBar } from './styles';\n\ntype Props = {\n HeaderInfoDialog?: React.FC<any>;\n isPlainHeader?: boolean;\n ~~tokenCheckIntervalMs?: number;\n~~};\n\~~n// Session timeout default is 1 hour\~~nconst Header: React.FC<Props> = ({\n HeaderInfoDialog~~,\n~~ isPlainHeader~~,\n tokenCheckIntervalMs~~ ~~= 60 * 60 * 1000,\n~~}) => {\n const { t } = useTranslation();\n const [isInfoDialogOpen, setOpenInfoDialog] = useState<boolean>(false);\n const [isSettingsDialogOpen, setSettingsDialogOpen] = useState<boolean>(false);\n const [showMobileNavBar, setShowMobileNavBar] = useState<boolean>(false);\n const [showLoginModal, setShowLoginModal] = useState<boolean>(false);\n const { configOptions } = useConfig();\n const { userState, logOutUser } = useAuth();\n\n // Use ~~refs~~ to always have the latest ~~token/~~logout in the ~~interval~~ callback\n const ~~tokenRef = useRef(userState?.token);\n const~~ logOutUserRef = useRef(logOutUser);\n useEffect(() => {\n ~~tokenRef~~.current = ~~userState?.token~~;\n }, [~~userState?.token~~]);\n useEffect(() => {\n ~~logOutUserRef.current~~ = ~~logOutUser~~;\n }, ~~[logOutUser]~~);\n\n ~~useEffect(()~~ => {\n ~~function~~ ~~checkToken~~() {\n const ~~token~~ = ~~tokenRef.current~~;\n if (~~token~~ && ~~isTokenExpire(token~~)) {\n logOutUserRef.current?.();\n }\n }\n ~~checkToken();\n const~~ ~~interval~~ = ~~setInterval~~(~~checkToken~~, ~~tokenCheckIntervalMs~~);\n return () => ~~clearInterval~~(~~interval~~);\n }, [~~tokenCheckIntervalMs~~]);\n\n const handleLogout = () => {\n logOutUser?.();\n setShowLoginModal(false);\n };\n if (isPlainHeader) {\n return (\n <NavBar data-testid=\"header\" position=\"static\">\n <InnerNavBar data-testid=\"inner-nav-bar\">\n <HeaderLeft showSearch={false} />\n <HeaderRight\n hasLogin={false}\n onLogout={() => {}}\n onOpenRegistryInfoDialog={() => {}}\n onOpenSettingsDialog={() => {}}\n onToggleLogin={() => {}}\n onToggleMobileNav={() => {}}\n showInfo={false}\n showSearch={false}\n showSettings={false}\n showThemeSwitch={false}\n username={''}\n />\n </InnerNavBar>\n </NavBar>\n );\n }\n\n return (\n <>\n <NavBar data-testid=\"header\" position=\"static\">\n <InnerNavBar data-testid=\"inner-nav-bar\">\n <HeaderLeft showSearch={configOptions.showSearch} />\n <HeaderRight\n hasLogin={configOptions?.login}\n onLogout={handleLogout}\n onOpenRegistryInfoDialog={() => setOpenInfoDialog(true)}\n onOpenSettingsDialog={() => setSettingsDialogOpen(true)}\n onToggleLogin={() => setShowLoginModal(!showLoginModal)}\n onToggleMobileNav={() => setShowMobileNavBar(!showMobileNavBar)}\n showInfo={configOptions.showInfo}\n showSearch={configOptions.showSearch}\n showSettings={configOptions.showSettings}\n showThemeSwitch={configOptions.showThemeSwitch}\n username={userState?.username}\n />\n </InnerNavBar>\n <HeaderSettingsDialog\n isOpen={isSettingsDialogOpen}\n onCloseDialog={() => setSettingsDialogOpen(false)}\n />\n {HeaderInfoDialog ? (\n <HeaderInfoDialog\n dialogTitle={t('dialog.registry-info.title')}\n isOpen={isInfoDialogOpen}\n onCloseDialog={() => setOpenInfoDialog(false)}\n />\n ) : null}\n </NavBar>\n {showMobileNavBar && (\n <MobileNavBar data-testid=\"mobile-nav-bar\">\n <InnerMobileNavBar>\n <Search />\n </InnerMobileNavBar>\n <Button color=\"inherit\" onClick={() => setShowMobileNavBar(false)}>\n {t('button.cancel')}\n </Button>\n </MobileNavBar>\n )}\n {!userState?.username && (\n <LoginDialog onClose={() => setShowLoginModal(false)} open={showLoginModal} />\n )}\n </>\n );\n};\n\nexport default Header;\n"],"mappings":";;;;;;;;;;;;;;;~~AAkBA~~,IAAM,UAA2B,~~EAC/B~~,~~kBACA~~,~~eACA,uBAAuB,WACnB~~;~~CACJ~~,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,CAAC,kBAAkB,qBAAqB,SAAkB,KAAK;CACrE,MAAM,CAAC,sBAAsB,yBAAyB,SAAkB,KAAK;CAC7E,MAAM,CAAC,kBAAkB,uBAAuB,SAAkB,KAAK;CACvE,MAAM,CAAC,gBAAgB,qBAAqB,SAAkB,KAAK;CACnE,MAAM,EAAE,kBAAkB,UAAU;CACpC,MAAM,EAAE,WAAW,eAAe,QAAQ;CAG1C,MAAM,~~WAAW,OAAO,WAAW,KAAK;CACxC,MAAM,~~gBAAgB,OAAO,UAAU;CACvC,gBAAgB;EACd,~~SAAS~~,UAAU~~,WAAW~~;~~CAChC~~,GAAG,CAAC,~~WAAW~~,~~KAAK,~~CAAC;~~CACrB~~,gBAAgB;EACd,~~cAAc~~,~~UAAU~~;~~CAC1B~~,~~GAAG~~,CAAC,~~UAAU,CAAC~~;~~CAEf~~,~~gBAAgB~~;~~EACd~~,~~SAAS~~,~~aAAa~~;~~GACpB~~,MAAM,~~QAAQ~~,~~SAAS~~;~~GACvB~~,IAAI,~~SAAS,~~cAAc,~~KAAK~~,~~GAC9B~~,cAAc,UAAU;~~EAE5B~~;~~EACA~~,WAAW~~;EACX~~,~~MAAM~~,WAAW,~~YAAY~~,~~YAAY~~,~~oBAAoB~~;~~EAC7D~~,aAAa,~~cAAc~~,~~QAAQ~~;~~CACrC~~,GAAG,CAAC,~~oBAAoB~~,CAAC;~~CAEzB~~,MAAM,qBAAqB;EACzB,aAAa;EACb,kBAAkB,KAAK;CACzB;CACA,IAAI,eACF,OACE,oBAAC,QAAD;EAAQ,eAAY;EAAS,UAAS;EACpC,UAAA,qBAAC,aAAD;GAAa,eAAY;GAAzB,UAAA,CACE,oBAAC,YAAD,EAAY,YAAY,MAAQ,CAAA,GAChC,oBAAC,aAAD;IACE,UAAU;IACV,gBAAgB,CAAC;IACjB,gCAAgC,CAAC;IACjC,4BAA4B,CAAC;IAC7B,qBAAqB,CAAC;IACtB,yBAAyB,CAAC;IAC1B,UAAU;IACV,YAAY;IACZ,cAAc;IACd,iBAAiB;IACjB,UAAU;GACX,CAAA,CACU;;CACP,CAAA;CAIZ,OACE,qBAAA,YAAA,EAAA,UAAA;EACE,qBAAC,QAAD;GAAQ,eAAY;GAAS,UAAS;GAAtC,UAAA;IACE,qBAAC,aAAD;KAAa,eAAY;KAAzB,UAAA,CACE,oBAAC,YAAD,EAAY,YAAY,cAAc,WAAa,CAAA,GACnD,oBAAC,aAAD;MACE,UAAU,eAAe;MACzB,UAAU;MACV,gCAAgC,kBAAkB,IAAI;MACtD,4BAA4B,sBAAsB,IAAI;MACtD,qBAAqB,kBAAkB,CAAC,cAAc;MACtD,yBAAyB,oBAAoB,CAAC,gBAAgB;MAC9D,UAAU,cAAc;MACxB,YAAY,cAAc;MAC1B,cAAc,cAAc;MAC5B,iBAAiB,cAAc;MAC/B,UAAU,WAAW;KACtB,CAAA,CACU;;IACb,oBAAC,sBAAD;KACE,QAAQ;KACR,qBAAqB,sBAAsB,KAAK;IACjD,CAAA;IACA,mBACC,oBAAC,kBAAD;KACE,aAAa,EAAE,4BAA4B;KAC3C,QAAQ;KACR,qBAAqB,kBAAkB,KAAK;IAC7C,CAAA,IACC;GACE;;EACP,oBACC,qBAAC,cAAD;GAAc,eAAY;GAA1B,UAAA,CACE,oBAAC,mBAAD,EAAA,UACE,oBAAC,QAAD,CAAS,CAAA,EACQ,CAAA,GACnB,oBAAC,QAAD;IAAQ,OAAM;IAAU,eAAe,oBAAoB,KAAK;IAC7D,UAAA,EAAE,eAAe;GACZ,CAAA,CACI;;EAEf,CAAC,WAAW,YACX,oBAAC,aAAD;GAAa,eAAe,kBAAkB,KAAK;GAAG,MAAM;EAAiB,CAAA;CAE/E,EAAA,CAAA;AAEN"}
1	+ {"version":3,"file":"Header.mjs","names":[],"sources":["../../../src/sections/Header/Header.tsx"],"sourcesContent":["import Button from '@mui/material/Button';\nimport React, { useEffect, useRef, useState } from 'react';\nimport { useTranslation } from 'react-i18next';\n\nimport { LoginDialog, Search, useAuth, useConfig } from '../../';\nimport { tokenExpireInMs } from '../../utils/token';\nimport HeaderLeft from './HeaderLeft';\nimport HeaderRight from './HeaderRight';\nimport HeaderSettingsDialog from './HeaderSettingsDialog';\nimport { InnerMobileNavBar, InnerNavBar, MobileNavBar, NavBar } from './styles';\n\ntype Props = {\n HeaderInfoDialog?: React.FC<any>;\n isPlainHeader?: boolean;\n};\n\nconst Header: React.FC<Props> = ({ HeaderInfoDialog, isPlainHeader }) => {\n const { t } = useTranslation();\n const [isInfoDialogOpen, setOpenInfoDialog] = useState<boolean>(false);\n const [isSettingsDialogOpen, setSettingsDialogOpen] = useState<boolean>(false);\n const [showMobileNavBar, setShowMobileNavBar] = useState<boolean>(false);\n const [showLoginModal, setShowLoginModal] = useState<boolean>(false);\n const { configOptions } = useConfig();\n const { userState, logOutUser } = useAuth();\n\n // Use a ref to always have the latest logout in the timer callback\n const logOutUserRef = useRef(logOutUser);\n useEffect(() => {\n logOutUserRef.current = logOutUser;\n }, [logOutUser]);\n\n // log out exactly when the token expires; polling reloaded the page at an\n // arbitrary moment up to a minute later, mid-interaction\n useEffect(() => {\n const token = userState?.token;\n if (!token) {\n return;\n }\n let timer: ReturnType<typeof setTimeout> \| undefined;\n const arm = () => {\n const remaining = tokenExpireInMs(token);\n if (remaining === null \|\| remaining <= 0) {\n logOutUserRef.current?.();\n return;\n }\n // setTimeout overflows above 2^31-1 ms; re-arm for far-away expiries\n timer = setTimeout(arm, Math.min(remaining, 2 ** 31 - 1));\n };\n arm();\n return () => clearTimeout(timer);\n }, [userState?.token]);\n\n const handleLogout = () => {\n logOutUser?.();\n setShowLoginModal(false);\n };\n if (isPlainHeader) {\n return (\n <NavBar data-testid=\"header\" position=\"static\">\n <InnerNavBar data-testid=\"inner-nav-bar\">\n <HeaderLeft showSearch={false} />\n <HeaderRight\n hasLogin={false}\n onLogout={() => {}}\n onOpenRegistryInfoDialog={() => {}}\n onOpenSettingsDialog={() => {}}\n onToggleLogin={() => {}}\n onToggleMobileNav={() => {}}\n showInfo={false}\n showSearch={false}\n showSettings={false}\n showThemeSwitch={false}\n username={''}\n />\n </InnerNavBar>\n </NavBar>\n );\n }\n\n return (\n <>\n <NavBar data-testid=\"header\" position=\"static\">\n <InnerNavBar data-testid=\"inner-nav-bar\">\n <HeaderLeft showSearch={configOptions.showSearch} />\n <HeaderRight\n hasLogin={configOptions?.login}\n onLogout={handleLogout}\n onOpenRegistryInfoDialog={() => setOpenInfoDialog(true)}\n onOpenSettingsDialog={() => setSettingsDialogOpen(true)}\n onToggleLogin={() => setShowLoginModal(!showLoginModal)}\n onToggleMobileNav={() => setShowMobileNavBar(!showMobileNavBar)}\n showInfo={configOptions.showInfo}\n showSearch={configOptions.showSearch}\n showSettings={configOptions.showSettings}\n showThemeSwitch={configOptions.showThemeSwitch}\n username={userState?.username}\n />\n </InnerNavBar>\n <HeaderSettingsDialog\n isOpen={isSettingsDialogOpen}\n onCloseDialog={() => setSettingsDialogOpen(false)}\n />\n {HeaderInfoDialog ? (\n <HeaderInfoDialog\n dialogTitle={t('dialog.registry-info.title')}\n isOpen={isInfoDialogOpen}\n onCloseDialog={() => setOpenInfoDialog(false)}\n />\n ) : null}\n </NavBar>\n {showMobileNavBar && (\n <MobileNavBar data-testid=\"mobile-nav-bar\">\n <InnerMobileNavBar>\n <Search />\n </InnerMobileNavBar>\n <Button color=\"inherit\" onClick={() => setShowMobileNavBar(false)}>\n {t('button.cancel')}\n </Button>\n </MobileNavBar>\n )}\n {!userState?.username && (\n <LoginDialog onClose={() => setShowLoginModal(false)} open={showLoginModal} />\n )}\n </>\n );\n};\n\nexport default Header;\n"],"mappings":";;;;;;;;;;;;;;;AAgBA,IAAM,UAA2B,EAAE,kBAAkB,oBAAoB;CACvE,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,CAAC,kBAAkB,qBAAqB,SAAkB,KAAK;CACrE,MAAM,CAAC,sBAAsB,yBAAyB,SAAkB,KAAK;CAC7E,MAAM,CAAC,kBAAkB,uBAAuB,SAAkB,KAAK;CACvE,MAAM,CAAC,gBAAgB,qBAAqB,SAAkB,KAAK;CACnE,MAAM,EAAE,kBAAkB,UAAU;CACpC,MAAM,EAAE,WAAW,eAAe,QAAQ;CAG1C,MAAM,gBAAgB,OAAO,UAAU;CACvC,gBAAgB;EACd,cAAc,UAAU;CAC1B,GAAG,CAAC,UAAU,CAAC;CAIf,gBAAgB;EACd,MAAM,QAAQ,WAAW;EACzB,IAAI,CAAC,OACH;EAEF,IAAI;EACJ,MAAM,YAAY;GAChB,MAAM,YAAY,gBAAgB,KAAK;GACvC,IAAI,cAAc,QAAQ,aAAa,GAAG;IACxC,cAAc,UAAU;IACxB;GACF;GAEA,QAAQ,WAAW,KAAK,KAAK,IAAI,WAAW,KAAK,KAAK,CAAC,CAAC;EAC1D;EACA,IAAI;EACJ,aAAa,aAAa,KAAK;CACjC,GAAG,CAAC,WAAW,KAAK,CAAC;CAErB,MAAM,qBAAqB;EACzB,aAAa;EACb,kBAAkB,KAAK;CACzB;CACA,IAAI,eACF,OACE,oBAAC,QAAD;EAAQ,eAAY;EAAS,UAAS;EACpC,UAAA,qBAAC,aAAD;GAAa,eAAY;GAAzB,UAAA,CACE,oBAAC,YAAD,EAAY,YAAY,MAAQ,CAAA,GAChC,oBAAC,aAAD;IACE,UAAU;IACV,gBAAgB,CAAC;IACjB,gCAAgC,CAAC;IACjC,4BAA4B,CAAC;IAC7B,qBAAqB,CAAC;IACtB,yBAAyB,CAAC;IAC1B,UAAU;IACV,YAAY;IACZ,cAAc;IACd,iBAAiB;IACjB,UAAU;GACX,CAAA,CACU;;CACP,CAAA;CAIZ,OACE,qBAAA,YAAA,EAAA,UAAA;EACE,qBAAC,QAAD;GAAQ,eAAY;GAAS,UAAS;GAAtC,UAAA;IACE,qBAAC,aAAD;KAAa,eAAY;KAAzB,UAAA,CACE,oBAAC,YAAD,EAAY,YAAY,cAAc,WAAa,CAAA,GACnD,oBAAC,aAAD;MACE,UAAU,eAAe;MACzB,UAAU;MACV,gCAAgC,kBAAkB,IAAI;MACtD,4BAA4B,sBAAsB,IAAI;MACtD,qBAAqB,kBAAkB,CAAC,cAAc;MACtD,yBAAyB,oBAAoB,CAAC,gBAAgB;MAC9D,UAAU,cAAc;MACxB,YAAY,cAAc;MAC1B,cAAc,cAAc;MAC5B,iBAAiB,cAAc;MAC/B,UAAU,WAAW;KACtB,CAAA,CACU;;IACb,oBAAC,sBAAD;KACE,QAAQ;KACR,qBAAqB,sBAAsB,KAAK;IACjD,CAAA;IACA,mBACC,oBAAC,kBAAD;KACE,aAAa,EAAE,4BAA4B;KAC3C,QAAQ;KACR,qBAAqB,kBAAkB,KAAK;IAC7C,CAAA,IACC;GACE;;EACP,oBACC,qBAAC,cAAD;GAAc,eAAY;GAA1B,UAAA,CACE,oBAAC,mBAAD,EAAA,UACE,oBAAC,QAAD,CAAS,CAAA,EACQ,CAAA,GACnB,oBAAC,QAAD;IAAQ,OAAM;IAAU,eAAe,oBAAoB,KAAK;IAC7D,UAAA,EAAE,eAAe;GACZ,CAAA,CACI;;EAEf,CAAC,WAAW,YACX,oBAAC,aAAD;GAAa,eAAe,kBAAkB,KAAK;GAAG,MAAM;EAAiB,CAAA;CAE/E,EAAA,CAAA;AAEN"}

package/build/sections/Header/HeaderGreetings.js CHANGED Viewed

@@ -4,8 +4,8 @@ const require_styles = require("./styles.js");
 require("../../index.js");
 let react = require("react");
 react = require_runtime.__toESM(react);
-let react_jsx_runtime = require("react/jsx-runtime");
 let react_i18next = require("react-i18next");
+let react_jsx_runtime = require("react/jsx-runtime");
 //#region src/sections/Header/HeaderGreetings.tsx
 var HeaderGreetings = ({ username }) => {
 	const { t } = (0, react_i18next.useTranslation)();

package/build/sections/Header/HeaderGreetings.mjs CHANGED Viewed

@@ -2,8 +2,8 @@ import Label from "../../components/Label/Label.mjs";
 import { Greetings } from "./styles.mjs";
 import "../../index.mjs";
 import "react";
-import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 import { useTranslation } from "react-i18next";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 //#region src/sections/Header/HeaderGreetings.tsx
 var HeaderGreetings = ({ username }) => {
 	const { t } = useTranslation();

package/build/sections/Header/HeaderMenu.js CHANGED Viewed

@@ -1,4 +1,7 @@
 const require_runtime = require("../../_virtual/_rolldown/runtime.js");
+const require_routes = require("../../utils/routes.js");
+require("../../utils/index.js");
+const require_AppConfigurationProvider = require("../../providers/AppConfigurationProvider/AppConfigurationProvider.js");
 const require_MenuItem = require("../../components/MenuItem/MenuItem.js");
 const require_HeaderGreetings = require("./HeaderGreetings.js");
 require("../../index.js");
@@ -6,8 +9,9 @@ let _mui_material_IconButton = require("@mui/material/IconButton");
 _mui_material_IconButton = require_runtime.__toESM(_mui_material_IconButton);
 let react = require("react");
 react = require_runtime.__toESM(react);
-let react_jsx_runtime = require("react/jsx-runtime");
 let react_i18next = require("react-i18next");
+let react_jsx_runtime = require("react/jsx-runtime");
+let react_router = require("react-router");
 let _mui_material_Menu = require("@mui/material/Menu");
 _mui_material_Menu = require_runtime.__toESM(_mui_material_Menu);
 let _mui_icons_material_AccountCircle = require("@mui/icons-material/AccountCircle");
@@ -16,6 +20,9 @@ _mui_icons_material_AccountCircle = require_runtime.__toESM(_mui_icons_material_
 var TypedMenu = _mui_material_Menu.default;
 var HeaderMenu = ({ onLogout, username, isMenuOpen = false, anchorEl, onLoggedInMenu, onLoggedInMenuClose }) => {
 	const { t } = (0, react_i18next.useTranslation)();
+	const navigate = (0, react_router.useNavigate)();
+	const { configOptions } = require_AppConfigurationProvider.useConfig();
+	const stageEnabled = configOptions?.flags?.stage;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_mui_material_IconButton.default, {
 		color: "inherit",
 		"data-testid": "logInDialogIcon",
@@ -35,12 +42,24 @@ var HeaderMenu = ({ onLogout, username, isMenuOpen = false, anchorEl, onLoggedIn
 			vertical: "top",
 			horizontal: "right"
 		},
-		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_MenuItem.default, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_HeaderGreetings.default, { username }) }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_MenuItem.default, {
-			"data-testid": "logOutDialogIcon",
-			id: "logOutDialogIcon",
-			onClick: onLogout,
-			children: t("button.logout")
-		})]
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_MenuItem.default, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_HeaderGreetings.default, { username }) }),
+			stageEnabled && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_MenuItem.default, {
+				"data-testid": "stagedPackagesMenuItem",
+				id: "stagedPackagesMenuItem",
+				onClick: () => {
+					onLoggedInMenuClose();
+					navigate(require_routes.Route.STAGE);
+				},
+				children: t("stage.menu")
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_MenuItem.default, {
+				"data-testid": "logOutDialogIcon",
+				id: "logOutDialogIcon",
+				onClick: onLogout,
+				children: t("button.logout")
+			})
+		]
 	})] });
 };
 //#endregion

package/build/sections/Header/HeaderMenu.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"HeaderMenu.js","names":[],"sources":["../../../src/sections/Header/HeaderMenu.tsx"],"sourcesContent":["import AccountCircle from '@mui/icons-material/AccountCircle';\nimport IconButton from '@mui/material/IconButton';\nimport Menu from '@mui/material/Menu';\nimport type { MouseEvent } from 'react';\nimport React from 'react';\nimport { useTranslation } from 'react-i18next';\n\nimport { MenuItem } from '../../';\nimport HeaderGreetings from './HeaderGreetings';\n\n// Workaround: MUI v7 MenuProps type resolution breaks inherited PopoverProps.\nconst TypedMenu = Menu as React.FC<any>;\n\ninterface Props {\n username: string;\n isMenuOpen: boolean;\n anchorEl?: Element \| null \| undefined;\n onLogout: () => void;\n onLoggedInMenu: (event: MouseEvent<HTMLButtonElement>) => void;\n onLoggedInMenuClose: () => void;\n}\n\nconst HeaderMenu: React.FC<Props> = ({\n onLogout,\n username,\n isMenuOpen = false,\n anchorEl,\n onLoggedInMenu,\n onLoggedInMenuClose,\n}) => {\n const { t } = useTranslation();\n return (\n <>\n <IconButton\n color=\"inherit\"\n data-testid=\"logInDialogIcon\"\n id=\"header--button-account\"\n onClick={onLoggedInMenu}\n size=\"large\"\n >\n <AccountCircle />\n </IconButton>\n <TypedMenu\n anchorEl={anchorEl}\n anchorOrigin={{\n vertical: 'bottom',\n horizontal: 'right',\n }}\n onClose={onLoggedInMenuClose}\n open={isMenuOpen}\n transformOrigin={{\n vertical: 'top',\n horizontal: 'right',\n }}\n >\n <MenuItem>\n <HeaderGreetings username={username} />\n </MenuItem>\n <MenuItem data-testid=\"logOutDialogIcon\" id=\"logOutDialogIcon\" onClick={onLogout}>\n {t('button.logout')}\n </MenuItem>\n </TypedMenu>\n </>\n );\n};\n\nexport default HeaderMenu;\n"],"mappings":"~~;;;;;;;;;;;;;;;AAWA~~,IAAM,YAAY,mBAAA;AAWlB,IAAM,cAA+B,EACnC,UACA,UACA,aAAa,OACb,UACA,gBACA,0BACI;CACJ,MAAM,EAAE,OAAA,GAAM,cAAA,eAAA,CAAe;CAC7B,OACE,iBAAA,GAAA,kBAAA,KAAA,CAAA,kBAAA,UAAA,EAAA,UAAA,CACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,yBAAA,SAAD;EACE,OAAM;EACN,eAAY;EACZ,IAAG;EACH,SAAS;EACT,MAAK;EAEL,UAAA,iBAAA,GAAA,kBAAA,IAAA,CAAC,kCAAA,SAAD,CAAgB,CAAA;CACN,CAAA,GACZ,iBAAA,GAAA,kBAAA,KAAA,CAAC,WAAD;EACY;EACV,cAAc;GACZ,UAAU;GACV,YAAY;EACd;EACA,SAAS;EACT,MAAM;EACN,iBAAiB;GACf,UAAU;GACV,YAAY;EACd;EAXF,UAAA,~~CAaE,~~iBAAA,GAAA,kBAAA,IAAA,CAAC,iBAAA,SAAD,EAAA,UACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,wBAAA,SAAD,EAA2B,SAAW,CAAA,EAC9B,CAAA,~~GACV~~,iBAAA,GAAA,kBAAA,IAAA,CAAC,iBAAA,SAAD;~~GAAU~~,eAAY;~~GAAmB~~,IAAG;~~GAAmB~~,SAAS;~~GACrE~~,UAAA,EAAE,~~eAAe~~;~~EACV~~,CAAA,~~CACD~~;CACX,CAAA,CAAA,EAAA,CAAA;AAEN"}
1	+ {"version":3,"file":"HeaderMenu.js","names":[],"sources":["../../../src/sections/Header/HeaderMenu.tsx"],"sourcesContent":["import AccountCircle from '@mui/icons-material/AccountCircle';\nimport IconButton from '@mui/material/IconButton';\nimport Menu from '@mui/material/Menu';\nimport type { MouseEvent } from 'react';\nimport React from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { useNavigate } from 'react-router';\n\nimport { MenuItem } from '../../';\nimport { useConfig } from '../../providers/AppConfigurationProvider/AppConfigurationProvider';\nimport { Route } from '../../utils';\nimport HeaderGreetings from './HeaderGreetings';\n\n// Workaround: MUI v7 MenuProps type resolution breaks inherited PopoverProps.\nconst TypedMenu = Menu as React.FC<any>;\n\ninterface Props {\n username: string;\n isMenuOpen: boolean;\n anchorEl?: Element \| null \| undefined;\n onLogout: () => void;\n onLoggedInMenu: (event: MouseEvent<HTMLButtonElement>) => void;\n onLoggedInMenuClose: () => void;\n}\n\nconst HeaderMenu: React.FC<Props> = ({\n onLogout,\n username,\n isMenuOpen = false,\n anchorEl,\n onLoggedInMenu,\n onLoggedInMenuClose,\n}) => {\n const { t } = useTranslation();\n const navigate = useNavigate();\n const { configOptions } = useConfig();\n const stageEnabled = configOptions?.flags?.stage;\n return (\n <>\n <IconButton\n color=\"inherit\"\n data-testid=\"logInDialogIcon\"\n id=\"header--button-account\"\n onClick={onLoggedInMenu}\n size=\"large\"\n >\n <AccountCircle />\n </IconButton>\n <TypedMenu\n anchorEl={anchorEl}\n anchorOrigin={{\n vertical: 'bottom',\n horizontal: 'right',\n }}\n onClose={onLoggedInMenuClose}\n open={isMenuOpen}\n transformOrigin={{\n vertical: 'top',\n horizontal: 'right',\n }}\n >\n <MenuItem>\n <HeaderGreetings username={username} />\n </MenuItem>\n {stageEnabled && (\n <MenuItem\n data-testid=\"stagedPackagesMenuItem\"\n id=\"stagedPackagesMenuItem\"\n onClick={() => {\n onLoggedInMenuClose();\n navigate(Route.STAGE);\n }}\n >\n {t('stage.menu')}\n </MenuItem>\n )}\n <MenuItem data-testid=\"logOutDialogIcon\" id=\"logOutDialogIcon\" onClick={onLogout}>\n {t('button.logout')}\n </MenuItem>\n </TypedMenu>\n </>\n );\n};\n\nexport default HeaderMenu;\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAcA,IAAM,YAAY,mBAAA;AAWlB,IAAM,cAA+B,EACnC,UACA,UACA,aAAa,OACb,UACA,gBACA,0BACI;CACJ,MAAM,EAAE,OAAA,GAAM,cAAA,eAAA,CAAe;CAC7B,MAAM,YAAA,GAAW,aAAA,YAAA,CAAY;CAC7B,MAAM,EAAE,kBAAkB,iCAAA,UAAU;CACpC,MAAM,eAAe,eAAe,OAAO;CAC3C,OACE,iBAAA,GAAA,kBAAA,KAAA,CAAA,kBAAA,UAAA,EAAA,UAAA,CACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,yBAAA,SAAD;EACE,OAAM;EACN,eAAY;EACZ,IAAG;EACH,SAAS;EACT,MAAK;EAEL,UAAA,iBAAA,GAAA,kBAAA,IAAA,CAAC,kCAAA,SAAD,CAAgB,CAAA;CACN,CAAA,GACZ,iBAAA,GAAA,kBAAA,KAAA,CAAC,WAAD;EACY;EACV,cAAc;GACZ,UAAU;GACV,YAAY;EACd;EACA,SAAS;EACT,MAAM;EACN,iBAAiB;GACf,UAAU;GACV,YAAY;EACd;EAXF,UAAA;GAaE,iBAAA,GAAA,kBAAA,IAAA,CAAC,iBAAA,SAAD,EAAA,UACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,wBAAA,SAAD,EAA2B,SAAW,CAAA,EAC9B,CAAA;GACT,gBACC,iBAAA,GAAA,kBAAA,IAAA,CAAC,iBAAA,SAAD;IACE,eAAY;IACZ,IAAG;IACH,eAAe;KACb,oBAAoB;KACpB,SAAS,eAAA,MAAM,KAAK;IACtB;IAEC,UAAA,EAAE,YAAY;GACP,CAAA;GAEZ,iBAAA,GAAA,kBAAA,IAAA,CAAC,iBAAA,SAAD;IAAU,eAAY;IAAmB,IAAG;IAAmB,SAAS;IACrE,UAAA,EAAE,eAAe;GACV,CAAA;EACD;CACX,CAAA,CAAA,EAAA,CAAA;AAEN"}

package/build/sections/Header/HeaderMenu.mjs CHANGED Viewed

@@ -1,16 +1,23 @@
+import { Route as Route$1 } from "../../utils/routes.mjs";
+import "../../utils/index.mjs";
+import { useConfig } from "../../providers/AppConfigurationProvider/AppConfigurationProvider.mjs";
 import MenuItem from "../../components/MenuItem/MenuItem.mjs";
 import HeaderGreetings from "./HeaderGreetings.mjs";
 import "../../index.mjs";
 import IconButton from "@mui/material/IconButton";
 import "react";
-import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 import { useTranslation } from "react-i18next";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
+import { useNavigate } from "react-router";
 import Menu from "@mui/material/Menu";
 import AccountCircle from "@mui/icons-material/AccountCircle";
 //#region src/sections/Header/HeaderMenu.tsx
 var TypedMenu = Menu;
 var HeaderMenu = ({ onLogout, username, isMenuOpen = false, anchorEl, onLoggedInMenu, onLoggedInMenuClose }) => {
 	const { t } = useTranslation();
+	const navigate = useNavigate();
+	const { configOptions } = useConfig();
+	const stageEnabled = configOptions?.flags?.stage;
 	return /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(IconButton, {
 		color: "inherit",
 		"data-testid": "logInDialogIcon",
@@ -30,12 +37,24 @@ var HeaderMenu = ({ onLogout, username, isMenuOpen = false, anchorEl, onLoggedIn
 			vertical: "top",
 			horizontal: "right"
 		},
-		children: [/* @__PURE__ */ jsx(MenuItem, { children: /* @__PURE__ */ jsx(HeaderGreetings, { username }) }), /* @__PURE__ */ jsx(MenuItem, {
-			"data-testid": "logOutDialogIcon",
-			id: "logOutDialogIcon",
-			onClick: onLogout,
-			children: t("button.logout")
-		})]
+		children: [
+			/* @__PURE__ */ jsx(MenuItem, { children: /* @__PURE__ */ jsx(HeaderGreetings, { username }) }),
+			stageEnabled && /* @__PURE__ */ jsx(MenuItem, {
+				"data-testid": "stagedPackagesMenuItem",
+				id: "stagedPackagesMenuItem",
+				onClick: () => {
+					onLoggedInMenuClose();
+					navigate(Route$1.STAGE);
+				},
+				children: t("stage.menu")
+			}),
+			/* @__PURE__ */ jsx(MenuItem, {
+				"data-testid": "logOutDialogIcon",
+				id: "logOutDialogIcon",
+				onClick: onLogout,
+				children: t("button.logout")
+			})
+		]
 	})] });
 };
 //#endregion

package/build/sections/Header/HeaderMenu.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"HeaderMenu.mjs","names":[],"sources":["../../../src/sections/Header/HeaderMenu.tsx"],"sourcesContent":["import AccountCircle from '@mui/icons-material/AccountCircle';\nimport IconButton from '@mui/material/IconButton';\nimport Menu from '@mui/material/Menu';\nimport type { MouseEvent } from 'react';\nimport React from 'react';\nimport { useTranslation } from 'react-i18next';\n\nimport { MenuItem } from '../../';\nimport HeaderGreetings from './HeaderGreetings';\n\n// Workaround: MUI v7 MenuProps type resolution breaks inherited PopoverProps.\nconst TypedMenu = Menu as React.FC<any>;\n\ninterface Props {\n username: string;\n isMenuOpen: boolean;\n anchorEl?: Element \| null \| undefined;\n onLogout: () => void;\n onLoggedInMenu: (event: MouseEvent<HTMLButtonElement>) => void;\n onLoggedInMenuClose: () => void;\n}\n\nconst HeaderMenu: React.FC<Props> = ({\n onLogout,\n username,\n isMenuOpen = false,\n anchorEl,\n onLoggedInMenu,\n onLoggedInMenuClose,\n}) => {\n const { t } = useTranslation();\n return (\n <>\n <IconButton\n color=\"inherit\"\n data-testid=\"logInDialogIcon\"\n id=\"header--button-account\"\n onClick={onLoggedInMenu}\n size=\"large\"\n >\n <AccountCircle />\n </IconButton>\n <TypedMenu\n anchorEl={anchorEl}\n anchorOrigin={{\n vertical: 'bottom',\n horizontal: 'right',\n }}\n onClose={onLoggedInMenuClose}\n open={isMenuOpen}\n transformOrigin={{\n vertical: 'top',\n horizontal: 'right',\n }}\n >\n <MenuItem>\n <HeaderGreetings username={username} />\n </MenuItem>\n <MenuItem data-testid=\"logOutDialogIcon\" id=\"logOutDialogIcon\" onClick={onLogout}>\n {t('button.logout')}\n </MenuItem>\n </TypedMenu>\n </>\n );\n};\n\nexport default HeaderMenu;\n"],"mappings":"~~;;;;;;;;;;AAWA~~,IAAM,YAAY;AAWlB,IAAM,cAA+B,EACnC,UACA,UACA,aAAa,OACb,UACA,gBACA,0BACI;CACJ,MAAM,EAAE,MAAM,eAAe;CAC7B,OACE,qBAAA,YAAA,EAAA,UAAA,CACE,oBAAC,YAAD;EACE,OAAM;EACN,eAAY;EACZ,IAAG;EACH,SAAS;EACT,MAAK;EAEL,UAAA,oBAAC,eAAD,CAAgB,CAAA;CACN,CAAA,GACZ,qBAAC,WAAD;EACY;EACV,cAAc;GACZ,UAAU;GACV,YAAY;EACd;EACA,SAAS;EACT,MAAM;EACN,iBAAiB;GACf,UAAU;GACV,YAAY;EACd;EAXF,UAAA,~~CAaE,~~oBAAC,UAAD,EAAA,UACE,oBAAC,iBAAD,EAA2B,SAAW,CAAA,EAC9B,CAAA,~~GACV~~,oBAAC,UAAD;~~GAAU~~,eAAY;~~GAAmB~~,IAAG;~~GAAmB~~,SAAS;~~GACrE~~,UAAA,EAAE,~~eAAe~~;~~EACV~~,CAAA,~~CACD~~;CACX,CAAA,CAAA,EAAA,CAAA;AAEN"}
1	+ {"version":3,"file":"HeaderMenu.mjs","names":[],"sources":["../../../src/sections/Header/HeaderMenu.tsx"],"sourcesContent":["import AccountCircle from '@mui/icons-material/AccountCircle';\nimport IconButton from '@mui/material/IconButton';\nimport Menu from '@mui/material/Menu';\nimport type { MouseEvent } from 'react';\nimport React from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { useNavigate } from 'react-router';\n\nimport { MenuItem } from '../../';\nimport { useConfig } from '../../providers/AppConfigurationProvider/AppConfigurationProvider';\nimport { Route } from '../../utils';\nimport HeaderGreetings from './HeaderGreetings';\n\n// Workaround: MUI v7 MenuProps type resolution breaks inherited PopoverProps.\nconst TypedMenu = Menu as React.FC<any>;\n\ninterface Props {\n username: string;\n isMenuOpen: boolean;\n anchorEl?: Element \| null \| undefined;\n onLogout: () => void;\n onLoggedInMenu: (event: MouseEvent<HTMLButtonElement>) => void;\n onLoggedInMenuClose: () => void;\n}\n\nconst HeaderMenu: React.FC<Props> = ({\n onLogout,\n username,\n isMenuOpen = false,\n anchorEl,\n onLoggedInMenu,\n onLoggedInMenuClose,\n}) => {\n const { t } = useTranslation();\n const navigate = useNavigate();\n const { configOptions } = useConfig();\n const stageEnabled = configOptions?.flags?.stage;\n return (\n <>\n <IconButton\n color=\"inherit\"\n data-testid=\"logInDialogIcon\"\n id=\"header--button-account\"\n onClick={onLoggedInMenu}\n size=\"large\"\n >\n <AccountCircle />\n </IconButton>\n <TypedMenu\n anchorEl={anchorEl}\n anchorOrigin={{\n vertical: 'bottom',\n horizontal: 'right',\n }}\n onClose={onLoggedInMenuClose}\n open={isMenuOpen}\n transformOrigin={{\n vertical: 'top',\n horizontal: 'right',\n }}\n >\n <MenuItem>\n <HeaderGreetings username={username} />\n </MenuItem>\n {stageEnabled && (\n <MenuItem\n data-testid=\"stagedPackagesMenuItem\"\n id=\"stagedPackagesMenuItem\"\n onClick={() => {\n onLoggedInMenuClose();\n navigate(Route.STAGE);\n }}\n >\n {t('stage.menu')}\n </MenuItem>\n )}\n <MenuItem data-testid=\"logOutDialogIcon\" id=\"logOutDialogIcon\" onClick={onLogout}>\n {t('button.logout')}\n </MenuItem>\n </TypedMenu>\n </>\n );\n};\n\nexport default HeaderMenu;\n"],"mappings":";;;;;;;;;;;;;;AAcA,IAAM,YAAY;AAWlB,IAAM,cAA+B,EACnC,UACA,UACA,aAAa,OACb,UACA,gBACA,0BACI;CACJ,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,WAAW,YAAY;CAC7B,MAAM,EAAE,kBAAkB,UAAU;CACpC,MAAM,eAAe,eAAe,OAAO;CAC3C,OACE,qBAAA,YAAA,EAAA,UAAA,CACE,oBAAC,YAAD;EACE,OAAM;EACN,eAAY;EACZ,IAAG;EACH,SAAS;EACT,MAAK;EAEL,UAAA,oBAAC,eAAD,CAAgB,CAAA;CACN,CAAA,GACZ,qBAAC,WAAD;EACY;EACV,cAAc;GACZ,UAAU;GACV,YAAY;EACd;EACA,SAAS;EACT,MAAM;EACN,iBAAiB;GACf,UAAU;GACV,YAAY;EACd;EAXF,UAAA;GAaE,oBAAC,UAAD,EAAA,UACE,oBAAC,iBAAD,EAA2B,SAAW,CAAA,EAC9B,CAAA;GACT,gBACC,oBAAC,UAAD;IACE,eAAY;IACZ,IAAG;IACH,eAAe;KACb,oBAAoB;KACpB,SAAS,QAAM,KAAK;IACtB;IAEC,UAAA,EAAE,YAAY;GACP,CAAA;GAEZ,oBAAC,UAAD;IAAU,eAAY;IAAmB,IAAG;IAAmB,SAAS;IACrE,UAAA,EAAE,eAAe;GACV,CAAA;EACD;CACX,CAAA,CAAA,EAAA,CAAA;AAEN"}

package/build/sections/Header/HeaderRight.js CHANGED Viewed

@@ -5,8 +5,8 @@ const require_ThemeProvider = require("../../Theme/ThemeProvider.js");
 require("../../index.js");
 let react = require("react");
 react = require_runtime.__toESM(react);
-let react_jsx_runtime = require("react/jsx-runtime");
 let react_i18next = require("react-i18next");
+let react_jsx_runtime = require("react/jsx-runtime");
 let _mui_material_Button = require("@mui/material/Button");
 _mui_material_Button = require_runtime.__toESM(_mui_material_Button);
 let _mui_material_Toolbar = require("@mui/material/Toolbar");

package/build/sections/Header/HeaderRight.mjs CHANGED Viewed

@@ -3,8 +3,8 @@ import HeaderToolTip from "./HeaderToolTip.mjs";
 import { useCustomTheme } from "../../Theme/ThemeProvider.mjs";
 import "../../index.mjs";
 import { useEffect, useState } from "react";
-import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 import { useTranslation } from "react-i18next";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 import Button from "@mui/material/Button";
 import Toolbar from "@mui/material/Toolbar";
 //#region src/sections/Header/HeaderRight.tsx

package/build/sections/Header/HeaderSettingsDialog.js CHANGED Viewed

@@ -9,10 +9,10 @@ let _emotion_styled = require("@emotion/styled");
 _emotion_styled = require_runtime.__toESM(_emotion_styled);
 let react = require("react");
 react = require_runtime.__toESM(react);
+let react_i18next = require("react-i18next");
 let react_jsx_runtime = require("react/jsx-runtime");
 let _mui_material_Box = require("@mui/material/Box");
 _mui_material_Box = require_runtime.__toESM(_mui_material_Box);
-let react_i18next = require("react-i18next");
 let _mui_material_Tab = require("@mui/material/Tab");
 _mui_material_Tab = require_runtime.__toESM(_mui_material_Tab);
 let _mui_material_Tabs = require("@mui/material/Tabs");

package/build/sections/Header/HeaderSettingsDialog.mjs CHANGED Viewed

@@ -6,9 +6,9 @@ import RegistryInfoContent from "./RegistryInfoContent/RegistryInfoContent.mjs";
 import "./RegistryInfoContent/index.mjs";
 import styled from "@emotion/styled";
 import React from "react";
+import { useTranslation } from "react-i18next";
 import { jsx, jsxs } from "react/jsx-runtime";
 import Box from "@mui/material/Box";
-import { useTranslation } from "react-i18next";
 import Tab from "@mui/material/Tab";
 import Tabs from "@mui/material/Tabs";
 import ReactMarkdown from "react-markdown";

package/build/sections/Header/LanguageSwitch.js CHANGED Viewed

@@ -5,10 +5,10 @@ let _emotion_styled = require("@emotion/styled");
 _emotion_styled = require_runtime.__toESM(_emotion_styled);
 let react = require("react");
 react = require_runtime.__toESM(react);
+let react_i18next = require("react-i18next");
 let react_jsx_runtime = require("react/jsx-runtime");
 let i18next = require("i18next");
 i18next = require_runtime.__toESM(i18next);
-let react_i18next = require("react-i18next");
 let _mui_material_Typography = require("@mui/material/Typography");
 _mui_material_Typography = require_runtime.__toESM(_mui_material_Typography);
 let _mui_material_Card = require("@mui/material/Card");

package/build/sections/Header/LanguageSwitch.mjs CHANGED Viewed

@@ -2,9 +2,9 @@ import { useLanguage } from "../../providers/TranslatorProvider/TranslatorProvid
 import "../../index.mjs";
 import styled from "@emotion/styled";
 import { useCallback, useState } from "react";
+import { useTranslation } from "react-i18next";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 import i18next from "i18next";
-import { useTranslation } from "react-i18next";
 import Typography from "@mui/material/Typography";
 import Card from "@mui/material/Card";
 import CardContent from "@mui/material/CardContent";

package/build/sections/Header/RegistryInfoContent/RegistryInfoContent.js CHANGED Viewed

@@ -8,10 +8,10 @@ let _emotion_styled = require("@emotion/styled");
 _emotion_styled = require_runtime.__toESM(_emotion_styled);
 let react = require("react");
 react = require_runtime.__toESM(react);
+let react_i18next = require("react-i18next");
 let react_jsx_runtime = require("react/jsx-runtime");
 let _mui_material_Box = require("@mui/material/Box");
 _mui_material_Box = require_runtime.__toESM(_mui_material_Box);
-let react_i18next = require("react-i18next");
 let _mui_material_Link = require("@mui/material/Link");
 _mui_material_Link = require_runtime.__toESM(_mui_material_Link);
 let _mui_material_Typography = require("@mui/material/Typography");

package/build/sections/Header/RegistryInfoContent/RegistryInfoContent.mjs CHANGED Viewed

@@ -5,9 +5,9 @@ import { Description, TextContent } from "./styles.mjs";
 import "../../../index.mjs";
 import styled from "@emotion/styled";
 import "react";
+import { useTranslation } from "react-i18next";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 import Box from "@mui/material/Box";
-import { useTranslation } from "react-i18next";
 import Link from "@mui/material/Link";
 import Typography from "@mui/material/Typography";
 import ReactMarkdown from "react-markdown";

package/build/sections/Home/Home.js CHANGED Viewed

@@ -1,5 +1,6 @@
 const require_runtime = require("../../_virtual/_rolldown/runtime.js");
 const require_ManifestsProvider = require("../../providers/ManifestsProvider/ManifestsProvider.js");
+const require_GenericError = require("../../components/GenericError/GenericError.js");
 const require_Loading = require("../../components/Loading/Loading.js");
 const require_PackageList = require("../../components/PackageList/PackageList.js");
 require("../../index.js");
@@ -9,11 +10,11 @@ let react_jsx_runtime = require("react/jsx-runtime");
 //#region src/sections/Home/Home.tsx
 var Home = () => {
 	const manifests = require_ManifestsProvider.useManifests();
-	if (manifests.isError) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { children: "Error loading manifests" });
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+	if (manifests.isError) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_GenericError.default, {});
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 		className: "container content",
 		"data-testid": "home-page-container",
-		children: [manifests.isLoading ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Loading.default, {}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_PackageList.default, { packages: manifests.manifests }), manifests.isError && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { children: "Error loading manifests" })]
+		children: manifests.isLoading ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Loading.default, {}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_PackageList.default, { packages: manifests.manifests })
 	});
 };
 //#endregion

package/build/sections/Home/Home.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Home.js","names":[],"sources":["../../../src/sections/Home/Home.tsx"],"sourcesContent":["import React from 'react';\n\nimport { Loading, PackageList, useManifests } from '../..';\nimport type { ManifestWeb } from '../../providers/ManifestsProvider/ManifestsProvider';\n\nconst Home: React.FC = () => {\n const manifests = useManifests();\n\n if (manifests.isError) {\n return <~~div>Error~~ ~~loading manifests</div>;\~~n }\n\n return (\n <div className=\"container content\" data-testid=\"home-page-container\">\n {manifests.isLoading ? (\n <Loading />\n ) : (\n <PackageList packages={manifests.manifests as ManifestWeb[]} />\n )}\n ~~{manifests.isError && <div>{'Error loading manifests'}</div>}\n~~ </div>\n );\n};\n\nexport default Home;\n"],"mappings":"~~;;;;;;;;;~~AAKA,IAAM,aAAuB;CAC3B,MAAM,YAAY,0BAAA,aAAa;CAE/B,IAAI,UAAU,SACZ,OAAO,iBAAA,GAAA,kBAAA,IAAA,CAAC,~~OAAD~~,~~EAAA~~,~~UAAK~~,~~0BAA4B,~~CAAA;~~CAG1C~~,OACE,iBAAA,GAAA,kBAAA,~~KAAA~~,CAAC,OAAD;EAAK,WAAU;EAAoB,eAAY;~~EAA/C~~,UAAA,~~CACG,~~UAAU,YACT,iBAAA,GAAA,kBAAA,IAAA,CAAC,gBAAA,SAAD,CAAU,CAAA,IAEV,iBAAA,GAAA,kBAAA,IAAA,CAAC,oBAAA,SAAD,EAAa,UAAU,UAAU,UAA6B,CAAA,~~GAE/D,UAAU,WAAW,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD,EAAA,UAAM,0BAA+B,~~CAAA~~,CACxD;;~~AAET"}
1	+ {"version":3,"file":"Home.js","names":[],"sources":["../../../src/sections/Home/Home.tsx"],"sourcesContent":["import React from 'react';\n\nimport { GenericError, Loading, PackageList, useManifests } from '../..';\nimport type { ManifestWeb } from '../../providers/ManifestsProvider/ManifestsProvider';\n\nconst Home: React.FC = () => {\n const manifests = useManifests();\n\n if (manifests.isError) {\n return <GenericError />;\n }\n\n return (\n <div className=\"container content\" data-testid=\"home-page-container\">\n {manifests.isLoading ? (\n <Loading />\n ) : (\n <PackageList packages={manifests.manifests as ManifestWeb[]} />\n )}\n </div>\n );\n};\n\nexport default Home;\n"],"mappings":";;;;;;;;;;AAKA,IAAM,aAAuB;CAC3B,MAAM,YAAY,0BAAA,aAAa;CAE/B,IAAI,UAAU,SACZ,OAAO,iBAAA,GAAA,kBAAA,IAAA,CAAC,qBAAA,SAAD,CAAe,CAAA;CAGxB,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD;EAAK,WAAU;EAAoB,eAAY;EAC5C,UAAA,UAAU,YACT,iBAAA,GAAA,kBAAA,IAAA,CAAC,gBAAA,SAAD,CAAU,CAAA,IAEV,iBAAA,GAAA,kBAAA,IAAA,CAAC,oBAAA,SAAD,EAAa,UAAU,UAAU,UAA6B,CAAA;CAE7D,CAAA;AAET"}