From 9f32480076091bc2d4e539ef928293b53147ca72 Mon Sep 17 00:00:00 2001
From: Noah Onyejese <129368606+noahonyejese@users.noreply.github.com>
Date: Mon, 9 Sep 2024 08:25:52 +0200
Subject: [PATCH 1/2] style: Improved Share Styling

---
 .../copy-to-clipboard-text-input.tsx          |  2 +-
 app/components/publish-actions.tsx            | 19 +++----------------
 2 files changed, 4 insertions(+), 17 deletions(-)

diff --git a/app/components/copy-to-clipboard-text-input.tsx b/app/components/copy-to-clipboard-text-input.tsx
index b856163d8..256172f8b 100644
--- a/app/components/copy-to-clipboard-text-input.tsx
+++ b/app/components/copy-to-clipboard-text-input.tsx
@@ -50,7 +50,7 @@ const useCopyToClipboardTextInputStyles = makeStyles((theme: Theme) => ({
     padding: `${theme.spacing(0)} ${theme.spacing(2)}`,
     flexGrow: 1,
     fontSize: "1rem",
-    minWidth: 160,
+    minWidth: 250,
     overflowX: "auto",
     borderTopLeftRadius: "default",
     borderBottomLeftRadius: "default",
diff --git a/app/components/publish-actions.tsx b/app/components/publish-actions.tsx
index b7afe2141..004b99011 100644
--- a/app/components/publish-actions.tsx
+++ b/app/components/publish-actions.tsx
@@ -3,11 +3,10 @@ import {
   Box,
   Button,
   Divider,
-  Link,
   Popover,
   PopoverProps,
   Stack,
-  Typography,
+  Typography
 } from "@mui/material";
 import { ReactNode, useEffect, useState } from "react";
 
@@ -158,7 +157,7 @@ const Share = ({ configKey, locale }: PublishActionProps) => {
         );
       }}
     >
-      <Box m={4}>
+      <Box m={4} sx={{ "& > * + *": { mt: 4 } }}>
         <Flex
           sx={{
             justifyContent: "space-between",
@@ -217,19 +216,7 @@ const Share = ({ configKey, locale }: PublishActionProps) => {
           <Typography component="div" variant="body1" color="grey.700">
             <Trans id="publication.share.chart.url">Chart URL: </Trans>
           </Typography>
-          <Box my={1} sx={{ color: "primary" }}>
-            <Link
-              href={shareUrl}
-              sx={{
-                color: "primary",
-                textDecoration: "underline",
-                cursor: "pointer",
-                mr: 4,
-              }}
-            >
-              {shareUrl}
-            </Link>
-          </Box>
+          <CopyToClipboardTextInput content={shareUrl} />
         </Box>
       </Box>
     </TriggeredPopover>

From d47091e056d70a4773ed712f7720382513fc2fee Mon Sep 17 00:00:00 2001
From: Noah Onyejese <129368606+noahonyejese@users.noreply.github.com>
Date: Mon, 9 Sep 2024 08:28:42 +0200
Subject: [PATCH 2/2] chore: Auto Formating on Save

---
 .vscode/settings.json              | 3 +++
 app/components/publish-actions.tsx | 2 +-
 2 files changed, 4 insertions(+), 1 deletion(-)

diff --git a/.vscode/settings.json b/.vscode/settings.json
index 0adb5cdcc..f8fb78778 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -4,6 +4,9 @@
     "source.fixAll.eslint": "explicit",
     "source.organizeImports": "explicit"
   },
+  "editor.formatOnSave": true,
+  "editor.defaultFormatter": "esbenp.prettier-vscode",
+  "prettier.requireConfig": true,
   "eslint.validate": [
     "javascript",
     "javascriptreact",
diff --git a/app/components/publish-actions.tsx b/app/components/publish-actions.tsx
index 004b99011..a94f03492 100644
--- a/app/components/publish-actions.tsx
+++ b/app/components/publish-actions.tsx
@@ -6,7 +6,7 @@ import {
   Popover,
   PopoverProps,
   Stack,
-  Typography
+  Typography,
 } from "@mui/material";
 import { ReactNode, useEffect, useState } from "react";