fix blob downloading

Author: xdeq

components/TheHeader.vue

@@ -50,7 +50,9 @@ const isActive = (link) => {
 				</NuxtLink>
 			</Flex>
 
-			<Icon name="empty" :class="$style.empty_icon" />
+			<Flex align="center" gap="8" :class="$style.command_button">
+				<Icon name="search" size="16" color="secondary" />
+			</Flex>
 		</Flex>
 	</Flex>
 </template>
@@ -121,6 +123,26 @@ const isActive = (link) => {
 	}
 }
 
+.command_button {
+	height: 28px;
+
+	border-radius: 6px;
+	background: var(--op-5);
+	cursor: pointer;
+
+	padding: 0 8px;
+
+	transition: all 0.2s ease;
+
+	&:hover {
+		background: var(--op-8);
+	}
+
+	&:active {
+		background: var(--op-10);
+	}
+}
+
 @media (max-width: 600px) {
 	.wrapper {
 		height: initial;

components/modals/BlobModal.vue

@@ -4,7 +4,7 @@ import Modal from "@/components/ui/Modal.vue"
 import Button from "@/components/ui/Button.vue"
 
 /** Services */
-import { formatBytes, getNamespaceID } from "@/services/utils"
+import { formatBytes, getNamespaceID, strToHex } from "@/services/utils"
 
 /** API */
 import { fetchNamespaceByMetadata } from "@/services/api/namespace"
@@ -65,8 +65,7 @@ watch(
 
 const handleDownload = () => {
 	const byteArray = new Uint8Array(
-		decodedData.value
-			.replaceAll(" ", "")
+		strToHex(atob(blob.value.data))
 			.match(/.{2}/g)
 			.map((e) => parseInt(e, 16)),
 	)

services/utils/general.js

@@ -18,3 +18,14 @@ export const getNamespaceID = (target) => {
 
 	return s
 }
+
+export const strToHex = (str) => {
+	let hex = ""
+	for (let i = 0; i < str.length; i++) {
+		const charCode = str.charCodeAt(i)
+		const hexValue = charCode.toString(16)
+
+		hex += hexValue.padStart(2, "0")
+	}
+	return hex
+}