Skip to content
Merged
Show file tree
Hide file tree
Changes from 5 commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
490 changes: 249 additions & 241 deletions frontend/package-lock.json

Large diffs are not rendered by default.

13 changes: 7 additions & 6 deletions frontend/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -36,8 +36,8 @@
"@mui/material": "^6.4.7",
"@mui/x-tree-view": "^7.26.0",
"@octokit/rest": "^22.0.0",
"@react-three/drei": "^9.80.0",
"@react-three/fiber": "^8.13.6",
"@react-three/drei": "^10.7.7",
"@react-three/fiber": "^9.4.2",
"@tanstack/react-query": "^5.67.1",
"@tanstack/react-query-devtools": "^5.67.1",
"@types/js-yaml": "^4.0.9",
Expand All @@ -57,9 +57,9 @@
"monaco-editor": "^0.52.2",
"nanoid": "^5.0.9",
"puppeteer-core": "^24.1.1",
"react": "^18.3.1",
"react": "^19.2.1",
Copy link

Copilot AI Dec 8, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The PR title states "Updating react 1.19.1" but the actual version being updated to is 19.2.1. The title should be corrected to "Updating react 19.2.1" to accurately reflect the version change.

Copilot uses AI. Check for mistakes.
"react-chatbot-kit": "^2.2.2",
"react-dom": "^18.3.1",
"react-dom": "^19.2.1",
"react-flow-renderer": "^10.3.17",
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

remove this dependency

Suggested change
"react-flow-renderer": "^10.3.17",

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

and I think after removing this re run the commands to update lock file

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

done i remove this and update the pr

