salman/igny8
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

123

Browse Source
This commit is contained in:
Desktop
2025-11-12 22:17:37 +05:00
parent 7c48854e86
commit 883e4642dc
4 changed files with 18 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
frontend/src/components/common/ComponentCard.tsx
View File

@@ -13,10 +13,10 @@ const ComponentCard: React.FC<ComponentCardProps> = ({
}) => {
return (
<div
className={`rounded-2xl border border-gray-200 bg-white dark:border-gray-800 dark:bg-white/[0.03] ${className}`}
className={`rounded-2xl border border-gray-200 bg-white dark:border-gray-800 dark:bg-white/[0.03] overflow-visible ${className}`}
>
{/* Card Header */}
<div className="px-6 py-5">
<div className="px-6 py-5 relative z-0">
<h3 className="text-base font-medium text-gray-800 dark:text-white/90">
{title}
</h3>
@@ -28,7 +28,7 @@ const ComponentCard: React.FC<ComponentCardProps> = ({
</div>
{/* Card Body */}
<div className="p-4 border-t border-gray-100 dark:border-gray-800 sm:p-6">
<div className="p-4 border-t border-gray-100 dark:border-gray-800 sm:p-6 overflow-visible">
<div className="space-y-6">{children}</div>
</div>
</div>

20
frontend/src/components/dashboard/WorkflowPipeline.tsx
View File

@@ -1,4 +1,4 @@
import { ReactNode } from "react";
import React, { ReactNode } from "react";
import { Link } from "react-router";
import { CheckCircleIcon, TimeIcon, ArrowRightIcon } from "../../icons";
import { Tooltip } from "../ui/tooltip";
@@ -59,8 +59,8 @@ export default function WorkflowPipeline({
};
return (
<div className={`relative ${className}`}>
<div className="flex items-center justify-between gap-4 overflow-x-auto pb-4 scrollbar-hide">
<div className={`relative overflow-visible ${className}`}>
<div className="flex items-center justify-between gap-2 overflow-x-auto pb-4 scrollbar-hide">
<style>{`
.scrollbar-hide::-webkit-scrollbar {
display: none;
@@ -75,9 +75,9 @@ export default function WorkflowPipeline({
const nextStep = !isLast ? steps[index + 1] : null;
return (
<div key={step.number} className="flex items-center flex-shrink-0">
<React.Fragment key={step.number}>
{/* Step Node */}
<div className="flex flex-col items-center">
<div className="flex flex-col items-center flex-shrink-0">
<Tooltip
text={
step.details ||
@@ -149,13 +149,13 @@ export default function WorkflowPipeline({
{/* Connection Line */}
{!isLast && showConnections && (
<div className="flex items-center mx-2 flex-shrink-0">
<div className={`h-0.5 w-16 ${getConnectionColor(step.status, nextStep?.status)} transition-colors duration-300`} />
<ArrowRightIcon className={`size-4 ${step.status === "completed" ? "text-success-500" : "text-gray-400"} transition-colors duration-300`} />
<div className={`h-0.5 w-16 ${getConnectionColor(step.status, nextStep?.status)} transition-colors duration-300`} />
<div className="flex items-center flex-1 min-w-[60px] max-w-[120px] mx-1">
<div className={`h-0.5 flex-1 ${getConnectionColor(step.status, nextStep?.status)} transition-colors duration-300`} />
<ArrowRightIcon className={`size-4 mx-1 flex-shrink-0 ${step.status === "completed" ? "text-success-500" : "text-gray-400"} transition-colors duration-300`} />
<div className={`h-0.5 flex-1 ${getConnectionColor(step.status, nextStep?.status)} transition-colors duration-300`} />
</div>
)}
</div>
</React.Fragment>
);
})}
</div>

4
frontend/src/components/ui/tooltip/EnhancedTooltip.tsx
View File

@@ -58,6 +58,7 @@ export const EnhancedTooltip: React.FC<EnhancedTooltipProps> = ({
<div
ref={triggerRef}
className={`relative inline-flex ${className}`}
style={{ zIndex: 1 }}
onMouseEnter={handleMouseEnter}
onMouseLeave={handleMouseLeave}
>
@@ -66,12 +67,13 @@ export const EnhancedTooltip: React.FC<EnhancedTooltipProps> = ({
<div
ref={tooltipRef}
className={`
absolute z-[9999] px-3 py-2 text-xs font-medium text-white bg-gray-900 rounded-lg
absolute z-[99999] px-3 py-2 text-xs font-medium text-white bg-gray-900 rounded-lg
opacity-100 pointer-events-none transition-opacity duration-200
whitespace-normal max-w-xs shadow-lg
before:absolute before:border-4 before:border-transparent before:content-['']
${placementClasses[placement]}
`}
style={{ zIndex: 99999 }}
onMouseEnter={() => setIsVisible(true)}
onMouseLeave={() => setIsVisible(false)}
>

4
frontend/src/components/ui/tooltip/Tooltip.tsx
View File

@@ -23,10 +23,10 @@ export const Tooltip: React.FC<TooltipProps> = ({
};
return (
<div className={`relative group inline-flex ${className}`}>
<div className={`relative group inline-flex ${className}`} style={{ zIndex: 1 }}>
{children}
<span
className={`absolute z-[9999] px-3 py-1.5 text-xs font-medium text-white bg-gray-900 rounded-lg opacity-0 pointer-events-none group-hover:opacity-100 transition-opacity whitespace-nowrap before:absolute before:border-4 before:border-transparent before:content-[''] ${placementClasses[placement]}`}
className={`absolute z-[99999] px-3 py-1.5 text-xs font-medium text-white bg-gray-900 rounded-lg opacity-0 pointer-events-none group-hover:opacity-100 transition-opacity whitespace-nowrap before:absolute before:border-4 before:border-transparent before:content-[''] ${placementClasses[placement]}`}
>
{text}
</span>