@strapi/admin 5.13.1 → 5.14.0

package/dist/admin/admin/src/features/Auth.js.map

@@ -1 +1 @@
-{"version":3,"file":"Auth.js","sources":["../../../../../admin/src/features/Auth.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { useLocation, useNavigate } from 'react-router-dom';\n\nimport { Login } from '../../../shared/contracts/authentication';\nimport { createContext } from '../components/Context';\nimport { useTypedDispatch, useTypedSelector } from '../core/store/hooks';\nimport { useStrapiApp } from '../features/StrapiApp';\nimport { useQueryParams } from '../hooks/useQueryParams';\nimport { login as loginAction, logout as logoutAction, setLocale } from '../reducer';\nimport { adminApi } from '../services/api';\nimport {\n  useGetMeQuery,\n  useGetMyPermissionsQuery,\n  useLazyCheckPermissionsQuery,\n  useLoginMutation,\n  useLogoutMutation,\n  useRenewTokenMutation,\n} from '../services/auth';\n\nimport type {\n  Permission as PermissionContract,\n  SanitizedAdminUser,\n} from '../../../shared/contracts/shared';\n\ninterface Permission\n  extends Pick<PermissionContract, 'action' | 'subject'>,\n    Partial<Omit<PermissionContract, 'action' | 'subject'>> {}\n\ninterface User\n  extends Pick<SanitizedAdminUser, 'email' | 'firstname' | 'lastname' | 'username' | 'roles'>,\n    Partial<Omit<SanitizedAdminUser, 'email' | 'firstname' | 'lastname' | 'username' | 'roles'>> {}\n\ninterface AuthContextValue {\n  login: (\n    body: Login.Request['body'] & { rememberMe: boolean }\n  ) => Promise<Awaited<ReturnType<ReturnType<typeof useLoginMutation>[0]>>>;\n  logout: () => Promise<void>;\n  /**\n   * @alpha\n   * @description given a list of permissions, this function checks\n   * those against the current user's permissions or those passed as\n   * the second argument, if the user has those permissions the complete\n   * permission object form the API is returned. Therefore, if the list is\n   * empty, the user does not have any of those permissions.\n   */\n  checkUserHasPermissions: (\n    permissions?: Permission[],\n    passedPermissions?: Permission[],\n    rawQueryContext?: string\n  ) => Promise<Permission[]>;\n  isLoading: boolean;\n  permissions: Permission[];\n  refetchPermissions: () => Promise<void>;\n  token: string | null;\n  user?: User;\n}\n\nconst [Provider, useAuth] = createContext<AuthContextValue>('Auth');\n\ninterface AuthProviderProps {\n  children: React.ReactNode;\n  /**\n   * @internal could be removed at any time.\n   */\n  _defaultPermissions?: Permission[];\n\n  // NOTE: this is used for testing purposed only\n  _disableRenewToken?: boolean;\n}\n\nconst STORAGE_KEYS = {\n  TOKEN: 'jwtToken',\n  STATUS: 'isLoggedIn',\n};\n\nconst AuthProvider = ({\n  children,\n  _defaultPermissions = [],\n  _disableRenewToken = false,\n}: AuthProviderProps) => {\n  const dispatch = useTypedDispatch();\n  const runRbacMiddleware = useStrapiApp('AuthProvider', (state) => state.rbac.run);\n  const location = useLocation();\n  const [{ rawQuery }] = useQueryParams();\n\n  const token = useTypedSelector((state) => state.admin_app.token ?? null);\n\n  const { data: user, isLoading: isLoadingUser } = useGetMeQuery(undefined, {\n    /**\n     * If there's no token, we don't try to fetch\n     * the user data because it will fail.\n     */\n    skip: !token,\n  });\n\n  const {\n    data: userPermissions = _defaultPermissions,\n    refetch,\n    isUninitialized,\n    isLoading: isLoadingPermissions,\n  } = useGetMyPermissionsQuery(undefined, {\n    skip: !token,\n  });\n\n  const navigate = useNavigate();\n\n  const [loginMutation] = useLoginMutation();\n  const [renewTokenMutation] = useRenewTokenMutation();\n  const [logoutMutation] = useLogoutMutation();\n\n  const clearStateAndLogout = React.useCallback(() => {\n    dispatch(adminApi.util.resetApiState());\n    dispatch(logoutAction());\n    navigate('/auth/login');\n  }, [dispatch, navigate]);\n\n  /**\n   * Fetch data from storages on mount and store it in our state.\n   * It's not normally stored in session storage unless the user\n   * does click \"remember me\" when they login. We also need to renew the token.\n   */\n  React.useEffect(() => {\n    if (token && !_disableRenewToken) {\n      renewTokenMutation({ token }).then((res) => {\n        if ('data' in res) {\n          dispatch(\n            loginAction({\n              token: res.data.token,\n            })\n          );\n        } else {\n          clearStateAndLogout();\n        }\n      });\n    }\n  }, [token, dispatch, renewTokenMutation, clearStateAndLogout, _disableRenewToken]);\n\n  React.useEffect(() => {\n    if (user) {\n      if (user.preferedLanguage) {\n        dispatch(setLocale(user.preferedLanguage));\n      }\n    }\n  }, [dispatch, user]);\n\n  React.useEffect(() => {\n    /**\n     * This will log a user out of all tabs if they log out in one tab.\n     */\n    const handleUserStorageChange = (event: StorageEvent) => {\n      if (event.key === STORAGE_KEYS.STATUS && event.newValue === null) {\n        clearStateAndLogout();\n      }\n    };\n\n    window.addEventListener('storage', handleUserStorageChange);\n\n    return () => {\n      window.removeEventListener('storage', handleUserStorageChange);\n    };\n  });\n\n  const login = React.useCallback<AuthContextValue['login']>(\n    async ({ rememberMe, ...body }) => {\n      const res = await loginMutation(body);\n\n      /**\n       * There will always be a `data` key in the response\n       * because if something fails, it will throw an error.\n       */\n      if ('data' in res) {\n        const { token } = res.data;\n\n        dispatch(\n          loginAction({\n            token,\n            persist: rememberMe,\n          })\n        );\n      }\n\n      return res;\n    },\n    [dispatch, loginMutation]\n  );\n\n  const logout = React.useCallback(async () => {\n    await logoutMutation();\n    clearStateAndLogout();\n  }, [clearStateAndLogout, logoutMutation]);\n\n  const refetchPermissions = React.useCallback(async () => {\n    if (!isUninitialized) {\n      await refetch();\n    }\n  }, [isUninitialized, refetch]);\n\n  const [checkPermissions] = useLazyCheckPermissionsQuery();\n  const checkUserHasPermissions: AuthContextValue['checkUserHasPermissions'] = React.useCallback(\n    async (\n      permissions,\n      passedPermissions,\n      // TODO:\n      // Here we have parameterised checkUserHasPermissions in order to pass\n      // query context from elsewhere in the application.\n      // See packages/core/content-manager/admin/src/features/DocumentRBAC.tsx\n\n      // This is in order to calculate permissions on accurate query params.\n      // We should be able to rely on the query params in this provider\n      // If we need to pass additional context to the RBAC middleware\n      // we should define a better context type.\n      rawQueryContext\n    ) => {\n      /**\n       * If there's no permissions to check, then we allow it to\n       * pass to preserve existing behaviours.\n       *\n       * TODO: should we review this? it feels more dangerous than useful.\n       */\n      if (!permissions || permissions.length === 0) {\n        return [{ action: '', subject: '' }];\n      }\n\n      /**\n       * Given the provided permissions, return the permissions from either passedPermissions\n       * or userPermissions as this is expected to be the full permission entity.\n       */\n      const actualUserPermissions = passedPermissions ?? userPermissions;\n\n      const matchingPermissions = actualUserPermissions.filter(\n        (permission) =>\n          permissions.findIndex(\n            (perm) =>\n              perm.action === permission.action &&\n              // Only check the subject if it's provided\n              (perm.subject == undefined || perm.subject === permission.subject)\n          ) >= 0\n      );\n\n      const middlewaredPermissions = await runRbacMiddleware(\n        {\n          user,\n          permissions: userPermissions,\n          pathname: location.pathname,\n          search: (rawQueryContext || rawQuery).split('?')[1] ?? '',\n        },\n        matchingPermissions\n      );\n\n      const shouldCheckConditions = middlewaredPermissions.some(\n        (perm) => Array.isArray(perm.conditions) && perm.conditions.length > 0\n      );\n\n      if (!shouldCheckConditions) {\n        return middlewaredPermissions;\n      }\n\n      const { data, error } = await checkPermissions({\n        permissions: middlewaredPermissions.map((perm) => ({\n          action: perm.action,\n          subject: perm.subject,\n        })),\n      });\n\n      if (error) {\n        throw error;\n      } else {\n        return middlewaredPermissions.filter((_, index) => data?.data[index] === true);\n      }\n    },\n    [checkPermissions, location.pathname, rawQuery, runRbacMiddleware, user, userPermissions]\n  );\n\n  const isLoading = isLoadingUser || isLoadingPermissions;\n\n  return (\n    <Provider\n      token={token}\n      user={user}\n      login={login}\n      logout={logout}\n      permissions={userPermissions}\n      checkUserHasPermissions={checkUserHasPermissions}\n      refetchPermissions={refetchPermissions}\n      isLoading={isLoading}\n    >\n      {children}\n    </Provider>\n  );\n};\n\nexport { AuthProvider, useAuth, STORAGE_KEYS };\nexport type { AuthContextValue, Permission, User };\n"],"names":["Provider","useAuth","createContext","STORAGE_KEYS","TOKEN","STATUS","AuthProvider","children","_defaultPermissions","_disableRenewToken","dispatch","useTypedDispatch","runRbacMiddleware","useStrapiApp","state","rbac","run","location","useLocation","rawQuery","useQueryParams","token","useTypedSelector","admin_app","data","user","isLoading","isLoadingUser","useGetMeQuery","undefined","skip","userPermissions","refetch","isUninitialized","isLoadingPermissions","useGetMyPermissionsQuery","navigate","useNavigate","loginMutation","useLoginMutation","renewTokenMutation","useRenewTokenMutation","logoutMutation","useLogoutMutation","clearStateAndLogout","React","useCallback","adminApi","util","resetApiState","logoutAction","useEffect","then","res","loginAction","preferedLanguage","setLocale","handleUserStorageChange","event","key","newValue","window","addEventListener","removeEventListener","login","rememberMe","body","persist","logout","refetchPermissions","checkPermissions","useLazyCheckPermissionsQuery","checkUserHasPermissions","permissions","passedPermissions","rawQueryContext","length","action","subject","actualUserPermissions","matchingPermissions","filter","permission","findIndex","perm","middlewaredPermissions","pathname","search","split","shouldCheckConditions","some","Array","isArray","conditions","error","map","_","index","_jsx"],"mappings":"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"}
+{"version":3,"file":"Auth.js","sources":["../../../../../admin/src/features/Auth.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { useLocation, useNavigate } from 'react-router-dom';\n\nimport { Login } from '../../../shared/contracts/authentication';\nimport { createContext } from '../components/Context';\nimport { useTypedDispatch, useTypedSelector } from '../core/store/hooks';\nimport { useStrapiApp } from '../features/StrapiApp';\nimport { useQueryParams } from '../hooks/useQueryParams';\nimport { login as loginAction, logout as logoutAction, setLocale } from '../reducer';\nimport { adminApi } from '../services/api';\nimport {\n  useGetMeQuery,\n  useGetMyPermissionsQuery,\n  useLazyCheckPermissionsQuery,\n  useLoginMutation,\n  useLogoutMutation,\n  useRenewTokenMutation,\n} from '../services/auth';\n\nimport type {\n  Permission as PermissionContract,\n  SanitizedAdminUser,\n} from '../../../shared/contracts/shared';\n\ninterface Permission\n  extends Pick<PermissionContract, 'action' | 'subject'>,\n    Partial<Omit<PermissionContract, 'action' | 'subject'>> {}\n\ninterface User\n  extends Pick<SanitizedAdminUser, 'email' | 'firstname' | 'lastname' | 'username' | 'roles'>,\n    Partial<Omit<SanitizedAdminUser, 'email' | 'firstname' | 'lastname' | 'username' | 'roles'>> {}\n\ninterface AuthContextValue {\n  login: (\n    body: Login.Request['body'] & { rememberMe: boolean }\n  ) => Promise<Awaited<ReturnType<ReturnType<typeof useLoginMutation>[0]>>>;\n  logout: () => Promise<void>;\n  /**\n   * @alpha\n   * @description given a list of permissions, this function checks\n   * those against the current user's permissions or those passed as\n   * the second argument, if the user has those permissions the complete\n   * permission object form the API is returned. Therefore, if the list is\n   * empty, the user does not have any of those permissions.\n   */\n  checkUserHasPermissions: (\n    permissions?: Permission[],\n    passedPermissions?: Permission[],\n    rawQueryContext?: string\n  ) => Promise<Permission[]>;\n  isLoading: boolean;\n  permissions: Permission[];\n  refetchPermissions: () => Promise<void>;\n  token: string | null;\n  user?: User;\n}\n\nconst [Provider, useAuth] = createContext<AuthContextValue>('Auth');\n\ninterface AuthProviderProps {\n  children: React.ReactNode;\n  /**\n   * @internal could be removed at any time.\n   */\n  _defaultPermissions?: Permission[];\n\n  // NOTE: this is used for testing purposed only\n  _disableRenewToken?: boolean;\n}\n\nconst STORAGE_KEYS = {\n  TOKEN: 'jwtToken',\n  STATUS: 'isLoggedIn',\n};\n\nconst AuthProvider = ({\n  children,\n  _defaultPermissions = [],\n  _disableRenewToken = false,\n}: AuthProviderProps) => {\n  const dispatch = useTypedDispatch();\n  const runRbacMiddleware = useStrapiApp('AuthProvider', (state) => state.rbac.run);\n  const location = useLocation();\n  const [{ rawQuery }] = useQueryParams();\n\n  const locationRef = React.useRef(location);\n\n  // Update ref without causing re-render\n  React.useEffect(() => {\n    locationRef.current = location;\n  }, [location]);\n\n  const token = useTypedSelector((state) => state.admin_app.token ?? null);\n\n  const { data: user, isLoading: isLoadingUser } = useGetMeQuery(undefined, {\n    /**\n     * If there's no token, we don't try to fetch\n     * the user data because it will fail.\n     */\n    skip: !token,\n  });\n\n  const {\n    data: userPermissions = _defaultPermissions,\n    refetch,\n    isUninitialized,\n    isLoading: isLoadingPermissions,\n  } = useGetMyPermissionsQuery(undefined, {\n    skip: !token,\n  });\n\n  const navigate = useNavigate();\n\n  const [loginMutation] = useLoginMutation();\n  const [renewTokenMutation] = useRenewTokenMutation();\n  const [logoutMutation] = useLogoutMutation();\n\n  const clearStateAndLogout = React.useCallback(() => {\n    dispatch(adminApi.util.resetApiState());\n    dispatch(logoutAction());\n    navigate('/auth/login');\n  }, [dispatch, navigate]);\n\n  /**\n   * Fetch data from storages on mount and store it in our state.\n   * It's not normally stored in session storage unless the user\n   * does click \"remember me\" when they login. We also need to renew the token.\n   */\n  React.useEffect(() => {\n    if (token && !_disableRenewToken) {\n      renewTokenMutation({ token }).then((res) => {\n        if ('data' in res) {\n          dispatch(\n            loginAction({\n              token: res.data.token,\n            })\n          );\n        } else {\n          clearStateAndLogout();\n        }\n      });\n    }\n  }, [token, dispatch, renewTokenMutation, clearStateAndLogout, _disableRenewToken]);\n\n  React.useEffect(() => {\n    if (user) {\n      if (user.preferedLanguage) {\n        dispatch(setLocale(user.preferedLanguage));\n      }\n    }\n  }, [dispatch, user]);\n\n  React.useEffect(() => {\n    /**\n     * This will log a user out of all tabs if they log out in one tab.\n     */\n    const handleUserStorageChange = (event: StorageEvent) => {\n      if (event.key === STORAGE_KEYS.STATUS && event.newValue === null) {\n        clearStateAndLogout();\n      }\n    };\n\n    window.addEventListener('storage', handleUserStorageChange);\n\n    return () => {\n      window.removeEventListener('storage', handleUserStorageChange);\n    };\n  });\n\n  const login = React.useCallback<AuthContextValue['login']>(\n    async ({ rememberMe, ...body }) => {\n      const res = await loginMutation(body);\n\n      /**\n       * There will always be a `data` key in the response\n       * because if something fails, it will throw an error.\n       */\n      if ('data' in res) {\n        const { token } = res.data;\n\n        dispatch(\n          loginAction({\n            token,\n            persist: rememberMe,\n          })\n        );\n      }\n\n      return res;\n    },\n    [dispatch, loginMutation]\n  );\n\n  const logout = React.useCallback(async () => {\n    await logoutMutation();\n    clearStateAndLogout();\n  }, [clearStateAndLogout, logoutMutation]);\n\n  const refetchPermissions = React.useCallback(async () => {\n    if (!isUninitialized) {\n      await refetch();\n    }\n  }, [isUninitialized, refetch]);\n\n  const [checkPermissions] = useLazyCheckPermissionsQuery();\n  const checkUserHasPermissions: AuthContextValue['checkUserHasPermissions'] = React.useCallback(\n    async (\n      permissions,\n      passedPermissions,\n      // TODO:\n      // Here we have parameterised checkUserHasPermissions in order to pass\n      // query context from elsewhere in the application.\n      // See packages/core/content-manager/admin/src/features/DocumentRBAC.tsx\n\n      // This is in order to calculate permissions on accurate query params.\n      // We should be able to rely on the query params in this provider\n      // If we need to pass additional context to the RBAC middleware\n      // we should define a better context type.\n      rawQueryContext\n    ) => {\n      /**\n       * If there's no permissions to check, then we allow it to\n       * pass to preserve existing behaviours.\n       *\n       * TODO: should we review this? it feels more dangerous than useful.\n       */\n      if (!permissions || permissions.length === 0) {\n        return [{ action: '', subject: '' }];\n      }\n\n      /**\n       * Given the provided permissions, return the permissions from either passedPermissions\n       * or userPermissions as this is expected to be the full permission entity.\n       */\n      const actualUserPermissions = passedPermissions ?? userPermissions;\n\n      const matchingPermissions = actualUserPermissions.filter(\n        (permission) =>\n          permissions.findIndex(\n            (perm) =>\n              perm.action === permission.action &&\n              // Only check the subject if it's provided\n              (perm.subject == undefined || perm.subject === permission.subject)\n          ) >= 0\n      );\n\n      const middlewaredPermissions = await runRbacMiddleware(\n        {\n          user,\n          permissions: userPermissions,\n          pathname: locationRef.current.pathname,\n          search: (rawQueryContext || rawQuery).split('?')[1] ?? '',\n        },\n        matchingPermissions\n      );\n\n      const shouldCheckConditions = middlewaredPermissions.some(\n        (perm) => Array.isArray(perm.conditions) && perm.conditions.length > 0\n      );\n\n      if (!shouldCheckConditions) {\n        return middlewaredPermissions;\n      }\n\n      const { data, error } = await checkPermissions({\n        permissions: middlewaredPermissions.map((perm) => ({\n          action: perm.action,\n          subject: perm.subject,\n        })),\n      });\n\n      if (error) {\n        throw error;\n      } else {\n        return middlewaredPermissions.filter((_, index) => data?.data[index] === true);\n      }\n    },\n    [checkPermissions, rawQuery, runRbacMiddleware, user, userPermissions]\n  );\n\n  const isLoading = isLoadingUser || isLoadingPermissions;\n\n  return (\n    <Provider\n      token={token}\n      user={user}\n      login={login}\n      logout={logout}\n      permissions={userPermissions}\n      checkUserHasPermissions={checkUserHasPermissions}\n      refetchPermissions={refetchPermissions}\n      isLoading={isLoading}\n    >\n      {children}\n    </Provider>\n  );\n};\n\nexport { AuthProvider, useAuth, STORAGE_KEYS };\nexport type { AuthContextValue, Permission, User };\n"],"names":["Provider","useAuth","createContext","STORAGE_KEYS","TOKEN","STATUS","AuthProvider","children","_defaultPermissions","_disableRenewToken","dispatch","useTypedDispatch","runRbacMiddleware","useStrapiApp","state","rbac","run","location","useLocation","rawQuery","useQueryParams","locationRef","React","useRef","useEffect","current","token","useTypedSelector","admin_app","data","user","isLoading","isLoadingUser","useGetMeQuery","undefined","skip","userPermissions","refetch","isUninitialized","isLoadingPermissions","useGetMyPermissionsQuery","navigate","useNavigate","loginMutation","useLoginMutation","renewTokenMutation","useRenewTokenMutation","logoutMutation","useLogoutMutation","clearStateAndLogout","useCallback","adminApi","util","resetApiState","logoutAction","then","res","loginAction","preferedLanguage","setLocale","handleUserStorageChange","event","key","newValue","window","addEventListener","removeEventListener","login","rememberMe","body","persist","logout","refetchPermissions","checkPermissions","useLazyCheckPermissionsQuery","checkUserHasPermissions","permissions","passedPermissions","rawQueryContext","length","action","subject","actualUserPermissions","matchingPermissions","filter","permission","findIndex","perm","middlewaredPermissions","pathname","search","split","shouldCheckConditions","some","Array","isArray","conditions","error","map","_","index","_jsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0DA,MAAM,CAACA,QAAAA,EAAUC,OAAQ,CAAA,GAAGC,qBAAgC,CAAA,MAAA;AAa5D,MAAMC,YAAe,GAAA;IACnBC,KAAO,EAAA,UAAA;IACPC,MAAQ,EAAA;AACV;AAEMC,MAAAA,YAAAA,GAAe,CAAC,EACpBC,QAAQ,EACRC,sBAAsB,EAAE,EACxBC,kBAAqB,GAAA,KAAK,EACR,GAAA;AAClB,IAAA,MAAMC,QAAWC,GAAAA,sBAAAA,EAAAA;IACjB,MAAMC,iBAAAA,GAAoBC,uBAAa,cAAgB,EAAA,CAACC,QAAUA,KAAMC,CAAAA,IAAI,CAACC,GAAG,CAAA;AAChF,IAAA,MAAMC,QAAWC,GAAAA,0BAAAA,EAAAA;AACjB,IAAA,MAAM,CAAC,EAAEC,QAAQ,EAAE,CAAC,GAAGC,6BAAAA,EAAAA;IAEvB,MAAMC,WAAAA,GAAcC,gBAAMC,CAAAA,MAAM,CAACN,QAAAA,CAAAA;;AAGjCK,IAAAA,gBAAAA,CAAME,SAAS,CAAC,IAAA;AACdH,QAAAA,WAAAA,CAAYI,OAAO,GAAGR,QAAAA;KACrB,EAAA;AAACA,QAAAA;AAAS,KAAA,CAAA;IAEb,MAAMS,KAAAA,GAAQC,uBAAiB,CAACb,KAAAA,GAAUA,MAAMc,SAAS,CAACF,KAAK,IAAI,IAAA,CAAA;IAEnE,MAAM,EAAEG,MAAMC,IAAI,EAAEC,WAAWC,aAAa,EAAE,GAAGC,kBAAAA,CAAcC,SAAW,EAAA;AACxE;;;AAGC,QACDC,MAAM,CAACT;AACT,KAAA,CAAA;AAEA,IAAA,MAAM,EACJG,IAAAA,EAAMO,eAAkB5B,GAAAA,mBAAmB,EAC3C6B,OAAO,EACPC,eAAe,EACfP,SAAWQ,EAAAA,oBAAoB,EAChC,GAAGC,8BAAyBN,SAAW,EAAA;AACtCC,QAAAA,IAAAA,EAAM,CAACT;AACT,KAAA,CAAA;AAEA,IAAA,MAAMe,QAAWC,GAAAA,0BAAAA,EAAAA;IAEjB,MAAM,CAACC,cAAc,GAAGC,qBAAAA,EAAAA;IACxB,MAAM,CAACC,mBAAmB,GAAGC,0BAAAA,EAAAA;IAC7B,MAAM,CAACC,eAAe,GAAGC,sBAAAA,EAAAA;IAEzB,MAAMC,mBAAAA,GAAsB3B,gBAAM4B,CAAAA,WAAW,CAAC,IAAA;QAC5CxC,QAASyC,CAAAA,YAAAA,CAASC,IAAI,CAACC,aAAa,EAAA,CAAA;QACpC3C,QAAS4C,CAAAA,cAAAA,EAAAA,CAAAA;QACTb,QAAS,CAAA,aAAA,CAAA;KACR,EAAA;AAAC/B,QAAAA,QAAAA;AAAU+B,QAAAA;AAAS,KAAA,CAAA;AAEvB;;;;MAKAnB,gBAAAA,CAAME,SAAS,CAAC,IAAA;QACd,IAAIE,KAAAA,IAAS,CAACjB,kBAAoB,EAAA;YAChCoC,kBAAmB,CAAA;AAAEnB,gBAAAA;aAAS6B,CAAAA,CAAAA,IAAI,CAAC,CAACC,GAAAA,GAAAA;AAClC,gBAAA,IAAI,UAAUA,GAAK,EAAA;AACjB9C,oBAAAA,QAAAA,CACE+C,aAAY,CAAA;wBACV/B,KAAO8B,EAAAA,GAAAA,CAAI3B,IAAI,CAACH;AAClB,qBAAA,CAAA,CAAA;iBAEG,MAAA;AACLuB,oBAAAA,mBAAAA,EAAAA;AACF;AACF,aAAA,CAAA;AACF;KACC,EAAA;AAACvB,QAAAA,KAAAA;AAAOhB,QAAAA,QAAAA;AAAUmC,QAAAA,kBAAAA;AAAoBI,QAAAA,mBAAAA;AAAqBxC,QAAAA;AAAmB,KAAA,CAAA;AAEjFa,IAAAA,gBAAAA,CAAME,SAAS,CAAC,IAAA;AACd,QAAA,IAAIM,IAAM,EAAA;YACR,IAAIA,IAAAA,CAAK4B,gBAAgB,EAAE;gBACzBhD,QAASiD,CAAAA,iBAAAA,CAAU7B,KAAK4B,gBAAgB,CAAA,CAAA;AAC1C;AACF;KACC,EAAA;AAAChD,QAAAA,QAAAA;AAAUoB,QAAAA;AAAK,KAAA,CAAA;AAEnBR,IAAAA,gBAAAA,CAAME,SAAS,CAAC,IAAA;AACd;;QAGA,MAAMoC,0BAA0B,CAACC,KAAAA,GAAAA;YAC/B,IAAIA,KAAAA,CAAMC,GAAG,KAAK3D,YAAAA,CAAaE,MAAM,IAAIwD,KAAAA,CAAME,QAAQ,KAAK,IAAM,EAAA;AAChEd,gBAAAA,mBAAAA,EAAAA;AACF;AACF,SAAA;QAEAe,MAAOC,CAAAA,gBAAgB,CAAC,SAAWL,EAAAA,uBAAAA,CAAAA;QAEnC,OAAO,IAAA;YACLI,MAAOE,CAAAA,mBAAmB,CAAC,SAAWN,EAAAA,uBAAAA,CAAAA;AACxC,SAAA;AACF,KAAA,CAAA;IAEA,MAAMO,KAAAA,GAAQ7C,iBAAM4B,WAAW,CAC7B,OAAO,EAAEkB,UAAU,EAAE,GAAGC,IAAM,EAAA,GAAA;QAC5B,MAAMb,GAAAA,GAAM,MAAMb,aAAc0B,CAAAA,IAAAA,CAAAA;AAEhC;;;UAIA,IAAI,UAAUb,GAAK,EAAA;AACjB,YAAA,MAAM,EAAE9B,KAAK,EAAE,GAAG8B,IAAI3B,IAAI;AAE1BnB,YAAAA,QAAAA,CACE+C,aAAY,CAAA;AACV/B,gBAAAA,KAAAA;gBACA4C,OAASF,EAAAA;AACX,aAAA,CAAA,CAAA;AAEJ;QAEA,OAAOZ,GAAAA;KAET,EAAA;AAAC9C,QAAAA,QAAAA;AAAUiC,QAAAA;AAAc,KAAA,CAAA;IAG3B,MAAM4B,MAAAA,GAASjD,gBAAM4B,CAAAA,WAAW,CAAC,UAAA;QAC/B,MAAMH,cAAAA,EAAAA;AACNE,QAAAA,mBAAAA,EAAAA;KACC,EAAA;AAACA,QAAAA,mBAAAA;AAAqBF,QAAAA;AAAe,KAAA,CAAA;IAExC,MAAMyB,kBAAAA,GAAqBlD,gBAAM4B,CAAAA,WAAW,CAAC,UAAA;AAC3C,QAAA,IAAI,CAACZ,eAAiB,EAAA;YACpB,MAAMD,OAAAA,EAAAA;AACR;KACC,EAAA;AAACC,QAAAA,eAAAA;AAAiBD,QAAAA;AAAQ,KAAA,CAAA;IAE7B,MAAM,CAACoC,iBAAiB,GAAGC,iCAAAA,EAAAA;AAC3B,IAAA,MAAMC,0BAAuErD,gBAAM4B,CAAAA,WAAW,CAC5F,OACE0B,WAAAA,EACAC;;;;;;;;AAUAC,IAAAA,eAAAA,GAAAA;AAEA;;;;;AAKC,UACD,IAAI,CAACF,WAAAA,IAAeA,WAAYG,CAAAA,MAAM,KAAK,CAAG,EAAA;YAC5C,OAAO;AAAC,gBAAA;oBAAEC,MAAQ,EAAA,EAAA;oBAAIC,OAAS,EAAA;AAAG;AAAE,aAAA;AACtC;AAEA;;;UAIA,MAAMC,wBAAwBL,iBAAqBzC,IAAAA,eAAAA;AAEnD,QAAA,MAAM+C,sBAAsBD,qBAAsBE,CAAAA,MAAM,CACtD,CAACC,aACCT,WAAYU,CAAAA,SAAS,CACnB,CAACC,OACCA,IAAKP,CAAAA,MAAM,KAAKK,UAAWL,CAAAA,MAAM;iBAEhCO,IAAAA,CAAKN,OAAO,IAAI/C,SAAaqD,IAAAA,IAAAA,CAAKN,OAAO,KAAKI,UAAAA,CAAWJ,OAAM,CAC/D,CAAA,IAAA,CAAA,CAAA;QAGT,MAAMO,sBAAAA,GAAyB,MAAM5E,iBACnC,CAAA;AACEkB,YAAAA,IAAAA;YACA8C,WAAaxC,EAAAA,eAAAA;YACbqD,QAAUpE,EAAAA,WAAAA,CAAYI,OAAO,CAACgE,QAAQ;YACtCC,MAAQ,EAACZ,CAAAA,eAAAA,IAAmB3D,QAAO,EAAGwE,KAAK,CAAC,GAAA,CAAI,CAAC,CAAA,CAAE,IAAI;SAEzDR,EAAAA,mBAAAA,CAAAA;AAGF,QAAA,MAAMS,wBAAwBJ,sBAAuBK,CAAAA,IAAI,CACvD,CAACN,OAASO,KAAMC,CAAAA,OAAO,CAACR,IAAAA,CAAKS,UAAU,CAAKT,IAAAA,IAAAA,CAAKS,UAAU,CAACjB,MAAM,GAAG,CAAA,CAAA;AAGvE,QAAA,IAAI,CAACa,qBAAuB,EAAA;YAC1B,OAAOJ,sBAAAA;AACT;AAEA,QAAA,MAAM,EAAE3D,IAAI,EAAEoE,KAAK,EAAE,GAAG,MAAMxB,gBAAiB,CAAA;AAC7CG,YAAAA,WAAAA,EAAaY,sBAAuBU,CAAAA,GAAG,CAAC,CAACX,QAAU;AACjDP,oBAAAA,MAAAA,EAAQO,KAAKP,MAAM;AACnBC,oBAAAA,OAAAA,EAASM,KAAKN;iBAChB,CAAA;AACF,SAAA,CAAA;AAEA,QAAA,IAAIgB,KAAO,EAAA;YACT,MAAMA,KAAAA;SACD,MAAA;YACL,OAAOT,sBAAAA,CAAuBJ,MAAM,CAAC,CAACe,CAAAA,EAAGC,QAAUvE,IAAMA,EAAAA,IAAI,CAACuE,KAAAA,CAAM,KAAK,IAAA,CAAA;AAC3E;KAEF,EAAA;AAAC3B,QAAAA,gBAAAA;AAAkBtD,QAAAA,QAAAA;AAAUP,QAAAA,iBAAAA;AAAmBkB,QAAAA,IAAAA;AAAMM,QAAAA;AAAgB,KAAA,CAAA;AAGxE,IAAA,MAAML,YAAYC,aAAiBO,IAAAA,oBAAAA;AAEnC,IAAA,qBACE8D,cAACrG,CAAAA,QAAAA,EAAAA;QACC0B,KAAOA,EAAAA,KAAAA;QACPI,IAAMA,EAAAA,IAAAA;QACNqC,KAAOA,EAAAA,KAAAA;QACPI,MAAQA,EAAAA,MAAAA;QACRK,WAAaxC,EAAAA,eAAAA;QACbuC,uBAAyBA,EAAAA,uBAAAA;QACzBH,kBAAoBA,EAAAA,kBAAAA;QACpBzC,SAAWA,EAAAA,SAAAA;AAEVxB,QAAAA,QAAAA,EAAAA;;AAGP;;;;;;"}

package/dist/admin/admin/src/features/Auth.mjs

@@ -19,6 +19,13 @@ const AuthProvider = ({ children, _defaultPermissions = [], _disableRenewToken =
     const runRbacMiddleware = useStrapiApp('AuthProvider', (state)=>state.rbac.run);
     const location = useLocation();
     const [{ rawQuery }] = useQueryParams();
+    const locationRef = React.useRef(location);
+    // Update ref without causing re-render
+    React.useEffect(()=>{
+        locationRef.current = location;
+    }, [
+        location
+    ]);
     const token = useTypedSelector((state)=>state.admin_app.token ?? null);
     const { data: user, isLoading: isLoadingUser } = useGetMeQuery(undefined, {
         /**
@@ -153,7 +160,7 @@ const AuthProvider = ({ children, _defaultPermissions = [], _disableRenewToken =
         const middlewaredPermissions = await runRbacMiddleware({
             user,
             permissions: userPermissions,
-            pathname: location.pathname,
+            pathname: locationRef.current.pathname,
             search: (rawQueryContext || rawQuery).split('?')[1] ?? ''
         }, matchingPermissions);
         const shouldCheckConditions = middlewaredPermissions.some((perm)=>Array.isArray(perm.conditions) && perm.conditions.length > 0);
@@ -173,7 +180,6 @@ const AuthProvider = ({ children, _defaultPermissions = [], _disableRenewToken =
         }
     }, [
         checkPermissions,
-        location.pathname,
         rawQuery,
         runRbacMiddleware,
         user,

package/dist/admin/admin/src/features/Auth.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Auth.mjs","sources":["../../../../../admin/src/features/Auth.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { useLocation, useNavigate } from 'react-router-dom';\n\nimport { Login } from '../../../shared/contracts/authentication';\nimport { createContext } from '../components/Context';\nimport { useTypedDispatch, useTypedSelector } from '../core/store/hooks';\nimport { useStrapiApp } from '../features/StrapiApp';\nimport { useQueryParams } from '../hooks/useQueryParams';\nimport { login as loginAction, logout as logoutAction, setLocale } from '../reducer';\nimport { adminApi } from '../services/api';\nimport {\n  useGetMeQuery,\n  useGetMyPermissionsQuery,\n  useLazyCheckPermissionsQuery,\n  useLoginMutation,\n  useLogoutMutation,\n  useRenewTokenMutation,\n} from '../services/auth';\n\nimport type {\n  Permission as PermissionContract,\n  SanitizedAdminUser,\n} from '../../../shared/contracts/shared';\n\ninterface Permission\n  extends Pick<PermissionContract, 'action' | 'subject'>,\n    Partial<Omit<PermissionContract, 'action' | 'subject'>> {}\n\ninterface User\n  extends Pick<SanitizedAdminUser, 'email' | 'firstname' | 'lastname' | 'username' | 'roles'>,\n    Partial<Omit<SanitizedAdminUser, 'email' | 'firstname' | 'lastname' | 'username' | 'roles'>> {}\n\ninterface AuthContextValue {\n  login: (\n    body: Login.Request['body'] & { rememberMe: boolean }\n  ) => Promise<Awaited<ReturnType<ReturnType<typeof useLoginMutation>[0]>>>;\n  logout: () => Promise<void>;\n  /**\n   * @alpha\n   * @description given a list of permissions, this function checks\n   * those against the current user's permissions or those passed as\n   * the second argument, if the user has those permissions the complete\n   * permission object form the API is returned. Therefore, if the list is\n   * empty, the user does not have any of those permissions.\n   */\n  checkUserHasPermissions: (\n    permissions?: Permission[],\n    passedPermissions?: Permission[],\n    rawQueryContext?: string\n  ) => Promise<Permission[]>;\n  isLoading: boolean;\n  permissions: Permission[];\n  refetchPermissions: () => Promise<void>;\n  token: string | null;\n  user?: User;\n}\n\nconst [Provider, useAuth] = createContext<AuthContextValue>('Auth');\n\ninterface AuthProviderProps {\n  children: React.ReactNode;\n  /**\n   * @internal could be removed at any time.\n   */\n  _defaultPermissions?: Permission[];\n\n  // NOTE: this is used for testing purposed only\n  _disableRenewToken?: boolean;\n}\n\nconst STORAGE_KEYS = {\n  TOKEN: 'jwtToken',\n  STATUS: 'isLoggedIn',\n};\n\nconst AuthProvider = ({\n  children,\n  _defaultPermissions = [],\n  _disableRenewToken = false,\n}: AuthProviderProps) => {\n  const dispatch = useTypedDispatch();\n  const runRbacMiddleware = useStrapiApp('AuthProvider', (state) => state.rbac.run);\n  const location = useLocation();\n  const [{ rawQuery }] = useQueryParams();\n\n  const token = useTypedSelector((state) => state.admin_app.token ?? null);\n\n  const { data: user, isLoading: isLoadingUser } = useGetMeQuery(undefined, {\n    /**\n     * If there's no token, we don't try to fetch\n     * the user data because it will fail.\n     */\n    skip: !token,\n  });\n\n  const {\n    data: userPermissions = _defaultPermissions,\n    refetch,\n    isUninitialized,\n    isLoading: isLoadingPermissions,\n  } = useGetMyPermissionsQuery(undefined, {\n    skip: !token,\n  });\n\n  const navigate = useNavigate();\n\n  const [loginMutation] = useLoginMutation();\n  const [renewTokenMutation] = useRenewTokenMutation();\n  const [logoutMutation] = useLogoutMutation();\n\n  const clearStateAndLogout = React.useCallback(() => {\n    dispatch(adminApi.util.resetApiState());\n    dispatch(logoutAction());\n    navigate('/auth/login');\n  }, [dispatch, navigate]);\n\n  /**\n   * Fetch data from storages on mount and store it in our state.\n   * It's not normally stored in session storage unless the user\n   * does click \"remember me\" when they login. We also need to renew the token.\n   */\n  React.useEffect(() => {\n    if (token && !_disableRenewToken) {\n      renewTokenMutation({ token }).then((res) => {\n        if ('data' in res) {\n          dispatch(\n            loginAction({\n              token: res.data.token,\n            })\n          );\n        } else {\n          clearStateAndLogout();\n        }\n      });\n    }\n  }, [token, dispatch, renewTokenMutation, clearStateAndLogout, _disableRenewToken]);\n\n  React.useEffect(() => {\n    if (user) {\n      if (user.preferedLanguage) {\n        dispatch(setLocale(user.preferedLanguage));\n      }\n    }\n  }, [dispatch, user]);\n\n  React.useEffect(() => {\n    /**\n     * This will log a user out of all tabs if they log out in one tab.\n     */\n    const handleUserStorageChange = (event: StorageEvent) => {\n      if (event.key === STORAGE_KEYS.STATUS && event.newValue === null) {\n        clearStateAndLogout();\n      }\n    };\n\n    window.addEventListener('storage', handleUserStorageChange);\n\n    return () => {\n      window.removeEventListener('storage', handleUserStorageChange);\n    };\n  });\n\n  const login = React.useCallback<AuthContextValue['login']>(\n    async ({ rememberMe, ...body }) => {\n      const res = await loginMutation(body);\n\n      /**\n       * There will always be a `data` key in the response\n       * because if something fails, it will throw an error.\n       */\n      if ('data' in res) {\n        const { token } = res.data;\n\n        dispatch(\n          loginAction({\n            token,\n            persist: rememberMe,\n          })\n        );\n      }\n\n      return res;\n    },\n    [dispatch, loginMutation]\n  );\n\n  const logout = React.useCallback(async () => {\n    await logoutMutation();\n    clearStateAndLogout();\n  }, [clearStateAndLogout, logoutMutation]);\n\n  const refetchPermissions = React.useCallback(async () => {\n    if (!isUninitialized) {\n      await refetch();\n    }\n  }, [isUninitialized, refetch]);\n\n  const [checkPermissions] = useLazyCheckPermissionsQuery();\n  const checkUserHasPermissions: AuthContextValue['checkUserHasPermissions'] = React.useCallback(\n    async (\n      permissions,\n      passedPermissions,\n      // TODO:\n      // Here we have parameterised checkUserHasPermissions in order to pass\n      // query context from elsewhere in the application.\n      // See packages/core/content-manager/admin/src/features/DocumentRBAC.tsx\n\n      // This is in order to calculate permissions on accurate query params.\n      // We should be able to rely on the query params in this provider\n      // If we need to pass additional context to the RBAC middleware\n      // we should define a better context type.\n      rawQueryContext\n    ) => {\n      /**\n       * If there's no permissions to check, then we allow it to\n       * pass to preserve existing behaviours.\n       *\n       * TODO: should we review this? it feels more dangerous than useful.\n       */\n      if (!permissions || permissions.length === 0) {\n        return [{ action: '', subject: '' }];\n      }\n\n      /**\n       * Given the provided permissions, return the permissions from either passedPermissions\n       * or userPermissions as this is expected to be the full permission entity.\n       */\n      const actualUserPermissions = passedPermissions ?? userPermissions;\n\n      const matchingPermissions = actualUserPermissions.filter(\n        (permission) =>\n          permissions.findIndex(\n            (perm) =>\n              perm.action === permission.action &&\n              // Only check the subject if it's provided\n              (perm.subject == undefined || perm.subject === permission.subject)\n          ) >= 0\n      );\n\n      const middlewaredPermissions = await runRbacMiddleware(\n        {\n          user,\n          permissions: userPermissions,\n          pathname: location.pathname,\n          search: (rawQueryContext || rawQuery).split('?')[1] ?? '',\n        },\n        matchingPermissions\n      );\n\n      const shouldCheckConditions = middlewaredPermissions.some(\n        (perm) => Array.isArray(perm.conditions) && perm.conditions.length > 0\n      );\n\n      if (!shouldCheckConditions) {\n        return middlewaredPermissions;\n      }\n\n      const { data, error } = await checkPermissions({\n        permissions: middlewaredPermissions.map((perm) => ({\n          action: perm.action,\n          subject: perm.subject,\n        })),\n      });\n\n      if (error) {\n        throw error;\n      } else {\n        return middlewaredPermissions.filter((_, index) => data?.data[index] === true);\n      }\n    },\n    [checkPermissions, location.pathname, rawQuery, runRbacMiddleware, user, userPermissions]\n  );\n\n  const isLoading = isLoadingUser || isLoadingPermissions;\n\n  return (\n    <Provider\n      token={token}\n      user={user}\n      login={login}\n      logout={logout}\n      permissions={userPermissions}\n      checkUserHasPermissions={checkUserHasPermissions}\n      refetchPermissions={refetchPermissions}\n      isLoading={isLoading}\n    >\n      {children}\n    </Provider>\n  );\n};\n\nexport { AuthProvider, useAuth, STORAGE_KEYS };\nexport type { AuthContextValue, Permission, User };\n"],"names":["Provider","useAuth","createContext","STORAGE_KEYS","TOKEN","STATUS","AuthProvider","children","_defaultPermissions","_disableRenewToken","dispatch","useTypedDispatch","runRbacMiddleware","useStrapiApp","state","rbac","run","location","useLocation","rawQuery","useQueryParams","token","useTypedSelector","admin_app","data","user","isLoading","isLoadingUser","useGetMeQuery","undefined","skip","userPermissions","refetch","isUninitialized","isLoadingPermissions","useGetMyPermissionsQuery","navigate","useNavigate","loginMutation","useLoginMutation","renewTokenMutation","useRenewTokenMutation","logoutMutation","useLogoutMutation","clearStateAndLogout","React","useCallback","adminApi","util","resetApiState","logoutAction","useEffect","then","res","loginAction","preferedLanguage","setLocale","handleUserStorageChange","event","key","newValue","window","addEventListener","removeEventListener","login","rememberMe","body","persist","logout","refetchPermissions","checkPermissions","useLazyCheckPermissionsQuery","checkUserHasPermissions","permissions","passedPermissions","rawQueryContext","length","action","subject","actualUserPermissions","matchingPermissions","filter","permission","findIndex","perm","middlewaredPermissions","pathname","search","split","shouldCheckConditions","some","Array","isArray","conditions","error","map","_","index","_jsx"],"mappings":"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"}
+{"version":3,"file":"Auth.mjs","sources":["../../../../../admin/src/features/Auth.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { useLocation, useNavigate } from 'react-router-dom';\n\nimport { Login } from '../../../shared/contracts/authentication';\nimport { createContext } from '../components/Context';\nimport { useTypedDispatch, useTypedSelector } from '../core/store/hooks';\nimport { useStrapiApp } from '../features/StrapiApp';\nimport { useQueryParams } from '../hooks/useQueryParams';\nimport { login as loginAction, logout as logoutAction, setLocale } from '../reducer';\nimport { adminApi } from '../services/api';\nimport {\n  useGetMeQuery,\n  useGetMyPermissionsQuery,\n  useLazyCheckPermissionsQuery,\n  useLoginMutation,\n  useLogoutMutation,\n  useRenewTokenMutation,\n} from '../services/auth';\n\nimport type {\n  Permission as PermissionContract,\n  SanitizedAdminUser,\n} from '../../../shared/contracts/shared';\n\ninterface Permission\n  extends Pick<PermissionContract, 'action' | 'subject'>,\n    Partial<Omit<PermissionContract, 'action' | 'subject'>> {}\n\ninterface User\n  extends Pick<SanitizedAdminUser, 'email' | 'firstname' | 'lastname' | 'username' | 'roles'>,\n    Partial<Omit<SanitizedAdminUser, 'email' | 'firstname' | 'lastname' | 'username' | 'roles'>> {}\n\ninterface AuthContextValue {\n  login: (\n    body: Login.Request['body'] & { rememberMe: boolean }\n  ) => Promise<Awaited<ReturnType<ReturnType<typeof useLoginMutation>[0]>>>;\n  logout: () => Promise<void>;\n  /**\n   * @alpha\n   * @description given a list of permissions, this function checks\n   * those against the current user's permissions or those passed as\n   * the second argument, if the user has those permissions the complete\n   * permission object form the API is returned. Therefore, if the list is\n   * empty, the user does not have any of those permissions.\n   */\n  checkUserHasPermissions: (\n    permissions?: Permission[],\n    passedPermissions?: Permission[],\n    rawQueryContext?: string\n  ) => Promise<Permission[]>;\n  isLoading: boolean;\n  permissions: Permission[];\n  refetchPermissions: () => Promise<void>;\n  token: string | null;\n  user?: User;\n}\n\nconst [Provider, useAuth] = createContext<AuthContextValue>('Auth');\n\ninterface AuthProviderProps {\n  children: React.ReactNode;\n  /**\n   * @internal could be removed at any time.\n   */\n  _defaultPermissions?: Permission[];\n\n  // NOTE: this is used for testing purposed only\n  _disableRenewToken?: boolean;\n}\n\nconst STORAGE_KEYS = {\n  TOKEN: 'jwtToken',\n  STATUS: 'isLoggedIn',\n};\n\nconst AuthProvider = ({\n  children,\n  _defaultPermissions = [],\n  _disableRenewToken = false,\n}: AuthProviderProps) => {\n  const dispatch = useTypedDispatch();\n  const runRbacMiddleware = useStrapiApp('AuthProvider', (state) => state.rbac.run);\n  const location = useLocation();\n  const [{ rawQuery }] = useQueryParams();\n\n  const locationRef = React.useRef(location);\n\n  // Update ref without causing re-render\n  React.useEffect(() => {\n    locationRef.current = location;\n  }, [location]);\n\n  const token = useTypedSelector((state) => state.admin_app.token ?? null);\n\n  const { data: user, isLoading: isLoadingUser } = useGetMeQuery(undefined, {\n    /**\n     * If there's no token, we don't try to fetch\n     * the user data because it will fail.\n     */\n    skip: !token,\n  });\n\n  const {\n    data: userPermissions = _defaultPermissions,\n    refetch,\n    isUninitialized,\n    isLoading: isLoadingPermissions,\n  } = useGetMyPermissionsQuery(undefined, {\n    skip: !token,\n  });\n\n  const navigate = useNavigate();\n\n  const [loginMutation] = useLoginMutation();\n  const [renewTokenMutation] = useRenewTokenMutation();\n  const [logoutMutation] = useLogoutMutation();\n\n  const clearStateAndLogout = React.useCallback(() => {\n    dispatch(adminApi.util.resetApiState());\n    dispatch(logoutAction());\n    navigate('/auth/login');\n  }, [dispatch, navigate]);\n\n  /**\n   * Fetch data from storages on mount and store it in our state.\n   * It's not normally stored in session storage unless the user\n   * does click \"remember me\" when they login. We also need to renew the token.\n   */\n  React.useEffect(() => {\n    if (token && !_disableRenewToken) {\n      renewTokenMutation({ token }).then((res) => {\n        if ('data' in res) {\n          dispatch(\n            loginAction({\n              token: res.data.token,\n            })\n          );\n        } else {\n          clearStateAndLogout();\n        }\n      });\n    }\n  }, [token, dispatch, renewTokenMutation, clearStateAndLogout, _disableRenewToken]);\n\n  React.useEffect(() => {\n    if (user) {\n      if (user.preferedLanguage) {\n        dispatch(setLocale(user.preferedLanguage));\n      }\n    }\n  }, [dispatch, user]);\n\n  React.useEffect(() => {\n    /**\n     * This will log a user out of all tabs if they log out in one tab.\n     */\n    const handleUserStorageChange = (event: StorageEvent) => {\n      if (event.key === STORAGE_KEYS.STATUS && event.newValue === null) {\n        clearStateAndLogout();\n      }\n    };\n\n    window.addEventListener('storage', handleUserStorageChange);\n\n    return () => {\n      window.removeEventListener('storage', handleUserStorageChange);\n    };\n  });\n\n  const login = React.useCallback<AuthContextValue['login']>(\n    async ({ rememberMe, ...body }) => {\n      const res = await loginMutation(body);\n\n      /**\n       * There will always be a `data` key in the response\n       * because if something fails, it will throw an error.\n       */\n      if ('data' in res) {\n        const { token } = res.data;\n\n        dispatch(\n          loginAction({\n            token,\n            persist: rememberMe,\n          })\n        );\n      }\n\n      return res;\n    },\n    [dispatch, loginMutation]\n  );\n\n  const logout = React.useCallback(async () => {\n    await logoutMutation();\n    clearStateAndLogout();\n  }, [clearStateAndLogout, logoutMutation]);\n\n  const refetchPermissions = React.useCallback(async () => {\n    if (!isUninitialized) {\n      await refetch();\n    }\n  }, [isUninitialized, refetch]);\n\n  const [checkPermissions] = useLazyCheckPermissionsQuery();\n  const checkUserHasPermissions: AuthContextValue['checkUserHasPermissions'] = React.useCallback(\n    async (\n      permissions,\n      passedPermissions,\n      // TODO:\n      // Here we have parameterised checkUserHasPermissions in order to pass\n      // query context from elsewhere in the application.\n      // See packages/core/content-manager/admin/src/features/DocumentRBAC.tsx\n\n      // This is in order to calculate permissions on accurate query params.\n      // We should be able to rely on the query params in this provider\n      // If we need to pass additional context to the RBAC middleware\n      // we should define a better context type.\n      rawQueryContext\n    ) => {\n      /**\n       * If there's no permissions to check, then we allow it to\n       * pass to preserve existing behaviours.\n       *\n       * TODO: should we review this? it feels more dangerous than useful.\n       */\n      if (!permissions || permissions.length === 0) {\n        return [{ action: '', subject: '' }];\n      }\n\n      /**\n       * Given the provided permissions, return the permissions from either passedPermissions\n       * or userPermissions as this is expected to be the full permission entity.\n       */\n      const actualUserPermissions = passedPermissions ?? userPermissions;\n\n      const matchingPermissions = actualUserPermissions.filter(\n        (permission) =>\n          permissions.findIndex(\n            (perm) =>\n              perm.action === permission.action &&\n              // Only check the subject if it's provided\n              (perm.subject == undefined || perm.subject === permission.subject)\n          ) >= 0\n      );\n\n      const middlewaredPermissions = await runRbacMiddleware(\n        {\n          user,\n          permissions: userPermissions,\n          pathname: locationRef.current.pathname,\n          search: (rawQueryContext || rawQuery).split('?')[1] ?? '',\n        },\n        matchingPermissions\n      );\n\n      const shouldCheckConditions = middlewaredPermissions.some(\n        (perm) => Array.isArray(perm.conditions) && perm.conditions.length > 0\n      );\n\n      if (!shouldCheckConditions) {\n        return middlewaredPermissions;\n      }\n\n      const { data, error } = await checkPermissions({\n        permissions: middlewaredPermissions.map((perm) => ({\n          action: perm.action,\n          subject: perm.subject,\n        })),\n      });\n\n      if (error) {\n        throw error;\n      } else {\n        return middlewaredPermissions.filter((_, index) => data?.data[index] === true);\n      }\n    },\n    [checkPermissions, rawQuery, runRbacMiddleware, user, userPermissions]\n  );\n\n  const isLoading = isLoadingUser || isLoadingPermissions;\n\n  return (\n    <Provider\n      token={token}\n      user={user}\n      login={login}\n      logout={logout}\n      permissions={userPermissions}\n      checkUserHasPermissions={checkUserHasPermissions}\n      refetchPermissions={refetchPermissions}\n      isLoading={isLoading}\n    >\n      {children}\n    </Provider>\n  );\n};\n\nexport { AuthProvider, useAuth, STORAGE_KEYS };\nexport type { AuthContextValue, Permission, User };\n"],"names":["Provider","useAuth","createContext","STORAGE_KEYS","TOKEN","STATUS","AuthProvider","children","_defaultPermissions","_disableRenewToken","dispatch","useTypedDispatch","runRbacMiddleware","useStrapiApp","state","rbac","run","location","useLocation","rawQuery","useQueryParams","locationRef","React","useRef","useEffect","current","token","useTypedSelector","admin_app","data","user","isLoading","isLoadingUser","useGetMeQuery","undefined","skip","userPermissions","refetch","isUninitialized","isLoadingPermissions","useGetMyPermissionsQuery","navigate","useNavigate","loginMutation","useLoginMutation","renewTokenMutation","useRenewTokenMutation","logoutMutation","useLogoutMutation","clearStateAndLogout","useCallback","adminApi","util","resetApiState","logoutAction","then","res","loginAction","preferedLanguage","setLocale","handleUserStorageChange","event","key","newValue","window","addEventListener","removeEventListener","login","rememberMe","body","persist","logout","refetchPermissions","checkPermissions","useLazyCheckPermissionsQuery","checkUserHasPermissions","permissions","passedPermissions","rawQueryContext","length","action","subject","actualUserPermissions","matchingPermissions","filter","permission","findIndex","perm","middlewaredPermissions","pathname","search","split","shouldCheckConditions","some","Array","isArray","conditions","error","map","_","index","_jsx"],"mappings":"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"}

package/dist/admin/admin/src/hooks/useQueryParams.js

@@ -4,8 +4,14 @@ var React = require('react');
 var qs = require('qs');
 var reactRouterDom = require('react-router-dom');
 
-const useQueryParams = (initialParams)=>{
+const useSearch = ()=>{
     const { search } = reactRouterDom.useLocation();
+    return React.useMemo(()=>search, [
+        search
+    ]);
+};
+const useQueryParams = (initialParams)=>{
+    const search = useSearch();
     const navigate = reactRouterDom.useNavigate();
     const query = React.useMemo(()=>{
         // TODO: investigate why sometimes we're getting the search with a leading `?` and sometimes not.

package/dist/admin/admin/src/hooks/useQueryParams.js.map

@@ -1 +1 @@
-{"version":3,"file":"useQueryParams.js","sources":["../../../../../admin/src/hooks/useQueryParams.ts"],"sourcesContent":["import { useCallback, useMemo } from 'react';\n\nimport { parse, stringify } from 'qs';\nimport { useNavigate, useLocation } from 'react-router-dom';\n\nconst useQueryParams = <TQuery extends object>(initialParams?: TQuery) => {\n  const { search } = useLocation();\n  const navigate = useNavigate();\n\n  const query = useMemo(() => {\n    // TODO: investigate why sometimes we're getting the search with a leading `?` and sometimes not.\n    const searchQuery = search.startsWith('?') ? search.slice(1) : search;\n    if (!search && initialParams) {\n      return initialParams;\n    }\n\n    return { ...initialParams, ...parse(searchQuery) } as TQuery;\n  }, [search, initialParams]);\n\n  const setQuery = useCallback(\n    (nextParams: TQuery, method: 'push' | 'remove' = 'push', replace = false) => {\n      let nextQuery = { ...query };\n\n      if (method === 'remove') {\n        Object.keys(nextParams).forEach((key) => {\n          if (Object.prototype.hasOwnProperty.call(nextQuery, key)) {\n            // @ts-expect-error – this is fine, if you want to fix it, please do.\n            delete nextQuery[key];\n          }\n        });\n      } else {\n        nextQuery = { ...query, ...nextParams };\n      }\n\n      navigate({ search: stringify(nextQuery, { encode: false }) }, { replace });\n    },\n    [navigate, query]\n  );\n\n  return [{ query, rawQuery: search }, setQuery] as const;\n};\n\nexport { useQueryParams };\n"],"names":["useQueryParams","initialParams","search","useLocation","navigate","useNavigate","query","useMemo","searchQuery","startsWith","slice","parse","setQuery","useCallback","nextParams","method","replace","nextQuery","Object","keys","forEach","key","prototype","hasOwnProperty","call","stringify","encode","rawQuery"],"mappings":";;;;;;AAKA,MAAMA,iBAAiB,CAAwBC,aAAAA,GAAAA;IAC7C,MAAM,EAAEC,MAAM,EAAE,GAAGC,0BAAAA,EAAAA;AACnB,IAAA,MAAMC,QAAWC,GAAAA,0BAAAA,EAAAA;AAEjB,IAAA,MAAMC,QAAQC,aAAQ,CAAA,IAAA;;QAEpB,MAAMC,WAAAA,GAAcN,OAAOO,UAAU,CAAC,OAAOP,MAAOQ,CAAAA,KAAK,CAAC,CAAKR,CAAAA,GAAAA,MAAAA;QAC/D,IAAI,CAACA,UAAUD,aAAe,EAAA;YAC5B,OAAOA,aAAAA;AACT;QAEA,OAAO;AAAE,YAAA,GAAGA,aAAa;AAAE,YAAA,GAAGU,SAAMH,WAAY;AAAC,SAAA;KAChD,EAAA;AAACN,QAAAA,MAAAA;AAAQD,QAAAA;AAAc,KAAA,CAAA;IAE1B,MAAMW,QAAAA,GAAWC,kBACf,CAACC,UAAAA,EAAoBC,SAA4B,MAAM,EAAEC,UAAU,KAAK,GAAA;AACtE,QAAA,IAAIC,SAAY,GAAA;AAAE,YAAA,GAAGX;AAAM,SAAA;AAE3B,QAAA,IAAIS,WAAW,QAAU,EAAA;AACvBG,YAAAA,MAAAA,CAAOC,IAAI,CAACL,UAAYM,CAAAA,CAAAA,OAAO,CAAC,CAACC,GAAAA,GAAAA;gBAC/B,IAAIH,MAAAA,CAAOI,SAAS,CAACC,cAAc,CAACC,IAAI,CAACP,WAAWI,GAAM,CAAA,EAAA;;oBAExD,OAAOJ,SAAS,CAACI,GAAI,CAAA;AACvB;AACF,aAAA,CAAA;SACK,MAAA;YACLJ,SAAY,GAAA;AAAE,gBAAA,GAAGX,KAAK;AAAE,gBAAA,GAAGQ;AAAW,aAAA;AACxC;QAEAV,QAAS,CAAA;AAAEF,YAAAA,MAAAA,EAAQuB,aAAUR,SAAW,EAAA;gBAAES,MAAQ,EAAA;AAAM,aAAA;SAAM,EAAA;AAAEV,YAAAA;AAAQ,SAAA,CAAA;KAE1E,EAAA;AAACZ,QAAAA,QAAAA;AAAUE,QAAAA;AAAM,KAAA,CAAA;IAGnB,OAAO;AAAC,QAAA;AAAEA,YAAAA,KAAAA;YAAOqB,QAAUzB,EAAAA;AAAO,SAAA;AAAGU,QAAAA;AAAS,KAAA;AAChD;;;;"}
+{"version":3,"file":"useQueryParams.js","sources":["../../../../../admin/src/hooks/useQueryParams.ts"],"sourcesContent":["import { useCallback, useMemo } from 'react';\n\nimport { parse, stringify } from 'qs';\nimport { useNavigate, useLocation } from 'react-router-dom';\n\nconst useSearch = () => {\n  const { search } = useLocation();\n\n  return useMemo(() => search, [search]);\n};\n\nconst useQueryParams = <TQuery extends object>(initialParams?: TQuery) => {\n  const search = useSearch();\n  const navigate = useNavigate();\n\n  const query = useMemo(() => {\n    // TODO: investigate why sometimes we're getting the search with a leading `?` and sometimes not.\n    const searchQuery = search.startsWith('?') ? search.slice(1) : search;\n    if (!search && initialParams) {\n      return initialParams;\n    }\n\n    return { ...initialParams, ...parse(searchQuery) } as TQuery;\n  }, [search, initialParams]);\n\n  const setQuery = useCallback(\n    (nextParams: TQuery, method: 'push' | 'remove' = 'push', replace = false) => {\n      let nextQuery = { ...query };\n\n      if (method === 'remove') {\n        Object.keys(nextParams).forEach((key) => {\n          if (Object.prototype.hasOwnProperty.call(nextQuery, key)) {\n            // @ts-expect-error – this is fine, if you want to fix it, please do.\n            delete nextQuery[key];\n          }\n        });\n      } else {\n        nextQuery = { ...query, ...nextParams };\n      }\n\n      navigate({ search: stringify(nextQuery, { encode: false }) }, { replace });\n    },\n    [navigate, query]\n  );\n\n  return [{ query, rawQuery: search }, setQuery] as const;\n};\n\nexport { useQueryParams };\n"],"names":["useSearch","search","useLocation","useMemo","useQueryParams","initialParams","navigate","useNavigate","query","searchQuery","startsWith","slice","parse","setQuery","useCallback","nextParams","method","replace","nextQuery","Object","keys","forEach","key","prototype","hasOwnProperty","call","stringify","encode","rawQuery"],"mappings":";;;;;;AAKA,MAAMA,SAAY,GAAA,IAAA;IAChB,MAAM,EAAEC,MAAM,EAAE,GAAGC,0BAAAA,EAAAA;IAEnB,OAAOC,aAAAA,CAAQ,IAAMF,MAAQ,EAAA;AAACA,QAAAA;AAAO,KAAA,CAAA;AACvC,CAAA;AAEA,MAAMG,iBAAiB,CAAwBC,aAAAA,GAAAA;AAC7C,IAAA,MAAMJ,MAASD,GAAAA,SAAAA,EAAAA;AACf,IAAA,MAAMM,QAAWC,GAAAA,0BAAAA,EAAAA;AAEjB,IAAA,MAAMC,QAAQL,aAAQ,CAAA,IAAA;;QAEpB,MAAMM,WAAAA,GAAcR,OAAOS,UAAU,CAAC,OAAOT,MAAOU,CAAAA,KAAK,CAAC,CAAKV,CAAAA,GAAAA,MAAAA;QAC/D,IAAI,CAACA,UAAUI,aAAe,EAAA;YAC5B,OAAOA,aAAAA;AACT;QAEA,OAAO;AAAE,YAAA,GAAGA,aAAa;AAAE,YAAA,GAAGO,SAAMH,WAAY;AAAC,SAAA;KAChD,EAAA;AAACR,QAAAA,MAAAA;AAAQI,QAAAA;AAAc,KAAA,CAAA;IAE1B,MAAMQ,QAAAA,GAAWC,kBACf,CAACC,UAAAA,EAAoBC,SAA4B,MAAM,EAAEC,UAAU,KAAK,GAAA;AACtE,QAAA,IAAIC,SAAY,GAAA;AAAE,YAAA,GAAGV;AAAM,SAAA;AAE3B,QAAA,IAAIQ,WAAW,QAAU,EAAA;AACvBG,YAAAA,MAAAA,CAAOC,IAAI,CAACL,UAAYM,CAAAA,CAAAA,OAAO,CAAC,CAACC,GAAAA,GAAAA;gBAC/B,IAAIH,MAAAA,CAAOI,SAAS,CAACC,cAAc,CAACC,IAAI,CAACP,WAAWI,GAAM,CAAA,EAAA;;oBAExD,OAAOJ,SAAS,CAACI,GAAI,CAAA;AACvB;AACF,aAAA,CAAA;SACK,MAAA;YACLJ,SAAY,GAAA;AAAE,gBAAA,GAAGV,KAAK;AAAE,gBAAA,GAAGO;AAAW,aAAA;AACxC;QAEAT,QAAS,CAAA;AAAEL,YAAAA,MAAAA,EAAQyB,aAAUR,SAAW,EAAA;gBAAES,MAAQ,EAAA;AAAM,aAAA;SAAM,EAAA;AAAEV,YAAAA;AAAQ,SAAA,CAAA;KAE1E,EAAA;AAACX,QAAAA,QAAAA;AAAUE,QAAAA;AAAM,KAAA,CAAA;IAGnB,OAAO;AAAC,QAAA;AAAEA,YAAAA,KAAAA;YAAOoB,QAAU3B,EAAAA;AAAO,SAAA;AAAGY,QAAAA;AAAS,KAAA;AAChD;;;;"}

package/dist/admin/admin/src/hooks/useQueryParams.mjs

@@ -1,9 +1,15 @@
 import { useMemo, useCallback } from 'react';
 import { parse, stringify } from 'qs';
-import { useLocation, useNavigate } from 'react-router-dom';
+import { useNavigate, useLocation } from 'react-router-dom';
 
-const useQueryParams = (initialParams)=>{
+const useSearch = ()=>{
     const { search } = useLocation();
+    return useMemo(()=>search, [
+        search
+    ]);
+};
+const useQueryParams = (initialParams)=>{
+    const search = useSearch();
     const navigate = useNavigate();
     const query = useMemo(()=>{
         // TODO: investigate why sometimes we're getting the search with a leading `?` and sometimes not.

package/dist/admin/admin/src/hooks/useQueryParams.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"useQueryParams.mjs","sources":["../../../../../admin/src/hooks/useQueryParams.ts"],"sourcesContent":["import { useCallback, useMemo } from 'react';\n\nimport { parse, stringify } from 'qs';\nimport { useNavigate, useLocation } from 'react-router-dom';\n\nconst useQueryParams = <TQuery extends object>(initialParams?: TQuery) => {\n  const { search } = useLocation();\n  const navigate = useNavigate();\n\n  const query = useMemo(() => {\n    // TODO: investigate why sometimes we're getting the search with a leading `?` and sometimes not.\n    const searchQuery = search.startsWith('?') ? search.slice(1) : search;\n    if (!search && initialParams) {\n      return initialParams;\n    }\n\n    return { ...initialParams, ...parse(searchQuery) } as TQuery;\n  }, [search, initialParams]);\n\n  const setQuery = useCallback(\n    (nextParams: TQuery, method: 'push' | 'remove' = 'push', replace = false) => {\n      let nextQuery = { ...query };\n\n      if (method === 'remove') {\n        Object.keys(nextParams).forEach((key) => {\n          if (Object.prototype.hasOwnProperty.call(nextQuery, key)) {\n            // @ts-expect-error – this is fine, if you want to fix it, please do.\n            delete nextQuery[key];\n          }\n        });\n      } else {\n        nextQuery = { ...query, ...nextParams };\n      }\n\n      navigate({ search: stringify(nextQuery, { encode: false }) }, { replace });\n    },\n    [navigate, query]\n  );\n\n  return [{ query, rawQuery: search }, setQuery] as const;\n};\n\nexport { useQueryParams };\n"],"names":["useQueryParams","initialParams","search","useLocation","navigate","useNavigate","query","useMemo","searchQuery","startsWith","slice","parse","setQuery","useCallback","nextParams","method","replace","nextQuery","Object","keys","forEach","key","prototype","hasOwnProperty","call","stringify","encode","rawQuery"],"mappings":";;;;AAKA,MAAMA,iBAAiB,CAAwBC,aAAAA,GAAAA;IAC7C,MAAM,EAAEC,MAAM,EAAE,GAAGC,WAAAA,EAAAA;AACnB,IAAA,MAAMC,QAAWC,GAAAA,WAAAA,EAAAA;AAEjB,IAAA,MAAMC,QAAQC,OAAQ,CAAA,IAAA;;QAEpB,MAAMC,WAAAA,GAAcN,OAAOO,UAAU,CAAC,OAAOP,MAAOQ,CAAAA,KAAK,CAAC,CAAKR,CAAAA,GAAAA,MAAAA;QAC/D,IAAI,CAACA,UAAUD,aAAe,EAAA;YAC5B,OAAOA,aAAAA;AACT;QAEA,OAAO;AAAE,YAAA,GAAGA,aAAa;AAAE,YAAA,GAAGU,MAAMH,WAAY;AAAC,SAAA;KAChD,EAAA;AAACN,QAAAA,MAAAA;AAAQD,QAAAA;AAAc,KAAA,CAAA;IAE1B,MAAMW,QAAAA,GAAWC,YACf,CAACC,UAAAA,EAAoBC,SAA4B,MAAM,EAAEC,UAAU,KAAK,GAAA;AACtE,QAAA,IAAIC,SAAY,GAAA;AAAE,YAAA,GAAGX;AAAM,SAAA;AAE3B,QAAA,IAAIS,WAAW,QAAU,EAAA;AACvBG,YAAAA,MAAAA,CAAOC,IAAI,CAACL,UAAYM,CAAAA,CAAAA,OAAO,CAAC,CAACC,GAAAA,GAAAA;gBAC/B,IAAIH,MAAAA,CAAOI,SAAS,CAACC,cAAc,CAACC,IAAI,CAACP,WAAWI,GAAM,CAAA,EAAA;;oBAExD,OAAOJ,SAAS,CAACI,GAAI,CAAA;AACvB;AACF,aAAA,CAAA;SACK,MAAA;YACLJ,SAAY,GAAA;AAAE,gBAAA,GAAGX,KAAK;AAAE,gBAAA,GAAGQ;AAAW,aAAA;AACxC;QAEAV,QAAS,CAAA;AAAEF,YAAAA,MAAAA,EAAQuB,UAAUR,SAAW,EAAA;gBAAES,MAAQ,EAAA;AAAM,aAAA;SAAM,EAAA;AAAEV,YAAAA;AAAQ,SAAA,CAAA;KAE1E,EAAA;AAACZ,QAAAA,QAAAA;AAAUE,QAAAA;AAAM,KAAA,CAAA;IAGnB,OAAO;AAAC,QAAA;AAAEA,YAAAA,KAAAA;YAAOqB,QAAUzB,EAAAA;AAAO,SAAA;AAAGU,QAAAA;AAAS,KAAA;AAChD;;;;"}
+{"version":3,"file":"useQueryParams.mjs","sources":["../../../../../admin/src/hooks/useQueryParams.ts"],"sourcesContent":["import { useCallback, useMemo } from 'react';\n\nimport { parse, stringify } from 'qs';\nimport { useNavigate, useLocation } from 'react-router-dom';\n\nconst useSearch = () => {\n  const { search } = useLocation();\n\n  return useMemo(() => search, [search]);\n};\n\nconst useQueryParams = <TQuery extends object>(initialParams?: TQuery) => {\n  const search = useSearch();\n  const navigate = useNavigate();\n\n  const query = useMemo(() => {\n    // TODO: investigate why sometimes we're getting the search with a leading `?` and sometimes not.\n    const searchQuery = search.startsWith('?') ? search.slice(1) : search;\n    if (!search && initialParams) {\n      return initialParams;\n    }\n\n    return { ...initialParams, ...parse(searchQuery) } as TQuery;\n  }, [search, initialParams]);\n\n  const setQuery = useCallback(\n    (nextParams: TQuery, method: 'push' | 'remove' = 'push', replace = false) => {\n      let nextQuery = { ...query };\n\n      if (method === 'remove') {\n        Object.keys(nextParams).forEach((key) => {\n          if (Object.prototype.hasOwnProperty.call(nextQuery, key)) {\n            // @ts-expect-error – this is fine, if you want to fix it, please do.\n            delete nextQuery[key];\n          }\n        });\n      } else {\n        nextQuery = { ...query, ...nextParams };\n      }\n\n      navigate({ search: stringify(nextQuery, { encode: false }) }, { replace });\n    },\n    [navigate, query]\n  );\n\n  return [{ query, rawQuery: search }, setQuery] as const;\n};\n\nexport { useQueryParams };\n"],"names":["useSearch","search","useLocation","useMemo","useQueryParams","initialParams","navigate","useNavigate","query","searchQuery","startsWith","slice","parse","setQuery","useCallback","nextParams","method","replace","nextQuery","Object","keys","forEach","key","prototype","hasOwnProperty","call","stringify","encode","rawQuery"],"mappings":";;;;AAKA,MAAMA,SAAY,GAAA,IAAA;IAChB,MAAM,EAAEC,MAAM,EAAE,GAAGC,WAAAA,EAAAA;IAEnB,OAAOC,OAAAA,CAAQ,IAAMF,MAAQ,EAAA;AAACA,QAAAA;AAAO,KAAA,CAAA;AACvC,CAAA;AAEA,MAAMG,iBAAiB,CAAwBC,aAAAA,GAAAA;AAC7C,IAAA,MAAMJ,MAASD,GAAAA,SAAAA,EAAAA;AACf,IAAA,MAAMM,QAAWC,GAAAA,WAAAA,EAAAA;AAEjB,IAAA,MAAMC,QAAQL,OAAQ,CAAA,IAAA;;QAEpB,MAAMM,WAAAA,GAAcR,OAAOS,UAAU,CAAC,OAAOT,MAAOU,CAAAA,KAAK,CAAC,CAAKV,CAAAA,GAAAA,MAAAA;QAC/D,IAAI,CAACA,UAAUI,aAAe,EAAA;YAC5B,OAAOA,aAAAA;AACT;QAEA,OAAO;AAAE,YAAA,GAAGA,aAAa;AAAE,YAAA,GAAGO,MAAMH,WAAY;AAAC,SAAA;KAChD,EAAA;AAACR,QAAAA,MAAAA;AAAQI,QAAAA;AAAc,KAAA,CAAA;IAE1B,MAAMQ,QAAAA,GAAWC,YACf,CAACC,UAAAA,EAAoBC,SAA4B,MAAM,EAAEC,UAAU,KAAK,GAAA;AACtE,QAAA,IAAIC,SAAY,GAAA;AAAE,YAAA,GAAGV;AAAM,SAAA;AAE3B,QAAA,IAAIQ,WAAW,QAAU,EAAA;AACvBG,YAAAA,MAAAA,CAAOC,IAAI,CAACL,UAAYM,CAAAA,CAAAA,OAAO,CAAC,CAACC,GAAAA,GAAAA;gBAC/B,IAAIH,MAAAA,CAAOI,SAAS,CAACC,cAAc,CAACC,IAAI,CAACP,WAAWI,GAAM,CAAA,EAAA;;oBAExD,OAAOJ,SAAS,CAACI,GAAI,CAAA;AACvB;AACF,aAAA,CAAA;SACK,MAAA;YACLJ,SAAY,GAAA;AAAE,gBAAA,GAAGV,KAAK;AAAE,gBAAA,GAAGO;AAAW,aAAA;AACxC;QAEAT,QAAS,CAAA;AAAEL,YAAAA,MAAAA,EAAQyB,UAAUR,SAAW,EAAA;gBAAES,MAAQ,EAAA;AAAM,aAAA;SAAM,EAAA;AAAEV,YAAAA;AAAQ,SAAA,CAAA;KAE1E,EAAA;AAACX,QAAAA,QAAAA;AAAUE,QAAAA;AAAM,KAAA,CAAA;IAGnB,OAAO;AAAC,QAAA;AAAEA,YAAAA,KAAAA;YAAOoB,QAAU3B,EAAAA;AAAO,SAAA;AAAGY,QAAAA;AAAS,KAAA;AAChD;;;;"}

package/dist/admin/admin/src/pages/Settings/components/SettingsNav.js

@@ -6,22 +6,13 @@ var icons = require('@strapi/icons');
 var reactIntl = require('react-intl');
 var reactRouterDom = require('react-router-dom');
 var styledComponents = require('styled-components');
+var SubNav = require('../../../components/SubNav.js');
 var Tracking = require('../../../features/Tracking.js');
 
-const CustomIcon = styledComponents.styled(icons.Lightning)`
-  right: 15px;
-  position: absolute;
-  bottom: 50%;
-  transform: translateY(50%);
-
-  path {
-    fill: ${({ theme })=>theme.colors.warning500};
-  }
-`;
-const Link = styledComponents.styled(designSystem.SubNavLink)`
-  &.active ${CustomIcon} {
-    right: 13px;
-  }
+const StyledBadge = styledComponents.styled(designSystem.Badge)`
+  border-radius: 50%;
+  padding: ${({ theme })=>theme.spaces[2]};
+  height: 2rem;
 `;
 const SettingsNav = ({ menu })=>{
     const { formatMessage } = reactIntl.useIntl();
@@ -51,29 +42,39 @@ const SettingsNav = ({ menu })=>{
                 to: destination
             });
         };
-    return /*#__PURE__*/ jsxRuntime.jsxs(designSystem.SubNav, {
+    return /*#__PURE__*/ jsxRuntime.jsxs(SubNav.SubNav.Main, {
         "aria-label": label,
         children: [
-            /*#__PURE__*/ jsxRuntime.jsx(designSystem.SubNavHeader, {
+            /*#__PURE__*/ jsxRuntime.jsx(SubNav.SubNav.Header, {
                 label: label
             }),
-            /*#__PURE__*/ jsxRuntime.jsx(designSystem.SubNavSections, {
-                children: sections.map((section)=>/*#__PURE__*/ jsxRuntime.jsx(designSystem.SubNavSection, {
+            /*#__PURE__*/ jsxRuntime.jsx(designSystem.Divider, {
+                background: "neutral150",
+                marginBottom: 5
+            }),
+            /*#__PURE__*/ jsxRuntime.jsx(SubNav.SubNav.Sections, {
+                children: sections.map((section)=>/*#__PURE__*/ jsxRuntime.jsx(SubNav.SubNav.Section, {
                         label: formatMessage(section.intlLabel),
                         children: section.links.map((link)=>{
-                            return /*#__PURE__*/ jsxRuntime.jsxs(Link, {
-                                tag: reactRouterDom.NavLink,
-                                withBullet: link.hasNotification,
+                            return /*#__PURE__*/ jsxRuntime.jsx(SubNav.SubNav.Link, {
                                 to: link.to,
                                 onClick: handleClickOnLink(link.to),
-                                position: "relative",
-                                children: [
-                                    formatMessage(link.intlLabel),
-                                    link?.licenseOnly && /*#__PURE__*/ jsxRuntime.jsx(CustomIcon, {
-                                        width: "1.5rem",
-                                        height: "1.5rem"
-                                    })
-                                ]
+                                label: formatMessage(link.intlLabel),
+                                endAction: /*#__PURE__*/ jsxRuntime.jsxs(jsxRuntime.Fragment, {
+                                    children: [
+                                        link?.licenseOnly && /*#__PURE__*/ jsxRuntime.jsx(icons.Lightning, {
+                                            fill: "warning500",
+                                            width: "1.5rem",
+                                            height: "1.5rem"
+                                        }),
+                                        link?.hasNotification && /*#__PURE__*/ jsxRuntime.jsx(StyledBadge, {
+                                            "aria-label": "Notification",
+                                            backgroundColor: "primary600",
+                                            textColor: "neutral0",
+                                            children: "1"
+                                        })
+                                    ]
+                                })
                             }, link.id);
                         })
                     }, section.id))

package/dist/admin/admin/src/pages/Settings/components/SettingsNav.js.map

@@ -1 +1 @@
-{"version":3,"file":"SettingsNav.js","sources":["../../../../../../../admin/src/pages/Settings/components/SettingsNav.tsx"],"sourcesContent":["import {\n  SubNav,\n  SubNavHeader,\n  SubNavLink,\n  SubNavSection,\n  SubNavSections,\n} from '@strapi/design-system';\nimport { Lightning } from '@strapi/icons';\nimport { useIntl } from 'react-intl';\nimport { NavLink, useLocation } from 'react-router-dom';\nimport { styled } from 'styled-components';\n\nimport { useTracking } from '../../../features/Tracking';\nimport { SettingsMenu } from '../../../hooks/useSettingsMenu';\n\nconst CustomIcon = styled(Lightning)`\n  right: 15px;\n  position: absolute;\n  bottom: 50%;\n  transform: translateY(50%);\n\n  path {\n    fill: ${({ theme }) => theme.colors.warning500};\n  }\n`;\n\nconst Link = styled(SubNavLink)`\n  &.active ${CustomIcon} {\n    right: 13px;\n  }\n`;\n\ninterface SettingsNavProps {\n  menu: SettingsMenu;\n}\n\nconst SettingsNav = ({ menu }: SettingsNavProps) => {\n  const { formatMessage } = useIntl();\n  const { trackUsage } = useTracking();\n  const { pathname } = useLocation();\n\n  const filteredMenu = menu.filter(\n    (section) => !section.links.every((link) => link.isDisplayed === false)\n  );\n\n  const sections = filteredMenu.map((section) => {\n    return {\n      ...section,\n      title: section.intlLabel,\n      links: section.links.map((link) => {\n        return {\n          ...link,\n          title: link.intlLabel,\n          name: link.id,\n        };\n      }),\n    };\n  });\n\n  const label = formatMessage({\n    id: 'global.settings',\n    defaultMessage: 'Settings',\n  });\n\n  const handleClickOnLink = (destination: string) => () => {\n    trackUsage('willNavigate', { from: pathname, to: destination });\n  };\n\n  return (\n    <SubNav aria-label={label}>\n      <SubNavHeader label={label} />\n      <SubNavSections>\n        {sections.map((section) => (\n          <SubNavSection key={section.id} label={formatMessage(section.intlLabel)}>\n            {section.links.map((link) => {\n              return (\n                <Link\n                  tag={NavLink}\n                  withBullet={link.hasNotification}\n                  to={link.to}\n                  onClick={handleClickOnLink(link.to)}\n                  key={link.id}\n                  position=\"relative\"\n                >\n                  {formatMessage(link.intlLabel)}\n                  {link?.licenseOnly && <CustomIcon width=\"1.5rem\" height=\"1.5rem\" />}\n                </Link>\n              );\n            })}\n          </SubNavSection>\n        ))}\n      </SubNavSections>\n    </SubNav>\n  );\n};\n\nexport { SettingsNav };\nexport type { SettingsNavProps };\n"],"names":["CustomIcon","styled","Lightning","theme","colors","warning500","Link","SubNavLink","SettingsNav","menu","formatMessage","useIntl","trackUsage","useTracking","pathname","useLocation","filteredMenu","filter","section","links","every","link","isDisplayed","sections","map","title","intlLabel","name","id","label","defaultMessage","handleClickOnLink","destination","from","to","_jsxs","SubNav","aria-label","_jsx","SubNavHeader","SubNavSections","SubNavSection","tag","NavLink","withBullet","hasNotification","onClick","position","licenseOnly","width","height"],"mappings":"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"}
+{"version":3,"file":"SettingsNav.js","sources":["../../../../../../../admin/src/pages/Settings/components/SettingsNav.tsx"],"sourcesContent":["import { Badge, Divider } from '@strapi/design-system';\nimport { Lightning } from '@strapi/icons';\nimport { useIntl } from 'react-intl';\nimport { useLocation } from 'react-router-dom';\nimport { styled } from 'styled-components';\n\nimport { SubNav } from '../../../components/SubNav';\nimport { useTracking } from '../../../features/Tracking';\nimport { SettingsMenu } from '../../../hooks/useSettingsMenu';\n\ninterface SettingsNavProps {\n  menu: SettingsMenu;\n}\n\nconst StyledBadge = styled(Badge)`\n  border-radius: 50%;\n  padding: ${({ theme }) => theme.spaces[2]};\n  height: 2rem;\n`;\n\nconst SettingsNav = ({ menu }: SettingsNavProps) => {\n  const { formatMessage } = useIntl();\n  const { trackUsage } = useTracking();\n  const { pathname } = useLocation();\n\n  const filteredMenu = menu.filter(\n    (section) => !section.links.every((link) => link.isDisplayed === false)\n  );\n\n  const sections = filteredMenu.map((section) => {\n    return {\n      ...section,\n      title: section.intlLabel,\n      links: section.links.map((link) => {\n        return {\n          ...link,\n          title: link.intlLabel,\n          name: link.id,\n        };\n      }),\n    };\n  });\n\n  const label = formatMessage({\n    id: 'global.settings',\n    defaultMessage: 'Settings',\n  });\n\n  const handleClickOnLink = (destination: string) => () => {\n    trackUsage('willNavigate', { from: pathname, to: destination });\n  };\n\n  return (\n    <SubNav.Main aria-label={label}>\n      <SubNav.Header label={label} />\n      <Divider background=\"neutral150\" marginBottom={5} />\n      <SubNav.Sections>\n        {sections.map((section) => (\n          <SubNav.Section key={section.id} label={formatMessage(section.intlLabel)}>\n            {section.links.map((link) => {\n              return (\n                <SubNav.Link\n                  to={link.to}\n                  onClick={handleClickOnLink(link.to)}\n                  key={link.id}\n                  label={formatMessage(link.intlLabel)}\n                  endAction={\n                    <>\n                      {link?.licenseOnly && (\n                        <Lightning fill=\"warning500\" width=\"1.5rem\" height=\"1.5rem\" />\n                      )}\n                      {link?.hasNotification && (\n                        <StyledBadge\n                          aria-label=\"Notification\"\n                          backgroundColor=\"primary600\"\n                          textColor=\"neutral0\"\n                        >\n                          1\n                        </StyledBadge>\n                      )}\n                    </>\n                  }\n                />\n              );\n            })}\n          </SubNav.Section>\n        ))}\n      </SubNav.Sections>\n    </SubNav.Main>\n  );\n};\n\nexport { SettingsNav };\nexport type { SettingsNavProps };\n"],"names":["StyledBadge","styled","Badge","theme","spaces","SettingsNav","menu","formatMessage","useIntl","trackUsage","useTracking","pathname","useLocation","filteredMenu","filter","section","links","every","link","isDisplayed","sections","map","title","intlLabel","name","id","label","defaultMessage","handleClickOnLink","destination","from","to","_jsxs","SubNav","Main","aria-label","_jsx","Header","Divider","background","marginBottom","Sections","Section","Link","onClick","endAction","_Fragment","licenseOnly","Lightning","fill","width","height","hasNotification","backgroundColor","textColor"],"mappings":"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"}

package/dist/admin/admin/src/pages/Settings/components/SettingsNav.mjs

@@ -1,25 +1,16 @@
-import { jsxs, jsx } from 'react/jsx-runtime';
-import { SubNavLink, SubNav, SubNavHeader, SubNavSections, SubNavSection } from '@strapi/design-system';
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+import { Badge, Divider } from '@strapi/design-system';
 import { Lightning } from '@strapi/icons';
 import { useIntl } from 'react-intl';
-import { useLocation, NavLink } from 'react-router-dom';
+import { useLocation } from 'react-router-dom';
 import { styled } from 'styled-components';
+import { SubNav } from '../../../components/SubNav.mjs';
 import { useTracking } from '../../../features/Tracking.mjs';
 
-const CustomIcon = styled(Lightning)`
-  right: 15px;
-  position: absolute;
-  bottom: 50%;
-  transform: translateY(50%);
-
-  path {
-    fill: ${({ theme })=>theme.colors.warning500};
-  }
-`;
-const Link = styled(SubNavLink)`
-  &.active ${CustomIcon} {
-    right: 13px;
-  }
+const StyledBadge = styled(Badge)`
+  border-radius: 50%;
+  padding: ${({ theme })=>theme.spaces[2]};
+  height: 2rem;
 `;
 const SettingsNav = ({ menu })=>{
     const { formatMessage } = useIntl();
@@ -49,29 +40,39 @@ const SettingsNav = ({ menu })=>{
                 to: destination
             });
         };
-    return /*#__PURE__*/ jsxs(SubNav, {
+    return /*#__PURE__*/ jsxs(SubNav.Main, {
         "aria-label": label,
         children: [
-            /*#__PURE__*/ jsx(SubNavHeader, {
+            /*#__PURE__*/ jsx(SubNav.Header, {
                 label: label
             }),
-            /*#__PURE__*/ jsx(SubNavSections, {
-                children: sections.map((section)=>/*#__PURE__*/ jsx(SubNavSection, {
+            /*#__PURE__*/ jsx(Divider, {
+                background: "neutral150",
+                marginBottom: 5
+            }),
+            /*#__PURE__*/ jsx(SubNav.Sections, {
+                children: sections.map((section)=>/*#__PURE__*/ jsx(SubNav.Section, {
                         label: formatMessage(section.intlLabel),
                         children: section.links.map((link)=>{
-                            return /*#__PURE__*/ jsxs(Link, {
-                                tag: NavLink,
-                                withBullet: link.hasNotification,
+                            return /*#__PURE__*/ jsx(SubNav.Link, {
                                 to: link.to,
                                 onClick: handleClickOnLink(link.to),
-                                position: "relative",
-                                children: [
-                                    formatMessage(link.intlLabel),
-                                    link?.licenseOnly && /*#__PURE__*/ jsx(CustomIcon, {
-                                        width: "1.5rem",
-                                        height: "1.5rem"
-                                    })
-                                ]
+                                label: formatMessage(link.intlLabel),
+                                endAction: /*#__PURE__*/ jsxs(Fragment, {
+                                    children: [
+                                        link?.licenseOnly && /*#__PURE__*/ jsx(Lightning, {
+                                            fill: "warning500",
+                                            width: "1.5rem",
+                                            height: "1.5rem"
+                                        }),
+                                        link?.hasNotification && /*#__PURE__*/ jsx(StyledBadge, {
+                                            "aria-label": "Notification",
+                                            backgroundColor: "primary600",
+                                            textColor: "neutral0",
+                                            children: "1"
+                                        })
+                                    ]
+                                })
                             }, link.id);
                         })
                     }, section.id))

package/dist/admin/admin/src/pages/Settings/components/SettingsNav.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"SettingsNav.mjs","sources":["../../../../../../../admin/src/pages/Settings/components/SettingsNav.tsx"],"sourcesContent":["import {\n  SubNav,\n  SubNavHeader,\n  SubNavLink,\n  SubNavSection,\n  SubNavSections,\n} from '@strapi/design-system';\nimport { Lightning } from '@strapi/icons';\nimport { useIntl } from 'react-intl';\nimport { NavLink, useLocation } from 'react-router-dom';\nimport { styled } from 'styled-components';\n\nimport { useTracking } from '../../../features/Tracking';\nimport { SettingsMenu } from '../../../hooks/useSettingsMenu';\n\nconst CustomIcon = styled(Lightning)`\n  right: 15px;\n  position: absolute;\n  bottom: 50%;\n  transform: translateY(50%);\n\n  path {\n    fill: ${({ theme }) => theme.colors.warning500};\n  }\n`;\n\nconst Link = styled(SubNavLink)`\n  &.active ${CustomIcon} {\n    right: 13px;\n  }\n`;\n\ninterface SettingsNavProps {\n  menu: SettingsMenu;\n}\n\nconst SettingsNav = ({ menu }: SettingsNavProps) => {\n  const { formatMessage } = useIntl();\n  const { trackUsage } = useTracking();\n  const { pathname } = useLocation();\n\n  const filteredMenu = menu.filter(\n    (section) => !section.links.every((link) => link.isDisplayed === false)\n  );\n\n  const sections = filteredMenu.map((section) => {\n    return {\n      ...section,\n      title: section.intlLabel,\n      links: section.links.map((link) => {\n        return {\n          ...link,\n          title: link.intlLabel,\n          name: link.id,\n        };\n      }),\n    };\n  });\n\n  const label = formatMessage({\n    id: 'global.settings',\n    defaultMessage: 'Settings',\n  });\n\n  const handleClickOnLink = (destination: string) => () => {\n    trackUsage('willNavigate', { from: pathname, to: destination });\n  };\n\n  return (\n    <SubNav aria-label={label}>\n      <SubNavHeader label={label} />\n      <SubNavSections>\n        {sections.map((section) => (\n          <SubNavSection key={section.id} label={formatMessage(section.intlLabel)}>\n            {section.links.map((link) => {\n              return (\n                <Link\n                  tag={NavLink}\n                  withBullet={link.hasNotification}\n                  to={link.to}\n                  onClick={handleClickOnLink(link.to)}\n                  key={link.id}\n                  position=\"relative\"\n                >\n                  {formatMessage(link.intlLabel)}\n                  {link?.licenseOnly && <CustomIcon width=\"1.5rem\" height=\"1.5rem\" />}\n                </Link>\n              );\n            })}\n          </SubNavSection>\n        ))}\n      </SubNavSections>\n    </SubNav>\n  );\n};\n\nexport { SettingsNav };\nexport type { SettingsNavProps };\n"],"names":["CustomIcon","styled","Lightning","theme","colors","warning500","Link","SubNavLink","SettingsNav","menu","formatMessage","useIntl","trackUsage","useTracking","pathname","useLocation","filteredMenu","filter","section","links","every","link","isDisplayed","sections","map","title","intlLabel","name","id","label","defaultMessage","handleClickOnLink","destination","from","to","_jsxs","SubNav","aria-label","_jsx","SubNavHeader","SubNavSections","SubNavSection","tag","NavLink","withBullet","hasNotification","onClick","position","licenseOnly","width","height"],"mappings":";;;;;;;;AAeA,MAAMA,UAAAA,GAAaC,MAAOC,CAAAA,SAAAA,CAAU;;;;;;;UAO1B,EAAE,CAAC,EAAEC,KAAK,EAAE,GAAKA,KAAMC,CAAAA,MAAM,CAACC,UAAU,CAAC;;AAEnD,CAAC;AAED,MAAMC,IAAAA,GAAOL,MAAOM,CAAAA,UAAAA,CAAW;AACpB,WAAA,EAAEP,UAAW,CAAA;;;AAGxB,CAAC;AAMD,MAAMQ,WAAc,GAAA,CAAC,EAAEC,IAAI,EAAoB,GAAA;IAC7C,MAAM,EAAEC,aAAa,EAAE,GAAGC,OAAAA,EAAAA;IAC1B,MAAM,EAAEC,UAAU,EAAE,GAAGC,WAAAA,EAAAA;IACvB,MAAM,EAAEC,QAAQ,EAAE,GAAGC,WAAAA,EAAAA;AAErB,IAAA,MAAMC,eAAeP,IAAKQ,CAAAA,MAAM,CAC9B,CAACC,UAAY,CAACA,OAAAA,CAAQC,KAAK,CAACC,KAAK,CAAC,CAACC,IAASA,GAAAA,IAAAA,CAAKC,WAAW,KAAK,KAAA,CAAA,CAAA;AAGnE,IAAA,MAAMC,QAAWP,GAAAA,YAAAA,CAAaQ,GAAG,CAAC,CAACN,OAAAA,GAAAA;QACjC,OAAO;AACL,YAAA,GAAGA,OAAO;AACVO,YAAAA,KAAAA,EAAOP,QAAQQ,SAAS;AACxBP,YAAAA,KAAAA,EAAOD,OAAQC,CAAAA,KAAK,CAACK,GAAG,CAAC,CAACH,IAAAA,GAAAA;gBACxB,OAAO;AACL,oBAAA,GAAGA,IAAI;AACPI,oBAAAA,KAAAA,EAAOJ,KAAKK,SAAS;AACrBC,oBAAAA,IAAAA,EAAMN,KAAKO;AACb,iBAAA;AACF,aAAA;AACF,SAAA;AACF,KAAA,CAAA;AAEA,IAAA,MAAMC,QAAQnB,aAAc,CAAA;QAC1BkB,EAAI,EAAA,iBAAA;QACJE,cAAgB,EAAA;AAClB,KAAA,CAAA;IAEA,MAAMC,iBAAAA,GAAoB,CAACC,WAAwB,GAAA,IAAA;AACjDpB,YAAAA,UAAAA,CAAW,cAAgB,EAAA;gBAAEqB,IAAMnB,EAAAA,QAAAA;gBAAUoB,EAAIF,EAAAA;AAAY,aAAA,CAAA;AAC/D,SAAA;AAEA,IAAA,qBACEG,IAACC,CAAAA,MAAAA,EAAAA;QAAOC,YAAYR,EAAAA,KAAAA;;0BAClBS,GAACC,CAAAA,YAAAA,EAAAA;gBAAaV,KAAOA,EAAAA;;0BACrBS,GAACE,CAAAA,cAAAA,EAAAA;AACEjB,gBAAAA,QAAAA,EAAAA,QAAAA,CAASC,GAAG,CAAC,CAACN,OAAAA,iBACboB,GAACG,CAAAA,aAAAA,EAAAA;wBAA+BZ,KAAOnB,EAAAA,aAAAA,CAAcQ,QAAQQ,SAAS,CAAA;AACnER,wBAAAA,QAAAA,EAAAA,OAAAA,CAAQC,KAAK,CAACK,GAAG,CAAC,CAACH,IAAAA,GAAAA;AAClB,4BAAA,qBACEc,IAAC7B,CAAAA,IAAAA,EAAAA;gCACCoC,GAAKC,EAAAA,OAAAA;AACLC,gCAAAA,UAAAA,EAAYvB,KAAKwB,eAAe;AAChCX,gCAAAA,EAAAA,EAAIb,KAAKa,EAAE;gCACXY,OAASf,EAAAA,iBAAAA,CAAkBV,KAAKa,EAAE,CAAA;gCAElCa,QAAS,EAAA,UAAA;;AAERrC,oCAAAA,aAAAA,CAAcW,KAAKK,SAAS,CAAA;AAC5BL,oCAAAA,IAAAA,EAAM2B,6BAAeV,GAACtC,CAAAA,UAAAA,EAAAA;wCAAWiD,KAAM,EAAA,QAAA;wCAASC,MAAO,EAAA;;;AAJnD7B,6BAAAA,EAAAA,IAAAA,CAAKO,EAAE,CAAA;AAOlB,yBAAA;AAfkBV,qBAAAA,EAAAA,OAAAA,CAAQU,EAAE,CAAA;;;;AAqBxC;;;;"}
+{"version":3,"file":"SettingsNav.mjs","sources":["../../../../../../../admin/src/pages/Settings/components/SettingsNav.tsx"],"sourcesContent":["import { Badge, Divider } from '@strapi/design-system';\nimport { Lightning } from '@strapi/icons';\nimport { useIntl } from 'react-intl';\nimport { useLocation } from 'react-router-dom';\nimport { styled } from 'styled-components';\n\nimport { SubNav } from '../../../components/SubNav';\nimport { useTracking } from '../../../features/Tracking';\nimport { SettingsMenu } from '../../../hooks/useSettingsMenu';\n\ninterface SettingsNavProps {\n  menu: SettingsMenu;\n}\n\nconst StyledBadge = styled(Badge)`\n  border-radius: 50%;\n  padding: ${({ theme }) => theme.spaces[2]};\n  height: 2rem;\n`;\n\nconst SettingsNav = ({ menu }: SettingsNavProps) => {\n  const { formatMessage } = useIntl();\n  const { trackUsage } = useTracking();\n  const { pathname } = useLocation();\n\n  const filteredMenu = menu.filter(\n    (section) => !section.links.every((link) => link.isDisplayed === false)\n  );\n\n  const sections = filteredMenu.map((section) => {\n    return {\n      ...section,\n      title: section.intlLabel,\n      links: section.links.map((link) => {\n        return {\n          ...link,\n          title: link.intlLabel,\n          name: link.id,\n        };\n      }),\n    };\n  });\n\n  const label = formatMessage({\n    id: 'global.settings',\n    defaultMessage: 'Settings',\n  });\n\n  const handleClickOnLink = (destination: string) => () => {\n    trackUsage('willNavigate', { from: pathname, to: destination });\n  };\n\n  return (\n    <SubNav.Main aria-label={label}>\n      <SubNav.Header label={label} />\n      <Divider background=\"neutral150\" marginBottom={5} />\n      <SubNav.Sections>\n        {sections.map((section) => (\n          <SubNav.Section key={section.id} label={formatMessage(section.intlLabel)}>\n            {section.links.map((link) => {\n              return (\n                <SubNav.Link\n                  to={link.to}\n                  onClick={handleClickOnLink(link.to)}\n                  key={link.id}\n                  label={formatMessage(link.intlLabel)}\n                  endAction={\n                    <>\n                      {link?.licenseOnly && (\n                        <Lightning fill=\"warning500\" width=\"1.5rem\" height=\"1.5rem\" />\n                      )}\n                      {link?.hasNotification && (\n                        <StyledBadge\n                          aria-label=\"Notification\"\n                          backgroundColor=\"primary600\"\n                          textColor=\"neutral0\"\n                        >\n                          1\n                        </StyledBadge>\n                      )}\n                    </>\n                  }\n                />\n              );\n            })}\n          </SubNav.Section>\n        ))}\n      </SubNav.Sections>\n    </SubNav.Main>\n  );\n};\n\nexport { SettingsNav };\nexport type { SettingsNavProps };\n"],"names":["StyledBadge","styled","Badge","theme","spaces","SettingsNav","menu","formatMessage","useIntl","trackUsage","useTracking","pathname","useLocation","filteredMenu","filter","section","links","every","link","isDisplayed","sections","map","title","intlLabel","name","id","label","defaultMessage","handleClickOnLink","destination","from","to","_jsxs","SubNav","Main","aria-label","_jsx","Header","Divider","background","marginBottom","Sections","Section","Link","onClick","endAction","_Fragment","licenseOnly","Lightning","fill","width","height","hasNotification","backgroundColor","textColor"],"mappings":"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"}

package/dist/admin/index.js

@@ -14,6 +14,7 @@ var Pagination = require('./admin/src/components/Pagination.js');
 var SearchInput = require('./admin/src/components/SearchInput.js');
 var Table = require('./admin/src/components/Table.js');
 var ContentBox = require('./admin/src/components/ContentBox.js');
+var SubNav = require('./admin/src/components/SubNav.js');
 var Provider = require('./admin/src/components/GuidedTour/Provider.js');
 var Tracking = require('./admin/src/features/Tracking.js');
 var StrapiApp = require('./admin/src/features/StrapiApp.js');
@@ -57,6 +58,7 @@ exports.SearchInput = SearchInput.SearchInput;
 exports.Table = Table.Table;
 exports.useTable = Table.useTable;
 exports.ContentBox = ContentBox.ContentBox;
+exports.SubNav = SubNav.SubNav;
 exports.useGuidedTour = Provider.useGuidedTour;
 exports.useTracking = Tracking.useTracking;
 exports.useStrapiApp = StrapiApp.useStrapiApp;

package/dist/admin/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/admin/index.mjs

@@ -12,6 +12,7 @@ export { Pagination } from './admin/src/components/Pagination.mjs';
 export { SearchInput } from './admin/src/components/SearchInput.mjs';
 export { Table, useTable } from './admin/src/components/Table.mjs';
 export { ContentBox } from './admin/src/components/ContentBox.mjs';
+export { SubNav } from './admin/src/components/SubNav.mjs';
 export { useGuidedTour } from './admin/src/components/GuidedTour/Provider.mjs';
 export { useTracking } from './admin/src/features/Tracking.mjs';
 export { useStrapiApp } from './admin/src/features/StrapiApp.mjs';

package/dist/admin/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/admin/src/components/SubNav.d.ts

@@ -0,0 +1,33 @@
+/// <reference types="react" />
+declare const StyledLink: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").FastOmit<Omit<import("react-router-dom").NavLinkProps & import("react").RefAttributes<HTMLAnchorElement>, "ref"> & {
+    ref?: ((instance: HTMLAnchorElement | null) => void) | import("react").RefObject<HTMLAnchorElement> | null | undefined;
+}, never>> & Omit<import("react").ForwardRefExoticComponent<import("react-router-dom").NavLinkProps & import("react").RefAttributes<HTMLAnchorElement>>, keyof import("react").Component<any, {}, any>>;
+export declare const SubNav: {
+    Main: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").FastOmit<Omit<Omit<import("@strapi/design-system").SubNavProps, "ref"> & import("react").RefAttributes<HTMLDivElement>, "ref"> & {
+        ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
+    }, never>> & Omit<import("react").ForwardRefExoticComponent<Omit<import("@strapi/design-system").SubNavProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>, keyof import("react").Component<any, {}, any>>;
+    Header: ({ label }: {
+        label: string;
+    }) => import("react/jsx-runtime").JSX.Element;
+    Link: (props: Omit<React.ComponentProps<typeof StyledLink>, 'label'> & {
+        label: React.ReactNode;
+        endAction?: React.ReactNode;
+    }) => import("react/jsx-runtime").JSX.Element;
+    Sections: ({ children, ...props }: {
+        children: React.ReactNode[];
+        [key: string]: any;
+    }) => import("react/jsx-runtime").JSX.Element;
+    Section: ({ label, children, link, }: {
+        label: string;
+        children: React.ReactNode[];
+        link?: {
+            label: string;
+            onClik: () => void;
+        };
+    }) => import("react/jsx-runtime").JSX.Element;
+    SubSection: ({ label, children }: {
+        label: string;
+        children: React.ReactNode[];
+    }) => import("react/jsx-runtime").JSX.Element;
+};
+export {};

package/dist/admin/src/index.d.ts

@@ -20,6 +20,7 @@ export * from './components/Pagination';
 export * from './components/SearchInput';
 export * from './components/Table';
 export * from './components/ContentBox';
+export * from './components/SubNav';
 export { useGuidedTour } from './components/GuidedTour/Provider';
 /**
  * Features