@backstage/core-components 0.18.10 → 0.18.11-next.1

package/CHANGELOG.md

@@ -1,5 +1,21 @@
 # @backstage/core-components
 
+## 0.18.11-next.1
+
+### Patch Changes
+
+- dbe93a7: Fix autologout not working correctly when closing all tabs
+- Updated dependencies
+  - @backstage/core-plugin-api@1.12.7-next.0
+
+## 0.18.11-next.0
+
+### Patch Changes
+
+- e0889a3: chore(deps): bump `qs` from 6.15.1 to 6.15.2
+- a07e6a3: Added the correctly-spelled `'header'` literal to the `TableFiltersClassKey` union type and deprecated the previous typoed `'heder'` literal. The generated CSS class with the old key is preserved for backwards compatibility; switch to `'header'` to avoid future removal.
+- 8add9b9: Fixed the proxy-based sign-in page failing to read the session token when the proxy issues a token whose payload is encoded using the URL-safe base64 alphabet. Such tokens are now decoded correctly so sign-in no longer breaks.
+
 ## 0.18.10
 
 ### Patch Changes

package/dist/components/AutoLogout/AutoLogout.esm.js

@@ -1,6 +1,6 @@
 import { jsx, Fragment } from 'react/jsx-runtime';
 import { useApi, identityApiRef, configApiRef } from '@backstage/core-plugin-api';
-import { useState, useEffect, useMemo } from 'react';
+import { useState, useMemo, useEffect } from 'react';
 import { useIdleTimer, workerTimers } from 'react-idle-timer';
 import { LAST_SEEN_ONLINE_STORAGE_KEY, useLogoutDisconnectedUserEffect } from './disconnectedUsers.esm.js';
 import { StillTherePrompt } from './StillTherePrompt.esm.js';
