@jetbrains/ring-ui 7.0.116 → 7.0.118

package/components/auth/auth-core.d.ts

@@ -171,18 +171,13 @@ declare class Auth implements HTTPAuth {
     requestToken(): Promise<string | null>;
     /**
      * Get new token in the background or redirect to the login page.
-     *
-     * Retries background token refresh with delays from {@link AuthConfig.tokenRefreshRetryDelays}
-     * with increasing delays before showing the auth dialog.
-     * This handles transient failures that commonly occur after network
-     * recovery (e.g. waking from sleep, switching networks) where the first
-     * iframe-based auth attempt fails but a subsequent one succeeds once
-     * the Hub session is re-established.
-     *
      * @return {Promise.<string | null>}
      */
-    forceTokenUpdate(): Promise<string | null>;
+    forceTokenUpdate(failedToken?: string | null): Promise<string | null>;
     private _doForceTokenUpdate;
+    private _refreshTokenUnderWebLock;
+    private _refreshTokenOrReuseChanged;
+    private _handleTokenRefreshFailure;
     loadCurrentService(): Promise<void>;
     getAPIPath(): string;
     /**
@@ -195,6 +190,7 @@ declare class Auth implements HTTPAuth {
     requestUser(): Promise<any>;
     updateUser(): Promise<void>;
     _detectUserChange(accessToken: string): Promise<void>;
+    private _getUserWithTokenRefresh;
     _beforeLogout(params?: AuthDialogParams): void;
     _showAuthDialog({ nonInteractive, error, canCancel, onTryAgain }?: AuthDialogParams): void;
     _showUserChangedDialog({ newUser, onApply, onPostpone }: UserChangedDialogParams): void;

package/components/auth/auth-core.js

@@ -1,7 +1,7 @@
 /* eslint-disable no-underscore-dangle,max-lines */
 import { fixUrl, getAbsoluteBaseURL } from '../global/url';
 import Listeners from '../global/listeners';
-import HTTP from '../http/http';
+import HTTP, { CODE, HTTPError } from '../http/http';
 import promiseWithTimeout from '../global/promise-with-timeout';
 import { getTranslations, getTranslationsWithFallback, translate } from '../i18n/i18n';
 import AuthStorage from './storage';
@@ -16,6 +16,7 @@ const DEFAULT_BACKEND_CHECK_TIMEOUT = 10 * 1000;
 const BACKGROUND_REDIRECT_TIMEOUT = 20 * 1000;
 const DEFAULT_WAIT_FOR_REDIRECT_TIMEOUT = 5 * 1000;
 export const TOKEN_REFRESH_RETRY_DELAYS = [0, 2000, 5000];
+const TOKEN_REFRESH_LOCK_TIMEOUT = 15 * 1000;
 export const USER_CHANGED_EVENT = 'userChange';
 export const DOMAIN_USER_CHANGED_EVENT = 'domainUser';
 export const LOGOUT_EVENT = 'logout';
@@ -346,26 +347,19 @@ class Auth {
     }
     /**
      * Get new token in the background or redirect to the login page.
-     *
-     * Retries background token refresh with delays from {@link AuthConfig.tokenRefreshRetryDelays}
-     * with increasing delays before showing the auth dialog.
-     * This handles transient failures that commonly occur after network
-     * recovery (e.g. waking from sleep, switching networks) where the first
-     * iframe-based auth attempt fails but a subsequent one succeeds once
-     * the Hub session is re-established.
-     *
      * @return {Promise.<string | null>}
      */
-    forceTokenUpdate() {
+    forceTokenUpdate(failedToken) {
         if (this._forceTokenUpdatePromise) {
             return this._forceTokenUpdatePromise;
         }
-        this._forceTokenUpdatePromise = this._doForceTokenUpdate().finally(() => {
+        this._forceTokenUpdatePromise = this._doForceTokenUpdate(failedToken).finally(() => {
             this._forceTokenUpdatePromise = null;
         });
         return this._forceTokenUpdatePromise;
     }
-    async _doForceTokenUpdate() {
+    async _doForceTokenUpdate(failedToken) {
+        const previousToken = failedToken ?? (await this._storage?.getToken())?.accessToken ?? null;
         try {
             if (!this._backendCheckPromise) {
                 this._backendCheckPromise = this._checkBackendsStatusesIfEnabled();
@@ -378,18 +372,50 @@ class Auth {
         finally {
             this._backendCheckPromise = null;
         }
+        const attempt = await this._refreshTokenUnderWebLock(previousToken);
+        if ('token' in attempt) {
+            return attempt.token;
+        }
+        return this._handleTokenRefreshFailure(attempt.error);
+    }
+    async _refreshTokenUnderWebLock(previousToken) {
+        if (navigator.locks == null) {
+            return this._refreshTokenOrReuseChanged(previousToken);
+        }
+        const lockName = `ring-ui-token-refresh-${this.config.clientId}`;
+        try {
+            return await navigator.locks.request(lockName, { signal: AbortSignal.timeout(TOKEN_REFRESH_LOCK_TIMEOUT) }, () => this._refreshTokenOrReuseChanged(previousToken));
+        }
+        catch {
+            return this._refreshTokenOrReuseChanged(previousToken);
+        }
+    }
+    async _refreshTokenOrReuseChanged(previousToken) {
+        let storedToken = null;
+        try {
+            storedToken = (await this._tokenValidator?.validateTokenLocally()) ?? null;
+        }
+        catch {
+            // No valid local token — fall through to refresh.
+        }
+        if (storedToken != null && storedToken !== previousToken) {
+            return { token: storedToken };
+        }
         let lastError = null;
         for (const delay of this.config.tokenRefreshRetryDelays) {
             if (delay > 0) {
                 await new Promise(resolve => setTimeout(resolve, delay));
             }
             try {
-                return (await this._backgroundFlow?.authorize()) ?? null;
+                return { token: (await this._backgroundFlow?.authorize()) ?? null };
             }
             catch (error) {
                 lastError = error instanceof Error ? error : new Error(String(error));
             }
         }
+        return { error: lastError ?? new Error('Failed to refresh token') };
+    }
+    async _handleTokenRefreshFailure(lastError) {
         if (this._canShowDialogs()) {
             return new Promise(resolve => {
                 const onTryAgain = async () => {
@@ -419,7 +445,7 @@ class Auth {
         if (authRequest) {
             this._redirectCurrentPage(authRequest.url);
         }
-        throw new TokenValidator.TokenValidationError(lastError?.message ?? 'Failed to refresh token');
+        throw new TokenValidator.TokenValidationError(lastError.message);
     }
     async loadCurrentService() {
         if (this._service.serviceName) {
@@ -471,7 +497,7 @@ class Auth {
     }
     async _detectUserChange(accessToken) {
         const windowWasOpen = this._isLoginWindowOpen;
-        const user = await this.getUser(accessToken);
+        const user = await this._getUserWithTokenRefresh(accessToken);
         const onApply = () => {
             this.user = user;
             this.listeners.trigger(USER_CHANGED_EVENT, user);
@@ -495,6 +521,21 @@ class Auth {
             });
         }
     }
+    async _getUserWithTokenRefresh(accessToken) {
+        try {
+            return await this.getUser(accessToken);
+        }
+        catch (error) {
+            if (!(error instanceof HTTPError) || error.status !== CODE.UNAUTHORIZED) {
+                throw error;
+            }
+            const attempt = await this._refreshTokenUnderWebLock(accessToken);
+            if ('error' in attempt) {
+                throw error;
+            }
+            return this.getUser(attempt.token);
+        }
+    }
     _beforeLogout(params) {
         if (this._canShowDialogs()) {
             const onTryAgain = async () => {

package/components/http/http.d.ts

@@ -20,7 +20,7 @@ export interface RequestParams<RawBody extends boolean = true | false> extends F
 export type RequestParamsWithoutMethod<RawBody extends boolean = boolean> = Omit<RequestParams<RawBody>, 'method'>;
 export interface HTTPAuth {
     requestToken(): Promise<string | null> | string | null;
-    forceTokenUpdate(): Promise<string | null>;
+    forceTokenUpdate(failedToken?: string | null): Promise<string | null>;
 }
 export default class HTTP implements Partial<HTTPAuth> {
     baseUrl: string | null | undefined;
@@ -28,7 +28,7 @@ export default class HTTP implements Partial<HTTPAuth> {
     fetchConfig: RequestInit;
     requestToken?: () => Promise<string | null> | string | null;
     shouldRefreshToken?: (error: string) => boolean;
-    forceTokenUpdate?: () => Promise<string | null>;
+    forceTokenUpdate?: (failedToken?: string | null) => Promise<string | null>;
     constructor(auth?: HTTPAuth, baseUrl?: string | null | undefined, fetchConfig?: RequestInit);
     setAuth: (auth: HTTPAuth) => void;
     setBaseUrl: (baseUrl: string | null | undefined) => void;

package/components/http/http.js

@@ -50,7 +50,7 @@ export default class HTTP {
     setAuth = (auth) => {
         this.requestToken = () => auth.requestToken();
         this.shouldRefreshToken = auth.constructor.shouldRefreshToken;
-        this.forceTokenUpdate = () => auth.forceTokenUpdate();
+        this.forceTokenUpdate = failedToken => auth.forceTokenUpdate(failedToken);
     };
     setBaseUrl = (baseUrl) => {
         this.baseUrl = baseUrl;
@@ -141,7 +141,7 @@ export default class HTTP {
             }
             const shouldRefreshToken = typeof error.data.error === 'string' ? this.shouldRefreshToken?.(error.data.error) : false;
             if (shouldRefreshToken) {
-                token = await this.forceTokenUpdate?.();
+                token = await this.forceTokenUpdate?.(token);
                 response = await this._performRequest(url, token, params);
                 return this._processResponse(response);
             }

package/components/popup/popup.d.ts

@@ -45,6 +45,8 @@ export interface BasePopupProps {
     onMouseUp?: ((e: React.MouseEvent<HTMLElement>) => void) | undefined;
     onMouseOver?: ((e: React.SyntheticEvent<HTMLElement>) => void) | undefined;
     onMouseOut?: ((e: React.SyntheticEvent<HTMLElement>) => void) | undefined;
+    onMouseEnter?: ((e: React.MouseEvent<HTMLElement>) => void) | undefined;
+    onMouseLeave?: ((e: React.MouseEvent<HTMLElement>) => void) | undefined;
     onContextMenu?: ((e: React.MouseEvent<HTMLElement>) => void) | undefined;
     onDirectionChange?: ((direction: Directions) => void) | null | undefined;
     onShow?: (() => void) | null | undefined;

package/components/popup/popup.js

@@ -282,7 +282,7 @@ export default class Popup extends PureComponent {
         esc: this._onEscPress,
     };
     render() {
-        const { className, style, hidden, attached, keepMounted, client, onMouseDown, onMouseUp, onMouseOver, onMouseOut, onContextMenu, 'data-test': dataTest, largeBorderRadius, } = this.props;
+        const { className, style, hidden, attached, keepMounted, client, onMouseDown, onMouseUp, onMouseOver, onMouseOut, onMouseEnter, onMouseLeave, onContextMenu, 'data-test': dataTest, largeBorderRadius, } = this.props;
         const showing = this.state.display === Display.SHOWING;
         const direction = (this.state.direction || '').toLowerCase().replace(/[_]/g, '-');
         return (<ThemeContext.Consumer>
@@ -305,7 +305,7 @@ export default class Popup extends PureComponent {
 
                       {client !== false &&
                                 (keepMounted || !hidden) &&
-                                createPortal(<PopupTarget id={this.uid} ref={this.containerRef} onMouseOver={onMouseOver} onFocus={onMouseOver} onMouseOut={onMouseOut} onBlur={onMouseOut} onContextMenu={onContextMenu}>
+                                createPortal(<PopupTarget id={this.uid} ref={this.containerRef} onMouseOver={onMouseOver} onFocus={onMouseOver} onMouseOut={onMouseOut} onBlur={onMouseOut} onMouseEnter={onMouseEnter} onMouseLeave={onMouseLeave} onContextMenu={onContextMenu}>
                             <div data-test={dataTests('ring-popup', dataTest)} data-test-shown={!hidden && !showing} data-test-direction={direction} ref={this.popupRef} className={classes} style={style} onMouseDown={onMouseDown} onMouseUp={onMouseUp} 
                                 // mouse handlers are used to track clicking on inner elements
                                 role='presentation'>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jetbrains/ring-ui",
-  "version": "7.0.116",
+  "version": "7.0.118",
   "description": "JetBrains UI library",
   "author": {
     "name": "JetBrains"
@@ -99,14 +99,14 @@
   },
   "readmeFilename": "README.md",
   "devDependencies": {
-    "@babel/cli": "^7.29.7",
+    "@babel/cli": "^8.0.1",
     "@babel/eslint-parser": "^7.29.7",
     "@csstools/css-parser-algorithms": "^4.0.0",
     "@csstools/stylelint-no-at-nest-rule": "^5.0.0",
     "@eslint/compat": "^2.1.0",
     "@eslint/eslintrc": "^3.3.5",
     "@eslint/js": "^10.0.1",
-    "@figma/code-connect": "^1.4.7",
+    "@figma/code-connect": "^1.4.8",
     "@jetbrains/eslint-config": "^6.0.5",
     "@jetbrains/logos": "3.0.0-canary.734b213.0",
     "@jetbrains/rollup-css-plugin": "./packages/rollup-css-plugin",
@@ -117,11 +117,11 @@
     "@rollup/plugin-json": "^6.1.0",
     "@rollup/plugin-node-resolve": "^16.0.3",
     "@rollup/plugin-replace": "^6.0.3",
-    "@storybook/addon-a11y": "10.4.2",
-    "@storybook/addon-docs": "^10.4.2",
-    "@storybook/addon-themes": "^10.4.2",
+    "@storybook/addon-a11y": "10.4.6",
+    "@storybook/addon-docs": "^10.4.6",
+    "@storybook/addon-themes": "^10.4.6",
     "@storybook/csf": "^0.1.13",
-    "@storybook/react-webpack5": "10.4.2",
+    "@storybook/react-webpack5": "10.4.6",
     "@storybook/test-runner": "^0.24.4",
     "@testing-library/dom": "^10.4.1",
     "@testing-library/react": "^16.3.2",
@@ -133,17 +133,17 @@
     "@types/react-dom": "^19.2.3",
     "@types/webpack-env": "^1.18.8",
     "@vitejs/plugin-react": "^6.0.2",
-    "@vitest/eslint-plugin": "^1.6.19",
-    "acorn": "^8.16.0",
+    "@vitest/eslint-plugin": "^1.6.20",
+    "acorn": "^8.17.0",
     "babel-plugin-require-context-hook": "^1.0.0",
-    "caniuse-lite": "^1.0.30001797",
+    "caniuse-lite": "^1.0.30001799",
     "chai-as-promised": "^8.0.2",
     "chai-dom": "^1.12.1",
     "cheerio": "^1.2.0",
     "core-js": "^3.49.0",
     "cpy-cli": "^7.0.0",
     "dotenv-cli": "^11.0.0",
-    "eslint": "^9.39.2",
+    "eslint": "^9.39.4",
     "eslint-config-prettier": "^10.1.8",
     "eslint-formatter-jslint-xml": "^9.0.1",
     "eslint-import-resolver-exports": "^1.0.0-beta.5",
@@ -154,8 +154,8 @@
     "eslint-plugin-prettier": "^5.5.6",
     "eslint-plugin-react": "^7.37.5",
     "eslint-plugin-react-hooks": "^7.1.1",
-    "eslint-plugin-storybook": "^10.4.2",
-    "eslint-plugin-unicorn": "^64.0.0",
+    "eslint-plugin-storybook": "^10.4.6",
+    "eslint-plugin-unicorn": "^68.0.0",
     "events": "^3.3.0",
     "glob": "^13.0.6",
     "globals": "^17.6.0",
@@ -166,20 +166,20 @@
     "jest": "~30.4.2",
     "jest-environment-jsdom": "^30.4.1",
     "jest-teamcity": "^1.12.0",
-    "lint-staged": "^17.0.6",
+    "lint-staged": "^17.0.8",
     "markdown-it": "^14.2.0",
     "merge-options": "^3.0.4",
     "pinst": "^3.0.0",
-    "prettier": "^3.8.3",
+    "prettier": "^3.8.4",
     "raw-loader": "^4.0.2",
     "react": "^19.2.7",
     "react-dom": "^19.2.7",
     "regenerator-runtime": "^0.14.1",
     "rimraf": "^6.1.3",
-    "rollup": "^4.61.1",
+    "rollup": "^4.62.2",
     "rollup-plugin-clear": "^2.0.7",
     "storage-mock": "^2.1.0",
-    "storybook": "10.4.4",
+    "storybook": "10.4.6",
     "stylelint": "^17.13.0",
     "stylelint-config-sass-guidelines": "^13.0.0",
     "svg-inline-loader": "^0.8.2",
@@ -187,9 +187,9 @@
     "terser-webpack-plugin": "^5.6.1",
     "typed-css-modules": "^0.9.1",
     "typescript": "~6.0.3",
-    "typescript-eslint": "^8.60.0",
+    "typescript-eslint": "^8.61.1",
     "vite": "^8.0.16",
-    "vitest": "^4.1.8",
+    "vitest": "^4.1.9",
     "vitest-teamcity-reporter": "^0.4.1",
     "webpack": "^5.107.2",
     "webpack-cli": "^7.0.3",
@@ -216,9 +216,9 @@
   },
   "dependencies": {
     "@babel/core": "^7.29.7",
-    "@babel/preset-typescript": "^7.29.7",
+    "@babel/preset-typescript": "^8.0.1",
     "@jetbrains/babel-preset-jetbrains": "^2.4.0",
-    "@jetbrains/icons": "^5.22.0",
+    "@jetbrains/icons": "^5.23.0",
     "@jetbrains/postcss-require-hover": "^0.2.0",
     "@types/combokeys": "^2.4.9",
     "@types/element-resize-detector": "^1.1.6",
@@ -247,7 +247,7 @@
     "postcss-font-family-system-ui": "^5.0.0",
     "postcss-loader": "^8.2.1",
     "postcss-modules-values-replace": "^4.2.2",
-    "postcss-preset-env": "^11.3.0",
+    "postcss-preset-env": "^11.3.1",
     "react-compiler-runtime": "^1.0.0",
     "react-movable": "^3.4.1",
     "react-virtualized": "^9.22.6",