From 400b9cbb3b190d847bbe76109b46a3cad5d19966 Mon Sep 17 00:00:00 2001
From: Joshua Jones <joshua@general-metrics.com>
Date: Wed, 17 May 2023 13:16:58 -0700
Subject: [PATCH] Add missing copy button

---
 .../access-request-form/jwks-dialog.tsx       | 61 +++++++++++--------
 .../access-request-form/public-key-dialog.tsx | 61 +++++++++++--------
 2 files changed, 68 insertions(+), 54 deletions(-)

diff --git a/src/nextapp/components/access-request-form/jwks-dialog.tsx b/src/nextapp/components/access-request-form/jwks-dialog.tsx
index 159e7f909..755487ddd 100644
--- a/src/nextapp/components/access-request-form/jwks-dialog.tsx
+++ b/src/nextapp/components/access-request-form/jwks-dialog.tsx
@@ -121,36 +121,43 @@ const JwksDialog: React.FC<JwksDialogProps> = ({
               <Heading size="sm" mb={2}>
                 Issuer
               </Heading>
-              <Box
-                h="40px"
-                d="flex"
-                alignItems="center"
-                backgroundColor="#C2ED9850"
-                border="1px solid"
-                borderColor="#C2ED98"
-                px={4}
-                py={1}
-                borderRadius={4}
-                mb={4}
-              >
-                {issuer}
-              </Box>
+              <Flex align="center" mb={4}>
+                <Box
+                  h="40px"
+                  d="flex"
+                  alignItems="center"
+                  backgroundColor="#C2ED9850"
+                  border="2px solid"
+                  borderColor="#C2ED98"
+                  px={4}
+                  py={1}
+                  borderRadius={4}
+                  flex="1"
+                >
+                  {issuer}
+                </Box>
+                <CopyButton value={issuer} />
+              </Flex>
               <Heading size="sm" mb={2}>
                 Token Endpoint
               </Heading>
-              <Box
-                h="40px"
-                d="flex"
-                alignItems="center"
-                backgroundColor="#C2ED9850"
-                border="1px solid"
-                borderColor="#C2ED98"
-                px={4}
-                py={1}
-                borderRadius={4}
-              >
-                {tokenEndpoint}
-              </Box>
+              <Flex align="center">
+                <Box
+                  h="40px"
+                  d="flex"
+                  alignItems="center"
+                  backgroundColor="#C2ED9850"
+                  border="2px solid"
+                  borderColor="#C2ED98"
+                  px={4}
+                  py={1}
+                  flex="1"
+                  borderRadius={4}
+                >
+                  {tokenEndpoint}
+                </Box>
+                <CopyButton value={tokenEndpoint} />
+              </Flex>
             </Box>
           </ModalBody>
           <ModalFooter>
diff --git a/src/nextapp/components/access-request-form/public-key-dialog.tsx b/src/nextapp/components/access-request-form/public-key-dialog.tsx
index ad4b213a1..946441f1a 100644
--- a/src/nextapp/components/access-request-form/public-key-dialog.tsx
+++ b/src/nextapp/components/access-request-form/public-key-dialog.tsx
@@ -121,36 +121,43 @@ const PublicKeyDialog: React.FC<PublicKeyDialogProps> = ({
               <Heading size="sm" mb={2}>
                 Issuer
               </Heading>
-              <Box
-                h="40px"
-                d="flex"
-                alignItems="center"
-                backgroundColor="#C2ED9850"
-                border="1px solid"
-                borderColor="#C2ED98"
-                px={4}
-                py={1}
-                borderRadius={4}
-                mb={4}
-              >
-                {issuer}
-              </Box>
+              <Flex align="center" mb={4}>
+                <Box
+                  h="40px"
+                  d="flex"
+                  alignItems="center"
+                  backgroundColor="#C2ED9850"
+                  border="2px solid"
+                  borderColor="#C2ED98"
+                  px={4}
+                  py={1}
+                  borderRadius={4}
+                  flex="1"
+                >
+                  {issuer}
+                </Box>
+                <CopyButton value={issuer} />
+              </Flex>
               <Heading size="sm" mb={2}>
                 Token Endpoint
               </Heading>
-              <Box
-                h="40px"
-                d="flex"
-                alignItems="center"
-                backgroundColor="#C2ED9850"
-                border="1px solid"
-                borderColor="#C2ED98"
-                px={4}
-                py={1}
-                borderRadius={4}
-              >
-                {tokenEndpoint}
-              </Box>
+              <Flex align="center">
+                <Box
+                  h="40px"
+                  d="flex"
+                  alignItems="center"
+                  backgroundColor="#C2ED9850"
+                  border="2px solid"
+                  borderColor="#C2ED98"
+                  px={4}
+                  py={1}
+                  flex="1"
+                  borderRadius={4}
+                >
+                  {tokenEndpoint}
+                </Box>
+                <CopyButton value={tokenEndpoint} />
+              </Flex>
             </Box>
           </ModalBody>
           <ModalFooter>