Skip to content

[FEATURE] Add annotation support#120

Draft
Gladorme wants to merge 12 commits into
perses:mainfrom
Gladorme:annotations
Draft

[FEATURE] Add annotation support#120
Gladorme wants to merge 12 commits into
perses:mainfrom
Gladorme:annotations

Conversation

@Gladorme
Copy link
Copy Markdown
Member

@Gladorme Gladorme commented Apr 27, 2026

Description

Adding Annotation support with Provider, Editor, ...

PR related to:

Screenshots

image

Checklist

  • Pull request has a descriptive title and context useful to a reviewer.
  • Pull request title follows the [<catalog_entry>] <commit message> naming convention using one of the
    following catalog_entry values: FEATURE, ENHANCEMENT, BUGFIX, BREAKINGCHANGE, DOC,IGNORE.
  • All commits have DCO signoffs.

UI Changes

  • Changes that impact the UI include screenshots and/or screencasts of the relevant changes.
  • Code follows the UI guidelines.
  • E2E tests are stable and unlikely to be flaky.
    See e2e docs for more details. Common issues include:
    • Is the data inconsistent? You need to mock API requests.
    • Does the time change? You need to use consistent time values or mock time utilities.
    • Does it have loading states? You need to wait for loading to complete.

Comment thread dashboards/src/components/Annotations/AnnotationsEditor.tsx
Comment thread dashboards/src/components/Annotations/AnnotationsEditor.tsx Outdated
Comment thread dashboards/src/components/Annotations/AnnotationsEditor.tsx Outdated
Comment thread dashboards/src/components/Annotations/AnnotationsEditor.tsx
Comment on lines +18 to +37
export function AnnotationHydrationWrapper({ children }: AnnotationHydrationWrapperProps): ReactNode {
const annotationSpecs = useAnnotationSpecs();
const { setAnnotationState } = useAnnotationActions();
const annotations: Array<UseQueryResult<AnnotationData[]>> = useAnnotations(annotationSpecs);

useEffect(() => {
for (const [index, definition] of annotationSpecs.entries()) {
const query = annotations[index] ?? null;
if (query) {
setAnnotationState(definition.display.name, {
data: query.data ?? null,
isPending: query.isLoading,
error: (query?.error as Error) ?? null,
});
}
}
}, [annotationSpecs, annotations, setAnnotationState]);

return <>{children}</>;
}
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Comment thread dashboards/src/context/AnnotationProvider/utils.ts Outdated
Comment thread dashboards/src/context/AnnotationProvider/AnnotationHydrationWrapper.tsx Outdated
Comment thread dashboards/src/context/AnnotationProvider/AnnotationHydrationWrapper.tsx Outdated
Comment thread dashboards/src/context/useDashboard.tsx Outdated
Comment thread dashboards/src/context/useDashboard.tsx Outdated
Comment on lines +26 to +36
function useAnnotationContext(): AnnotationContext {
const { absoluteTimeRange } = useTimeRange();
const variableState = useAllVariableValues();
const datasourceStore = useDatasourceStore();

return {
variableState,
datasourceStore,
absoluteTimeRange,
};
}
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This function name has the issue which has been already explained here
https://github.com/perses/shared/pull/120/changes#r3309777312

Comment on lines +59 to +62
let waitToLoad = false;
if (variableDependencies) {
waitToLoad = variableDependencies.some((v) => variableState[v]?.loading);
}
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This blocks seems unnecessary:
It could have been simplified to

const waitToLoad = !!variableDependencies?.some((v) => variableState[v]?.loading);

Copy link
Copy Markdown
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Prefer to keep the current one, more easy to understand and readable

Comment thread plugin-system/src/runtime/annotations.ts Outdated
Comment on lines +111 to +115
let dependsOnVariables: string[] = Object.keys(allVariables); // Default to all variables
if (annotationPlugin?.dependsOn) {
const dependencies = annotationPlugin.dependsOn(spec.plugin.spec, variablePluginCtx);
dependsOnVariables = dependencies.variables ? dependencies.variables : dependsOnVariables;
}
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Comment thread plugin-system/src/runtime/annotations.ts
Gladorme added 9 commits May 29, 2026 15:26
Signed-off-by: Guillaume LADORME <Gladorme@users.noreply.github.com>
Signed-off-by: Guillaume LADORME <Gladorme@users.noreply.github.com>
Signed-off-by: Guillaume LADORME <Gladorme@users.noreply.github.com>
Signed-off-by: Guillaume LADORME <Gladorme@users.noreply.github.com>
Signed-off-by: Guillaume LADORME <Gladorme@users.noreply.github.com>
Signed-off-by: Guillaume LADORME <Gladorme@users.noreply.github.com>
Signed-off-by: Guillaume LADORME <Gladorme@users.noreply.github.com>
Signed-off-by: Guillaume LADORME <Gladorme@users.noreply.github.com>
Signed-off-by: Guillaume LADORME <Gladorme@users.noreply.github.com>
Gladorme added 2 commits May 29, 2026 17:37
Signed-off-by: Guillaume LADORME <Gladorme@users.noreply.github.com>
Signed-off-by: Guillaume LADORME <Gladorme@users.noreply.github.com>
Signed-off-by: Guillaume LADORME <Gladorme@users.noreply.github.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants