Resolve merge conflicts

.github/workflows/build.yml

@@ -8,7 +8,7 @@ jobs:
       - uses: actions/checkout@v4
       - uses: actions/setup-node@v4
         with:
-          node-version: 20
+          node-version: 22
       - name: Install dependencies
         run: npm install -g yarn && yarn
       - name: Install Playwright Browsers

.nvmrc

@@ -1 +1 @@
-v20
+v22

Dockerfile

@@ -1,4 +1,4 @@
-FROM node:20
+FROM node:22
 
 ENV NEXT_TELEMETRY_DISABLED 1
 ENV PORT 80

package.json

@@ -4,7 +4,7 @@
   "author": "Stellar Development Foundation <stellar@stellar.org>",
   "license": "Apache-2.0",
   "engines": {
-    "node": ">=20.0.0"
+    "node": ">=22.0.0"
   },
   "scripts": {
     "dev": "export NEXT_PUBLIC_COMMIT_HASH=$(git rev-parse --short HEAD) && next dev",

src/app/(sidebar)/endpoints/[[...pages]]/page.tsx

@@ -610,9 +610,27 @@ export default function Endpoints() {
 
     if (renderedProps) {
       return (
-        <div className="Endpoints__txTextarea">
-          <PrettyJsonTextarea json={renderedProps} label="Payload" />
-        </div>
+        <>
+          <div className="Endpoints__txTextarea">
+            <PrettyJsonTextarea json={renderedProps} label="Payload" />
+          </div>
+          <Box gap="md" direction="row" justify="end">
+            <CopyText textToCopy={stringify(renderedProps, null, 2) || ""}>
+              <Button
+                size="md"
+                variant="tertiary"
+                icon={<Icon.Copy01 />}
+                iconPosition="left"
+                // needed this to prevent the form from submitting
+                onClick={(e) => {
+                  e.preventDefault();
+                }}
+              >
+                Copy JSON
+              </Button>
+            </CopyText>
+          </Box>
+        </>
       );
     }
     return null;

src/app/(sidebar)/endpoints/components/SavedEndpointsPage.tsx

@@ -5,11 +5,14 @@ import {
   Badge,
   Button,
   Card,
+  CopyText,
   Icon,
   Input,
   Modal,
   Text,
 } from "@stellar/design-system";
+import { stringify } from "lossless-json";
+
 import { TabView } from "@/components/TabView";
 import { Box } from "@/components/layout/Box";
 import { InputSideElement } from "@/components/InputSideElement";
@@ -316,9 +319,23 @@ export const SavedEndpointsPage = () => {
                 </Box>
               </Box>
               {expandedPayloadIndex[idx] ? (
-                <div className="Endpoints__txTextarea">
-                  <PrettyJsonTextarea json={e.payload} label="Payload" />
-                </div>
+                <>
+                  <div className="Endpoints__txTextarea">
+                    <PrettyJsonTextarea json={e.payload} label="Payload" />
+                  </div>
+                  <Box gap="md" direction="row" justify="end">
+                    <CopyText textToCopy={stringify(e.payload, null, 2) || ""}>
+                      <Button
+                        size="md"
+                        variant="tertiary"
+                        icon={<Icon.Copy01 />}
+                        iconPosition="left"
+                      >
+                        Copy JSON
+                      </Button>
+                    </CopyText>
+                  </Box>
+                </>
               ) : (
                 <></>
               )}