Merge branch 'master' into josiah/fix-playground-anth-edit

docs/docs/guides/evaluation/scorers.md

@@ -455,7 +455,7 @@ In Weave, Scorers are used to evaluate AI outputs and return evaluation metrics.
     from weave.scorers import OpenAIModerationScorer
     from openai import OpenAI
 
-    oai_client = OpenAI(api_key=...) # initialize your LLM client here
+    oai_client = OpenAI() # initialize your LLM client here
 
     scorer = OpenAIModerationScorer(
         client=oai_client,

docs/docs/guides/integrations/local_models.md

@@ -14,7 +14,6 @@ First and most important, is the `base_url` change during the `openai.OpenAI()`
 
 ```python
 client = openai.OpenAI(
-    api_key='fake',
     base_url="http://localhost:1234",
 )
 ```

docs/docs/guides/integrations/notdiamond.md

@@ -68,7 +68,6 @@ preference_id = train_router(
     response_column="actual",
     language="en",
     maximize=True,
-    api_key=api_key,
 )
 ```
 

docs/docs/quickstart.md

@@ -50,7 +50,7 @@ _In this example, we're using openai so you will need to add an OpenAI [API key]
     import weave
     from openai import OpenAI
 
-    client = OpenAI(api_key="...")
+    client = OpenAI()
 
     # Weave will track the inputs, outputs and code of this function
     # highlight-next-line

docs/docs/tutorial-tracing_2.md

@@ -24,7 +24,7 @@ Building on our [basic tracing example](/quickstart), we will now add additional
     import json
     from openai import OpenAI
 
-    client = OpenAI(api_key="...")
+    client = OpenAI()
 
     # highlight-next-line
     @weave.op()

tests/trace/test_evaluations.py

@@ -1021,13 +1021,19 @@ def my_second_scorer(text, output, model_output):
 
     ds = [{"text": "hello"}]
 
-    with pytest.raises(ValueError, match="Both 'output' and 'model_output'"):
+    with pytest.raises(
+        ValueError, match="cannot include both `output` and `model_output`"
+    ):
         scorer = MyScorer()
 
-    with pytest.raises(ValueError, match="Both 'output' and 'model_output'"):
+    with pytest.raises(
+        ValueError, match="cannot include both `output` and `model_output`"
+    ):
         evaluation = weave.Evaluation(dataset=ds, scorers=[MyScorer()])
 
-    with pytest.raises(ValueError, match="Both 'output' and 'model_output'"):
+    with pytest.raises(
+        ValueError, match="cannot include both `output` and `model_output`"
+    ):
         evaluation = weave.Evaluation(dataset=ds, scorers=[my_second_scorer])
 
 

weave-js/package.json

@@ -192,7 +192,6 @@
     "@types/react-virtualized-auto-sizer": "^1.0.0",
     "@types/safe-json-stringify": "^1.1.2",
     "@types/styled-components": "^5.1.26",
-    "@types/uuid": "^9.0.1",
     "@types/wavesurfer.js": "^2.0.0",
     "@types/zen-observable": "^0.8.3",
     "@typescript-eslint/eslint-plugin": "5.35.1",
@@ -237,7 +236,7 @@
     "tslint-config-prettier": "^1.18.0",
     "tslint-plugin-prettier": "^2.3.0",
     "typescript": "4.7.4",
-    "uuid": "^9.0.0",
+    "uuid": "^11.0.3",
     "vite": "5.2.9",
     "vitest": "^1.6.0"
   },

weave-js/src/components/ErrorBoundary.tsx

@@ -1,6 +1,7 @@
 import {datadogRum} from '@datadog/browser-rum';
 import * as Sentry from '@sentry/react';
 import React, {Component, ErrorInfo, ReactNode} from 'react';
+import {v7 as uuidv7} from 'uuid';
 
 import {weaveErrorToDDPayload} from '../errors';
 import {ErrorPanel} from './ErrorPanel';
@@ -10,33 +11,41 @@ type Props = {
 };
 
 type State = {
-  hasError: boolean;
+  uuid: string | undefined;
+  timestamp: Date | undefined;
+  error: Error | undefined;
 };
 
 export class ErrorBoundary extends Component<Props, State> {
-  public static getDerivedStateFromError(_: Error): State {
-    return {hasError: true};
+  public static getDerivedStateFromError(error: Error): State {
+    return {uuid: uuidv7(), timestamp: new Date(), error};
   }
   public state: State = {
-    hasError: false,
+    uuid: undefined,
+    timestamp: undefined,
+    error: undefined,
   };
 
   public componentDidCatch(error: Error, errorInfo: ErrorInfo) {
+    const {uuid} = this.state;
     datadogRum.addAction(
       'weave_panel_error_boundary',
-      weaveErrorToDDPayload(error)
+      weaveErrorToDDPayload(error, undefined, uuid)
     );
-
     Sentry.captureException(error, {
+      extra: {
+        uuid,
+      },
       tags: {
         weaveErrorBoundary: 'true',
       },
     });
   }
 
   public render() {
-    if (this.state.hasError) {
-      return <ErrorPanel />;
+    const {uuid, timestamp, error} = this.state;
+    if (error != null) {
+      return <ErrorPanel uuid={uuid} timestamp={timestamp} error={error} />;
     }
 
     return this.props.children;

weave-js/src/components/ErrorPanel.tsx

@@ -1,7 +1,19 @@
-import React, {forwardRef, useEffect, useRef, useState} from 'react';
+import copyToClipboard from 'copy-to-clipboard';
+import _ from 'lodash';
+import React, {
+  forwardRef,
+  useCallback,
+  useEffect,
+  useRef,
+  useState,
+} from 'react';
 import styled from 'styled-components';
 
+import {toast} from '../common/components/elements/Toast';
 import {hexToRGB, MOON_300, MOON_600} from '../common/css/globals.styles';
+import {useViewerInfo} from '../common/hooks/useViewerInfo';
+import {getCookieBool, getFirebaseCookie} from '../common/util/cookie';
+import {Button} from './Button';
 import {Icon} from './Icon';
 import {Tooltip} from './Tooltip';
 
@@ -14,6 +26,11 @@ type ErrorPanelProps = {
   title?: string;
   subtitle?: string;
   subtitle2?: string;
+
+  // These props are for error details object
+  uuid?: string;
+  timestamp?: Date;
+  error?: Error;
 };
 
 export const Centered = styled.div`
@@ -85,11 +102,87 @@ export const ErrorPanelSmall = ({
   );
 };
 
+const getDateObject = (timestamp?: Date): Record<string, any> | null => {
+  if (!timestamp) {
+    return null;
+  }
+  return {
+    // e.g. "2024-12-12T06:10:19.475Z",
+    iso: timestamp.toISOString(),
+    // e.g. "Thursday, December 12, 2024 at 6:10:19 AM Coordinated Universal Time"
+    long: timestamp.toLocaleString('en-US', {
+      weekday: 'long',
+      year: 'numeric', // Full year
+      month: 'long', // Full month name
+      day: 'numeric', // Day of the month
+      hour: 'numeric', // Hour (12-hour or 24-hour depending on locale)
+      minute: 'numeric',
+      second: 'numeric',
+      timeZone: 'UTC', // Ensures it's in UTC
+      timeZoneName: 'long', // Full time zone name
+    }),
+    user: timestamp.toLocaleString('en-US', {
+      dateStyle: 'full',
+      timeStyle: 'full',
+    }),
+  };
+};
+
+const getErrorObject = (error?: Error): Record<string, any> | null => {
+  if (!error) {
+    return null;
+  }
+
+  // Error object properties are not enumerable so we have to copy them manually
+  const stack = (error.stack ?? '').split('\n');
+  return {
+    message: error.message,
+    stack,
+  };
+};
+
 export const ErrorPanelLarge = forwardRef<HTMLDivElement, ErrorPanelProps>(
-  ({title, subtitle, subtitle2}, ref) => {
+  ({title, subtitle, subtitle2, uuid, timestamp, error}, ref) => {
     const titleStr = title ?? DEFAULT_TITLE;
     const subtitleStr = subtitle ?? DEFAULT_SUBTITLE;
     const subtitle2Str = subtitle2 ?? DEFAULT_SUBTITLE2;
+
+    const {userInfo} = useViewerInfo();
+
+    const onClick = useCallback(() => {
+      const betaVersion = getFirebaseCookie('betaVersion');
+      const isUsingAdminPrivileges = getCookieBool('use_admin_privileges');
+      const {location, navigator, screen} = window;
+      const {userAgent, language} = navigator;
+      const details = {
+        uuid,
+        url: location.href,
+        error: getErrorObject(error),
+        timestamp_err: getDateObject(timestamp),
+        timestamp_copied: getDateObject(new Date()),
+        user: _.pick(userInfo, ['id', 'username']), // Skipping teams and admin
+        cookies: {
+          ...(betaVersion && {betaVersion}),
+          ...(isUsingAdminPrivileges && {use_admin_privileges: true}),
+        },
+        browser: {
+          userAgent,
+          language,
+          screenSize: {
+            width: screen.width,
+            height: screen.height,
+          },
+          viewportSize: {
+            width: window.innerWidth,
+            height: window.innerHeight,
+          },
+        },
+      };
+      const detailsText = JSON.stringify(details, null, 2);
+      copyToClipboard(detailsText);
+      toast('Copied to clipboard');
+    }, [uuid, timestamp, error, userInfo]);
+
     return (
       <Large ref={ref}>
         <Circle $size={40} $hoverHighlight={false}>
@@ -98,6 +191,14 @@ export const ErrorPanelLarge = forwardRef<HTMLDivElement, ErrorPanelProps>(
         <Title>{titleStr}</Title>
         <Subtitle>{subtitleStr}</Subtitle>
         <Subtitle>{subtitle2Str}</Subtitle>
+        <Button
+          style={{marginTop: 16}}
+          size="small"
+          variant="secondary"
+          icon="copy"
+          onClick={onClick}>
+          Copy error details
+        </Button>
       </Large>
     );
   }