"react-hot-toast": "^2.5.2",
"react-i18next": "^15.5.2",
Expand Down Expand Up @@ -91,9 +91,10 @@
"@types/js-yaml": "^4.0.9",
"@types/lodash": "^4.17.16",
"@types/node": "^22.13.1",
"@types/react": "^18.3.18",
"@types/react-dom": "^18.3.5",
"@types/react": "^19.2.7",
"@types/react-dom": "^19.2.3",
"@types/testing-library__jest-dom": "^6.0.0",
"@types/three": "^0.181.0",
"@types/xterm": "^3.0.0",
"@vitejs/plugin-react": "^4.3.2",
"autoprefixer": "^10.4.20",
Expand Down
7 changes: 5 additions & 2 deletions frontend/src/components/CommandPalette.tsx
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { useEffect, useState, useRef } from 'react';
import React, { useEffect, useState, useRef } from 'react';
import { createPortal } from 'react-dom';
import { useNavigate } from 'react-router-dom';
import { motion, AnimatePresence, Variants } from 'framer-motion';
Expand Down Expand Up @@ -875,7 +875,10 @@ const CommandListItem: React.FC<CommandListItemProps> = ({
background: isDark ? 'rgba(55, 65, 81, 0.5)' : 'rgba(243, 244, 246, 0.7)',
}}
>
<command.icon className="text-base" style={{ color: getIconColor(command.type) }} />
{React.createElement(command.icon, {
className: 'text-base',
style: { color: getIconColor(command.type) },
})}
</div>
<div className="min-w-0 flex-1">
<div
Expand Down
4 changes: 3 additions & 1 deletion frontend/src/components/LanguageSwitcher.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -316,7 +316,9 @@ const LanguageSwitcher = () => {
{languages.map((lang, idx) => (
<button
key={lang.code}
ref={el => (itemRefs.current[idx] = el)}
ref={el => {
itemRefs.current[idx] = el;
}}
tabIndex={0}
onClick={() => changeLanguage(lang.code)}
className={
Expand Down
2 changes: 1 addition & 1 deletion frontend/src/components/ProtectedRoute.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ import { useAuth } from '../hooks/useAuth';
import LoadingFallback from './LoadingFallback';

interface ProtectedRouteProps {
children: JSX.Element;
children: React.ReactNode;
}

const ProtectedRoute = ({ children }: ProtectedRouteProps) => {
Expand Down
2 changes: 1 addition & 1 deletion frontend/src/components/PublicRoute.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ import { motion, AnimatePresence } from 'framer-motion';
import { useAuth } from '../hooks/useAuth';

interface PublicRouteProps {
children: JSX.Element;
children: React.ReactNode;
}

const PublicRoute = ({ children }: PublicRouteProps) => {
Expand Down
80 changes: 43 additions & 37 deletions frontend/src/components/WecsTopology.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -52,43 +52,6 @@ import { api } from '../lib/api';
import useEdgeTypeStore from '../stores/edgeTypeStore';

// Updated Interfaces
export interface NodeData {
label: JSX.Element;
isDeploymentOrJobPod?: boolean;
}

export interface BaseNode {
id: string;
data: NodeData;
position: { x: number; y: number };
style?: React.CSSProperties;
}

export interface CustomNode extends BaseNode {
sourcePosition?: Position;
targetPosition?: Position;
collapsed?: boolean;
showMenu?: boolean;
}

export interface BaseEdge {
id: string;
source: string;
target: string;
}

export interface CustomEdge extends BaseEdge {
type?: string;
animated?: boolean;
style?: React.CSSProperties;
markerEnd?: {
type: MarkerType;
width?: number;
height?: number;
color?: string;
};
}

export interface ResourceItem {
apiVersion: string;
kind: string;
Expand Down Expand Up @@ -133,6 +96,49 @@ export interface ResourceItem {
[key: string]: unknown; // Add index signature to make compatible with TreeViewComponent
}

export interface NodeLabelProps {
label: string;
resourceData?: ResourceItem;
[key: string]: unknown;
}

export interface NodeData {
label: React.ReactElement<NodeLabelProps>;
isDeploymentOrJobPod?: boolean;
}

export interface BaseNode {
id: string;
data: NodeData;
position: { x: number; y: number };
style?: React.CSSProperties;
}

export interface CustomNode extends BaseNode {
sourcePosition?: Position;
targetPosition?: Position;
collapsed?: boolean;
showMenu?: boolean;
}

export interface BaseEdge {
id: string;
source: string;
target: string;
}

export interface CustomEdge extends BaseEdge {
type?: string;
animated?: boolean;
style?: React.CSSProperties;
markerEnd?: {
type: MarkerType;
width?: number;
height?: number;
color?: string;
};
}

export interface WecsResource {
name: string;
raw: ResourceItem;
Expand Down
2 changes: 1 addition & 1 deletion frontend/src/components/bindingPolicy/BPTable.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -45,7 +45,7 @@ const BPTable: React.FC<BPTableProps> = ({
setActiveFilters,
selectedPolicies,
onSelectionChange,
}): JSX.Element => {
}) => {
// Add debug log to see the policies structure
console.log('BPTable - Received Policies:', policies);

Expand Down
2 changes: 1 addition & 1 deletion frontend/src/components/common/ButtonTooltip.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ import React from 'react';
interface TooltipProps {
tooltip: string;
disabled: boolean;
children: React.ReactNode;
children?: React.ReactNode;
className?: string;
placement?: 'top' | 'bottom' | 'left' | 'right';
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -25,8 +25,8 @@ interface LabelsListProps {
onEditKeyChange: (value: string) => void;
onEditValueChange: (value: string) => void;
onEditKeyDown: (e: React.KeyboardEvent) => void;
editKeyInputRef: React.RefObject<HTMLInputElement>;
editValueInputRef: React.RefObject<HTMLInputElement>;
editKeyInputRef: React.RefObject<HTMLInputElement | null>;
editValueInputRef: React.RefObject<HTMLInputElement | null>;
t: (key: string, options?: Record<string, string | number>) => string;
}

Expand Down
4 changes: 2 additions & 2 deletions frontend/src/components/its/ImportCluster/QuickConnectTab.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -44,7 +44,7 @@ interface QuickConnectProps {
message: string;
severity: 'success' | 'error' | 'warning' | 'info';
}) => void;
successAlertRef: RefObject<HTMLDivElement>;
successAlertRef: RefObject<HTMLDivElement | null>;
setManualCommand: (command: CommandResponse | null) => void;
showLogs: boolean;
setShowLogs: (show: boolean) => void;
Expand Down Expand Up @@ -400,7 +400,7 @@ const SuccessView: React.FC<{
textColor: string;
manualCommand: CommandResponse;
cardStyle: SxProps<Theme>;
successAlertRef: RefObject<HTMLDivElement>;
successAlertRef: RefObject<HTMLDivElement | null>;
onCancel: () => void;
clearManualCommand: () => void;
primaryButtonStyles: SxProps<Theme>;
Expand Down
6 changes: 2 additions & 4 deletions frontend/src/components/login/globe/CosmicDust.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -48,16 +48,14 @@ const CosmicDust = ({ isActive = true }: CosmicDustProps) => {
<bufferGeometry>
<bufferAttribute
attach="attributes-position"
args={[positions, 3]}
count={count}
array={positions}
itemSize={3}
usage={THREE.StaticDrawUsage}
/>
<bufferAttribute
attach="attributes-size"
args={[sizes, 1]}
count={count}
array={sizes}
itemSize={1}
usage={THREE.StaticDrawUsage}
/>
</bufferGeometry>
Expand Down
2 changes: 1 addition & 1 deletion frontend/src/components/menu/Tooltip.tsx
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
import ReactDOM from 'react-dom';

interface TooltipProps {
children: React.ReactNode;
children?: React.ReactNode;
position: { top: number; left: number };
}

Expand Down
2 changes: 1 addition & 1 deletion frontend/src/components/treeView/TreeViewCanvas.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -42,7 +42,7 @@ interface TreeViewCanvasProps {
onExpandAll: () => void;
onCollapseAll: () => void;
isCollapsed: boolean;
containerRef: React.RefObject<HTMLDivElement>;
containerRef: React.RefObject<HTMLDivElement | null>;
resourceFilters?: ObjectFilter;
onResourceFiltersChange?: (filters: ObjectFilter) => void;
onToggleFullscreen?: () => void;
Expand Down
3 changes: 2 additions & 1 deletion frontend/src/components/treeView/TreeViewNodes.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -471,7 +471,8 @@ export const useTreeViewNodes = ({ onNodeSelect, onMenuOpen, isExpanded }: TreeV
const updateNodeStyles = useCallback(
(nodes: CustomNode[]) => {
return nodes.map(node => {
const resourceData = node.data?.label?.props?.resourceData;
const resourceData = (node.data?.label?.props as { resourceData?: ResourceItem })
?.resourceData;
const hasHighlightedLabel =
resourceData?.metadata?.labels &&
highlightedLabels &&
Expand Down
8 changes: 7 additions & 1 deletion frontend/src/components/treeView/types.ts
Original file line number Diff line number Diff line change
Expand Up @@ -2,8 +2,14 @@ import React from 'react';
import { Position, MarkerType } from 'reactflow';

// Base interfaces
export interface NodeLabelProps {
label: string;
resourceData?: ResourceItem;
[key: string]: unknown;
}

export interface NodeData {
label: JSX.Element;
label: React.ReactElement<NodeLabelProps>;
}

export interface BaseNode {
Expand Down
2 changes: 1 addition & 1 deletion frontend/src/components/wecs_details/tabs/ExecTab.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -29,7 +29,7 @@ interface ExecTabProps {
selectedContainer: string;
loadingContainers: boolean;
isTerminalMaximized: boolean;
execTerminalRef: React.RefObject<HTMLDivElement>;
execTerminalRef: React.RefObject<HTMLDivElement | null>;
execTerminalKey: string;
handleContainerChange: (event: SelectChangeEvent<string>) => void;
setIsContainerSelectActive: (active: boolean) => void;
Expand Down
2 changes: 1 addition & 1 deletion frontend/src/components/wecs_details/tabs/LogsTab.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,7 @@ interface LogsTabProps {
type: string;
theme: string;
t: (key: string, options?: Record<string, unknown>) => string;
terminalRef: React.RefObject<HTMLDivElement>;
terminalRef: React.RefObject<HTMLDivElement | null>;
logsContainers: ContainerInfo[];
selectedLogsContainer: string;
loadingLogsContainers: boolean;
Expand Down
10 changes: 5 additions & 5 deletions frontend/src/pages/Dashboard.tsx
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { useEffect, useState, useMemo, useCallback, Suspense, lazy } from 'react';
import React, { useEffect, useState, useMemo, useCallback, Suspense, lazy } from 'react';
import { useK8sQueries } from '../hooks/queries/useK8sQueries';
import { useClusterQueries } from '../hooks/queries/useClusterQueries';
import { motion, AnimatePresence, Variants } from 'framer-motion';
Expand Down Expand Up @@ -116,7 +116,7 @@ const OptimizedProgressBar = ({
<div>
<div className="mb-2 flex items-center justify-between">
<span className="group relative flex items-center text-sm font-medium text-gray-600 dark:text-gray-300">
{Icon && <Icon size={14} className="mr-2 text-gray-500" />}
{Icon && React.createElement(Icon, { size: 14, className: 'mr-2 text-gray-500' })}
{label}
{tooltip && (
<>
Expand Down Expand Up @@ -293,7 +293,7 @@ const StatCard = ({
};

interface CardLinkWrapperProps {
children: React.ReactNode;
children?: React.ReactNode;
link?: string;
}

Expand Down Expand Up @@ -391,7 +391,7 @@ const StatCard = ({
<div className="mb-4 flex items-center justify-between">
<div className="flex items-center">
<div className={`rounded-xl p-2.5 ${getIconGradient()} mr-3 text-white shadow-lg`}>
<Icon size={18} />
{React.createElement(Icon, { size: 18 })}
</div>
<span className="text-sm font-medium text-gray-700 transition-colors dark:text-gray-300">
{title}
Expand Down Expand Up @@ -459,7 +459,7 @@ const OverviewCard = ({
<div className="flex items-center justify-between border-b px-5 pb-3 pt-5 dark:border-gray-700">
<div className="flex items-center">
<div className={`mr-3 rounded-lg p-2 ${iconColor} transition-colors`}>
<Icon size={18} />
{React.createElement(Icon, { size: 18 })}
</div>
<h2 className="text-lg font-semibold text-gray-900 transition-colors dark:text-gray-100">
{title}
Expand Down
Loading