diff --git a/src/locales/de-DE/messages.po b/src/locales/de-DE/messages.po
index ee84d3a4..4a888201 100644
--- a/src/locales/de-DE/messages.po
+++ b/src/locales/de-DE/messages.po
@@ -272,7 +272,7 @@ msgstr ""
msgid "Account: {0}"
msgstr "Konto: {0}"
-#: src/pages/panel/inventory/InventoryPage.tsx:248
+#: src/pages/panel/inventory/InventoryPage.tsx:264
msgid "accounts"
msgstr ""
@@ -397,7 +397,7 @@ msgstr ""
msgid "All checks have been disabled for this resource"
msgstr "Für diese Ressource wurden alle Prüfungen deaktiviert"
-#: src/pages/panel/inventory/InventoryPage.tsx:75
+#: src/pages/panel/inventory/InventoryPage.tsx:91
msgid "All resource kinds"
msgstr ""
@@ -793,7 +793,7 @@ msgstr ""
msgid "Cloud Inventory"
msgstr "Cloud Inventar"
-#: src/pages/panel/inventory/InventoryPage.tsx:247
+#: src/pages/panel/inventory/InventoryPage.tsx:263
msgid "clouds"
msgstr ""
@@ -1583,7 +1583,7 @@ msgstr ""
msgid "Invalid Value"
msgstr "Ungültiger Wert"
-#: src/pages/panel/inventory/InventoryPage.tsx:204
+#: src/pages/panel/inventory/InventoryPage.tsx:220
#: src/shared/layouts/panel-layout/menuList.tsx:34
msgid "Inventory"
msgstr "Inventar"
@@ -1612,7 +1612,7 @@ msgstr ""
msgid "Kind"
msgstr "Art"
-#: src/pages/panel/inventory/InventoryPage.tsx:250
+#: src/pages/panel/inventory/InventoryPage.tsx:266
msgid "kinds"
msgstr ""
@@ -2238,7 +2238,7 @@ msgstr "Regenerieren"
msgid "Region"
msgstr "Region"
-#: src/pages/panel/inventory/InventoryPage.tsx:249
+#: src/pages/panel/inventory/InventoryPage.tsx:265
msgid "regions"
msgstr ""
diff --git a/src/locales/en-US/messages.po b/src/locales/en-US/messages.po
index efac8885..19c810ce 100644
--- a/src/locales/en-US/messages.po
+++ b/src/locales/en-US/messages.po
@@ -272,7 +272,7 @@ msgstr "Account usage"
msgid "Account: {0}"
msgstr "Account: {0}"
-#: src/pages/panel/inventory/InventoryPage.tsx:248
+#: src/pages/panel/inventory/InventoryPage.tsx:264
msgid "accounts"
msgstr "accounts"
@@ -397,7 +397,7 @@ msgstr "All changes over all resources."
msgid "All checks have been disabled for this resource"
msgstr "All checks have been disabled for this resource"
-#: src/pages/panel/inventory/InventoryPage.tsx:75
+#: src/pages/panel/inventory/InventoryPage.tsx:91
msgid "All resource kinds"
msgstr "All resource kinds"
@@ -793,7 +793,7 @@ msgstr "Cloud Accounts"
msgid "Cloud Inventory"
msgstr "Cloud Inventory"
-#: src/pages/panel/inventory/InventoryPage.tsx:247
+#: src/pages/panel/inventory/InventoryPage.tsx:263
msgid "clouds"
msgstr "clouds"
@@ -1583,7 +1583,7 @@ msgstr "Invalid file, Please follow the step-by-step instructions {0}."
msgid "Invalid Value"
msgstr "Invalid Value"
-#: src/pages/panel/inventory/InventoryPage.tsx:204
+#: src/pages/panel/inventory/InventoryPage.tsx:220
#: src/shared/layouts/panel-layout/menuList.tsx:34
msgid "Inventory"
msgstr "Inventory"
@@ -1612,7 +1612,7 @@ msgstr "kind"
msgid "Kind"
msgstr "Kind"
-#: src/pages/panel/inventory/InventoryPage.tsx:250
+#: src/pages/panel/inventory/InventoryPage.tsx:266
msgid "kinds"
msgstr "kinds"
@@ -2238,7 +2238,7 @@ msgstr "Regenerate"
msgid "Region"
msgstr "Region"
-#: src/pages/panel/inventory/InventoryPage.tsx:249
+#: src/pages/panel/inventory/InventoryPage.tsx:265
msgid "regions"
msgstr "regions"
diff --git a/src/pages/panel/inventory/GridFilterItem.tsx b/src/pages/panel/inventory/GridFilterItem.tsx
index 679be4fb..bea03086 100644
--- a/src/pages/panel/inventory/GridFilterItem.tsx
+++ b/src/pages/panel/inventory/GridFilterItem.tsx
@@ -58,9 +58,9 @@ export const GridFilterItem = ({ name, items, onChange, values: orgValues }: Gri
setValues(orgValues)
}, [orgValues])
const handleClose = () => {
+ setOpen(null)
setValues(orgValues)
setSearch('')
- setOpen(null)
}
const lowerCaseSearch = search.toLowerCase()
return (
@@ -138,8 +138,8 @@ export const GridFilterItem = ({ name, items, onChange, values: orgValues }: Gri
{
- onChange([])
setSearch('')
+ onChange([])
}}
>
@@ -180,9 +180,9 @@ export const GridFilterItem = ({ name, items, onChange, values: orgValues }: Gri
variant="contained"
fullWidth
onClick={() => {
- onChange(values)
- setSearch('')
setOpen(null)
+ setSearch('')
+ onChange(values)
}}
>
Apply filters
diff --git a/src/pages/panel/inventory/InventoryPage.tsx b/src/pages/panel/inventory/InventoryPage.tsx
index f7824a71..04de77cf 100644
--- a/src/pages/panel/inventory/InventoryPage.tsx
+++ b/src/pages/panel/inventory/InventoryPage.tsx
@@ -2,11 +2,12 @@ import { t, Trans } from '@lingui/macro'
import { useLingui } from '@lingui/react'
import { Box, ButtonBase, Divider, Stack, Typography } from '@mui/material'
import { useSuspenseQueries } from '@tanstack/react-query'
-import { ReactNode, useMemo, useState } from 'react'
+import { Dispatch, ReactNode, SetStateAction, useCallback, useMemo, useState, useTransition } from 'react'
import { getNameAndIconFromMetadataGroup, StacksIcon } from 'src/assets/icons'
import { useUserProfile } from 'src/core/auth'
import { getWorkspaceInventoryModelQuery, postWorkspaceInventoryDescendantSummaryQuery } from 'src/pages/panel/shared/queries'
import { CloudToIcon } from 'src/shared/cloud-avatar'
+import { LoadingSuspenseFallback } from 'src/shared/loading'
import { HelpSlider } from 'src/shared/right-slider'
import { ResourceComplexKind } from 'src/shared/types/server-shared'
import { getAccountCloudName } from 'src/shared/utils/getAccountCloudName'
@@ -21,13 +22,28 @@ const getString = (str?: null | string | string[]) => {
return typeof str === 'string' && str ? str : null
}
+function useTransitionState(
+ initialState: StateType | (() => StateType),
+): [StateType, Dispatch>, boolean] {
+ const [state, setState] = useState(initialState)
+ const [isPending, startTransition] = useTransition()
+ const handleSetState = useCallback>>((arg) => startTransition(() => setState(arg)), [])
+ return [state, handleSetState, isPending]
+}
+
export default function InventoryPage() {
const { selectedWorkspace } = useUserProfile()
- const [cloudFilter, setCloudFilter] = useState([])
- const [accountFilter, setAccountFilter] = useState([])
- const [regionFilter, setRegionFilter] = useState([])
- const [kindFilter, setKindFilter] = useState([])
- const [groupFilter, setGroupFilter] = useState('')
+ const [cloudFilter, setCloudFilter, isCloudFilterChangePending] = useTransitionState([])
+ const [accountFilter, setAccountFilter, isAccountFilterChangePending] = useTransitionState([])
+ const [regionFilter, setRegionFilter, isRegionFilterChangePending] = useTransitionState([])
+ const [kindFilter, setKindFilter, isKindFilterChangePending] = useTransitionState([])
+ const [groupFilter, setGroupFilter, isGroupFilterChangePending] = useTransitionState('')
+ const pendingTransition =
+ isCloudFilterChangePending ||
+ isAccountFilterChangePending ||
+ isRegionFilterChangePending ||
+ isKindFilterChangePending ||
+ isGroupFilterChangePending
const {
i18n: { locale },
} = useLingui()
@@ -265,19 +281,23 @@ export default function InventoryPage() {
-
+ {pendingTransition ? (
+
+ ) : (
+
+ )}