@@ -28,6 +28,7 @@ const ConditionalAutoLogout = ({
   const onIdle = () => {
     setPromptOpen(false);
     setRemainingTimeCountdown(0);
+    lastSeenOnlineStore.delete();
     identityApi.signOut();
   };
   const onActive = () => {
@@ -94,17 +95,34 @@ const parseConfig = (configApi, props) => {
 const AutoLogout = (props) => {
   const identityApi = useApi(identityApiRef);
   const configApi = useApi(configApiRef);
-  const [isLogged, setIsLogged] = useState(false);
+  const [isLogged, setIsLogged] = useState(null);
+  const lastSeenOnlineStore = useMemo(
+    () => new DefaultTimestampStore(LAST_SEEN_ONLINE_STORAGE_KEY),
+    []
+  );
   useEffect(() => {
-    async function isLoggedIn(identity) {
-      if ((await identity.getCredentials()).token) {
-        setIsLogged(true);
-      } else {
+    let cancelled = false;
+    async function checkLogin(identity) {
+      try {
+        const creds = await identity.getCredentials();
+        if (cancelled) return;
+        if (creds?.token) {
+          setIsLogged(true);
+        } else {
+          setIsLogged(false);
+          lastSeenOnlineStore.delete();
+        }
+      } catch (err) {
+        if (cancelled) return;
         setIsLogged(false);
+        lastSeenOnlineStore.delete();
       }
     }
-    isLoggedIn(identityApi);
-  }, [identityApi]);
+    checkLogin(identityApi);
+    return () => {
+      cancelled = true;
+    };
+  }, [lastSeenOnlineStore, identityApi]);
   const {
     enabled,
     idleTimeoutMinutes,
@@ -131,15 +149,12 @@ const AutoLogout = (props) => {
       );
     }
   }, [idleTimeoutMinutes, promptBeforeIdleSeconds]);
-  const lastSeenOnlineStore = useMemo(
-    () => new DefaultTimestampStore(LAST_SEEN_ONLINE_STORAGE_KEY),
-    []
-  );
   const [promptOpen, setPromptOpen] = useState(false);
   const [remainingTimeCountdown, setRemainingTimeCountdown] = useState(0);
   useLogoutDisconnectedUserEffect({
     enableEffect: logoutIfDisconnected,
-    autologoutIsEnabled: enabled && isLogged,
+    autologoutIsEnabled: enabled,
+    isLoggedIn: isLogged,
     idleTimeoutSeconds: idleTimeoutMinutes * 60,
     lastSeenOnlineStore,
     identityApi

package/dist/components/AutoLogout/AutoLogout.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"AutoLogout.esm.js","sources":["../../../src/components/AutoLogout/AutoLogout.tsx"],"sourcesContent":["/*\n * Copyright 2023 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport {\n  ConfigApi,\n  configApiRef,\n  IdentityApi,\n  identityApiRef,\n  useApi,\n} from '@backstage/core-plugin-api';\nimport { useEffect, useMemo, useState } from 'react';\nimport {\n  EventsType,\n  IIdleTimer,\n  workerTimers,\n  useIdleTimer,\n} from 'react-idle-timer';\n\nimport {\n  LAST_SEEN_ONLINE_STORAGE_KEY,\n  useLogoutDisconnectedUserEffect,\n} from './disconnectedUsers';\nimport { StillTherePrompt } from './StillTherePrompt';\nimport { DefaultTimestampStore, TimestampStore } from './timestampStore';\n\ntype AutoLogoutTrackableEvent = EventsType;\n\n/** @public */\nexport type AutoLogoutProps = {\n  /**\n   * Enable/disable the AutoLogoutMechanism.\n   * defaults to true.\n   */\n  enabled?: boolean;\n  /**\n   * The amount of time (in minutes) of inactivity\n   * after which the user is automatically logged out.\n   * defaults to 60 minutes.\n   */\n  idleTimeoutMinutes?: number;\n  /**\n   * The number of seconds before the idleTimeout expires,\n   * at which the user will be alerted by a Dialog that\n   * they are about to be logged out.\n   * defaults to 10 seconds\n   */\n  promptBeforeIdleSeconds?: number;\n  /**\n   * Enable/disable the usage of Node's worker thread timers instead of main thread timers.\n   * This is helpful if you notice that the your browser is killing inactive tab's timers, like the one used by AutoLogout.\n   * If you experience some browser incompatibility, you may try to set this to false.\n   * defaults to true.\n   */\n  useWorkerTimers?: boolean;\n  /**\n   * Enable/disable the autologout for disconnected users.\n   * disconnected users are the ones that are logged in but have no Backstage tab open in their browsers.\n   * If enabled, disconnected users will be automatically logged out after `idleTimeoutMinutes`\n   * defaults to true\n   */\n  logoutIfDisconnected?: boolean;\n};\n\ntype AutoLogoutInternalProps = Omit<Required<AutoLogoutProps>, 'enabled'> & {\n  events: AutoLogoutTrackableEvent[];\n  promptOpen: boolean;\n  setPromptOpen: (value: boolean) => void;\n  remainingTimeCountdown: number;\n  setRemainingTimeCountdown: (amount: number) => void;\n  identityApi: IdentityApi;\n  lastSeenOnlineStore: TimestampStore;\n};\n\nconst ConditionalAutoLogout = ({\n  idleTimeoutMinutes,\n  events,\n  useWorkerTimers,\n  logoutIfDisconnected,\n  promptBeforeIdleSeconds,\n  promptOpen,\n  setPromptOpen,\n  remainingTimeCountdown,\n  setRemainingTimeCountdown,\n  identityApi,\n  lastSeenOnlineStore,\n}: AutoLogoutInternalProps): JSX.Element => {\n  const promptBeforeIdleMillis = promptBeforeIdleSeconds * 1000;\n  const promptBeforeIdle = promptBeforeIdleMillis > 0 ? true : false;\n\n  const onPrompt = async () => {\n    // onPrompt will be called `promptBeforeIdle` milliseconds before `timeout`.\n    // All events are disabled while the prompt is active.\n    // If the user wishes to stay active, call the `activate()` method.\n    // You can get the remaining prompt time with the `getRemainingTime()` method,\n    setPromptOpen(true);\n    setRemainingTimeCountdown(promptBeforeIdleMillis);\n  };\n\n  const onIdle = () => {\n    // onIdle will be called after the timeout is reached.\n    // Events will be rebound as long as `stopOnMount` is not set.\n    setPromptOpen(false);\n    setRemainingTimeCountdown(0);\n    identityApi.signOut();\n  };\n\n  const onActive = () => {\n    // onActive will only be called if `activate()` is called while `isPrompted()`\n    // is true. Here you will also want to close your modal and perform\n    // any active actions.\n    setPromptOpen(false);\n    setRemainingTimeCountdown(0);\n  };\n\n  const onAction = (\n    _event?: Event | undefined,\n    _idleTimer?: IIdleTimer | null,\n  ) => {\n    // onAction will be called if any user event is detected. The list of events that triggers a user event detection is the list of configured events\n    // If any user event is detected we update the Last seen online in storage\n    lastSeenOnlineStore.save(new Date());\n  };\n\n  const timer = useIdleTimer({\n    timeout: idleTimeoutMinutes * 60 * 1000,\n    events: events,\n    crossTab: true,\n    name: 'autologout-timer',\n    timers: useWorkerTimers ? workerTimers : undefined,\n    onIdle: onIdle,\n    onActive: promptBeforeIdle ? onActive : undefined,\n    onAction: logoutIfDisconnected ? onAction : undefined,\n    onPrompt: promptBeforeIdle ? onPrompt : undefined,\n    promptBeforeIdle: promptBeforeIdle ? promptBeforeIdleMillis : undefined,\n    syncTimers: 1000,\n  });\n\n  return (\n    <>\n      {promptBeforeIdle && (\n        <StillTherePrompt\n          idleTimer={timer}\n          open={promptOpen}\n          setOpen={setPromptOpen}\n          remainingTime={remainingTimeCountdown}\n          setRemainingTime={setRemainingTimeCountdown}\n          promptTimeoutMillis={promptBeforeIdleMillis}\n        />\n      )}\n    </>\n  );\n};\n\nconst defaultConfig: Required<AutoLogoutProps> = {\n  enabled: true,\n  idleTimeoutMinutes: 0.5,\n  promptBeforeIdleSeconds: 10,\n  useWorkerTimers: true,\n  logoutIfDisconnected: true,\n};\n\n/**\n * A list of DOM events that the activity tracker will use to determine if the user is active or not.\n */\nconst defaultTrackedEvents: AutoLogoutTrackableEvent[] = [\n  'mousemove',\n  'keydown',\n  'wheel',\n  'DOMMouseScroll',\n  'mousewheel',\n  'mousedown',\n  'touchstart',\n  'touchmove',\n  'MSPointerDown',\n  'MSPointerMove',\n  'visibilitychange',\n];\n\n/**\n * Parses configuration for the AutoLogout. Properties configured in `app-config` take precedence over the props passed to the React component.\n * If neither props nor config properties are found, a default value will be set accordingly.\n */\nconst parseConfig = (\n  configApi: ConfigApi,\n  props: AutoLogoutProps,\n): Required<AutoLogoutProps> => {\n  return {\n    enabled:\n      configApi.getOptionalBoolean('auth.autologout.enabled') ??\n      props.enabled ??\n      defaultConfig.enabled,\n    idleTimeoutMinutes:\n      configApi.getOptionalNumber('auth.autologout.idleTimeoutMinutes') ??\n      props.idleTimeoutMinutes ??\n      defaultConfig.idleTimeoutMinutes,\n    promptBeforeIdleSeconds:\n      configApi.getOptionalNumber('auth.autologout.promptBeforeIdleSeconds') ??\n      props.promptBeforeIdleSeconds ??\n      defaultConfig.promptBeforeIdleSeconds,\n    useWorkerTimers:\n      configApi.getOptionalBoolean('auth.autologout.useWorkerTimers') ??\n      props.useWorkerTimers ??\n      defaultConfig.useWorkerTimers,\n    logoutIfDisconnected:\n      configApi.getOptionalBoolean('auth.autologout.logoutIfDisconnected') ??\n      props.logoutIfDisconnected ??\n      defaultConfig.logoutIfDisconnected,\n  };\n};\n\n/**\n * The Autologout feature enables platform engineers to add a mechanism to log out users after a configurable amount of time of inactivity.\n * When enabled, the mechanism will track user actions (mouse movement, mouse click, key pressing, taps, etc.) in order to determine if they are active or not.\n * After a certain amount of inactivity/idle time, the user session is invalidated and they are required to sign in again.\n *\n * @public\n */\nexport const AutoLogout = (props: AutoLogoutProps): JSX.Element | null => {\n  const identityApi = useApi(identityApiRef);\n  const configApi = useApi(configApiRef);\n  const [isLogged, setIsLogged] = useState(false);\n  useEffect(() => {\n    // if the user is not logged in, the autologout feature won't affect the app even if enabled\n    async function isLoggedIn(identity: IdentityApi) {\n      if ((await identity.getCredentials()).token) {\n        setIsLogged(true);\n      } else {\n        setIsLogged(false);\n      }\n    }\n    isLoggedIn(identityApi);\n  }, [identityApi]);\n\n  const {\n    enabled,\n    idleTimeoutMinutes,\n    promptBeforeIdleSeconds,\n    logoutIfDisconnected,\n    useWorkerTimers,\n  }: AutoLogoutProps = useMemo(() => {\n    return parseConfig(configApi, props);\n  }, [configApi, props]);\n\n  useEffect(() => {\n    if (idleTimeoutMinutes < 0.5) {\n      throw new Error(\n        '❌ idleTimeoutMinutes property should be >= 0.5 minutes (30 seconds).',\n      );\n    }\n\n    if (promptBeforeIdleSeconds < 0) {\n      throw new Error(\n        '❌ promptBeforeIdleSeconds property should be >= 0 seconds. Set to 0 to disable the prompt.',\n      );\n    }\n\n    if (idleTimeoutMinutes * 60 <= promptBeforeIdleSeconds) {\n      throw new Error(\n        `❌ promptBeforeIdleSeconds should be smaller than idleTimeoutMinutes`,\n      );\n    }\n  }, [idleTimeoutMinutes, promptBeforeIdleSeconds]);\n\n  const lastSeenOnlineStore: TimestampStore = useMemo(\n    () => new DefaultTimestampStore(LAST_SEEN_ONLINE_STORAGE_KEY),\n    [],\n  );\n  const [promptOpen, setPromptOpen] = useState<boolean>(false);\n\n  const [remainingTimeCountdown, setRemainingTimeCountdown] =\n    useState<number>(0);\n\n  useLogoutDisconnectedUserEffect({\n    enableEffect: logoutIfDisconnected,\n    autologoutIsEnabled: enabled && isLogged,\n    idleTimeoutSeconds: idleTimeoutMinutes * 60,\n    lastSeenOnlineStore,\n    identityApi,\n  });\n\n  if (!enabled || !isLogged) {\n    return null;\n  }\n\n  return (\n    <ConditionalAutoLogout\n      idleTimeoutMinutes={idleTimeoutMinutes}\n      promptBeforeIdleSeconds={promptBeforeIdleSeconds}\n      useWorkerTimers={useWorkerTimers}\n      events={defaultTrackedEvents}\n      logoutIfDisconnected={logoutIfDisconnected}\n      promptOpen={promptOpen}\n      setPromptOpen={setPromptOpen}\n      remainingTimeCountdown={remainingTimeCountdown}\n      setRemainingTimeCountdown={setRemainingTimeCountdown}\n      identityApi={identityApi}\n      lastSeenOnlineStore={lastSeenOnlineStore}\n    />\n  );\n};\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"AutoLogout.esm.js","sources":["../../../src/components/AutoLogout/AutoLogout.tsx"],"sourcesContent":["/*\n * Copyright 2023 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport {\n  ConfigApi,\n  configApiRef,\n  IdentityApi,\n  identityApiRef,\n  useApi,\n} from '@backstage/core-plugin-api';\nimport { useEffect, useMemo, useState } from 'react';\nimport {\n  EventsType,\n  IIdleTimer,\n  workerTimers,\n  useIdleTimer,\n} from 'react-idle-timer';\n\nimport {\n  LAST_SEEN_ONLINE_STORAGE_KEY,\n  useLogoutDisconnectedUserEffect,\n} from './disconnectedUsers';\nimport { StillTherePrompt } from './StillTherePrompt';\nimport { DefaultTimestampStore, TimestampStore } from './timestampStore';\n\ntype AutoLogoutTrackableEvent = EventsType;\n\n/** @public */\nexport type AutoLogoutProps = {\n  /**\n   * Enable/disable the AutoLogoutMechanism.\n   * defaults to true.\n   */\n  enabled?: boolean;\n  /**\n   * The amount of time (in minutes) of inactivity\n   * after which the user is automatically logged out.\n   * defaults to 60 minutes.\n   */\n  idleTimeoutMinutes?: number;\n  /**\n   * The number of seconds before the idleTimeout expires,\n   * at which the user will be alerted by a Dialog that\n   * they are about to be logged out.\n   * defaults to 10 seconds\n   */\n  promptBeforeIdleSeconds?: number;\n  /**\n   * Enable/disable the usage of Node's worker thread timers instead of main thread timers.\n   * This is helpful if you notice that the your browser is killing inactive tab's timers, like the one used by AutoLogout.\n   * If you experience some browser incompatibility, you may try to set this to false.\n   * defaults to true.\n   */\n  useWorkerTimers?: boolean;\n  /**\n   * Enable/disable the autologout for disconnected users.\n   * disconnected users are the ones that are logged in but have no Backstage tab open in their browsers.\n   * If enabled, disconnected users will be automatically logged out after `idleTimeoutMinutes`\n   * defaults to true\n   */\n  logoutIfDisconnected?: boolean;\n};\n\ntype AutoLogoutInternalProps = Omit<Required<AutoLogoutProps>, 'enabled'> & {\n  events: AutoLogoutTrackableEvent[];\n  promptOpen: boolean;\n  setPromptOpen: (value: boolean) => void;\n  remainingTimeCountdown: number;\n  setRemainingTimeCountdown: (amount: number) => void;\n  identityApi: IdentityApi;\n  lastSeenOnlineStore: TimestampStore;\n};\n\nconst ConditionalAutoLogout = ({\n  idleTimeoutMinutes,\n  events,\n  useWorkerTimers,\n  logoutIfDisconnected,\n  promptBeforeIdleSeconds,\n  promptOpen,\n  setPromptOpen,\n  remainingTimeCountdown,\n  setRemainingTimeCountdown,\n  identityApi,\n  lastSeenOnlineStore,\n}: AutoLogoutInternalProps): JSX.Element => {\n  const promptBeforeIdleMillis = promptBeforeIdleSeconds * 1000;\n  const promptBeforeIdle = promptBeforeIdleMillis > 0 ? true : false;\n\n  const onPrompt = async () => {\n    // onPrompt will be called `promptBeforeIdle` milliseconds before `timeout`.\n    // All events are disabled while the prompt is active.\n    // If the user wishes to stay active, call the `activate()` method.\n    // You can get the remaining prompt time with the `getRemainingTime()` method,\n    setPromptOpen(true);\n    setRemainingTimeCountdown(promptBeforeIdleMillis);\n  };\n\n  const onIdle = () => {\n    // onIdle will be called after the timeout is reached.\n    // Events will be rebound as long as `stopOnMount` is not set.\n    setPromptOpen(false);\n    setRemainingTimeCountdown(0);\n    lastSeenOnlineStore.delete();\n    identityApi.signOut();\n  };\n\n  const onActive = () => {\n    // onActive will only be called if `activate()` is called while `isPrompted()`\n    // is true. Here you will also want to close your modal and perform\n    // any active actions.\n    setPromptOpen(false);\n    setRemainingTimeCountdown(0);\n  };\n\n  const onAction = (\n    _event?: Event | undefined,\n    _idleTimer?: IIdleTimer | null,\n  ) => {\n    // onAction will be called if any user event is detected. The list of events that triggers a user event detection is the list of configured events\n    // If any user event is detected we update the Last seen online in storage\n    lastSeenOnlineStore.save(new Date());\n  };\n\n  const timer = useIdleTimer({\n    timeout: idleTimeoutMinutes * 60 * 1000,\n    events: events,\n    crossTab: true,\n    name: 'autologout-timer',\n    timers: useWorkerTimers ? workerTimers : undefined,\n    onIdle: onIdle,\n    onActive: promptBeforeIdle ? onActive : undefined,\n    onAction: logoutIfDisconnected ? onAction : undefined,\n    onPrompt: promptBeforeIdle ? onPrompt : undefined,\n    promptBeforeIdle: promptBeforeIdle ? promptBeforeIdleMillis : undefined,\n    syncTimers: 1000,\n  });\n\n  return (\n    <>\n      {promptBeforeIdle && (\n        <StillTherePrompt\n          idleTimer={timer}\n          open={promptOpen}\n          setOpen={setPromptOpen}\n          remainingTime={remainingTimeCountdown}\n          setRemainingTime={setRemainingTimeCountdown}\n          promptTimeoutMillis={promptBeforeIdleMillis}\n        />\n      )}\n    </>\n  );\n};\n\nconst defaultConfig: Required<AutoLogoutProps> = {\n  enabled: true,\n  idleTimeoutMinutes: 0.5,\n  promptBeforeIdleSeconds: 10,\n  useWorkerTimers: true,\n  logoutIfDisconnected: true,\n};\n\n/**\n * A list of DOM events that the activity tracker will use to determine if the user is active or not.\n */\nconst defaultTrackedEvents: AutoLogoutTrackableEvent[] = [\n  'mousemove',\n  'keydown',\n  'wheel',\n  'DOMMouseScroll',\n  'mousewheel',\n  'mousedown',\n  'touchstart',\n  'touchmove',\n  'MSPointerDown',\n  'MSPointerMove',\n  'visibilitychange',\n];\n\n/**\n * Parses configuration for the AutoLogout. Properties configured in `app-config` take precedence over the props passed to the React component.\n * If neither props nor config properties are found, a default value will be set accordingly.\n */\nconst parseConfig = (\n  configApi: ConfigApi,\n  props: AutoLogoutProps,\n): Required<AutoLogoutProps> => {\n  return {\n    enabled:\n      configApi.getOptionalBoolean('auth.autologout.enabled') ??\n      props.enabled ??\n      defaultConfig.enabled,\n    idleTimeoutMinutes:\n      configApi.getOptionalNumber('auth.autologout.idleTimeoutMinutes') ??\n      props.idleTimeoutMinutes ??\n      defaultConfig.idleTimeoutMinutes,\n    promptBeforeIdleSeconds:\n      configApi.getOptionalNumber('auth.autologout.promptBeforeIdleSeconds') ??\n      props.promptBeforeIdleSeconds ??\n      defaultConfig.promptBeforeIdleSeconds,\n    useWorkerTimers:\n      configApi.getOptionalBoolean('auth.autologout.useWorkerTimers') ??\n      props.useWorkerTimers ??\n      defaultConfig.useWorkerTimers,\n    logoutIfDisconnected:\n      configApi.getOptionalBoolean('auth.autologout.logoutIfDisconnected') ??\n      props.logoutIfDisconnected ??\n      defaultConfig.logoutIfDisconnected,\n  };\n};\n\n/**\n * The Autologout feature enables platform engineers to add a mechanism to log out users after a configurable amount of time of inactivity.\n * When enabled, the mechanism will track user actions (mouse movement, mouse click, key pressing, taps, etc.) in order to determine if they are active or not.\n * After a certain amount of inactivity/idle time, the user session is invalidated and they are required to sign in again.\n *\n * @public\n */\nexport const AutoLogout = (props: AutoLogoutProps): JSX.Element | null => {\n  const identityApi = useApi(identityApiRef);\n  const configApi = useApi(configApiRef);\n  const [isLogged, setIsLogged] = useState<boolean | null>(null);\n  const lastSeenOnlineStore: TimestampStore = useMemo(\n    () => new DefaultTimestampStore(LAST_SEEN_ONLINE_STORAGE_KEY),\n    [],\n  );\n\n  useEffect(() => {\n    let cancelled = false;\n\n    async function checkLogin(identity: IdentityApi) {\n      try {\n        const creds = await identity.getCredentials();\n        if (cancelled) return;\n        if (creds?.token) {\n          setIsLogged(true);\n        } else {\n          setIsLogged(false);\n          lastSeenOnlineStore.delete();\n        }\n      } catch (err) {\n        if (cancelled) return;\n        setIsLogged(false);\n        lastSeenOnlineStore.delete();\n      }\n    }\n    checkLogin(identityApi);\n\n    return () => {\n      cancelled = true;\n    };\n  }, [lastSeenOnlineStore, identityApi]);\n\n  const {\n    enabled,\n    idleTimeoutMinutes,\n    promptBeforeIdleSeconds,\n    logoutIfDisconnected,\n    useWorkerTimers,\n  }: AutoLogoutProps = useMemo(() => {\n    return parseConfig(configApi, props);\n  }, [configApi, props]);\n\n  useEffect(() => {\n    if (idleTimeoutMinutes < 0.5) {\n      throw new Error(\n        '❌ idleTimeoutMinutes property should be >= 0.5 minutes (30 seconds).',\n      );\n    }\n\n    if (promptBeforeIdleSeconds < 0) {\n      throw new Error(\n        '❌ promptBeforeIdleSeconds property should be >= 0 seconds. Set to 0 to disable the prompt.',\n      );\n    }\n\n    if (idleTimeoutMinutes * 60 <= promptBeforeIdleSeconds) {\n      throw new Error(\n        `❌ promptBeforeIdleSeconds should be smaller than idleTimeoutMinutes`,\n      );\n    }\n  }, [idleTimeoutMinutes, promptBeforeIdleSeconds]);\n\n  const [promptOpen, setPromptOpen] = useState<boolean>(false);\n\n  const [remainingTimeCountdown, setRemainingTimeCountdown] =\n    useState<number>(0);\n\n  useLogoutDisconnectedUserEffect({\n    enableEffect: logoutIfDisconnected,\n    autologoutIsEnabled: enabled,\n    isLoggedIn: isLogged,\n    idleTimeoutSeconds: idleTimeoutMinutes * 60,\n    lastSeenOnlineStore,\n    identityApi,\n  });\n\n  if (!enabled || !isLogged) {\n    return null;\n  }\n\n  return (\n    <ConditionalAutoLogout\n      idleTimeoutMinutes={idleTimeoutMinutes}\n      promptBeforeIdleSeconds={promptBeforeIdleSeconds}\n      useWorkerTimers={useWorkerTimers}\n      events={defaultTrackedEvents}\n      logoutIfDisconnected={logoutIfDisconnected}\n      promptOpen={promptOpen}\n      setPromptOpen={setPromptOpen}\n      remainingTimeCountdown={remainingTimeCountdown}\n      setRemainingTimeCountdown={setRemainingTimeCountdown}\n      identityApi={identityApi}\n      lastSeenOnlineStore={lastSeenOnlineStore}\n    />\n  );\n};\n"],"names":[],"mappings":"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"}

package/dist/components/AutoLogout/disconnectedUsers.esm.js

@@ -4,30 +4,36 @@ const LAST_SEEN_ONLINE_STORAGE_KEY = "@backstage/autologout:lastSeenOnline";
 const useLogoutDisconnectedUserEffect = ({
   enableEffect,
   autologoutIsEnabled,
+  isLoggedIn,
   idleTimeoutSeconds,
   lastSeenOnlineStore,
   identityApi
 }) => {
   useEffect(() => {
-    if (autologoutIsEnabled && enableEffect) {
-      const lastSeenOnline = lastSeenOnlineStore.get();
-      if (lastSeenOnline) {
-        const now = /* @__PURE__ */ new Date();
-        const nowSeconds = Math.ceil(now.getTime() / 1e3);
-        const lastSeenOnlineSeconds = Math.ceil(
-          lastSeenOnline.getTime() / 1e3
-        );
-        if (nowSeconds - lastSeenOnlineSeconds > idleTimeoutSeconds) {
-          identityApi.signOut();
-        }
-      }
-      lastSeenOnlineStore.save(/* @__PURE__ */ new Date());
-    } else {
+    const shouldCheckDisconnectedUser = autologoutIsEnabled && enableEffect;
+    if (isLoggedIn === null) {
+      return;
+    }
+    if (!shouldCheckDisconnectedUser || !isLoggedIn) {
       lastSeenOnlineStore.delete();
+      return;
+    }
+    const lastSeenOnline = lastSeenOnlineStore.get();
+    if (lastSeenOnline) {
+      const now = /* @__PURE__ */ new Date();
+      const nowSeconds = Math.ceil(now.getTime() / 1e3);
+      const lastSeenOnlineSeconds = Math.ceil(lastSeenOnline.getTime() / 1e3);
+      if (nowSeconds - lastSeenOnlineSeconds > idleTimeoutSeconds) {
+        lastSeenOnlineStore.delete();
+        identityApi.signOut();
+        return;
+      }
     }
+    lastSeenOnlineStore.save(/* @__PURE__ */ new Date());
   }, [
     autologoutIsEnabled,
     enableEffect,
+    isLoggedIn,
     identityApi,
     idleTimeoutSeconds,
     lastSeenOnlineStore

package/dist/components/AutoLogout/disconnectedUsers.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"disconnectedUsers.esm.js","sources":["../../../src/components/AutoLogout/disconnectedUsers.ts"],"sourcesContent":["/*\n * Copyright 2023 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport { IdentityApi } from '@backstage/core-plugin-api';\nimport { useEffect } from 'react';\n\nimport { TimestampStore } from './timestampStore';\n\nexport const LAST_SEEN_ONLINE_STORAGE_KEY =\n  '@backstage/autologout:lastSeenOnline';\n\nexport type UseLogoutDisconnectedUserEffectProps = {\n  enableEffect: boolean;\n  autologoutIsEnabled: boolean;\n  idleTimeoutSeconds: number;\n  lastSeenOnlineStore: TimestampStore;\n  identityApi: IdentityApi;\n};\n\nexport const useLogoutDisconnectedUserEffect = ({\n  enableEffect,\n  autologoutIsEnabled,\n  idleTimeoutSeconds,\n  lastSeenOnlineStore,\n  identityApi,\n}: UseLogoutDisconnectedUserEffectProps) => {\n  useEffect(() => {\n    /**\n     * Considers disconnected users as inactive users.\n     * If all Backstage tabs are closed and idleTimeoutMinutes are passed then logout the user anyway.\n     */\n    if (autologoutIsEnabled && enableEffect) {\n      const lastSeenOnline = lastSeenOnlineStore.get();\n      if (lastSeenOnline) {\n        const now = new Date();\n        const nowSeconds = Math.ceil(now.getTime() / 1000);\n        const lastSeenOnlineSeconds = Math.ceil(\n          lastSeenOnline.getTime() / 1000,\n        );\n        if (nowSeconds - lastSeenOnlineSeconds > idleTimeoutSeconds) {\n          identityApi.signOut();\n        }\n      }\n      /**\n       * save for the first time when app is loaded, so that\n       * if user logs in and does nothing we still have a\n       * lastSeenOnline value in store\n       */\n      lastSeenOnlineStore.save(new Date());\n    } else {\n      lastSeenOnlineStore.delete();\n    }\n  }, [\n    autologoutIsEnabled,\n    enableEffect,\n    identityApi,\n    idleTimeoutSeconds,\n    lastSeenOnlineStore,\n  ]);\n};\n"],"names":[],"mappings":";;AAoBO,MAAM,4BAAA,GACX;AAUK,MAAM,kCAAkC,CAAC;AAAA,EAC9C,YAAA;AAAA,EACA,mBAAA;AAAA,EACA,kBAAA;AAAA,EACA,mBAAA;AAAA,EACA;AACF,CAAA,KAA4C;AAC1C,EAAA,SAAA,CAAU,MAAM;AAKd,IAAA,IAAI,uBAAuB,YAAA,EAAc;AACvC,MAAA,MAAM,cAAA,GAAiB,oBAAoB,GAAA,EAAI;AAC/C,MAAA,IAAI,cAAA,EAAgB;AAClB,QAAA,MAAM,GAAA,uBAAU,IAAA,EAAK;AACrB,QAAA,MAAM,aAAa,IAAA,CAAK,IAAA,CAAK,GAAA,CAAI,OAAA,KAAY,GAAI,CAAA;AACjD,QAAA,MAAM,wBAAwB,IAAA,CAAK,IAAA;AAAA,UACjC,cAAA,CAAe,SAAQ,GAAI;AAAA,SAC7B;AACA,QAAA,IAAI,UAAA,GAAa,wBAAwB,kBAAA,EAAoB;AAC3D,UAAA,WAAA,CAAY,OAAA,EAAQ;AAAA,QACtB;AAAA,MACF;AAMA,MAAA,mBAAA,CAAoB,IAAA,iBAAK,IAAI,IAAA,EAAM,CAAA;AAAA,IACrC,CAAA,MAAO;AACL,MAAA,mBAAA,CAAoB,MAAA,EAAO;AAAA,IAC7B;AAAA,EACF,CAAA,EAAG;AAAA,IACD,mBAAA;AAAA,IACA,YAAA;AAAA,IACA,WAAA;AAAA,IACA,kBAAA;AAAA,IACA;AAAA,GACD,CAAA;AACH;;;;"}
+{"version":3,"file":"disconnectedUsers.esm.js","sources":["../../../src/components/AutoLogout/disconnectedUsers.ts"],"sourcesContent":["/*\n * Copyright 2023 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport { IdentityApi } from '@backstage/core-plugin-api';\nimport { useEffect } from 'react';\n\nimport { TimestampStore } from './timestampStore';\n\nexport const LAST_SEEN_ONLINE_STORAGE_KEY =\n  '@backstage/autologout:lastSeenOnline';\n\nexport type UseLogoutDisconnectedUserEffectProps = {\n  enableEffect: boolean;\n  autologoutIsEnabled: boolean;\n  isLoggedIn: boolean | null;\n  idleTimeoutSeconds: number;\n  lastSeenOnlineStore: TimestampStore;\n  identityApi: IdentityApi;\n};\n\nexport const useLogoutDisconnectedUserEffect = ({\n  enableEffect,\n  autologoutIsEnabled,\n  isLoggedIn,\n  idleTimeoutSeconds,\n  lastSeenOnlineStore,\n  identityApi,\n}: UseLogoutDisconnectedUserEffectProps) => {\n  useEffect(() => {\n    /**\n     * Considers disconnected users as inactive users.\n     * If all Backstage tabs are closed and idleTimeoutMinutes are passed then logout the user anyway.\n     */\n    const shouldCheckDisconnectedUser = autologoutIsEnabled && enableEffect;\n\n    // Prevent lastSeen getting deleted before logged state is checked\n    if (isLoggedIn === null) {\n      return;\n    }\n\n    if (!shouldCheckDisconnectedUser || !isLoggedIn) {\n      lastSeenOnlineStore.delete();\n      return;\n    }\n\n    const lastSeenOnline = lastSeenOnlineStore.get();\n    if (lastSeenOnline) {\n      const now = new Date();\n      const nowSeconds = Math.ceil(now.getTime() / 1000);\n      const lastSeenOnlineSeconds = Math.ceil(lastSeenOnline.getTime() / 1000);\n      if (nowSeconds - lastSeenOnlineSeconds > idleTimeoutSeconds) {\n        lastSeenOnlineStore.delete();\n        identityApi.signOut();\n        return;\n      }\n    }\n    lastSeenOnlineStore.save(new Date());\n  }, [\n    autologoutIsEnabled,\n    enableEffect,\n    isLoggedIn,\n    identityApi,\n    idleTimeoutSeconds,\n    lastSeenOnlineStore,\n  ]);\n};\n"],"names":[],"mappings":";;AAoBO,MAAM,4BAAA,GACX;AAWK,MAAM,kCAAkC,CAAC;AAAA,EAC9C,YAAA;AAAA,EACA,mBAAA;AAAA,EACA,UAAA;AAAA,EACA,kBAAA;AAAA,EACA,mBAAA;AAAA,EACA;AACF,CAAA,KAA4C;AAC1C,EAAA,SAAA,CAAU,MAAM;AAKd,IAAA,MAAM,8BAA8B,mBAAA,IAAuB,YAAA;AAG3D,IAAA,IAAI,eAAe,IAAA,EAAM;AACvB,MAAA;AAAA,IACF;AAEA,IAAA,IAAI,CAAC,2BAAA,IAA+B,CAAC,UAAA,EAAY;AAC/C,MAAA,mBAAA,CAAoB,MAAA,EAAO;AAC3B,MAAA;AAAA,IACF;AAEA,IAAA,MAAM,cAAA,GAAiB,oBAAoB,GAAA,EAAI;AAC/C,IAAA,IAAI,cAAA,EAAgB;AAClB,MAAA,MAAM,GAAA,uBAAU,IAAA,EAAK;AACrB,MAAA,MAAM,aAAa,IAAA,CAAK,IAAA,CAAK,GAAA,CAAI,OAAA,KAAY,GAAI,CAAA;AACjD,MAAA,MAAM,wBAAwB,IAAA,CAAK,IAAA,CAAK,cAAA,CAAe,OAAA,KAAY,GAAI,CAAA;AACvE,MAAA,IAAI,UAAA,GAAa,wBAAwB,kBAAA,EAAoB;AAC3D,QAAA,mBAAA,CAAoB,MAAA,EAAO;AAC3B,QAAA,WAAA,CAAY,OAAA,EAAQ;AACpB,QAAA;AAAA,MACF;AAAA,IACF;AACA,IAAA,mBAAA,CAAoB,IAAA,iBAAK,IAAI,IAAA,EAAM,CAAA;AAAA,EACrC,CAAA,EAAG;AAAA,IACD,mBAAA;AAAA,IACA,YAAA;AAAA,IACA,UAAA;AAAA,IACA,WAAA;AAAA,IACA,kBAAA;AAAA,IACA;AAAA,GACD,CAAA;AACH;;;;"}

package/dist/components/Table/Filters.esm.js

@@ -27,6 +27,13 @@ const useFilterStyles = makeStyles(
       justifyContent: "space-between",
       borderBottom: `1px solid ${theme.palette.grey[500]}`
     },
+    // Intentionally empty: the deprecated `heder` class is still applied to
+    // the same element as `header` so legacy theme overrides on
+    // `BackstageTableFilters.heder` continue to work. Keeping this rule empty
+    // (rather than duplicating `header`'s styles) avoids clobbering overrides
+    // on the canonical `header` key — JSS injects rules in key order, so an
+    // empty `heder` defined after `header` has no properties to override.
+    heder: {},
     filters: {
       display: "flex",
       flexDirection: "column",
@@ -53,7 +60,7 @@ const Filters = (props) => {
     onChangeFilters(selectedFilters);
   }, [selectedFilters, onChangeFilters]);
   return /* @__PURE__ */ jsxs(Box, { className: classes.root, children: [
-    /* @__PURE__ */ jsxs(Box, { className: classes.header, children: [
+    /* @__PURE__ */ jsxs(Box, { className: `${classes.header} ${classes.heder}`, children: [
       /* @__PURE__ */ jsx(Box, { className: classes.value, children: t("table.filter.title") }),
       /* @__PURE__ */ jsx(Button, { color: "primary", onClick: handleClick, children: t("table.filter.clearAll") })
     ] }),

package/dist/components/Table/Filters.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"Filters.esm.js","sources":["../../../src/components/Table/Filters.tsx"],"sourcesContent":["/*\n * Copyright 2020 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport Box from '@material-ui/core/Box';\nimport Button from '@material-ui/core/Button';\nimport { makeStyles } from '@material-ui/core/styles';\nimport { useEffect, useState } from 'react';\n\nimport { Select } from '../Select';\nimport { SelectProps } from '../Select/Select';\nimport { coreComponentsTranslationRef } from '../../translation';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\n\nexport type TableFiltersClassKey = 'root' | 'value' | 'heder' | 'filters';\n\nconst useFilterStyles = makeStyles(\n  theme => ({\n    root: {\n      height: '100%',\n      width: '315px',\n      display: 'flex',\n      flexDirection: 'column',\n      marginRight: theme.spacing(3),\n    },\n    value: {\n      fontWeight: 'bold',\n      fontSize: 18,\n    },\n    header: {\n      display: 'flex',\n      alignItems: 'center',\n      height: theme.spacing(7.5),\n      justifyContent: 'space-between',\n      borderBottom: `1px solid ${theme.palette.grey[500]}`,\n    },\n    filters: {\n      display: 'flex',\n      flexDirection: 'column',\n      '& > *': {\n        marginTop: theme.spacing(2),\n      },\n    },\n  }),\n  { name: 'BackstageTableFilters' },\n);\n\nexport type Without<T, K> = Pick<T, Exclude<keyof T, K>>;\n\nexport type Filter = {\n  type: 'select' | 'multiple-select';\n  element: Without<SelectProps, 'onChange'>;\n};\n\nexport type SelectedFilters = {\n  [key: string]: string | string[];\n};\n\ntype Props = {\n  filters: Filter[];\n  selectedFilters?: SelectedFilters;\n  onChangeFilters: (arg: any) => any;\n};\n\nexport const Filters = (props: Props) => {\n  const classes = useFilterStyles();\n\n  const { onChangeFilters } = props;\n  const { t } = useTranslationRef(coreComponentsTranslationRef);\n\n  const [selectedFilters, setSelectedFilters] = useState<SelectedFilters>({\n    ...props.selectedFilters,\n  });\n  const [reset, triggerReset] = useState(false);\n\n  // Trigger re-rendering\n  const handleClick = () => {\n    setSelectedFilters({});\n    triggerReset(el => !el);\n  };\n\n  useEffect(() => {\n    onChangeFilters(selectedFilters);\n  }, [selectedFilters, onChangeFilters]);\n\n  // As material table doesn't provide a way to add a column filter tab we will make our own filter logic\n  return (\n    <Box className={classes.root}>\n      <Box className={classes.header}>\n        <Box className={classes.value}>{t('table.filter.title')}</Box>\n        <Button color=\"primary\" onClick={handleClick}>\n          {t('table.filter.clearAll')}\n        </Button>\n      </Box>\n      <Box className={classes.filters}>\n        {props.filters?.length &&\n          props.filters.map(filter => (\n            <Select\n              triggerReset={reset}\n              key={filter.element.label}\n              {...(filter.element as SelectProps)}\n              selected={selectedFilters[filter.element.label]}\n              onChange={el =>\n                setSelectedFilters({\n                  ...selectedFilters,\n                  [filter.element.label]: el as any,\n                })\n              }\n            />\n          ))}\n      </Box>\n    </Box>\n  );\n};\n"],"names":["Select"],"mappings":"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"}
+{"version":3,"file":"Filters.esm.js","sources":["../../../src/components/Table/Filters.tsx"],"sourcesContent":["/*\n * Copyright 2020 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport Box from '@material-ui/core/Box';\nimport Button from '@material-ui/core/Button';\nimport { makeStyles } from '@material-ui/core/styles';\nimport { useEffect, useState } from 'react';\n\nimport { Select } from '../Select';\nimport { SelectProps } from '../Select/Select';\nimport { coreComponentsTranslationRef } from '../../translation';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\n\nexport type TableFiltersClassKey =\n  | 'root'\n  | 'value'\n  | 'header'\n  /**\n   * @deprecated Use `'header'` instead. This was a typo in the original class key.\n   */\n  | 'heder'\n  | 'filters';\n\nconst useFilterStyles = makeStyles(\n  theme => ({\n    root: {\n      height: '100%',\n      width: '315px',\n      display: 'flex',\n      flexDirection: 'column',\n      marginRight: theme.spacing(3),\n    },\n    value: {\n      fontWeight: 'bold',\n      fontSize: 18,\n    },\n    header: {\n      display: 'flex',\n      alignItems: 'center',\n      height: theme.spacing(7.5),\n      justifyContent: 'space-between',\n      borderBottom: `1px solid ${theme.palette.grey[500]}`,\n    },\n    // Intentionally empty: the deprecated `heder` class is still applied to\n    // the same element as `header` so legacy theme overrides on\n    // `BackstageTableFilters.heder` continue to work. Keeping this rule empty\n    // (rather than duplicating `header`'s styles) avoids clobbering overrides\n    // on the canonical `header` key — JSS injects rules in key order, so an\n    // empty `heder` defined after `header` has no properties to override.\n    heder: {},\n    filters: {\n      display: 'flex',\n      flexDirection: 'column',\n      '& > *': {\n        marginTop: theme.spacing(2),\n      },\n    },\n  }),\n  { name: 'BackstageTableFilters' },\n);\n\nexport type Without<T, K> = Pick<T, Exclude<keyof T, K>>;\n\nexport type Filter = {\n  type: 'select' | 'multiple-select';\n  element: Without<SelectProps, 'onChange'>;\n};\n\nexport type SelectedFilters = {\n  [key: string]: string | string[];\n};\n\ntype Props = {\n  filters: Filter[];\n  selectedFilters?: SelectedFilters;\n  onChangeFilters: (arg: any) => any;\n};\n\nexport const Filters = (props: Props) => {\n  const classes = useFilterStyles();\n\n  const { onChangeFilters } = props;\n  const { t } = useTranslationRef(coreComponentsTranslationRef);\n\n  const [selectedFilters, setSelectedFilters] = useState<SelectedFilters>({\n    ...props.selectedFilters,\n  });\n  const [reset, triggerReset] = useState(false);\n\n  // Trigger re-rendering\n  const handleClick = () => {\n    setSelectedFilters({});\n    triggerReset(el => !el);\n  };\n\n  useEffect(() => {\n    onChangeFilters(selectedFilters);\n  }, [selectedFilters, onChangeFilters]);\n\n  // As material table doesn't provide a way to add a column filter tab we will make our own filter logic\n  return (\n    <Box className={classes.root}>\n      <Box className={`${classes.header} ${classes.heder}`}>\n        <Box className={classes.value}>{t('table.filter.title')}</Box>\n        <Button color=\"primary\" onClick={handleClick}>\n          {t('table.filter.clearAll')}\n        </Button>\n      </Box>\n      <Box className={classes.filters}>\n        {props.filters?.length &&\n          props.filters.map(filter => (\n            <Select\n              triggerReset={reset}\n              key={filter.element.label}\n              {...(filter.element as SelectProps)}\n              selected={selectedFilters[filter.element.label]}\n              onChange={el =>\n                setSelectedFilters({\n                  ...selectedFilters,\n                  [filter.element.label]: el as any,\n                })\n              }\n            />\n          ))}\n      </Box>\n    </Box>\n  );\n};\n"],"names":["Select"],"mappings":"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"}

package/dist/index.d.ts

@@ -1312,7 +1312,11 @@ declare function RoutedTabs(props: {
     routes: SubRoute[];
 }): react_jsx_runtime.JSX.Element;
 
-type TableFiltersClassKey = 'root' | 'value' | 'heder' | 'filters';
+type TableFiltersClassKey = 'root' | 'value' | 'header'
+/**
+ * @deprecated Use `'header'` instead. This was a typo in the original class key.
+ */
+ | 'heder' | 'filters';
 type SelectedFilters = {
     [key: string]: string | string[];
 };

package/dist/layout/ProxiedSignInPage/ProxiedSignInIdentity.esm.js

@@ -9,13 +9,18 @@ const DEFAULTS = {
   // shall start trying to get a new one
   tokenExpiryMarginMillis: 5 * 60 * 1e3
 };
+function decodeBase64Url(value) {
+  const base64 = value.replace(/-/g, "+").replace(/_/g, "/");
+  const padded = base64.padEnd(Math.ceil(base64.length / 4) * 4, "=");
+  return window.atob(padded);
+}
 function tokenToExpiry(jwtToken) {
   const fallback = new Date(Date.now() + DEFAULTS.defaultTokenExpiryMillis);
   if (!jwtToken) {
     return fallback;
   }
   const [_header, rawPayload, _signature] = jwtToken.split(".");
-  const payload = JSON.parse(window.atob(rawPayload));
+  const payload = JSON.parse(decodeBase64Url(rawPayload));
   if (typeof payload.exp !== "number") {
     return fallback;
   }

package/dist/layout/ProxiedSignInPage/ProxiedSignInIdentity.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"ProxiedSignInIdentity.esm.js","sources":["../../../src/layout/ProxiedSignInPage/ProxiedSignInIdentity.ts"],"sourcesContent":["/*\n * Copyright 2021 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport {\n  BackstageUserIdentity,\n  discoveryApiRef,\n  IdentityApi,\n  ProfileInfo,\n} from '@backstage/core-plugin-api';\nimport { ResponseError } from '@backstage/errors';\nimport { ProxiedSession, proxiedSessionSchema } from './types';\n\nexport const DEFAULTS = {\n  // The amount of time between token refreshes, if we fail to get an actual\n  // value out of the exp claim\n  defaultTokenExpiryMillis: 5 * 60 * 1000,\n  // The amount of time before the actual expiry of the Backstage token, that we\n  // shall start trying to get a new one\n  tokenExpiryMarginMillis: 5 * 60 * 1000,\n} as const;\n\n// When the token expires, with some margin\nexport function tokenToExpiry(jwtToken: string | undefined): Date {\n  const fallback = new Date(Date.now() + DEFAULTS.defaultTokenExpiryMillis);\n  if (!jwtToken) {\n    return fallback;\n  }\n\n  const [_header, rawPayload, _signature] = jwtToken.split('.');\n  const payload = JSON.parse(window.atob(rawPayload));\n  if (typeof payload.exp !== 'number') {\n    return fallback;\n  }\n\n  return new Date(payload.exp * 1000 - DEFAULTS.tokenExpiryMarginMillis);\n}\n\ntype ProxiedSignInIdentityOptions = {\n  provider: string;\n  discoveryApi: typeof discoveryApiRef.T;\n  headers?: HeadersInit | (() => HeadersInit) | (() => Promise<HeadersInit>);\n};\n\ntype State =\n  | {\n      type: 'empty';\n    }\n  | {\n      type: 'fetching';\n      promise: Promise<ProxiedSession>;\n      previous: ProxiedSession | undefined;\n    }\n  | {\n      type: 'active';\n      session: ProxiedSession;\n      expiresAt: Date;\n    }\n  | {\n      type: 'failed';\n      error: Error;\n    };\n\n/**\n * An identity API that gets the user auth information solely based on a\n * provider's `/refresh` endpoint.\n */\nexport class ProxiedSignInIdentity implements IdentityApi {\n  private readonly options: ProxiedSignInIdentityOptions;\n  private readonly abortController: AbortController;\n  private state: State;\n\n  constructor(options: ProxiedSignInIdentityOptions) {\n    this.options = options;\n    this.abortController = new AbortController();\n    this.state = { type: 'empty' };\n  }\n\n  async start() {\n    // Try to make a first fetch, bubble up any errors to the caller\n    await this.getSessionAsync();\n  }\n\n  /** {@inheritdoc @backstage/core-plugin-api#IdentityApi.getUserId} */\n  getUserId(): string {\n    const { backstageIdentity } = this.getSessionSync();\n    const ref = backstageIdentity.identity.userEntityRef;\n    const match = /^([^:/]+:)?([^:/]+\\/)?([^:/]+)$/.exec(ref);\n    if (!match) {\n      throw new TypeError(`Invalid user entity reference \"${ref}\"`);\n    }\n\n    return match[3];\n  }\n\n  /** {@inheritdoc @backstage/core-plugin-api#IdentityApi.getIdToken} */\n  async getIdToken(): Promise<string | undefined> {\n    const session = await this.getSessionAsync();\n    return session.backstageIdentity.token;\n  }\n\n  /** {@inheritdoc @backstage/core-plugin-api#IdentityApi.getProfile} */\n  getProfile(): ProfileInfo {\n    const session = this.getSessionSync();\n    return session.profile;\n  }\n\n  /** {@inheritdoc @backstage/core-plugin-api#IdentityApi.getProfileInfo} */\n  async getProfileInfo(): Promise<ProfileInfo> {\n    const session = await this.getSessionAsync();\n    return session.profile;\n  }\n\n  /** {@inheritdoc @backstage/core-plugin-api#IdentityApi.getBackstageIdentity} */\n  async getBackstageIdentity(): Promise<BackstageUserIdentity> {\n    const session = await this.getSessionAsync();\n    return session.backstageIdentity.identity;\n  }\n\n  /** {@inheritdoc @backstage/core-plugin-api#IdentityApi.getCredentials} */\n  async getCredentials(): Promise<{ token?: string | undefined }> {\n    const session = await this.getSessionAsync();\n    return {\n      token: session.backstageIdentity.token,\n    };\n  }\n\n  /** {@inheritdoc @backstage/core-plugin-api#IdentityApi.signOut} */\n  async signOut(): Promise<void> {\n    this.abortController.abort();\n  }\n\n  getSessionSync(): ProxiedSession {\n    if (this.state.type === 'active') {\n      return this.state.session;\n    } else if (this.state.type === 'fetching' && this.state.previous) {\n      return this.state.previous;\n    }\n    throw new Error('No session available. Try reloading your browser page.');\n  }\n\n  async getSessionAsync(): Promise<ProxiedSession> {\n    if (this.state.type === 'fetching') {\n      return this.state.promise;\n    } else if (\n      this.state.type === 'active' &&\n      new Date() < this.state.expiresAt\n    ) {\n      return this.state.session;\n    }\n\n    const previous =\n      this.state.type === 'active' ? this.state.session : undefined;\n\n    const promise = this.fetchSession().then(\n      session => {\n        this.state = {\n          type: 'active',\n          session,\n          expiresAt: tokenToExpiry(session.backstageIdentity.token),\n        };\n        return session;\n      },\n      error => {\n        this.state = {\n          type: 'failed',\n          error,\n        };\n        throw error;\n      },\n    );\n\n    this.state = {\n      type: 'fetching',\n      promise,\n      previous,\n    };\n\n    return promise;\n  }\n\n  async fetchSession(): Promise<ProxiedSession> {\n    const baseUrl = await this.options.discoveryApi.getBaseUrl('auth');\n\n    const headers =\n      typeof this.options.headers === 'function'\n        ? await this.options.headers()\n        : this.options.headers;\n    const mergedHeaders = new Headers(headers);\n    mergedHeaders.set('X-Requested-With', 'XMLHttpRequest');\n\n    // Note that we do not use the fetchApi here, since this all happens before\n    // sign-in completes so there can be no automatic token injection and\n    // similar.\n    const response = await fetch(\n      `${baseUrl}/${this.options.provider}/refresh`,\n      {\n        signal: this.abortController.signal,\n        headers: mergedHeaders,\n        credentials: 'include',\n      },\n    );\n\n    if (!response.ok) {\n      throw await ResponseError.fromResponse(response);\n    }\n\n    return proxiedSessionSchema.parse(await response.json());\n  }\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"ProxiedSignInIdentity.esm.js","sources":["../../../src/layout/ProxiedSignInPage/ProxiedSignInIdentity.ts"],"sourcesContent":["/*\n * Copyright 2021 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport {\n  BackstageUserIdentity,\n  discoveryApiRef,\n  IdentityApi,\n  ProfileInfo,\n} from '@backstage/core-plugin-api';\nimport { ResponseError } from '@backstage/errors';\nimport { ProxiedSession, proxiedSessionSchema } from './types';\n\nexport const DEFAULTS = {\n  // The amount of time between token refreshes, if we fail to get an actual\n  // value out of the exp claim\n  defaultTokenExpiryMillis: 5 * 60 * 1000,\n  // The amount of time before the actual expiry of the Backstage token, that we\n  // shall start trying to get a new one\n  tokenExpiryMarginMillis: 5 * 60 * 1000,\n} as const;\n\n// Decodes a base64url-encoded string. JWTs encode their segments using base64url\n// (RFC 7515), which substitutes '-' and '_' for '+' and '/' and omits padding.\n// `window.atob` only accepts standard base64, so translate back to that alphabet\n// and restore the padding before decoding.\nfunction decodeBase64Url(value: string): string {\n  const base64 = value.replace(/-/g, '+').replace(/_/g, '/');\n  const padded = base64.padEnd(Math.ceil(base64.length / 4) * 4, '=');\n  return window.atob(padded);\n}\n\n// When the token expires, with some margin\nexport function tokenToExpiry(jwtToken: string | undefined): Date {\n  const fallback = new Date(Date.now() + DEFAULTS.defaultTokenExpiryMillis);\n  if (!jwtToken) {\n    return fallback;\n  }\n\n  const [_header, rawPayload, _signature] = jwtToken.split('.');\n  const payload = JSON.parse(decodeBase64Url(rawPayload));\n  if (typeof payload.exp !== 'number') {\n    return fallback;\n  }\n\n  return new Date(payload.exp * 1000 - DEFAULTS.tokenExpiryMarginMillis);\n}\n\ntype ProxiedSignInIdentityOptions = {\n  provider: string;\n  discoveryApi: typeof discoveryApiRef.T;\n  headers?: HeadersInit | (() => HeadersInit) | (() => Promise<HeadersInit>);\n};\n\ntype State =\n  | {\n      type: 'empty';\n    }\n  | {\n      type: 'fetching';\n      promise: Promise<ProxiedSession>;\n      previous: ProxiedSession | undefined;\n    }\n  | {\n      type: 'active';\n      session: ProxiedSession;\n      expiresAt: Date;\n    }\n  | {\n      type: 'failed';\n      error: Error;\n    };\n\n/**\n * An identity API that gets the user auth information solely based on a\n * provider's `/refresh` endpoint.\n */\nexport class ProxiedSignInIdentity implements IdentityApi {\n  private readonly options: ProxiedSignInIdentityOptions;\n  private readonly abortController: AbortController;\n  private state: State;\n\n  constructor(options: ProxiedSignInIdentityOptions) {\n    this.options = options;\n    this.abortController = new AbortController();\n    this.state = { type: 'empty' };\n  }\n\n  async start() {\n    // Try to make a first fetch, bubble up any errors to the caller\n    await this.getSessionAsync();\n  }\n\n  /** {@inheritdoc @backstage/core-plugin-api#IdentityApi.getUserId} */\n  getUserId(): string {\n    const { backstageIdentity } = this.getSessionSync();\n    const ref = backstageIdentity.identity.userEntityRef;\n    const match = /^([^:/]+:)?([^:/]+\\/)?([^:/]+)$/.exec(ref);\n    if (!match) {\n      throw new TypeError(`Invalid user entity reference \"${ref}\"`);\n    }\n\n    return match[3];\n  }\n\n  /** {@inheritdoc @backstage/core-plugin-api#IdentityApi.getIdToken} */\n  async getIdToken(): Promise<string | undefined> {\n    const session = await this.getSessionAsync();\n    return session.backstageIdentity.token;\n  }\n\n  /** {@inheritdoc @backstage/core-plugin-api#IdentityApi.getProfile} */\n  getProfile(): ProfileInfo {\n    const session = this.getSessionSync();\n    return session.profile;\n  }\n\n  /** {@inheritdoc @backstage/core-plugin-api#IdentityApi.getProfileInfo} */\n  async getProfileInfo(): Promise<ProfileInfo> {\n    const session = await this.getSessionAsync();\n    return session.profile;\n  }\n\n  /** {@inheritdoc @backstage/core-plugin-api#IdentityApi.getBackstageIdentity} */\n  async getBackstageIdentity(): Promise<BackstageUserIdentity> {\n    const session = await this.getSessionAsync();\n    return session.backstageIdentity.identity;\n  }\n\n  /** {@inheritdoc @backstage/core-plugin-api#IdentityApi.getCredentials} */\n  async getCredentials(): Promise<{ token?: string | undefined }> {\n    const session = await this.getSessionAsync();\n    return {\n      token: session.backstageIdentity.token,\n    };\n  }\n\n  /** {@inheritdoc @backstage/core-plugin-api#IdentityApi.signOut} */\n  async signOut(): Promise<void> {\n    this.abortController.abort();\n  }\n\n  getSessionSync(): ProxiedSession {\n    if (this.state.type === 'active') {\n      return this.state.session;\n    } else if (this.state.type === 'fetching' && this.state.previous) {\n      return this.state.previous;\n    }\n    throw new Error('No session available. Try reloading your browser page.');\n  }\n\n  async getSessionAsync(): Promise<ProxiedSession> {\n    if (this.state.type === 'fetching') {\n      return this.state.promise;\n    } else if (\n      this.state.type === 'active' &&\n      new Date() < this.state.expiresAt\n    ) {\n      return this.state.session;\n    }\n\n    const previous =\n      this.state.type === 'active' ? this.state.session : undefined;\n\n    const promise = this.fetchSession().then(\n      session => {\n        this.state = {\n          type: 'active',\n          session,\n          expiresAt: tokenToExpiry(session.backstageIdentity.token),\n        };\n        return session;\n      },\n      error => {\n        this.state = {\n          type: 'failed',\n          error,\n        };\n        throw error;\n      },\n    );\n\n    this.state = {\n      type: 'fetching',\n      promise,\n      previous,\n    };\n\n    return promise;\n  }\n\n  async fetchSession(): Promise<ProxiedSession> {\n    const baseUrl = await this.options.discoveryApi.getBaseUrl('auth');\n\n    const headers =\n      typeof this.options.headers === 'function'\n        ? await this.options.headers()\n        : this.options.headers;\n    const mergedHeaders = new Headers(headers);\n    mergedHeaders.set('X-Requested-With', 'XMLHttpRequest');\n\n    // Note that we do not use the fetchApi here, since this all happens before\n    // sign-in completes so there can be no automatic token injection and\n    // similar.\n    const response = await fetch(\n      `${baseUrl}/${this.options.provider}/refresh`,\n      {\n        signal: this.abortController.signal,\n        headers: mergedHeaders,\n        credentials: 'include',\n      },\n    );\n\n    if (!response.ok) {\n      throw await ResponseError.fromResponse(response);\n    }\n\n    return proxiedSessionSchema.parse(await response.json());\n  }\n}\n"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@backstage/core-components",
-  "version": "0.18.10",
+  "version": "0.18.11-next.1",
   "description": "Core components used by Backstage plugins and apps",
   "backstage": {
     "role": "web-library"
@@ -66,11 +66,11 @@
     "test": "backstage-cli package test"
   },
   "dependencies": {
-    "@backstage/config": "^1.3.8",
-    "@backstage/core-plugin-api": "^1.12.6",
-    "@backstage/errors": "^1.3.1",
-    "@backstage/theme": "^0.7.3",
-    "@backstage/version-bridge": "^1.0.12",
+    "@backstage/config": "1.3.8",
+    "@backstage/core-plugin-api": "1.12.7-next.0",
+    "@backstage/errors": "1.3.1",
+    "@backstage/theme": "0.7.3",
+    "@backstage/version-bridge": "1.0.12",
     "@dagrejs/dagre": "^1.1.4",
     "@date-io/core": "^1.3.13",
     "@material-table/core": "^3.1.0",
@@ -91,7 +91,7 @@
     "linkifyjs": "4.3.2",
     "lodash": "^4.17.21",
     "parse5": "^6.0.0",
-    "qs": "^6.9.4",
+    "qs": "^6.15.2",
     "rc-progress": "3.5.1",
     "react-full-screen": "^1.1.1",
     "react-helmet": "6.1.0",
@@ -110,10 +110,10 @@
     "zod": "^3.25.76 || ^4.0.0"
   },
   "devDependencies": {
-    "@backstage/app-defaults": "^1.7.8",
-    "@backstage/cli": "^0.36.2",
-    "@backstage/core-app-api": "^1.20.1",
-    "@backstage/test-utils": "^1.7.18",
+    "@backstage/app-defaults": "1.7.9-next.1",
+    "@backstage/cli": "0.36.3-next.1",
+    "@backstage/core-app-api": "1.20.2-next.0",
+    "@backstage/test-utils": "1.7.19-next.0",
     "@testing-library/dom": "^10.0.0",
     "@testing-library/jest-dom": "^6.0.0",
     "@testing-library/user-event": "^14.0.0",