mirror of
https://github.com/reconurge/flowsint.git
synced 2026-04-30 03:09:05 -05:00
feat: open console on scan launch
This commit is contained in:
BIN
flowsint-app/public/icon.ico
Normal file
BIN
flowsint-app/public/icon.ico
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 109 KiB |
BIN
flowsint-app/public/icon.png
Normal file
BIN
flowsint-app/public/icon.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 109 KiB |
@@ -9,11 +9,9 @@ import { type CosmosInputNode } from '@cosmograph/cosmos'
|
|||||||
import { ResizablePanel, ResizablePanelGroup } from '../ui/resizable'
|
import { ResizablePanel, ResizablePanelGroup } from '../ui/resizable'
|
||||||
import EmptyState from './empty-state'
|
import EmptyState from './empty-state'
|
||||||
|
|
||||||
// Lazy loading du timeline
|
|
||||||
const CosmographTimeline = lazy(() =>
|
const CosmographTimeline = lazy(() =>
|
||||||
import('@cosmograph/react').then((module) => ({ default: module.CosmographTimeline }))
|
import('@cosmograph/react').then((module) => ({ default: module.CosmographTimeline }))
|
||||||
)
|
)
|
||||||
// Hook pour tracker l'état de chargement de Cosmograph
|
|
||||||
const useCosmographLoader = (nodes: any[], edges: any[]) => {
|
const useCosmographLoader = (nodes: any[], edges: any[]) => {
|
||||||
const [isCosmographReady, setIsCosmographReady] = useState(true)
|
const [isCosmographReady, setIsCosmographReady] = useState(true)
|
||||||
const [loadingStage, setLoadingStage] = useState<'importing' | 'rendering' | 'ready'>('ready')
|
const [loadingStage, setLoadingStage] = useState<'importing' | 'rendering' | 'ready'>('ready')
|
||||||
@@ -21,7 +19,6 @@ const useCosmographLoader = (nodes: any[], edges: any[]) => {
|
|||||||
const dataVersionRef = useRef(0)
|
const dataVersionRef = useRef(0)
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
// Reset l'état quand les données changent
|
|
||||||
dataVersionRef.current += 1
|
dataVersionRef.current += 1
|
||||||
setIsCosmographReady(false)
|
setIsCosmographReady(false)
|
||||||
setLoadingStage('importing')
|
setLoadingStage('importing')
|
||||||
@@ -30,7 +27,6 @@ const useCosmographLoader = (nodes: any[], edges: any[]) => {
|
|||||||
setLoadingStage('ready')
|
setLoadingStage('ready')
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
// Skip simulation if no edges
|
|
||||||
if (edges.length === 0) {
|
if (edges.length === 0) {
|
||||||
setIsCosmographReady(true)
|
setIsCosmographReady(true)
|
||||||
setLoadingStage('ready')
|
setLoadingStage('ready')
|
||||||
@@ -149,7 +145,6 @@ const GraphContent = memo(() => {
|
|||||||
}
|
}
|
||||||
}, [cosmograph?.cosmograph, isCosmographReady])
|
}, [cosmograph?.cosmograph, isCosmographReady])
|
||||||
|
|
||||||
// Configuration des actions une seule fois
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (cosmograph?.cosmograph && !actionsSetRef.current) {
|
if (cosmograph?.cosmograph && !actionsSetRef.current) {
|
||||||
const actions = {
|
const actions = {
|
||||||
@@ -217,7 +212,6 @@ const GraphContent = memo(() => {
|
|||||||
})
|
})
|
||||||
GraphContent.displayName = 'GraphContent'
|
GraphContent.displayName = 'GraphContent'
|
||||||
|
|
||||||
// Timeline avec ses propres optimisations
|
|
||||||
const TimelinePanel = memo(() => {
|
const TimelinePanel = memo(() => {
|
||||||
const handleAnimationPlay = useCallback(() => {}, [])
|
const handleAnimationPlay = useCallback(() => {}, [])
|
||||||
|
|
||||||
@@ -244,7 +238,6 @@ const TimelinePanel = memo(() => {
|
|||||||
})
|
})
|
||||||
TimelinePanel.displayName = 'TimelinePanel'
|
TimelinePanel.displayName = 'TimelinePanel'
|
||||||
|
|
||||||
// Provider wrapper mémorisé pour éviter les re-créations
|
|
||||||
const GraphProvider = memo(
|
const GraphProvider = memo(
|
||||||
({ nodes, edges, children }: { nodes: any[]; edges: any[]; children: React.ReactNode }) => {
|
({ nodes, edges, children }: { nodes: any[]; edges: any[]; children: React.ReactNode }) => {
|
||||||
return (
|
return (
|
||||||
@@ -256,7 +249,6 @@ const GraphProvider = memo(
|
|||||||
)
|
)
|
||||||
GraphProvider.displayName = 'GraphProvider'
|
GraphProvider.displayName = 'GraphProvider'
|
||||||
|
|
||||||
// Composant principal avec optimisations maximales
|
|
||||||
const Graph = memo(() => {
|
const Graph = memo(() => {
|
||||||
const nodes = useGraphStore((s) => s.filteredNodes)
|
const nodes = useGraphStore((s) => s.filteredNodes)
|
||||||
const edges = useGraphStore((s) => s.filteredEdges)
|
const edges = useGraphStore((s) => s.filteredEdges)
|
||||||
|
|||||||
@@ -3,16 +3,19 @@ import { useConfirm } from '@/components/use-confirm-dialog'
|
|||||||
import { flowService } from '@/api/flow-service'
|
import { flowService } from '@/api/flow-service'
|
||||||
import { useMutation, useQueryClient } from '@tanstack/react-query'
|
import { useMutation, useQueryClient } from '@tanstack/react-query'
|
||||||
import { queryKeys } from '@/api/query-keys'
|
import { queryKeys } from '@/api/query-keys'
|
||||||
|
import { useLayoutStore } from '@/stores/layout-store'
|
||||||
|
|
||||||
export function useLaunchFlow(askUser: boolean = false) {
|
export function useLaunchFlow(askUser: boolean = false) {
|
||||||
const { confirm } = useConfirm()
|
const { confirm } = useConfirm()
|
||||||
const queryClient = useQueryClient()
|
const queryClient = useQueryClient()
|
||||||
|
const openClonsole = useLayoutStore(s => s.openConsole)
|
||||||
|
|
||||||
// Launch flow mutation
|
// Launch flow mutation
|
||||||
const launchFlowMutation = useMutation({
|
const launchFlowMutation = useMutation({
|
||||||
mutationFn: ({ flowId, body }: { flowId: string; body: BodyInit }) =>
|
mutationFn: ({ flowId, body }: { flowId: string; body: BodyInit }) =>
|
||||||
flowService.launch(flowId, body),
|
flowService.launch(flowId, body),
|
||||||
onSuccess: (data, variables) => {
|
onSuccess: (_, variables) => {
|
||||||
|
openClonsole()
|
||||||
queryClient.invalidateQueries({
|
queryClient.invalidateQueries({
|
||||||
queryKey: queryKeys.flows.detail(variables.flowId)
|
queryKey: queryKeys.flows.detail(variables.flowId)
|
||||||
})
|
})
|
||||||
|
|||||||
@@ -1,9 +1,12 @@
|
|||||||
import { toast } from 'sonner'
|
import { toast } from 'sonner'
|
||||||
import { useConfirm } from '@/components/use-confirm-dialog'
|
import { useConfirm } from '@/components/use-confirm-dialog'
|
||||||
import { transformService } from '@/api/transform-service'
|
import { transformService } from '@/api/transform-service'
|
||||||
|
import { useLayoutStore } from '@/stores/layout-store'
|
||||||
|
|
||||||
export function useLaunchTransform(askUser: boolean = false) {
|
export function useLaunchTransform(askUser: boolean = false) {
|
||||||
const { confirm } = useConfirm()
|
const { confirm } = useConfirm()
|
||||||
|
const openClonsole = useLayoutStore(s => s.openConsole)
|
||||||
|
|
||||||
const launchTransform = async (
|
const launchTransform = async (
|
||||||
values: string[],
|
values: string[],
|
||||||
transformName: string,
|
transformName: string,
|
||||||
@@ -26,6 +29,7 @@ export function useLaunchTransform(askUser: boolean = false) {
|
|||||||
`Transform ${transformName} has been launched on ${sliced.join(', ')}${left > 0 ? ` and ${left} others` : ''}.`,
|
`Transform ${transformName} has been launched on ${sliced.join(', ')}${left > 0 ? ` and ${left} others` : ''}.`,
|
||||||
error: () => `An error occurred launching transform.`
|
error: () => `An error occurred launching transform.`
|
||||||
})
|
})
|
||||||
|
openClonsole()
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
return {
|
return {
|
||||||
|
|||||||
@@ -9,6 +9,7 @@ interface LayoutStore {
|
|||||||
isOpenAnalysis: boolean
|
isOpenAnalysis: boolean
|
||||||
chatWidth: number
|
chatWidth: number
|
||||||
chatHeight: number
|
chatHeight: number
|
||||||
|
openConsole: () => void
|
||||||
toggleConsole: () => void
|
toggleConsole: () => void
|
||||||
togglePanel: () => void
|
togglePanel: () => void
|
||||||
toggleChat: () => void
|
toggleChat: () => void
|
||||||
@@ -39,6 +40,7 @@ export const useLayoutStore = create<LayoutStore>()(
|
|||||||
chatHeight: 600,
|
chatHeight: 600,
|
||||||
activeTab: 'entities',
|
activeTab: 'entities',
|
||||||
activeTransformTab: 'transforms',
|
activeTransformTab: 'transforms',
|
||||||
|
openConsole: () => set(() => ({ isOpenConsole: true })),
|
||||||
toggleConsole: () => set((state) => ({ isOpenConsole: !state.isOpenConsole })),
|
toggleConsole: () => set((state) => ({ isOpenConsole: !state.isOpenConsole })),
|
||||||
togglePanel: () => set((state) => ({ isOpenPanel: !state.isOpenPanel })),
|
togglePanel: () => set((state) => ({ isOpenPanel: !state.isOpenPanel })),
|
||||||
toggleDetails: () => set((state) => ({ isOpenDetails: !state.isOpenDetails })),
|
toggleDetails: () => set((state) => ({ isOpenDetails: !state.isOpenDetails })),
|
||||||
|
|||||||
@@ -13,7 +13,6 @@ from cryptography.hazmat.primitives.ciphers.aead import AESGCM
|
|||||||
|
|
||||||
from dotenv import load_dotenv
|
from dotenv import load_dotenv
|
||||||
|
|
||||||
# Charger les variables d'environnement
|
|
||||||
load_dotenv()
|
load_dotenv()
|
||||||
|
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user