Merge branch 'master' of github.com:wandb/weave into mbarrramsey/trac…

…e_charts

docs/docs/guides/core-types/media.md

@@ -1,10 +1,10 @@
 # Logging media
 
-Weave supports logging and displaying multiple first class media types. Log images with `PIL.Image` and audio with `wave.Wave_read` either directly with the object API, or as the inputs or output of an op.
+Weave supports logging and displaying multiple first class media types. Log images with `PIL.Image.Image` and audio with `wave.Wave_read` either directly with the object API, or as the inputs or output of an op.
 
 ## Images
 
-Logging type: `PIL.Image`. Here is an example of logging an image with the OpenAI DALL-E API:
+Logging type: `PIL.Image.Image`. Here is an example of logging an image with the OpenAI DALL-E API:
 
 ```python
 import weave
@@ -29,7 +29,7 @@ def generate_image(prompt: str) -> Image:
     image_response = requests.get(image_url, stream=True)
     image = Image.open(image_response.raw)
 
-    # return an Image.Image object to be logged as an image
+    # return a PIL.Image.Image object to be logged as an image
     return image
 
 generate_image("a cat with a pumpkin hat")

weave-js/package.json

@@ -139,7 +139,7 @@
     "tailwindcss-radix": "^2.8.0",
     "umap-js": "^1.3.3",
     "unified": "^10.1.0",
-    "unist-util-visit": "2.0.3",
+    "unist-util-visit": "3.1.0",
     "universal-perf-hooks": "^1.0.1",
     "vega": "^5.24.0",
     "vega-lite": "5.6.0",

weave-js/src/common/util/markdown.ts

@@ -14,7 +14,7 @@ import math from 'remark-math';
 import parse from 'remark-parse';
 import remark2rehype from 'remark-rehype';
 import {Plugin, unified} from 'unified';
-import visit from 'unist-util-visit';
+import {visit} from 'unist-util-visit';
 
 import {blankifyLinks, shiftHeadings} from './html';
 

weave-js/src/components/PagePanelComponents/Home/Browse3/pages/CallPage/CallSummary.tsx

@@ -1,5 +1,6 @@
 import _ from 'lodash';
-import React from 'react';
+import numeral from 'numeral';
+import React, {useMemo} from 'react';
 
 import {Timestamp} from '../../../../../Timestamp';
 import {UserLink} from '../../../../../UserLink';
@@ -34,6 +35,22 @@ export const CallSummary: React.FC<{
   );
   const costData = call.traceCall?.summary?.weave?.costs;
 
+  const inputBytes = useMemo(
+    () =>
+      call.traceCall?.inputs
+        ? JSON.stringify(call.traceCall?.inputs).length
+        : 0,
+    [call.traceCall?.inputs]
+  );
+  const outputBytes = useMemo(
+    () =>
+      call.traceCall?.output
+        ? JSON.stringify(call.traceCall?.output).length
+        : 0,
+    [call.traceCall?.output]
+  );
+  const totalBytesStored = inputBytes + outputBytes;
+
   return (
     <div className="overflow-auto px-16 pt-12">
       {costData && (
@@ -75,6 +92,7 @@ export const CallSummary: React.FC<{
                 Latency: span.summary.latency_s.toFixed(3) + 's',
               }
             : {}),
+          'Bytes stored': numeral(totalBytesStored).format('0.0b'),
           ...(Object.keys(attributes).length > 0
             ? {Attributes: attributes}
             : {}),

weave-js/src/components/PagePanelComponents/Home/Browse3/pages/CallsPage/CallsTable.tsx

@@ -40,7 +40,7 @@ import {useHistory} from 'react-router-dom';
 
 import {useViewerInfo} from '../../../../../../common/hooks/useViewerInfo';
 import {A, TargetBlank} from '../../../../../../common/util/links';
-import {Tailwind} from '../../../../../Tailwind';
+import {TailwindContents} from '../../../../../Tailwind';
 import {flattenObjectPreservingWeaveTypes} from '../../../Browse2/browse2Util';
 import {useWeaveflowCurrentRouteContext} from '../../context';
 import {OnAddFilter} from '../../filters/CellFilterWrapper';
@@ -664,7 +664,7 @@ export const CallsTable: FC<{
         alignItems: 'center',
       }}
       filterListItems={
-        <Tailwind style={{display: 'contents'}}>
+        <TailwindContents>
           <RefreshButton onClick={() => calls.refetch()} />
           {!hideOpSelector && (
             <div className="flex-none">
@@ -847,7 +847,7 @@ export const CallsTable: FC<{
               </div>
             </>
           )}
-        </Tailwind>
+        </TailwindContents>
       }>
       <StyledDataGrid
         // Start Column Menu

weave-js/src/components/PagePanelComponents/Home/Browse3/pages/ObjectVersionPage.tsx

@@ -1,5 +1,6 @@
 import Box from '@mui/material/Box';
 import {useObjectViewEvent} from '@wandb/weave/integrations/analytics/useViewEvents';
+import numeral from 'numeral';
 import React, {useMemo} from 'react';
 
 import {maybePluralizeWord} from '../../../../../core/util/string';
@@ -190,6 +191,11 @@ const ObjectVersionPageInner: React.FC<{
   const evalHasCalls = (consumingCalls.result?.length ?? 0) > 0;
   const evalHasCallsLoading = consumingCalls.loading;
 
+  const bytesStored = useMemo(
+    () => (data.result?.[0] ? JSON.stringify(data.result?.[0]).length : 0),
+    [data.result]
+  );
+
   if (isEvaluation && evalHasCallsLoading) {
     return <CenteredAnimatedLoader />;
   }
@@ -238,6 +244,15 @@ const ObjectVersionPageInner: React.FC<{
                   Subpath: refExtra,
                 }
               : {}),
+            'Bytes stored': (
+              <>
+                {data.loading ? (
+                  <LoadingDots />
+                ) : (
+                  numeral(bytesStored).format('0.0b')
+                )}
+              </>
+            ),
             // 'Type Version': (
             //   <TypeVersionLink
             //     entityName={entityName}

weave-js/src/components/PagePanelComponents/Home/Browse3/pages/common/SimplePageLayout.tsx

@@ -332,6 +332,7 @@ export const SimpleKeyValueTable: FC<{
                   display: 'flex',
                   flexDirection: 'column',
                   justifyContent: 'flex-start',
+                  width: 100,
                 }}>
                 {key}
               </td>

weave-js/src/components/RadixTooltip/index.tsx

@@ -3,7 +3,7 @@ import classNames from 'classnames';
 import React from 'react';
 import {twMerge} from 'tailwind-merge';
 
-import {Tailwind} from '../Tailwind';
+import {TailwindContents} from '../Tailwind';
 
 /**
  * {@link https://www.radix-ui.com/docs/primitives/components/tooltip#provider}
@@ -42,7 +42,7 @@ export const Trigger = ({
   ...props
 }: RadixTooltip.TooltipTriggerProps) => (
   <RadixTooltip.Trigger
-    className={twMerge(classNames('cursor-default', className))}
+    className={twMerge(classNames('cursor-inherit', className))}
     {...props}
   />
 );
@@ -57,7 +57,7 @@ export const Portal = RadixTooltip.Portal;
  */
 export const Content = React.forwardRef(
   ({className, children, ...props}: RadixTooltip.TooltipContentProps, ref) => (
-    <Tailwind style={{display: 'contents'}}>
+    <TailwindContents>
       <RadixTooltip.Content
         className={twMerge(
           'night-aware',
@@ -69,6 +69,6 @@ export const Content = React.forwardRef(
         {...props}>
         {children}
       </RadixTooltip.Content>
-    </Tailwind>
+    </TailwindContents>
   )
 );

weave-js/src/components/Tailwind.tsx

@@ -34,3 +34,26 @@ export const Tailwind: React.FC<TailwindProps> = ({
     </div>
   );
 };
+
+/**
+ * A tailwind wrapper with display: contents so that it doesn't affect document flow
+ */
+export const TailwindContents: React.FC<TailwindProps> = ({
+  children,
+  className,
+  style,
+}) => {
+  const styles = React.useMemo(
+    () => ({
+      ...style,
+      display: 'contents',
+    }),
+    [style]
+  );
+
+  return (
+    <Tailwind style={styles} className={className}>
+      {children}
+    </Tailwind>
+  );
+};

weave-js/yarn.lock

@@ -14868,6 +14868,14 @@ unist-util-visit-parents@^3.0.0:
     "@types/unist" "^2.0.0"
     unist-util-is "^4.0.0"
 
+unist-util-visit-parents@^4.0.0:
+  version "4.1.1"
+  resolved "https://registry.yarnpkg.com/unist-util-visit-parents/-/unist-util-visit-parents-4.1.1.tgz#e83559a4ad7e6048a46b1bdb22614f2f3f4724f2"
+  integrity sha512-1xAFJXAKpnnJl8G7K5KgU7FY55y3GcLIXqkzUj5QF/QVP7biUm0K0O2oqVkYsdjzJKifYeWn9+o6piAK2hGSHw==
+  dependencies:
+    "@types/unist" "^2.0.0"
+    unist-util-is "^5.0.0"
+
 unist-util-visit-parents@^5.0.0, unist-util-visit-parents@^5.1.1:
   version "5.1.3"
   resolved "https://registry.yarnpkg.com/unist-util-visit-parents/-/unist-util-visit-parents-5.1.3.tgz#b4520811b0ca34285633785045df7a8d6776cfeb"
@@ -14876,14 +14884,14 @@ unist-util-visit-parents@^5.0.0, unist-util-visit-parents@^5.1.1:
     "@types/unist" "^2.0.0"
     unist-util-is "^5.0.0"
 
-unist-util-visit@2.0.3, unist-util-visit@^2.0.0, unist-util-visit@^2.0.3:
-  version "2.0.3"
-  resolved "https://registry.yarnpkg.com/unist-util-visit/-/unist-util-visit-2.0.3.tgz#c3703893146df47203bb8a9795af47d7b971208c"
-  integrity sha512-iJ4/RczbJMkD0712mGktuGpm/U4By4FfDonL7N/9tATGIF4imikjOuagyMY53tnZq3NP6BcmlrHhEKAfGWjh7Q==
+unist-util-visit@3.1.0:
+  version "3.1.0"
+  resolved "https://registry.yarnpkg.com/unist-util-visit/-/unist-util-visit-3.1.0.tgz#9420d285e1aee938c7d9acbafc8e160186dbaf7b"
+  integrity sha512-Szoh+R/Ll68QWAyQyZZpQzZQm2UPbxibDvaY8Xc9SUtYgPsDzx5AWSk++UUt2hJuow8mvwR+rG+LQLw+KsuAKA==
   dependencies:
     "@types/unist" "^2.0.0"
-    unist-util-is "^4.0.0"
-    unist-util-visit-parents "^3.0.0"
+    unist-util-is "^5.0.0"
+    unist-util-visit-parents "^4.0.0"
 
 unist-util-visit@^1.1.0:
   version "1.4.1"
@@ -14892,6 +14900,15 @@ unist-util-visit@^1.1.0:
   dependencies:
     unist-util-visit-parents "^2.0.0"
 
+unist-util-visit@^2.0.0, unist-util-visit@^2.0.3:
+  version "2.0.3"
+  resolved "https://registry.yarnpkg.com/unist-util-visit/-/unist-util-visit-2.0.3.tgz#c3703893146df47203bb8a9795af47d7b971208c"
+  integrity sha512-iJ4/RczbJMkD0712mGktuGpm/U4By4FfDonL7N/9tATGIF4imikjOuagyMY53tnZq3NP6BcmlrHhEKAfGWjh7Q==
+  dependencies:
+    "@types/unist" "^2.0.0"
+    unist-util-is "^4.0.0"
+    unist-util-visit-parents "^3.0.0"
+
 unist-util-visit@^4.0.0:
   version "4.1.2"
   resolved "https://registry.yarnpkg.com/unist-util-visit/-/unist-util-visit-4.1.2.tgz#125a42d1eb876283715a3cb5cceaa531828c72e2"