unwrap obj to clone it (#6409)

web/src/components/agent/AgentManager.vue

@@ -40,6 +40,7 @@ import { useAsyncAction } from '~/compositions/useAsyncAction';
 import useNotifications from '~/compositions/useNotifications';
 import { usePagination } from '~/compositions/usePaginate';
 import type { Agent } from '~/lib/api/types';
+import { deepClone } from '~/lib/utils';
 
 import AgentForm from './AgentForm.vue';
 import AgentList from './AgentList.vue';
@@ -91,7 +92,7 @@ const { doSubmit: deleteAgent, isLoading: isDeleting } = useAsyncAction(async (_
 });
 
 function editAgent(agent: Agent) {
-  selectedAgent.value = structuredClone(agent);
+  selectedAgent.value = deepClone(agent);
 }
 
 function showAddAgent() {

web/src/lib/utils/index.ts

@@ -1,3 +1,5 @@
+import { toRaw } from 'vue';
+
 export function debounce<T extends unknown[]>(fn: (...args: T) => void, delay: number): (...args: T) => void {
   let timer: ReturnType<typeof setTimeout>;
   return (...args: T) => {
@@ -5,3 +7,7 @@ export function debounce<T extends unknown[]>(fn: (...args: T) => void, delay: n
     timer = setTimeout(fn, delay, ...args);
   };
 }
+
+export function deepClone<T>(value: T): T {
+  return JSON.parse(JSON.stringify(toRaw(value))) as T;
+}

web/src/views/admin/AdminRegistries.vue

@@ -52,6 +52,7 @@ import useNotifications from '~/compositions/useNotifications';
 import { usePagination } from '~/compositions/usePaginate';
 import { useWPTitle } from '~/compositions/useWPTitle';
 import type { Registry } from '~/lib/api/types';
+import { deepClone } from '~/lib/utils';
 
 const emptyRegistry: Partial<Registry> = {
   address: '',
@@ -97,11 +98,11 @@ const { doSubmit: deleteRegistry, isLoading: isDeleting } = useAsyncAction(async
 });
 
 function editRegistry(registry: Registry) {
-  selectedRegistry.value = structuredClone(registry);
+  selectedRegistry.value = deepClone(registry);
 }
 
 function showAddRegistry() {
-  selectedRegistry.value = structuredClone(emptyRegistry);
+  selectedRegistry.value = deepClone(emptyRegistry);
 }
 
 useWPTitle(computed(() => [i18n.t('registries.registries'), i18n.t('admin.settings.settings')]));

web/src/views/admin/AdminSecrets.vue

@@ -48,6 +48,7 @@ import { usePagination } from '~/compositions/usePaginate';
 import { useWPTitle } from '~/compositions/useWPTitle';
 import type { Secret } from '~/lib/api/types';
 import { WebhookEvents } from '~/lib/api/types';
+import { deepClone } from '~/lib/utils';
 
 const emptySecret: Partial<Secret> = {
   name: '',
@@ -94,11 +95,11 @@ const { doSubmit: deleteSecret, isLoading: isDeleting } = useAsyncAction(async (
 });
 
 function editSecret(secret: Secret) {
-  selectedSecret.value = structuredClone(secret);
+  selectedSecret.value = deepClone(secret);
 }
 
 function showAddSecret() {
-  selectedSecret.value = structuredClone(emptySecret);
+  selectedSecret.value = deepClone(emptySecret);
 }
 
 useWPTitle(computed(() => [i18n.t('secrets.secrets'), i18n.t('admin.settings.settings')]));

web/src/views/admin/AdminUsers.vue

@@ -104,6 +104,7 @@ import useNotifications from '~/compositions/useNotifications';
 import { usePagination } from '~/compositions/usePaginate';
 import { useWPTitle } from '~/compositions/useWPTitle';
 import type { User } from '~/lib/api/types';
+import { deepClone } from '~/lib/utils';
 
 const apiClient = useApiClient();
 const notifications = useNotifications();
@@ -152,7 +153,7 @@ const { doSubmit: deleteUser, isLoading: isDeleting } = useAsyncAction(async (_u
 });
 
 function editUser(user: User) {
-  selectedUser.value = structuredClone(user);
+  selectedUser.value = deepClone(user);
 }
 
 function showAddUser() {

web/src/views/org/settings/OrgRegistries.vue

@@ -48,6 +48,7 @@ import useNotifications from '~/compositions/useNotifications';
 import { usePagination } from '~/compositions/usePaginate';
 import { useWPTitle } from '~/compositions/useWPTitle';
 import type { Registry } from '~/lib/api/types';
+import { deepClone } from '~/lib/utils';
 
 const emptyRegistry: Partial<Registry> = {
   address: '',
@@ -130,11 +131,11 @@ const { doSubmit: deleteRegistry, isLoading: isDeleting } = useAsyncAction(async
 });
 
 function editRegistry(registry: Registry) {
-  selectedRegistry.value = structuredClone(registry);
+  selectedRegistry.value = deepClone(registry);
 }
 
 function showAddRegistry() {
-  selectedRegistry.value = structuredClone(emptyRegistry);
+  selectedRegistry.value = deepClone(emptyRegistry);
 }
 
 useWPTitle(computed(() => [i18n.t('registries.registries'), org.value.name]));

web/src/views/org/settings/OrgSecrets.vue

@@ -40,6 +40,7 @@ import { usePagination } from '~/compositions/usePaginate';
 import { useWPTitle } from '~/compositions/useWPTitle';
 import { WebhookEvents } from '~/lib/api/types';
 import type { Secret } from '~/lib/api/types';
+import { deepClone } from '~/lib/utils';
 
 const emptySecret: Partial<Secret> = {
   name: '',
@@ -87,11 +88,11 @@ const { doSubmit: deleteSecret, isLoading: isDeleting } = useAsyncAction(async (
 });
 
 function editSecret(secret: Secret) {
-  selectedSecret.value = structuredClone(secret);
+  selectedSecret.value = deepClone(secret);
 }
 
 function showAddSecret() {
-  selectedSecret.value = structuredClone(emptySecret);
+  selectedSecret.value = deepClone(emptySecret);
 }
 
 useWPTitle(computed(() => [i18n.t('secrets.secrets'), org.value.name]));

web/src/views/repo/settings/Registries.vue

@@ -44,6 +44,7 @@ import useNotifications from '~/compositions/useNotifications';
 import { usePagination } from '~/compositions/usePaginate';
 import { useWPTitle } from '~/compositions/useWPTitle';
 import type { Registry } from '~/lib/api/types';
+import { deepClone } from '~/lib/utils';
 
 const emptyRegistry: Partial<Registry> = {
   address: '',
@@ -132,11 +133,11 @@ const { doSubmit: deleteRegistry, isLoading: isDeleting } = useAsyncAction(async
 });
 
 function editRegistry(registry: Registry) {
-  selectedRegistry.value = structuredClone(registry);
+  selectedRegistry.value = deepClone(registry);
 }
 
 function showAddRegistry() {
-  selectedRegistry.value = structuredClone(emptyRegistry);
+  selectedRegistry.value = deepClone(emptyRegistry);
 }
 
 useWPTitle(computed(() => [i18n.t('registries.registries'), repo.value.full_name]));

web/src/views/repo/settings/Secrets.vue

@@ -40,6 +40,7 @@ import { usePagination } from '~/compositions/usePaginate';
 import { useWPTitle } from '~/compositions/useWPTitle';
 import { WebhookEvents } from '~/lib/api/types';
 import type { Secret } from '~/lib/api/types';
+import { deepClone } from '~/lib/utils';
 
 const emptySecret: Partial<Secret> = {
   name: '',
@@ -128,11 +129,11 @@ const { doSubmit: deleteSecret, isLoading: isDeleting } = useAsyncAction(async (
 });
 
 function editSecret(secret: Secret) {
-  selectedSecret.value = structuredClone(secret);
+  selectedSecret.value = deepClone(secret);
 }
 
 function showAddSecret() {
-  selectedSecret.value = structuredClone(emptySecret);
+  selectedSecret.value = deepClone(emptySecret);
 }
 
 useWPTitle(computed(() => [i18n.t('secrets.secrets'), repo.value.full_name]));

web/src/views/user/UserRegistries.vue

@@ -48,6 +48,7 @@ import useNotifications from '~/compositions/useNotifications';
 import { usePagination } from '~/compositions/usePaginate';
 import { useWPTitle } from '~/compositions/useWPTitle';
 import type { Registry } from '~/lib/api/types';
+import { deepClone } from '~/lib/utils';
 
 const emptyRegistry: Partial<Registry> = {
   address: '',
@@ -101,11 +102,11 @@ const { doSubmit: deleteRegistry, isLoading: isDeleting } = useAsyncAction(async
 });
 
 function editRegistry(registry: Registry) {
-  selectedRegistry.value = structuredClone(registry);
+  selectedRegistry.value = deepClone(registry);
 }
 
 function showAddRegistry() {
-  selectedRegistry.value = structuredClone(emptyRegistry);
+  selectedRegistry.value = deepClone(emptyRegistry);
 }
 
 useWPTitle(computed(() => [i18n.t('registries.registries'), i18n.t('user.settings.settings')]));

web/src/views/user/UserSecrets.vue

@@ -44,6 +44,7 @@ import { usePagination } from '~/compositions/usePaginate';
 import { useWPTitle } from '~/compositions/useWPTitle';
 import { WebhookEvents } from '~/lib/api/types';
 import type { Secret } from '~/lib/api/types';
+import { deepClone } from '~/lib/utils';
 
 const emptySecret: Partial<Secret> = {
   name: '',
@@ -98,11 +99,11 @@ const { doSubmit: deleteSecret, isLoading: isDeleting } = useAsyncAction(async (
 });
 
 function editSecret(secret: Secret) {
-  selectedSecret.value = structuredClone(secret);
+  selectedSecret.value = deepClone(secret);
 }
 
 function showAddSecret() {
-  selectedSecret.value = structuredClone(emptySecret);
+  selectedSecret.value = deepClone(emptySecret);
 }
 
 useWPTitle(computed(() => [i18n.t('secrets.secrets'), i18n.t('user.settings.settings')]));