Share transactions (#1084)

Co-authored-by: jeesun 지선 <[email protected]>
stellar · Oct 8, 2024 · 62f2f54 · 62f2f54
1 parent 02e6ca9
commit 62f2f54
Show file tree

Hide file tree

Showing 8 changed files with 26 additions and 20 deletions.
diff --git a/src/app/(sidebar)/endpoints/[[...pages]]/page.tsx b/src/app/(sidebar)/endpoints/[[...pages]]/page.tsx
@@ -21,7 +21,7 @@ import { formComponentTemplateEndpoints } from "@/components/formComponentTempla
 import { InputSideElement } from "@/components/InputSideElement";
 import { Box } from "@/components/layout/Box";
 import { PrettyJsonTextarea } from "@/components/PrettyJsonTextarea";
-import { ShareApiExplorerUrlButton } from "@/components/ShareApiExplorerUrlButton";
+import { ShareUrlButton } from "@/components/ShareUrlButton";
 
 import { useStore } from "@/store/useStore";
 import { isEmptyObject } from "@/helpers/isEmptyObject";
@@ -33,7 +33,7 @@ import { localStorageSavedEndpointsHorizon } from "@/helpers/localStorageSavedEn
 import { arrayItem } from "@/helpers/arrayItem";
 import { delayedAction } from "@/helpers/delayedAction";
 import { buildEndpointHref } from "@/helpers/buildEndpointHref";
-import { apiExplorerShareableUrl } from "@/helpers/apiExplorerShareableUrl";
+import { shareableUrl } from "@/helpers/shareableUrl";
 
 import { Routes } from "@/constants/routes";
 import {
@@ -655,9 +655,7 @@ export default function Endpoints() {
               Submit
             </Button>
 
-            <ShareApiExplorerUrlButton
-              shareableUrl={apiExplorerShareableUrl()}
-            />
+            <ShareUrlButton shareableUrl={shareableUrl("requests")} />
 
             <Button
               size="md"
@@ -674,7 +672,7 @@ export default function Endpoints() {
                     route: pathname,
                     params,
                     network: getSaveItemNetwork(network),
-                    shareableUrl: apiExplorerShareableUrl(),
+                    shareableUrl: shareableUrl("requests"),
                   }),
                 );
               }}

diff --git a/src/app/(sidebar)/endpoints/components/SavedEndpointsPage.tsx b/src/app/(sidebar)/endpoints/components/SavedEndpointsPage.tsx
@@ -13,7 +13,7 @@ import { TabView } from "@/components/TabView";
 import { Box } from "@/components/layout/Box";
 import { InputSideElement } from "@/components/InputSideElement";
 import { NextLink } from "@/components/NextLink";
-import { ShareApiExplorerUrlButton } from "@/components/ShareApiExplorerUrlButton";
+import { ShareUrlButton } from "@/components/ShareUrlButton";
 
 import { NetworkOptions } from "@/constants/settings";
 import { Routes } from "@/constants/routes";
