From 35068b6b69dc413beebfc378a364f5a634eba8ac Mon Sep 17 00:00:00 2001
From: Darin Kelkhoff <darin.kelkhoff@gmail.com>
Date: Thu, 4 May 2023 18:49:56 -0500
Subject: [PATCH] Reverting unintented change to code-viewer layout (keeping
 reveal layout good)

---
 src/qqq/pages/records/view/RecordView.tsx | 4 ++--
 src/qqq/utils/qqq/ValueUtils.tsx          | 9 +++++----
 2 files changed, 7 insertions(+), 6 deletions(-)

diff --git a/src/qqq/pages/records/view/RecordView.tsx b/src/qqq/pages/records/view/RecordView.tsx
index 90c1b0c..aac96eb 100644
--- a/src/qqq/pages/records/view/RecordView.tsx
+++ b/src/qqq/pages/records/view/RecordView.tsx
@@ -369,8 +369,8 @@ function RecordView({table, launchProcess}: Props): JSX.Element
                   <Box key={section.name} display="flex" flexDirection="column" py={1} pr={2}>
                      {
                         section.fieldNames.map((fieldName: string) => (
-                           <Box display="flex" key={fieldName} flexDirection="row" pb={2} pr={2}>
-                              <Typography sx={{display: "flex"}} variant="button" textTransform="none" fontWeight="bold" pr={1} color="rgb(52, 71, 103)">
+                           <Box  key={fieldName} flexDirection="row" pr={2}>
+                              <Typography variant="button" textTransform="none" fontWeight="bold" pr={1} color="rgb(52, 71, 103)">
                                  {tableMetaData.fields.get(fieldName).label}:
                                  <div style={{display: "inline-block", width: 0}}>&nbsp;</div>
                               </Typography>
diff --git a/src/qqq/utils/qqq/ValueUtils.tsx b/src/qqq/utils/qqq/ValueUtils.tsx
index d7e27fb..8ec1324 100644
--- a/src/qqq/utils/qqq/ValueUtils.tsx
+++ b/src/qqq/utils/qqq/ValueUtils.tsx
@@ -456,7 +456,7 @@ function CodeViewer({name, mode, code}: {name: string; mode: string; code: strin
    };
 
    return (
-      <>
+      <Box component="span">
          {mode == "json" && code && <Button onClick={() => formatJson()}>{isFormatted ? "Reset Format" : "Format JSON"}</Button>}
          {code && <Button onClick={() => toggleSize()}>{isExpanded ? "Collapse" : "Expand"}</Button>}
          {errorMessage}
@@ -471,10 +471,11 @@ function CodeViewer({name, mode, code}: {name: string; mode: string; code: strin
             readOnly
             highlightActiveLine={false}
             width="100%"
+            style={{border: "1px solid gray", marginBottom: "1rem"}}
             showPrintMargin={false}
             height={isExpanded ? "80vh" : code ? "200px" : "50px"}
          />
-      </>);
+      </Box>);
 }
 
 ////////////////////////////////////////////////////////////////////////////////////////////////
@@ -514,7 +515,7 @@ function RevealComponent({fieldName, value, usage}: {fieldName: string, value: s
 
    return (
       usage === "view" && adornmentFieldsMap.get(fieldName) === true ? (
-         <Box>
+         <Box component="span">
             <Icon onClick={() => handleRevealIconClick(fieldName)} sx={{cursor: "pointer", fontSize: "15px !important", position: "relative", top: "3px", marginRight: "5px"}}>visibility_on</Icon>
             {displayValue}
             <ClickAwayListener onClickAway={handleTooltipClose}>
@@ -534,7 +535,7 @@ function RevealComponent({fieldName, value, usage}: {fieldName: string, value: s
             </ClickAwayListener>
          </Box>
       ):(
-         <Box><Icon onClick={() => handleRevealIconClick(fieldName)} sx={{cursor: "pointer", fontSize: "15px !important", position: "relative", top: "3px", marginRight: "5px"}}>visibility_off</Icon>{displayValue}</Box>
+         <Box component="span"><Icon onClick={() => handleRevealIconClick(fieldName)} sx={{cursor: "pointer", fontSize: "15px !important", position: "relative", top: "3px", marginRight: "5px"}}>visibility_off</Icon>{displayValue}</Box>
       )
    );
 }