From 0cce14b4d5ef5d2658742e990d6fbb59466511a5 Mon Sep 17 00:00:00 2001
From: Timon <39559178+Its-treason@users.noreply.github.com>
Date: Tue, 9 Apr 2024 22:51:18 +0200
Subject: [PATCH] fix: Collection variable viewer (#1947)

Due to changes in https://github.com/usebruno/bruno/pull/650
collection variables would be passed as a object but was exptected
to be an array. Collection variables are now converted to an array.
---
 .../bruno-app/src/components/VariablesEditor/index.js | 11 ++++++++---
 1 file changed, 8 insertions(+), 3 deletions(-)

diff --git a/packages/bruno-app/src/components/VariablesEditor/index.js b/packages/bruno-app/src/components/VariablesEditor/index.js
index 324fdcc98..980a8c5c3 100644
--- a/packages/bruno-app/src/components/VariablesEditor/index.js
+++ b/packages/bruno-app/src/components/VariablesEditor/index.js
@@ -7,8 +7,7 @@ import { findEnvironmentInCollection, maskInputValue } from 'utils/collections';
 import StyledWrapper from './StyledWrapper';
 import { IconEye, IconEyeOff } from '@tabler/icons';
 
-const KeyValueExplorer = ({ data, theme }) => {
-  data = data || {};
+const KeyValueExplorer = ({ data = [], theme }) => {
   const [showSecret, setShowSecret] = useState(false);
 
   return (
@@ -66,11 +65,17 @@ const EnvVariables = ({ collection, theme }) => {
 const CollectionVariables = ({ collection, theme }) => {
   const collectionVariablesFound = Object.keys(collection.collectionVariables).length > 0;
 
+  const collectionVariableArray = Object.entries(collection.collectionVariables).map(([name, value]) => ({
+    name,
+    value,
+    secret: false
+  }));
+
   return (
     <>
       <h1 className="font-semibold mb-2">Collection Variables</h1>
       {collectionVariablesFound ? (
-        <KeyValueExplorer data={collection.collectionVariables} theme={theme} />
+        <KeyValueExplorer data={collectionVariableArray} theme={theme} />
       ) : (
         <div className="muted text-xs">No collection variables found</div>
       )}