From d7de3f9c5798f650a8559c44421d23f144a60980 Mon Sep 17 00:00:00 2001
From: Guillaume Paris <guillaume.paris@filigran.io>
Date: Wed, 28 Aug 2024 15:01:53 +0200
Subject: [PATCH 1/2] [frontend] fix icon import in NodePhantom

---
 openbas-front/src/components/nodes/NodePhantom.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/openbas-front/src/components/nodes/NodePhantom.tsx b/openbas-front/src/components/nodes/NodePhantom.tsx
index b1baa91230..72954b4ca6 100644
--- a/openbas-front/src/components/nodes/NodePhantom.tsx
+++ b/openbas-front/src/components/nodes/NodePhantom.tsx
@@ -1,6 +1,6 @@
 import React, { FunctionComponent, memo } from 'react';
 import { makeStyles } from '@mui/styles';
-import AddCircleOutlineIcon from '@mui/icons-material/AddCircleOutline';
+import { AddCircleOutline } from '@mui/icons-material';
 import type { Theme } from '../Theme';
 
 const useStyles = makeStyles<Theme>(() => ({
@@ -47,7 +47,7 @@ const NodePhantomComponent: FunctionComponent<Props> = (props) => {
       <div style={{ width: '500px', height: '50px' }}>
         <div className={classes.node} style={{ color: 'white' }}>
           <div className={classes.iconContainer}>
-            <AddCircleOutlineIcon className={classes.icon} style={{ fontSize: '30px' }}/>
+            <AddCircleOutline className={classes.icon} style={{ fontSize: '30px' }}/>
           </div>
         </div>
         <span className={classes.time}>

From 0cfbe1ac97dcdab586f3a484a6457e1fc1a540ae Mon Sep 17 00:00:00 2001
From: Guillaume Paris <guillaume.paris@filigran.io>
Date: Wed, 28 Aug 2024 15:02:35 +0200
Subject: [PATCH 2/2] [frontend] move style import of reactflow in the index

---
 .../atomic_testings/atomic_testing/TargetResultsDetail.tsx       | 1 -
 openbas-front/src/index.tsx                                      | 1 +
 2 files changed, 1 insertion(+), 1 deletion(-)

diff --git a/openbas-front/src/admin/components/atomic_testings/atomic_testing/TargetResultsDetail.tsx b/openbas-front/src/admin/components/atomic_testings/atomic_testing/TargetResultsDetail.tsx
index 7e7cf0189e..5837584d28 100644
--- a/openbas-front/src/admin/components/atomic_testings/atomic_testing/TargetResultsDetail.tsx
+++ b/openbas-front/src/admin/components/atomic_testings/atomic_testing/TargetResultsDetail.tsx
@@ -23,7 +23,6 @@ import {
 } from '@mui/material';
 import { makeStyles, useTheme } from '@mui/styles';
 import { Edge, MarkerType, ReactFlow, ReactFlowProvider, useEdgesState, useNodesState, useReactFlow } from '@xyflow/react';
-import '@xyflow/react/dist/style.css';
 import { AddBoxOutlined, MoreVertOutlined } from '@mui/icons-material';
 import type { InjectResultDTO, InjectTargetWithResult, InjectExpectationResult } from '../../../../utils/api-types';
 import { fetchInjectResultDto, fetchTargetResult } from '../../../../actions/atomic_testings/atomic-testing-actions';
diff --git a/openbas-front/src/index.tsx b/openbas-front/src/index.tsx
index b8fe737e32..5b75880fb6 100644
--- a/openbas-front/src/index.tsx
+++ b/openbas-front/src/index.tsx
@@ -2,6 +2,7 @@ import React from 'react';
 import '@fontsource/ibm-plex-sans';
 import '@fontsource/geologica';
 import { createRoot } from 'react-dom/client';
+import '@xyflow/react/dist/style.css';
 import App from './app';
 import './static/css/index.css';
 import './static/css/CKEditorDark.css';