From 3e01fa737daa1890af6c68b306070183f0d5efcf Mon Sep 17 00:00:00 2001
From: Bartosz Prusinowski <bartosz@interactivethings.com>
Date: Wed, 4 Dec 2024 09:59:23 +0100
Subject: [PATCH] feat: Disable more interactive elements from screenshots

---
 app/charts/shared/brush/index.tsx                    | 2 ++
 app/charts/shared/containers.tsx                     | 2 ++
 app/configurator/interactive-filters/time-slider.tsx | 2 ++
 3 files changed, 6 insertions(+)

diff --git a/app/charts/shared/brush/index.tsx b/app/charts/shared/brush/index.tsx
index 17560a1f0..a3447fb20 100644
--- a/app/charts/shared/brush/index.tsx
+++ b/app/charts/shared/brush/index.tsx
@@ -32,6 +32,7 @@ import {
 } from "@/stores/interactive-filters";
 import { useTransitionStore } from "@/stores/transition";
 import { getTextWidth } from "@/utils/get-text-width";
+import { DISABLE_SCREENSHOT_ATTR } from "@/utils/use-screenshot";
 
 // Brush constants
 const HANDLE_HEIGHT = 14;
@@ -371,6 +372,7 @@ export const BrushTime = () => {
 
   return fullData.length ? (
     <g
+      {...DISABLE_SCREENSHOT_ATTR}
       transform={`translate(0, ${
         chartHeight + margins.top + margins.bottom - HEIGHT * 1.5
       })`}
diff --git a/app/charts/shared/containers.tsx b/app/charts/shared/containers.tsx
index 652cc960c..8c2a6efdb 100644
--- a/app/charts/shared/containers.tsx
+++ b/app/charts/shared/containers.tsx
@@ -12,6 +12,7 @@ import {
   useConfiguratorState,
 } from "@/configurator";
 import { useTransitionStore } from "@/stores/transition";
+import { DISABLE_SCREENSHOT_ATTR } from "@/utils/use-screenshot";
 
 export const useStyles = makeStyles<{}, {}, "chartContainer">(() => ({
   chartContainer: {
@@ -70,6 +71,7 @@ export const ChartSvg = ({ children }: { children: ReactNode }) => {
     >
       {interactiveFiltersConfig?.calculation.active && (
         <foreignObject
+          {...DISABLE_SCREENSHOT_ATTR}
           width={width - margins.right}
           y={20}
           height="26"
diff --git a/app/configurator/interactive-filters/time-slider.tsx b/app/configurator/interactive-filters/time-slider.tsx
index a3b60cada..83e1529ac 100644
--- a/app/configurator/interactive-filters/time-slider.tsx
+++ b/app/configurator/interactive-filters/time-slider.tsx
@@ -34,6 +34,7 @@ import {
   makeDimensionValueSorters,
 } from "@/utils/sorting-values";
 import useEvent from "@/utils/use-event";
+import { DISABLE_SCREENSHOT_ATTR } from "@/utils/use-screenshot";
 
 const TimelineContext = createContext<Timeline | undefined>(undefined);
 
@@ -159,6 +160,7 @@ const Root = ({ showPlayButton }: { showPlayButton: boolean }) => {
 
   return (
     <Box
+      {...DISABLE_SCREENSHOT_ATTR}
       sx={{
         display: "flex",
         alignItems: "center",