@@ -153,9 +153,7 @@ export const SavedEndpointsPage = () => {
 
                   <>
                     {e.shareableUrl ? (
-                      <ShareApiExplorerUrlButton
-                        shareableUrl={e.shareableUrl}
-                      />
+                      <ShareUrlButton shareableUrl={e.shareableUrl} />
                     ) : null}
                   </>
                 </Box>

diff --git a/src/app/(sidebar)/transaction/build/components/Operations.tsx b/src/app/(sidebar)/transaction/build/components/Operations.tsx
@@ -15,10 +15,12 @@ import { Box } from "@/components/layout/Box";
 import { TabbedButtons } from "@/components/TabbedButtons";
 import { SdsLink } from "@/components/SdsLink";
 import { SaveTransactionModal } from "@/components/SaveTransactionModal";
+import { ShareUrlButton } from "@/components/ShareUrlButton";
 
 import { arrayItem } from "@/helpers/arrayItem";
 import { isEmptyObject } from "@/helpers/isEmptyObject";
 import { sanitizeObject } from "@/helpers/sanitizeObject";
+import { shareableUrl } from "@/helpers/shareableUrl";
 
 import { OP_SET_TRUST_LINE_FLAGS } from "@/constants/settings";
 import { TRANSACTION_OPERATIONS } from "@/constants/transactionOperations";
@@ -1167,6 +1169,8 @@ export const Operations = () => {
                 title="Save transaction"
                 disabled={!txnXdr}
               ></Button>
+
+              <ShareUrlButton shareableUrl={shareableUrl("transactions")} />
             </Box>
 
             <Button

diff --git a/src/app/(sidebar)/transaction/saved/page.tsx b/src/app/(sidebar)/transaction/saved/page.tsx
@@ -17,6 +17,7 @@ import { localStorageSavedTransactions } from "@/helpers/localStorageSavedTransa
 import { arrayItem } from "@/helpers/arrayItem";
 
 import { SavedTransaction, SavedTransactionPage } from "@/types/types";
+import { ShareUrlButton } from "@/components/ShareUrlButton";
 
 export default function SavedTransactions() {
   const { network, transaction, xdr } = useStore();
@@ -151,7 +152,12 @@ export default function SavedTransactions() {
           addlClassName="Endpoints__urlBar__footer"
         >
           <Box gap="sm" direction="row">
-            {renderActionButton(txn.timestamp, txn.page)}
+            <>
+              {renderActionButton(txn.timestamp, txn.page)}
+              {txn.shareableUrl ? (
+                <ShareUrlButton shareableUrl={txn.shareableUrl} />
+              ) : null}
+            </>
           </Box>
 
           <Box gap="sm" direction="row" align="center" justify="end">

diff --git a/src/components/SaveTransactionModal.tsx b/src/components/SaveTransactionModal.tsx
@@ -3,6 +3,7 @@ import { Button, Input, Modal } from "@stellar/design-system";
 import { arrayItem } from "@/helpers/arrayItem";
 import { localStorageSavedTransactions } from "@/helpers/localStorageSavedTransactions";
 import { getSaveItemNetwork } from "@/helpers/getSaveItemNetwork";
+import { shareableUrl } from "@/helpers/shareableUrl";
 import { useStore } from "@/store/useStore";
 import { SavedTransactionPage } from "@/types/types";
 
@@ -129,6 +130,7 @@ export const SaveTransactionModal = ({
                   name: savedTxnName,
                   page,
                   xdr,
+                  shareableUrl: shareableUrl("transactions"),
                   ...(page === "build"
                     ? {
                         params: transaction.build.params,

diff --git a/src/components/ShareApiExplorerUrlButton.tsx → src/components/ShareUrlButton.tsx b/src/components/ShareApiExplorerUrlButton.tsx → src/components/ShareUrlButton.tsx
@@ -1,10 +1,6 @@
 import { Button, CopyText, Icon } from "@stellar/design-system";
 
-export const ShareApiExplorerUrlButton = ({
-  shareableUrl,
-}: {
-  shareableUrl: string;
-}) => {
+export const ShareUrlButton = ({ shareableUrl }: { shareableUrl: string }) => {
   return (
     <CopyText
       textToCopy={shareableUrl}

diff --git a/src/helpers/apiExplorerShareableUrl.ts → src/helpers/shareableUrl.ts b/src/helpers/apiExplorerShareableUrl.ts → src/helpers/shareableUrl.ts
@@ -1,17 +1,18 @@
 import { parse, stringify } from "zustand-querystring";
 
-export const apiExplorerShareableUrl = () => {
+export const shareableUrl = (page: "requests" | "transactions") => {
   const { origin, pathname, search } = window.location;
+  const pageParam = page === "requests" ? "endpoints" : "transaction";
 
   // Removing extra chars
   const trimmedSearch = search.substring(3);
   const searchParams = Object.entries(parse(trimmedSearch) || {}).reduce(
     (res, cur) => {
       const [key, value] = cur;
 
-      // For API Explorer shareable URL we only need to keep network and
-      // endpoints params
-      if (["network", "endpoints"].includes(key)) {
+      // For API Explorer or Transaction shareable URL we only need to keep
+      // network and endpoints or transaction params
+      if (["network", pageParam].includes(key)) {
         return { ...res, [key]: value };
       }
 

diff --git a/src/types/types.ts b/src/types/types.ts
@@ -166,6 +166,7 @@ export type SavedTransaction = {
   xdr: string;
   name: string;
   page: SavedTransactionPage;
+  shareableUrl: string | undefined;
 };
 
 export type SavedTransactionPage = "build" | "sign" | "simulate" | "submit";