remove refetch fragments under create updated delete annotations

Arize-ai · Aug 2, 2024 · 311e3ef · 311e3ef
1 parent 5f6c786
commit 311e3ef
Show file tree

Hide file tree

Showing 6 changed files with 135 additions and 727 deletions.
diff --git a/app/src/pages/trace/EditSpanAnnotationsDialog.tsx b/app/src/pages/trace/EditSpanAnnotationsDialog.tsx
@@ -11,7 +11,6 @@ import {
   useMutation,
   useRefetchableFragment,
 } from "react-relay";
-import { useParams } from "react-router";
 import { css } from "@emotion/react";
 
 import {
@@ -30,7 +29,6 @@ import {
   View,
 } from "@arizeai/components";
 
-import { useLastNTimeRange } from "@phoenix/components/datetime";
 import { Empty } from "@phoenix/components/Empty";
 import { useNotifySuccess } from "@phoenix/contexts";
 import { formatFloat } from "@phoenix/utils/numberFormatUtils";
@@ -301,18 +299,13 @@ function SpanAnnotationCard(props: {
   spanNodeId: string;
 }) {
   const { annotation, spanNodeId } = props;
-  const { projectId } = useParams();
-
-  const { timeRange } = useLastNTimeRange();
   const [error, setError] = useState<Error | null>(null);
   const notifySuccess = useNotifySuccess();
 
   const [commitEdit, isCommittingEdit] =
     useMutation<EditSpanAnnotationsDialogEditAnnotationMutation>(graphql`
       mutation EditSpanAnnotationsDialogEditAnnotationMutation(
         $spanId: GlobalID!
-        $projectId: GlobalID!
-        $timeRange: TimeRange!
         $annotationId: GlobalID!
         $name: String!
         $label: String
@@ -332,11 +325,7 @@ function SpanAnnotationCard(props: {
           ]
         ) {
           query {
-            project: node(id: $projectId) {
-              ...AnnotationSummaryValueFragment
-                @arguments(annotationName: $name, timeRange: $timeRange)
-            }
-            span: node(id: $spanId) {
+            node(id: $spanId) {
               ... on Span {
                 ...EditSpanAnnotationsDialog_spanAnnotations
               }
@@ -353,11 +342,6 @@ function SpanAnnotationCard(props: {
           variables: {
             annotationId: annotation.id,
             spanId: spanNodeId,
-            projectId: projectId as string,
-            timeRange: {
-              start: timeRange.start.toISOString(),
-              end: timeRange.end.toISOString(),
-            },
             ...data,
           },
           onCompleted: () => {
@@ -372,16 +356,7 @@ function SpanAnnotationCard(props: {
         });
       });
     },
-    [
-      annotation.id,
-      annotation.name,
-      commitEdit,
-      notifySuccess,
-      projectId,
-      spanNodeId,
-      timeRange.end,
-      timeRange.start,
-    ]
+    [annotation.id, annotation.name, commitEdit, notifySuccess, spanNodeId]
   );
   return (
     <Card

diff --git a/app/src/pages/trace/NewSpanAnnotationForm.tsx b/app/src/pages/trace/NewSpanAnnotationForm.tsx
@@ -1,8 +1,5 @@
 import React from "react";
 import { graphql, useMutation } from "react-relay";
-import { useParams } from "react-router";
-
-import { useLastNTimeRange } from "@phoenix/components/datetime";
 
 import { NewSpanAnnotationFormMutation } from "./__generated__/NewSpanAnnotationFormMutation.graphql";
 import { AnnotationFormData, SpanAnnotationForm } from "./SpanAnnotationForm";
@@ -15,30 +12,15 @@ export type NewSpanAnnotationFormProps = {
 
 export function NewSpanAnnotationForm(props: NewSpanAnnotationFormProps) {
   const { annotationName: name, spanNodeId, onCreated } = props;
-  const { projectId } = useParams();
-  const { timeRange } = useLastNTimeRange();
   const [commit, isCommitting] = useMutation<NewSpanAnnotationFormMutation>(
     graphql`
       mutation NewSpanAnnotationFormMutation(
         $input: CreateSpanAnnotationInput!
         $spanId: GlobalID!
-        $projectId: GlobalID!
-        $annotationName: String!
-        $timeRange: TimeRange!
       ) {
         createSpanAnnotations(input: [$input]) {
           query {
-            project: node(id: $projectId) {
-              ... on Project {
-                ...ProjectPageHeader_stats
-                ...AnnotationSummaryValueFragment
-                  @arguments(
-                    annotationName: $annotationName
-                    timeRange: $timeRange
-                  )
-              }
-            }
-            span: node(id: $spanId) {
+            node(id: $spanId) {
               ... on Span {
                 ...EditSpanAnnotationsDialog_spanAnnotations
               }
@@ -57,12 +39,6 @@ export function NewSpanAnnotationForm(props: NewSpanAnnotationFormProps) {
           ...data,
         },
         spanId: spanNodeId,
-        projectId: projectId as string,
-        annotationName: name,
-        timeRange: {
-          start: timeRange.start.toISOString(),
-          end: timeRange.end.toISOString(),
-        },
       },
       onCompleted: () => {
         onCreated();

diff --git a/app/src/pages/trace/SpanAnnotationActionMenu.tsx b/app/src/pages/trace/SpanAnnotationActionMenu.tsx
@@ -5,7 +5,6 @@ import React, {
   useState,
 } from "react";
 import { graphql, useMutation } from "react-relay";
-import { useParams } from "react-router";
 
 import {
   Button,
@@ -17,8 +16,6 @@ import {
 } from "@arizeai/components";
 import { NoticeConfig } from "@arizeai/components/dist/notification/types";
 
-import { useLastNTimeRange } from "@phoenix/components/datetime";
-
 import { SpanAnnotationActionMenuDeleteMutation } from "./__generated__/SpanAnnotationActionMenuDeleteMutation.graphql";
 import { AnnotationActionMenu } from "./AnnotationActionMenu";
 
@@ -41,28 +38,15 @@ export function SpanAnnotationActionMenu(props: SpanAnnotationActionMenuProps) {
     onSpanAnnotationActionError,
   } = props;
   const [confirmDialog, setConfirmDialog] = useState<ReactNode>(null);
-  const { projectId } = useParams();
-  const { timeRange } = useLastNTimeRange();
   const [commitDelete, isCommittingDelete] =
     useMutation<SpanAnnotationActionMenuDeleteMutation>(graphql`
       mutation SpanAnnotationActionMenuDeleteMutation(
         $annotationId: GlobalID!
         $spanId: GlobalID!
-        $annotationName: String!
-        $projectId: GlobalID!
-        $timeRange: TimeRange!
       ) {
         deleteSpanAnnotations(input: { annotationIds: [$annotationId] }) {
           query {
-            project: node(id: $projectId) {
-              ...ProjectPageHeader_stats
-              ...AnnotationSummaryValueFragment
-                @arguments(
-                  annotationName: $annotationName
-                  timeRange: $timeRange
-                )
-            }
-            span: node(id: $spanId) {
+            node(id: $spanId) {
               ... on Span {
                 ...EditSpanAnnotationsDialog_spanAnnotations
               }
@@ -78,12 +62,6 @@ export function SpanAnnotationActionMenu(props: SpanAnnotationActionMenuProps) {
         variables: {
           annotationId,
           spanId: spanNodeId,
-          projectId: projectId as string,
-          annotationName,
-          timeRange: {
-            start: timeRange.start.toISOString(),
-            end: timeRange.end.toISOString(),
-          },
         },
         onCompleted: () => {
           onSpanAnnotationActionSuccess({
@@ -100,9 +78,6 @@ export function SpanAnnotationActionMenu(props: SpanAnnotationActionMenuProps) {
     commitDelete,
     annotationId,
     spanNodeId,
-    projectId,
-    timeRange.start,
-    timeRange.end,
     onSpanAnnotationActionSuccess,
     annotationName,
     onSpanAnnotationActionError,