From 22d0155d306c8c435699dc32b29a07fc974d1fb3 Mon Sep 17 00:00:00 2001 From: typescreep Date: Fri, 11 Jul 2025 01:43:13 +0300 Subject: [PATCH] tables on bff --- package-lock.json | 8 +- package.json | 2 +- .../organisms/ListProjects/ListProjects.tsx | 67 +------------- .../TableBuiltinInfo/TableBuiltinInfo.tsx | 87 ++++-------------- .../organisms/TableCrdInfo/TableCrdInfo.tsx | 52 ----------- .../molecules/ResourceInfo/ResourceInfo.tsx | 75 ++++------------ .../TableNonCrdInfo/TableNonCrdInfo.tsx | 89 ++++--------------- 7 files changed, 61 insertions(+), 319 deletions(-) diff --git a/package-lock.json b/package-lock.json index 4c6913e..b11ed36 100644 --- a/package-lock.json +++ b/package-lock.json @@ -11,7 +11,7 @@ "@ant-design/icons": "5.6.0", "@monaco-editor/react": "4.6.0", "@originjs/vite-plugin-federation": "1.3.6", - "@prorobotech/openapi-k8s-toolkit": "^0.0.1-alpha.51", + "@prorobotech/openapi-k8s-toolkit": "^0.0.1-alpha.52", "@readme/openapi-parser": "4.0.0", "@reduxjs/toolkit": "2.2.5", "@tanstack/react-query": "5.62.2", @@ -2807,9 +2807,9 @@ } }, "node_modules/@prorobotech/openapi-k8s-toolkit": { - "version": "0.0.1-alpha.51", - "resolved": "https://registry.npmjs.org/@prorobotech/openapi-k8s-toolkit/-/openapi-k8s-toolkit-0.0.1-alpha.51.tgz", - "integrity": "sha512-XvEXoYSzSyhf1xeoURREi3c9dRWI1G3si6cGAMME51hIIxkx06ZCl1LqmU0aTQuRaHuMMf9zDFWjj7OAXpsXwQ==", + "version": "0.0.1-alpha.52", + "resolved": "https://registry.npmjs.org/@prorobotech/openapi-k8s-toolkit/-/openapi-k8s-toolkit-0.0.1-alpha.52.tgz", + "integrity": "sha512-Tj61DQG68HW0tdYof16Z/ndPMLle5Xr0sxuXFStqGkicLp+V2scV0/hrkivzuWXUrW4QVBUYhTwfhDV+L4pZIw==", "license": "MIT", "dependencies": { "@monaco-editor/react": "4.6.0", diff --git a/package.json b/package.json index 1121c23..99db655 100644 --- a/package.json +++ b/package.json @@ -20,7 +20,7 @@ "@ant-design/icons": "5.6.0", "@monaco-editor/react": "4.6.0", "@originjs/vite-plugin-federation": "1.3.6", - "@prorobotech/openapi-k8s-toolkit": "0.0.1-alpha.51", + "@prorobotech/openapi-k8s-toolkit": "0.0.1-alpha.52", "@readme/openapi-parser": "4.0.0", "@reduxjs/toolkit": "2.2.5", "@tanstack/react-query": "5.62.2", diff --git a/src/components/organisms/ListProjects/ListProjects.tsx b/src/components/organisms/ListProjects/ListProjects.tsx index 7c92c19..b5db932 100644 --- a/src/components/organisms/ListProjects/ListProjects.tsx +++ b/src/components/organisms/ListProjects/ListProjects.tsx @@ -1,25 +1,17 @@ import React, { FC, useState } from 'react' -import { useNavigate, useLocation, useParams } from 'react-router-dom' +import { useNavigate, useParams } from 'react-router-dom' import { Spin, Alert, Button, Flex } from 'antd' import { PlusOutlined } from '@ant-design/icons' import { EnrichedTableProvider, - useDirectUnknownResource, usePermissions, DeleteModal, DeleteModalMany, - TTableMappingResponse, - TAdditionalPrinterColumns, - prepareTableMappings, useApiResources, - useCrdResources, - parseCustomOverrides, } from '@prorobotech/openapi-k8s-toolkit' import { useSelector } from 'react-redux' import { RootState } from 'store/store' import { - BASE_API_GROUP, - BASE_API_VERSION, BASE_PROJECTS_API_GROUP, BASE_PROJECTS_VERSION, BASE_PROJECTS_RESOURCE_NAME, @@ -29,12 +21,10 @@ import { TABLE_PROPS } from 'constants/tableProps' export const ListProjects: FC = () => { const navigate = useNavigate() - const { pathname } = useLocation() const theme = useSelector((state: RootState) => state.openapiTheme.theme) const baseprefix = useSelector((state: RootState) => state.baseprefix.baseprefix) const { clusterName } = useParams() - const path = pathname const cluster = clusterName || '' const apiGroup = BASE_PROJECTS_API_GROUP const apiVersion = BASE_PROJECTS_VERSION @@ -84,52 +74,6 @@ export const ListProjects: FC = () => { limit: null, }) - const columnsOverrides = useCrdResources({ - clusterName: cluster, - crdName: 'customcolumnsoverrides', - apiGroup: BASE_API_GROUP, - apiVersion: BASE_API_VERSION, - }) - - const additionalPrinterColumns: TAdditionalPrinterColumns = [ - { - name: 'Name', - type: 'string', - jsonPath: '.metadata.name', - }, - { - name: 'Timestamp', - type: 'string', - jsonPath: '.metadata.creationTimestamp', - }, - ] - - const { - ensuredCustomOverrides, - ensuredCustomOverridesUndefinedValues, - ensuredCustomOverridesTrimLengths, - ensuredCustomOverridesColWidths, - } = parseCustomOverrides({ - columnsOverridesData: columnsOverrides.data, - overrideType: `${apiGroup}/${apiVersion}/${typeName}`, - }) - - const { data: tableMappingsData } = useDirectUnknownResource({ - uri: `/api/clusters/${cluster}/k8s/apis/${BASE_API_GROUP}/${BASE_API_VERSION}/tableurimappings/`, - refetchInterval: 5000, - queryKey: ['tableMappings', cluster || 'no-cluster'], - isEnabled: cluster !== undefined, - }) - - const tableMappingsDataSpecs = tableMappingsData?.items.map(({ spec }) => spec) - const tableMappingSpecific = tableMappingsDataSpecs - ? prepareTableMappings({ - data: tableMappingsDataSpecs, - clusterName, - pathname: path, - }) - : undefined - const onDeleteHandle = (name: string, endpoint: string) => { setIsDeleteModalOpen({ name, endpoint }) } @@ -145,13 +89,12 @@ export const ListProjects: FC = () => { {error && } {!error && data && ( { canDelete: isNamespaced ? true : deletePermission.data?.status.allowed, }, }} - pathToNavigate={tableMappingSpecific?.pathToNavigate} - recordKeysForNavigation={tableMappingSpecific?.keysToParse} selectData={{ selectedRowKeys, onChange: (selectedRowKeys: React.Key[], selectedRowsData: { name: string; endpoint: string }[]) => { diff --git a/src/components/organisms/TableBuiltinInfo/TableBuiltinInfo.tsx b/src/components/organisms/TableBuiltinInfo/TableBuiltinInfo.tsx index 573e7da..7b614c1 100644 --- a/src/components/organisms/TableBuiltinInfo/TableBuiltinInfo.tsx +++ b/src/components/organisms/TableBuiltinInfo/TableBuiltinInfo.tsx @@ -1,24 +1,17 @@ import React, { FC, useState, useEffect } from 'react' -import { useNavigate, useParams, useLocation } from 'react-router-dom' +import { useNavigate, useParams } from 'react-router-dom' import { Spin, Alert, Button, Flex } from 'antd' import { PlusOutlined, ClearOutlined, MinusOutlined } from '@ant-design/icons' import { useSelector } from 'react-redux' import { RootState } from 'store/store' import { EnrichedTableProvider, - useDirectUnknownResource, usePermissions, DeleteModal, DeleteModalMany, checkIfBuiltInInstanceNamespaceScoped, - TTableMappingResponse, - useCrdResources, - prepareTableMappings, - parseCustomOverrides, - TAdditionalPrinterColumns, useBuiltinResources, } from '@prorobotech/openapi-k8s-toolkit' -import { BASE_API_GROUP, BASE_API_VERSION } from 'constants/customizationApiGroupAndVersion' import { FlexGrow, OverflowMaxHeightContainer, MarginTopContainer } from 'components' import { TABLE_PROPS } from 'constants/tableProps' import { @@ -39,9 +32,7 @@ type TTableBuiltinInfoProps = { export const TableBuiltinInfo: FC = ({ namespace, typeName, limit, inside }) => { const navigate = useNavigate() - const { pathname } = useLocation() const params = useParams() - const cluster = useSelector((state: RootState) => state.cluster.cluster) const theme = useSelector((state: RootState) => state.openapiTheme.theme) const baseprefix = useSelector((state: RootState) => state.baseprefix.baseprefix) @@ -123,60 +114,6 @@ export const TableBuiltinInfo: FC = ({ namespace, typeNa limit, }) - const additionalPrinterColumns: TAdditionalPrinterColumns = [ - { - name: 'Name', - type: 'string', - jsonPath: '.metadata.name', - }, - { - name: 'Timestamp', - type: 'string', - jsonPath: '.metadata.creationTimestamp', - }, - ] - - const columnsOverrides = useCrdResources({ - clusterName: cluster, - crdName: 'customcolumnsoverrides', - apiGroup: BASE_API_GROUP, - apiVersion: BASE_API_VERSION, - }) - - const { - ensuredCustomOverrides, - ensuredCustomOverridesUndefinedValues, - ensuredCustomOverridesTrimLengths, - ensuredCustomOverridesColWidths, - } = parseCustomOverrides({ columnsOverridesData: columnsOverrides.data, overrideType: `v1/${typeName}` }) - - const { data: tableMappingsData } = useDirectUnknownResource({ - uri: `/api/clusters/${cluster}/k8s/apis/${BASE_API_GROUP}/${BASE_API_VERSION}/tableurimappings/`, - refetchInterval: 5000, - queryKey: ['tableMappings', cluster || 'no-cluster'], - isEnabled: cluster !== undefined, - }) - - const tableMappingsDataSpecs = tableMappingsData?.items.map(({ spec }) => spec) - const tableMappingSpecific = tableMappingsDataSpecs - ? prepareTableMappings({ - data: tableMappingsDataSpecs, - clusterName: params.clusterName, - projectName: params.projectName, - instanceName: params.instanceName, - namespace: params.namespace, - syntheticProject: params.syntheticProject, - entryType: params.entryType, - apiGroup: params.apiGroup, - apiVersion: params.apiVersion, - typeName: params.typeName, - entryName: params.entryName, - apiExtensionVersion: params.apiExtensionVersion, - crdName: params.crdName, - pathname, - }) - : undefined - const onDeleteHandle = (name: string, endpoint: string) => { setIsDeleteModalOpen({ name, endpoint }) } @@ -193,13 +130,25 @@ export const TableBuiltinInfo: FC = ({ namespace, typeNa {!error && data && ( = ({ namespace, typeNa canDelete: isNamespaced ? true : deletePermission.data?.status.allowed, }, }} - pathToNavigate={tableMappingSpecific?.pathToNavigate} - recordKeysForNavigation={tableMappingSpecific?.keysToParse} selectData={{ selectedRowKeys, onChange: (selectedRowKeys: React.Key[], selectedRowsData: { name: string; endpoint: string }[]) => { diff --git a/src/components/organisms/TableCrdInfo/TableCrdInfo.tsx b/src/components/organisms/TableCrdInfo/TableCrdInfo.tsx index 08132a1..82170a8 100644 --- a/src/components/organisms/TableCrdInfo/TableCrdInfo.tsx +++ b/src/components/organisms/TableCrdInfo/TableCrdInfo.tsx @@ -1,5 +1,4 @@ import React, { FC, useState, useEffect } from 'react' -// import { Typography, Spin, Alert, Tabs } from 'antd' import { Spin, Alert } from 'antd' import { usePermissions, checkIfApiInstanceNamespaceScoped, useCrdData } from '@prorobotech/openapi-k8s-toolkit' import { useSelector } from 'react-redux' @@ -102,54 +101,3 @@ export const TableCrdInfo: FC = ({ ) } - -// return ( -// -// -// {isPending && } -// {!error && data && ( -// <> -//
-// Kind Name: -// {data.spec.names.kind} -//
-//
-// Plural Name: -// {data.spec.names.plural} -//
-//
-// Versions: -// -// {data.spec.versions.length > 0 && data.spec.versions.map(({ name }) => name).join(', ')} -// -//
-// -// )} -// {error && } -// -// -// {isPending && } -// {error && } -// {!error && data && data.spec && ( -// name === apiVersion)?.additionalPrinterColumns -// } -// permissions={{ -// canCreate: isNamespaced ? true : createPermission.data?.status.allowed, -// canUpdate: isNamespaced ? true : updatePermission.data?.status.allowed, -// canDelete: isNamespaced ? true : deletePermission.data?.status.allowed, -// }} -// /> -// )} -// -// -// ) -// } diff --git a/src/components/organisms/TableCrdInfo/molecules/ResourceInfo/ResourceInfo.tsx b/src/components/organisms/TableCrdInfo/molecules/ResourceInfo/ResourceInfo.tsx index 1a4239c..4647a0f 100644 --- a/src/components/organisms/TableCrdInfo/molecules/ResourceInfo/ResourceInfo.tsx +++ b/src/components/organisms/TableCrdInfo/molecules/ResourceInfo/ResourceInfo.tsx @@ -1,21 +1,16 @@ import React, { FC, useState, useEffect } from 'react' -import { useNavigate, useParams, useLocation } from 'react-router-dom' +import { useNavigate, useParams } from 'react-router-dom' import { Spin, Alert, Button, Flex } from 'antd' import { PlusOutlined, ClearOutlined, MinusOutlined } from '@ant-design/icons' import { useSelector } from 'react-redux' import { RootState } from 'store/store' import { EnrichedTableProvider, - useDirectUnknownResource, DeleteModal, DeleteModalMany, TAdditionalPrinterColumns, - TTableMappingResponse, useCrdResources, - prepareTableMappings, - parseCustomOverrides, } from '@prorobotech/openapi-k8s-toolkit' -import { BASE_API_GROUP, BASE_API_VERSION } from 'constants/customizationApiGroupAndVersion' import { FlexGrow, OverflowMaxHeightContainer, MarginTopContainer } from 'components' import { TABLE_PROPS } from 'constants/tableProps' import { @@ -57,7 +52,6 @@ export const ResourceInfo: FC = ({ inside, }) => { const navigate = useNavigate() - const { pathname } = useLocation() const params = useParams() const cluster = useSelector((state: RootState) => state.cluster.cluster) const theme = useSelector((state: RootState) => state.openapiTheme.theme) @@ -117,50 +111,6 @@ export const ResourceInfo: FC = ({ } } - const columnsOverrides = useCrdResources({ - clusterName, - crdName: 'customcolumnsoverrides', - apiGroup: BASE_API_GROUP, - apiVersion: BASE_API_VERSION, - }) - - const { - ensuredCustomOverrides, - ensuredCustomOverridesUndefinedValues, - ensuredCustomOverridesTrimLengths, - ensuredCustomOverridesColWidths, - } = parseCustomOverrides({ - columnsOverridesData: columnsOverrides.data, - overrideType: `${apiGroup}/${apiVersion}/${crdPluralName}`, - }) - - const { data: tableMappingsData } = useDirectUnknownResource({ - uri: `/api/clusters/${cluster}/k8s/apis/${BASE_API_GROUP}/${BASE_API_VERSION}/tableurimappings/`, - refetchInterval: 5000, - queryKey: ['tableMappings', cluster || 'no-cluster'], - isEnabled: cluster !== undefined, - }) - - const tableMappingsDataSpecs = tableMappingsData?.items.map(({ spec }) => spec) - const tableMappingSpecific = tableMappingsDataSpecs - ? prepareTableMappings({ - data: tableMappingsDataSpecs, - clusterName: params.clusterName, - projectName: params.projectName, - instanceName: params.instanceName, - namespace: params.namespace, - syntheticProject: params.syntheticProject, - entryType: params.entryType, - apiGroup: params.apiGroup, - apiVersion: params.apiVersion, - typeName: params.typeName, - entryName: params.entryName, - apiExtensionVersion: params.apiExtensionVersion, - crdName: params.crdName, - pathname, - }) - : undefined - const onDeleteHandle = (name: string, endpoint: string) => { setIsDeleteModalOpen({ name, endpoint }) } @@ -177,14 +127,27 @@ export const ResourceInfo: FC = ({ {!error && data && ( = ({ canDelete: permissions.canDelete, }, }} - pathToNavigate={tableMappingSpecific?.pathToNavigate} - recordKeysForNavigation={tableMappingSpecific?.keysToParse} selectData={{ selectedRowKeys, onChange: (selectedRowKeys: React.Key[], selectedRowsData: { name: string; endpoint: string }[]) => { diff --git a/src/components/organisms/TableNonCrdInfo/TableNonCrdInfo.tsx b/src/components/organisms/TableNonCrdInfo/TableNonCrdInfo.tsx index eae3b35..2e9724f 100644 --- a/src/components/organisms/TableNonCrdInfo/TableNonCrdInfo.tsx +++ b/src/components/organisms/TableNonCrdInfo/TableNonCrdInfo.tsx @@ -1,25 +1,18 @@ /* eslint-disable max-lines-per-function */ import React, { FC, useState, useEffect } from 'react' -import { useNavigate, useParams, useLocation } from 'react-router-dom' +import { useNavigate, useParams } from 'react-router-dom' import { Spin, Alert, Button, Flex } from 'antd' import { PlusOutlined, ClearOutlined, MinusOutlined } from '@ant-design/icons' import { useSelector } from 'react-redux' import { RootState } from 'store/store' import { EnrichedTableProvider, - useDirectUnknownResource, usePermissions, DeleteModal, DeleteModalMany, checkIfApiInstanceNamespaceScoped, - TTableMappingResponse, - TAdditionalPrinterColumns, - prepareTableMappings, useApiResources, - useCrdResources, - parseCustomOverrides, } from '@prorobotech/openapi-k8s-toolkit' -import { BASE_API_GROUP, BASE_API_VERSION } from 'constants/customizationApiGroupAndVersion' import { FlexGrow, OverflowMaxHeightContainer, MarginTopContainer } from 'components' import { TABLE_PROPS } from 'constants/tableProps' import { @@ -49,7 +42,6 @@ export const TableNonCrdInfo: FC = ({ inside, }) => { const navigate = useNavigate() - const { pathname } = useLocation() const params = useParams() const cluster = useSelector((state: RootState) => state.cluster.cluster) const theme = useSelector((state: RootState) => state.openapiTheme.theme) @@ -136,63 +128,6 @@ export const TableNonCrdInfo: FC = ({ limit, }) - const columnsOverrides = useCrdResources({ - clusterName: cluster, - crdName: 'customcolumnsoverrides', - apiGroup: BASE_API_GROUP, - apiVersion: BASE_API_VERSION, - }) - - const additionalPrinterColumns: TAdditionalPrinterColumns = [ - { - name: 'Name', - type: 'string', - jsonPath: '.metadata.name', - }, - { - name: 'Timestamp', - type: 'string', - jsonPath: '.metadata.creationTimestamp', - }, - ] - - const { - ensuredCustomOverrides, - ensuredCustomOverridesUndefinedValues, - ensuredCustomOverridesTrimLengths, - ensuredCustomOverridesColWidths, - } = parseCustomOverrides({ - columnsOverridesData: columnsOverrides.data, - overrideType: `${apiGroup}/${apiVersion}/${typeName}`, - }) - - const { data: tableMappingsData } = useDirectUnknownResource({ - uri: `/api/clusters/${cluster}/k8s/apis/${BASE_API_GROUP}/${BASE_API_VERSION}/tableurimappings/`, - refetchInterval: 5000, - queryKey: ['tableMappings', cluster || 'no-cluster'], - isEnabled: cluster !== undefined, - }) - - const tableMappingsDataSpecs = tableMappingsData?.items.map(({ spec }) => spec) - const tableMappingSpecific = tableMappingsDataSpecs - ? prepareTableMappings({ - data: tableMappingsDataSpecs, - clusterName: params.clusterName, - projectName: params.projectName, - instanceName: params.instanceName, - namespace: params.namespace, - syntheticProject: params.syntheticProject, - entryType: params.entryType, - apiGroup: params.apiGroup, - apiVersion: params.apiVersion, - typeName: params.typeName, - entryName: params.entryName, - apiExtensionVersion: params.apiExtensionVersion, - crdName: params.crdName, - pathname, - }) - : undefined - const onDeleteHandle = (name: string, endpoint: string) => { setIsDeleteModalOpen({ name, endpoint }) } @@ -209,13 +144,25 @@ export const TableNonCrdInfo: FC = ({ {!error && data && ( = ({ canDelete: isNamespaced ? true : deletePermission.data?.status.allowed, }, }} - pathToNavigate={tableMappingSpecific?.pathToNavigate} - recordKeysForNavigation={tableMappingSpecific?.keysToParse} selectData={{ selectedRowKeys, onChange: (selectedRowKeys: React.Key[], selectedRowsData: { name: string; endpoint: string }[]) => {