mod: fix graphviz (#166)

.github/workflows/nightly.yml

@@ -2,10 +2,10 @@ name: Studio nightly Package
 on:
   push:
     branches:
-      - v3.3.0-dev
+      - master
 jobs:
   call-workflow:
-    uses: vesoft-inc/nebula-studio/.github/workflows/build.yml@v3.3.0-dev
+    uses: vesoft-inc/nebula-studio/.github/workflows/build.yml@master
     secrets:
       oss_endpoint: ${{ secrets.OSS_ENDPOINT }}
       oss_id: ${{ secrets.OSS_ID }}

app/pages/Console/OutputBox/Graphviz/index.less

@@ -1,5 +1,6 @@
 .console-graph {
-	#graph {
+	.graphviz-box {
+		background-color: #fff;
 		svg {
 			width: 100%;
 			overflow: auto;

app/pages/Console/OutputBox/Graphviz/index.tsx

@@ -5,18 +5,18 @@ import './index.less';
 
 interface IProps {
   graph: string;
+  index: number;
 }
 
 const Graphviz = (props: IProps) => { 
   const domRef = useRef(null);
-  const { graph } = props;
+  const { graph, index } = props;
   const renderFlowChart = () => {
     const defaultOptions: GraphvizOptions = {
-      fit: true,
       width: '100%',
-      zoom: false,
+      zoom: true,
     };
-    graphviz('#graph')
+    graphviz(`.box-${index}`)
       .options({
         ...defaultOptions,
       })
@@ -25,7 +25,7 @@ const Graphviz = (props: IProps) => {
   useEffect(() => {
     renderFlowChart();
   }, [graph]);
-  return <div id="graph" ref={domRef} />;
+  return <div className={`graphviz-box box-${index}`} ref={domRef} />;
 };
 
 export default Graphviz;

app/pages/Console/OutputBox/index.tsx

@@ -314,7 +314,7 @@ const OutputBox = (props: IProps) => {
               }
               key="graph"
             >
-              {<Graphviz graph={dataSource[0]?.format} />}
+              {<Graphviz graph={dataSource[0]?.format} index={index} />}
             </Tabs.TabPane>
           )}
           {showGraph && (