feat(visManager): panels

apps/web/src/app/app.tsx

@@ -77,15 +77,13 @@ export function App(props: App) {
               </aside>
               <main className="flex w-screen h-[calc(100%-4.2rem)]">
                 <Resizable divisorSize={3} horizontal={true} defaultProportion={0.33}>
-                  <div className="h-full w-full">
-                    <DataViewer auth={authCheck} />
-                  </div>
+                  <DataViewer auth={authCheck} />
                   <div className="h-full w-full">
                     <Resizable divisorSize={3} horizontal={false}>
-                      <div className="w-full h-full panel">
+                      <div className="w-full h-full border">
                         <VisualizationPanel manager={manager} />
                       </div>
-                      <div className="w-full h-full panel">
+                      <div className="w-full h-full border">
                         <QueryBuilder onRunQuery={runQuery} />
                       </div>
                     </Resizable>

libs/shared/lib/data-viewer/index.tsx

@@ -14,7 +14,7 @@ export default function DataViewer({ auth }: { auth: boolean }) {
     <div className="info-panel w-full h-full flex">
       <TooltipProvider delayDuration={100}>
         <div className="w-12 flex flex-col items-center justify-between">
-          <div>
+          <div className="flex flex-col items-center justify-between">
             <Tooltip>
               <TooltipTrigger>
                 <Button

libs/shared/lib/data-viewer/search/similarity.ts

@@ -30,7 +30,7 @@ const matches = (query: string, object: Record<string, any>): number => {
   return highestScore;
 };
 
-const jaroSimilarity = (s1: string, s2: string) => {
+export const jaroSimilarity = (s1: string, s2: string) => {
   if (s1 == s2) return 1.0;
 
   const len1 = s1.length;