From cc5a27a5b90a8ac0c6d02c70d40f43d262c238dd Mon Sep 17 00:00:00 2001
From: Maxime Jacquemin <maxime2.jacquemin@gmail.com>
Date: Wed, 30 Mar 2022 15:40:26 +0200
Subject: [PATCH] [ivette] Better feeling in callstack display & bug fix

---
 ivette/src/frama-c/plugins/eva/style.css      | 19 ++++++++----
 ivette/src/frama-c/plugins/eva/valuetable.tsx | 30 ++++++++++++++-----
 2 files changed, 37 insertions(+), 12 deletions(-)

diff --git a/ivette/src/frama-c/plugins/eva/style.css b/ivette/src/frama-c/plugins/eva/style.css
index 6a94b524dc6..3b17203e0f8 100644
--- a/ivette/src/frama-c/plugins/eva/style.css
+++ b/ivette/src/frama-c/plugins/eva/style.css
@@ -62,11 +62,16 @@
 
 .eva-info {
   width: 100%;
-  flex-wrap: wrap;
+  display: flex;
+  flex-wrap: nowrap;
+  align-items: center;
   background: var(--background-profound);
-  padding-top: 3px;
-  padding-left: 12px;
-  padding-bottom: 2px;
+  padding: 2px;
+}
+
+.eva-info-wrap {
+  flex: auto;
+  flex-wrap: wrap;
 }
 
 .eva-callsite {
@@ -145,6 +150,10 @@
   z-index: +1;
 }
 
+.eva-table tr:nth-child(n + 4) {
+  cursor: pointer;
+}
+
 .eva-table tr th {
   border-right: thin solid var(--border);
   border-top: thin solid var(--border);
@@ -171,7 +180,7 @@
   position: relative;
   overflow: auto;
   height: 100%;
-  min-height: 80px;
+  min-height: 66px;
 }
 
 .eva-functions-section {
diff --git a/ivette/src/frama-c/plugins/eva/valuetable.tsx b/ivette/src/frama-c/plugins/eva/valuetable.tsx
index 45208eaa721..208daf158ff 100644
--- a/ivette/src/frama-c/plugins/eva/valuetable.tsx
+++ b/ivette/src/frama-c/plugins/eva/valuetable.tsx
@@ -34,8 +34,8 @@ import { classes } from 'dome/misc/utils';
 import { Icon } from 'dome/controls/icons';
 import { Cell, Code } from 'dome/controls/labels';
 import { IconButton } from 'dome/controls/buttons';
-import { Filler, Hpack, Vpack, Vfill } from 'dome/layout/boxes';
 import { Inset, Button, ButtonGroup } from 'dome/frame/toolbars';
+import { Filler, Hpack, Hfill, Vpack, Vfill } from 'dome/layout/boxes';
 
 
 
@@ -237,10 +237,11 @@ interface StackInfosProps {
   callsites: Callsite[];
   isSelected: boolean;
   setSelection: (a: States.SelectionActions) => void;
+  close: () => void;
 }
 
 async function StackInfos(props: StackInfosProps): Promise<JSX.Element> {
-  const { callsites, setSelection, isSelected } = props;
+  const { callsites, setSelection, isSelected, close } = props;
   const selectedClass = isSelected ? 'eva-focused' : '';
   const className = classes('eva-callsite', selectedClass);
   if (callsites.length <= 1) return <></>;
@@ -271,7 +272,17 @@ async function StackInfos(props: StackInfosProps): Promise<JSX.Element> {
     );
   };
   const children = React.Children.toArray(callsites.map(makeCallsite));
-  return <Hpack className="eva-info">{children}</Hpack>;
+  return (
+    <div className='eva-info'>
+      <Hpack className='eva-info-wrap'>{children}</Hpack>
+      <Hfill />
+      <IconButton
+        icon='CROSS'
+        className='eva-probeinfo-button'
+        onClick={close}
+      />
+    </div>
+  );
 }
 
 /* -------------------------------------------------------------------------- */
@@ -645,7 +656,7 @@ async function FunctionSection(props: FunctionProps): Promise<JSX.Element> {
   const { setFolded, setByCallstacks, close } = props;
   const { startingCallstack, changeStartingCallstack } = props;
   const { before, after } = state;
-  const displayTable = folded || !(before || after) ? 'none' : 'table';
+  const displayTable = folded || !(before || after) ? 'none' : 'block';
   type RowHandler = React.MouseEventHandler<HTMLTableRowElement>;
   const onClick: (c: callstack) => RowHandler = (c) => (event) => {
     const elt = document.elementFromPoint(event.clientX, event.clientY);
@@ -748,8 +759,12 @@ async function FunctionSection(props: FunctionProps): Promise<JSX.Element> {
           onClick={close}
         />
       </Hpack>
-      <div onScroll={onScroll} className='eva-table-container'>
-        <table className='eva-table' style={{ display: displayTable }}>
+      <div
+        onScroll={onScroll}
+        className='eva-table-container'
+        style={{ display: displayTable }}
+      >
+        <table className='eva-table'>
           <tbody>
             <tr>
               {doCall ? headerCall : undefined}
@@ -1075,7 +1090,8 @@ function EvaTable(): JSX.Element {
     const tgt = selection.current?.marker;
     const p = (c: Callsite): boolean => c.stmt !== undefined && c.stmt === tgt;
     const isSelected = callsites.find(p) !== undefined;
-    return StackInfos({ callsites, isSelected, setSelection: select });
+    const close = (): void => setCS('Summary');
+    return StackInfos({ callsites, isSelected, setSelection: select, close });
   }, [ cs, select, getCallsites, selection ]);
   const { result: stackInfos } = Dome.usePromise(stackInfosPromise);
 
-- 
GitLab