xevion/rdap
1
0
Fork 0
mirror of https://github.com/Xevion/rdap.git synced 2025-12-08 04:08:11 -06:00
Code Issues Packages Projects Releases Wiki Activity

Add actions: copy to clipboard, download response file

Browse Source
This commit is contained in:
Xevion
2024-05-10 05:43:55 -05:00
parent 597863ea70
commit 29e294d951
1 changed files with 43 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

49
src/components/common/AbstractCard.tsx
View File

@@ -4,6 +4,8 @@ import { useBoolean } from "usehooks-ts";
import {
LinkIcon,
CodeBracketIcon,
DocumentArrowDownIcon,
ClipboardDocumentIcon,
} from "@heroicons/react/24/outline";
type AbstractCardProps = {
@@ -28,12 +30,6 @@ const AbstractCard: FunctionComponent<AbstractCardProps> = ({
{header != undefined || data != undefined ? (
<div className="flex bg-zinc-700 p-2 pl-3 md:pl-5">
<div className="grow space-x-2">{header}</div>
{data != undefined ? (
<div className="pr-1">
<CodeBracketIcon
onClick={toggleRaw}
className="h-6 w-6 cursor-pointer"
/>
{url != undefined ? (
<div className="pr-2">
<a href={url} target="_blank" rel="noreferrer">
@@ -41,6 +37,47 @@ const AbstractCard: FunctionComponent<AbstractCardProps> = ({
</a>
</div>
) : null}
{data != undefined ? (
<>
<div className="pr-2">
<ClipboardDocumentIcon
onClick={() => {
// stringify the JSON object, then begin the async clipboard write
navigator.clipboard.writeText(JSON.stringify(data, null, 4)).then(() => {
console.log('Copied to clipboard.');
}, (err) => {
if (err instanceof Error)
console.error(`Failed to copy to clipboard (${err.toString()}).`);
else
console.error("Failed to copy to clipboard.");
});
}}
className="h-6 w-6 cursor-pointer"
/>
</div>
<div className="pr-2">
<DocumentArrowDownIcon
onClick={() => {
const file = new Blob([JSON.stringify(data, null, 4)], {
type: "application/json",
});
const anchor = document.createElement("a");
anchor.href = URL.createObjectURL(file);
anchor.download = "response.json";
anchor.click();
}}
className="h-6 w-6 cursor-pointer"
/>
</div>
<div className="pr-1">
<CodeBracketIcon
onClick={toggleRaw}
className="h-6 w-6 cursor-pointer"
/>
</div>
</>
) : null}
</div>
) : null}
<div className="max-w-full p-2 px-4 overflow-x-auto">