shaba/one
1
0
Fork 0
mirror of https://github.com/OpenNebula/one.git synced 2025-03-22 18:50:08 +03:00
Code Releases Wiki Activity

F #5637: Reformat logic to VMs datatable (#1777)

Browse Source 
(cherry picked from commit 779cbbceb22087f04eae3bd4d3a875a800350e9b)
This commit is contained in:
Sergio Betanzos 2022-02-15 19:19:58 +01:00 committed by Tino Vazquez
parent ed28e8948c
commit cb90fdc998
No known key found for this signature in database
GPG Key ID: 14201E424D02047E
18 changed files with 95 additions and 55 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
src/fireedge/src/client/components/Forms/MarketplaceApp/CreateForm/Steps/MarketplacesTable/index.js
View File

@ -17,8 +17,10 @@ import PropTypes from 'prop-types'
import { useFormContext } from 'react-hook-form'
import { useGetOneConfigQuery } from 'client/features/OneApi/system'
import { useGetMarketplacesQuery } from 'client/features/OneApi/marketplace'
import { MarketplacesTable } from 'client/components/Tables'
import { SCHEMA } from 'client/components/Forms/MarketplaceApp/CreateForm/Steps/MarketplacesTable/schema'
import { onedConfIncludesAction } from 'client/models/Marketplace'
import { Step } from 'client/utils'
import { T } from 'client/constants'
@ -41,14 +43,15 @@ const Content = ({ data }) => {
onlyGlobalSearch
onlyGlobalSelectedRows
getRowId={(market) => String(market.NAME)}
filter={(market) =>
oneConfig?.FEDERATION?.ZONE_ID === market.ZONE_ID &&
oneConfig?.MARKET_MAD_CONF?.some(
(marketMad) =>
marketMad?.APP_ACTIONS?.includes('create') &&
`${marketMad?.NAME}`.toUpperCase() ===
`${market?.MARKET_MAD}`.toUpperCase()
)
useQuery={() =>
useGetMarketplacesQuery(undefined, {
selectFromResult: ({ data: result = [], ...restOfQuery }) => ({
data: result?.filter((market) =>
onedConfIncludesAction(market, oneConfig, 'create')
),
...restOfQuery,
}),
})
}
initialState={{ selectedRowIds: { [NAME]: true } }}
onSelectedRowsChange={handleSelectedRows}

2
src/fireedge/src/client/components/Tables/Clusters/index.js
View File

@ -49,7 +49,7 @@ const ClustersTable = (props) => {
return (
<EnhancedTable
columns={columns}
data={data}
data={useMemo(() => data, [data])}
rootProps={rootProps}
searchProps={searchProps}
refetch={refetch}

2
src/fireedge/src/client/components/Tables/Datastores/index.js
View File

@ -54,7 +54,7 @@ const DatastoresTable = (props) => {
return (
<EnhancedTable
columns={columns}
data={data}
data={useMemo(() => data, [data])}
rootProps={rootProps}
searchProps={searchProps}
refetch={refetch}

7
src/fireedge/src/client/components/Tables/DockerHubTags/index.js
View File

@ -59,17 +59,14 @@ const DockerHubTagsTable = ({ app, ...props } = {}) => {
})()
}, [appId, next])
const memoData = useMemo(() => tags, [tags?.length])
const memoColumns = useMemo(() => [{ accessor: 'name' }], [])
if (!appId) {
return <>{'App ID is required'}</>
}
return (
<EnhancedTable
columns={memoColumns}
data={memoData}
columns={useMemo(() => [{ accessor: 'name' }], [])}
data={useMemo(() => tags, [tags])}
rootProps={rootProps}
searchProps={searchProps}
refetch={fetchRequest}

12
src/fireedge/src/client/components/Tables/Enhanced/index.js
View File

@ -65,15 +65,13 @@ const EnhancedTable = ({
}) => {
const styles = EnhancedTableStyles()
const isUninitialized = isLoading && data === undefined
const defaultColumn = useMemo(
() => ({
disableFilters: true,
}),
[]
const isUninitialized = useMemo(
() => isLoading && data === undefined,
[isLoading, data]
)
const defaultColumn = useMemo(() => ({ disableFilters: true }), [])
const sortTypes = useMemo(
() => ({
length: (rowA, rowB, columnId, desc) =>

2
src/fireedge/src/client/components/Tables/Groups/index.js
View File

@ -49,7 +49,7 @@ const GroupsTable = (props) => {
return (
<EnhancedTable
columns={columns}
data={data}
data={useMemo(() => data, [data])}
rootProps={rootProps}
searchProps={searchProps}
refetch={refetch}

2
src/fireedge/src/client/components/Tables/Hosts/index.js
View File

@ -54,7 +54,7 @@ const HostsTable = (props) => {
return (
<EnhancedTable
columns={columns}
data={data}
data={useMemo(() => data, [data])}
rootProps={rootProps}
searchProps={searchProps}
refetch={refetch}

2
src/fireedge/src/client/components/Tables/Images/index.js
View File

@ -49,7 +49,7 @@ const ImagesTable = (props) => {
return (
<EnhancedTable
columns={columns}
data={data}
data={useMemo(() => data, [data])}
rootProps={rootProps}
searchProps={searchProps}
refetch={refetch}

2
src/fireedge/src/client/components/Tables/MarketplaceApps/index.js
View File

@ -49,7 +49,7 @@ const MarketplaceAppsTable = (props) => {
return (
<EnhancedTable
columns={columns}
data={data}
data={useMemo(() => data, [data])}
rootProps={rootProps}
searchProps={searchProps}
refetch={refetch}

11
src/fireedge/src/client/components/Tables/Marketplaces/index.js
View File

@ -32,12 +32,17 @@ const DEFAULT_DATA_CY = 'marketplaces'
* @returns {ReactElement} Marketplaces table
*/
const MarketplacesTable = ({ filter, ...props }) => {
const { rootProps = {}, searchProps = {}, ...rest } = props ?? {}
const {
rootProps = {},
searchProps = {},
useQuery = useGetMarketplacesQuery,
...rest
} = props ?? {}
rootProps['data-cy'] ??= DEFAULT_DATA_CY
searchProps['data-cy'] ??= `search-${DEFAULT_DATA_CY}`
const { view, getResourceView } = useAuth()
const { data = [], isFetching, refetch } = useGetMarketplacesQuery()
const { data = [], isFetching, refetch } = useQuery()
const columns = useMemo(
() =>
@ -51,7 +56,7 @@ const MarketplacesTable = ({ filter, ...props }) => {
return (
<EnhancedTable
columns={columns}
data={typeof filter === 'function' ? data?.filter(filter) : data}
data={useMemo(() => data, [data])}
rootProps={rootProps}
searchProps={searchProps}
refetch={refetch}

2
src/fireedge/src/client/components/Tables/Users/index.js
View File

@ -49,7 +49,7 @@ const UsersTable = (props) => {
return (
<EnhancedTable
columns={columns}
data={data}
data={useMemo(() => data, [data])}
rootProps={rootProps}
searchProps={searchProps}
refetch={refetch}

2
src/fireedge/src/client/components/Tables/VNetworkTemplates/index.js
View File

@ -50,7 +50,7 @@ const VNetworkTemplatesTable = (props) => {
return (
<EnhancedTable
columns={columns}
data={data}
data={useMemo(() => data, [data])}
rootProps={rootProps}
searchProps={searchProps}
refetch={refetch}

2
src/fireedge/src/client/components/Tables/VNetworks/index.js
View File

@ -54,7 +54,7 @@ const VNetworksTable = (props) => {
return (
<EnhancedTable
columns={columns}
data={data}
data={useMemo(() => data, [data])}
rootProps={rootProps}
searchProps={searchProps}
refetch={refetch}

2
src/fireedge/src/client/components/Tables/VRouters/index.js
View File

@ -49,7 +49,7 @@ const VRoutersTable = (props) => {
return (
<EnhancedTable
columns={columns}
data={data}
data={useMemo(() => data, [data])}
rootProps={rootProps}
searchProps={searchProps}
refetch={refetch}

2
src/fireedge/src/client/components/Tables/VmTemplates/index.js
View File

@ -49,7 +49,7 @@ const VmTemplatesTable = (props) => {
return (
<EnhancedTable
columns={columns}
data={data}
data={useMemo(() => data, [data])}
rootProps={rootProps}
searchProps={searchProps}
refetch={refetch}

53
src/fireedge/src/client/components/Tables/Vms/index.js
View File

@ -13,7 +13,7 @@
* See the License for the specific language governing permissions and *
* limitations under the License. *
* ------------------------------------------------------------------------- */
import { useMemo, ReactElement } from 'react'
import { useState, useEffect, useMemo, ReactElement } from 'react'
import { useAuth } from 'client/features/Auth'
import { useGetVmsQuery } from 'client/features/OneApi/vm'
@ -23,14 +23,14 @@ import VmColumns from 'client/components/Tables/Vms/columns'
import VmRow from 'client/components/Tables/Vms/row'
import { RESOURCE_NAMES } from 'client/constants'
// const INITIAL_ELEMENT = 0
// const INTERVAL_ON_FIRST_RENDER = 2_000
const INITIAL_ELEMENT = 0
const INTERVAL_ON_FIRST_RENDER = 2_000
// const INITIAL_ARGS = {
// start: INITIAL_ELEMENT,
// end: -INTERVAL_ON_FIRST_RENDER,
// state: -1,
// }
const INITIAL_ARGS = {
start: INITIAL_ELEMENT,
end: -INTERVAL_ON_FIRST_RENDER,
state: -1,
}
const DEFAULT_DATA_CY = 'vms'
@ -44,8 +44,11 @@ const VmsTable = (props) => {
searchProps['data-cy'] ??= `search-${DEFAULT_DATA_CY}`
const { view, getResourceView } = useAuth()
// const [args, setArgs] = useState(() => INITIAL_ARGS)
const { data = [], isFetching, refetch } = useGetVmsQuery()
const [totalData, setTotalData] = useState(() => [])
const [args, setArgs] = useState(() => INITIAL_ARGS)
const { data, isSuccess, isFetching } = useGetVmsQuery(args, {
refetchOnMountOrArgChange: true,
})
const columns = useMemo(
() =>
@ -56,22 +59,33 @@ const VmsTable = (props) => {
[view]
)
/* useEffect(() => {
const lastVmId = data[INTERVAL_ON_FIRST_RENDER - 1]?.ID
const end = isSuccess ? lastVmId : -INTERVAL_ON_FIRST_RENDER
if (isSuccess && data?.length === INTERVAL_ON_FIRST_RENDER) {
setArgs({ start: INITIAL_ELEMENT, end, state: -1 })
useEffect(() => {
if (!isFetching && isSuccess && data?.length >= +INTERVAL_ON_FIRST_RENDER) {
setArgs((prev) => ({
...prev,
start: prev.start + INTERVAL_ON_FIRST_RENDER,
}))
}
}, [isSuccess]) */
}, [isFetching])
useEffect(() => {
data &&
setTotalData((prev) => {
const notDuplicatedData = data.filter(
({ ID }) => !prev.find((vm) => vm.ID === ID)
)
return prev.concat(notDuplicatedData).sort((a, b) => b.ID - a.ID)
})
}, [data])
return (
<EnhancedTable
columns={columns}
data={data}
data={useMemo(() => totalData, [totalData])}
rootProps={rootProps}
searchProps={searchProps}
refetch={refetch}
refetch={() => setArgs(INITIAL_ARGS)}
isLoading={isFetching}
getRowId={(row) => String(row.ID)}
RowComponent={VmRow}
@ -80,7 +94,6 @@ const VmsTable = (props) => {
)
}
VmsTable.propTypes = { ...EnhancedTable.propTypes }
VmsTable.displayName = 'VmsTable'
export default VmsTable

2
src/fireedge/src/client/components/Tables/Zones/index.js
View File

@ -49,7 +49,7 @@ const ZonesTable = (props) => {
return (
<EnhancedTable
columns={columns}
data={data}
data={useMemo(() => data, [data])}
rootProps={rootProps}
searchProps={searchProps}
refetch={refetch}

24
src/fireedge/src/client/models/Marketplace.js
View File

@ -43,3 +43,27 @@ export const getCapacityInfo = ({ TOTAL_MB, USED_MB } = {}) => {
return { percentOfUsed, percentLabel }
}
/**
* Returns `true` if the marketplace can be perform
* one of these actions: monitor, create, delete.
*
* @param {Marketplace} marketplace - Marketplace
* @param {object} onedConf - One daemon configuration
* @param {'monitor'|'create'|'delete'} action - Marketplace action
* @returns {boolean} If the oned.conf includes the action
*/
export const onedConfIncludesAction = (
marketplace = {},
onedConf = {},
action = 'monitor'
) => {
const isInZone = onedConf.FEDERATION?.ZONE_ID === marketplace.ZONE_ID
const includesAction = onedConf.MARKET_MAD_CONF?.some(
({ APP_ACTIONS, NAME }) =>
APP_ACTIONS?.includes(action) &&
`${NAME}`.toLowerCase() === `${marketplace.MARKET_MAD}`.toLowerCase()
)
return isInZone && includesAction
}