From b65aa6afec88919bedf9c1d77f5db0764d577dc1 Mon Sep 17 00:00:00 2001
From: Marcus Andersson <marcus.andersson@grafana.com>
Date: Tue, 31 Oct 2023 11:17:06 +0100
Subject: [PATCH] PluginExtensions: Returns a clone of moment objects in
 context (#77238)

* Fixed so we always return momentjs as UTC iso string.

* Creating a clone of the moment object instead of returing a string.

* fixed linting issue.
---
 .../app/features/plugins/extensions/utils.test.tsx   | 12 +++++++++++-
 public/app/features/plugins/extensions/utils.tsx     |  9 +++++++++
 2 files changed, 20 insertions(+), 1 deletion(-)

diff --git a/public/app/features/plugins/extensions/utils.test.tsx b/public/app/features/plugins/extensions/utils.test.tsx
index 967286a9710..60738f3a3ba 100644
--- a/public/app/features/plugins/extensions/utils.test.tsx
+++ b/public/app/features/plugins/extensions/utils.test.tsx
@@ -2,7 +2,7 @@ import { render, screen } from '@testing-library/react';
 import React from 'react';
 import { type Unsubscribable } from 'rxjs';
 
-import { type PluginExtensionLinkConfig, PluginExtensionTypes } from '@grafana/data';
+import { type PluginExtensionLinkConfig, PluginExtensionTypes, dateTime } from '@grafana/data';
 import appEvents from 'app/core/app_events';
 import { ShowModalReactEvent } from 'app/types/events';
 
@@ -312,6 +312,16 @@ describe('Plugin Extensions / Utils', () => {
 
       expect(proxy.a()).toBe('testing');
     });
+
+    it('should return a clone of moment/datetime in context', () => {
+      const source = dateTime('2023-10-26T18:25:01Z');
+      const proxy = getReadOnlyProxy({
+        a: source,
+      });
+
+      expect(source.isSame(proxy.a)).toBe(true);
+      expect(source).not.toBe(proxy.a);
+    });
   });
 
   describe('getEventHelpers', () => {
diff --git a/public/app/features/plugins/extensions/utils.tsx b/public/app/features/plugins/extensions/utils.tsx
index d1449484bd0..42dc799494f 100644
--- a/public/app/features/plugins/extensions/utils.tsx
+++ b/public/app/features/plugins/extensions/utils.tsx
@@ -9,6 +9,8 @@ import {
   type PluginExtensionEventHelpers,
   PluginExtensionTypes,
   type PluginExtensionOpenModalOptions,
+  isDateTime,
+  dateTime,
 } from '@grafana/data';
 import { Modal } from '@grafana/ui';
 import appEvents from 'app/core/app_events';
@@ -159,6 +161,13 @@ export function getReadOnlyProxy<T extends object>(obj: T): T {
 
       const value = Reflect.get(target, prop, receiver);
 
+      // This will create a clone of the date time object
+      // instead of creating a proxy because the underlying
+      // momentjs object needs to be able to mutate itself.
+      if (isDateTime(value)) {
+        return dateTime(value);
+      }
+
       if (isObject(value) || isArray(value)) {
         if (!cache.has(value)) {
           cache.set(value, getReadOnlyProxy(value));