fix: show node error in list & use tabs reinit

Author: Elessar1802

src/components/ClusterNodes/ClusterTerminal.tsx

@@ -15,7 +15,7 @@
  */
 
 import { useEffect, useRef, useState } from 'react'
-import { useHistory, useLocation, useParams } from 'react-router-dom'
+import { generatePath, useHistory, useLocation, useParams } from 'react-router-dom'
 
 import {
     Checkbox,
@@ -27,6 +27,7 @@ import {
     NodeTaintType,
     noop,
     OptionType,
+    RESOURCE_BROWSER_ROUTES,
     ResponseType,
     SelectPickerOptionType,
     ServerErrors,
@@ -35,6 +36,7 @@ import {
     TabProps,
 } from '@devtron-labs/devtron-fe-common-lib'
 
+import { ResourceBrowserTabsId } from '@Components/ResourceBrowser/Constants'
 import { K8sResourceListURLParams } from '@Components/ResourceBrowser/ResourceList/types'
 import { getClusterTerminalParamsData } from '@Pages/GlobalConfigurations/ClustersAndEnvironments/cluster.util'
 
@@ -84,7 +86,7 @@ const ClusterTerminal = ({
     clusterImageList,
     namespaceList = [],
     taints,
-    updateTerminalTabUrl,
+    updateTabUrl,
 }: ClusterTerminalType) => {
     const { kind } = useParams<K8sResourceListURLParams>()
     const { replace } = useHistory()
@@ -182,7 +184,10 @@ const ClusterTerminal = ({
         queryParams.set('namespace', selectedNamespace.value)
         queryParams.set('shell', selectedTerminalType.value)
         queryParams.set('node', selectedNodeName.value)
-        updateTerminalTabUrl(queryParams.toString())
+        updateTabUrl({
+            id: ResourceBrowserTabsId.terminal,
+            url: `${generatePath(RESOURCE_BROWSER_ROUTES.TERMINAL, { clusterId })}?${queryParams.toString()}`,
+        })
         if (kind === AppDetailsTabs.terminal) {
             replace({ search: queryParams.toString() })
         }

src/components/ClusterNodes/types.ts

@@ -155,7 +155,7 @@ export interface ClusterTerminalType {
     namespaceList: string[]
     nodeGroups: SelectGroupType[]
     taints: Map<string, NodeTaintType[]>
-    updateTerminalTabUrl: (queryParams: string) => void
+    updateTabUrl: UseTabsReturnType['updateTabUrl']
 }
 
 export const TEXT_COLOR_CLASS = {

src/components/ResourceBrowser/PageHeader.buttons.tsx

@@ -47,9 +47,9 @@ export const CreateResourceButton: React.FC<CreateResourceButtonType> = ({ clust
         })
     }
 
-    const handleModalClose = () => {
+    const handleModalClose = (shouldUpdate: boolean) => {
         setShowModal(false)
-        closeModal(true)
+        closeModal(shouldUpdate)
     }
 
     return (

src/components/ResourceBrowser/ResourceList/AdminTerminal.tsx

@@ -27,7 +27,7 @@ import ClusterTerminal from '../../ClusterNodes/ClusterTerminal'
 import { createGroupSelectList, filterImageList } from '../../common'
 import { AdminTerminalProps, ClusterDetailBaseParams } from '../Types'
 
-const AdminTerminal: React.FC<AdminTerminalProps> = ({ updateTerminalTabUrl }: AdminTerminalProps) => {
+const AdminTerminal: React.FC<AdminTerminalProps> = ({ updateTabUrl }: AdminTerminalProps) => {
     const { clusterId } = useParams<ClusterDetailBaseParams>()
 
     const [loading, data, error] = useAsync(
@@ -72,7 +72,7 @@ const AdminTerminal: React.FC<AdminTerminalProps> = ({ updateTerminalTabUrl }: A
             taints={details.taints}
             clusterImageList={details.clusterImageList}
             namespaceList={details.namespaceList}
-            updateTerminalTabUrl={updateTerminalTabUrl}
+            updateTabUrl={updateTabUrl}
         />
     )
 }

src/components/ResourceBrowser/ResourceList/CreateResource.tsx

@@ -46,12 +46,13 @@ export const CreateResource: React.FC<CreateResourceType> = ({ closePopup, clust
     const [loader, setLoader] = useState(false)
     const [resourceYAML, setResourceYAML] = useState('')
     const [resourceResponse, setResourceResponse] = useState<CreateResourceDTO[]>(null)
+    const [needsUpdate, setNeedsUpdate] = useState(false)
 
     const onClose = (): void => {
         if (loader) {
             return
         }
-        closePopup(true)
+        closePopup(needsUpdate)
     }
 
     useEffect(() => {
@@ -85,6 +86,7 @@ export const CreateResource: React.FC<CreateResourceType> = ({ closePopup, clust
             if (result) {
                 setResourceResponse(result)
                 toggleCodeEditorView(false)
+                setNeedsUpdate(true)
             }
         } catch (err) {
             showError(err)
@@ -96,7 +98,7 @@ export const CreateResource: React.FC<CreateResourceType> = ({ closePopup, clust
     const renderFooter = (): JSX.Element => {
         if (showCodeEditorView) {
             return (
-                <div className="dc__border-top flex right p-16">
+                <div className="dc__border-top flex right p-16 dc__gap-8">
                     <Button
                         dataTestId="cancel-create-resource"
                         text={CREATE_RESOURCE_MODAL_MESSAGING.actionButtonText.cancel}

src/components/ResourceBrowser/ResourceList/K8sResourceListTableCellComponent.tsx

@@ -27,7 +27,7 @@ import { AddEnvironmentFormPrefilledInfoType } from '@Pages/GlobalConfigurations
 import { ClusterEnvironmentDrawer } from '@Pages/GlobalConfigurations/ClustersAndEnvironments/ClusterEnvironmentDrawer'
 import { ADD_ENVIRONMENT_FORM_LOCAL_STORAGE_KEY } from '@Pages/GlobalConfigurations/ClustersAndEnvironments/constants'
 
-import { AI_BUTTON_CONFIG_MAP, EVENT_LIST, K8S_EMPTY_GROUP } from '../Constants'
+import { AI_BUTTON_CONFIG_MAP, EVENT_LIST, K8S_EMPTY_GROUP, NODE_LIST_HEADERS_TO_KEY_MAP } from '../Constants'
 import { ClusterDetailBaseParams } from '../Types'
 import { getRenderInvolvedObjectButton, getRenderNodeButton, renderResourceValue } from '../Utils'
 import NodeActionsMenu from './NodeActionsMenu'
@@ -53,8 +53,8 @@ const K8sResourceListTableCellComponent = ({
     const { push } = useHistory()
     const { clusterId } = useParams<ClusterDetailBaseParams>()
     const isNodeListing = selectedResource?.gvk.Kind === Nodes.Node
-    const isNodeListingAndNodeHasErrors = false
-    const isNodeUnschedulable = false
+    const isNodeListingAndNodeHasErrors = isNodeListing && !!resourceData[NODE_LIST_HEADERS_TO_KEY_MAP.errors]
+    const isNodeUnschedulable = isNodeListing && !!resourceData.unschedulable
     const nameButtonRef = useRef<HTMLButtonElement>(null)
     const contextMenuRef = useRef<HTMLButtonElement>(null)
 

src/components/ResourceBrowser/ResourceList/NodeActionsMenu.tsx

@@ -167,10 +167,10 @@ const NodeActionsMenu = forwardRef<HTMLButtonElement, NodeActionsMenuProps>(
                 case NodeActionMenuOptionIdEnum.drain:
                     showDrainNodeModal()
                     break
-                case NodeActionMenuOptionIdEnum['edit-taints']:
+                case NodeActionMenuOptionIdEnum.editTaints:
                     showEditTaintsModal()
                     break
-                case NodeActionMenuOptionIdEnum['edit-yaml']:
+                case NodeActionMenuOptionIdEnum.editYaml:
                     handleEditYamlAction()
                     break
                 case NodeActionMenuOptionIdEnum.delete: