diff --git a/components/IscnRegisterForm.vue b/components/IscnRegisterForm.vue index b865e7fc..d742b5af 100644 --- a/components/IscnRegisterForm.vue +++ b/components/IscnRegisterForm.vue @@ -310,9 +310,9 @@ class="mb-[12px] max-w-full" > info.link) + } + get isUseArweaveLink() { return this.shouldShowDRMOption && this.isUseArweaveLinkChecked } @@ -849,6 +853,10 @@ export default class IscnRegisterForm extends Vue { return list } + get ipfsLinkList() { + return this.ipfsHashList.map((ipfs) => formatIpfs(ipfs)) + } + get shouldShowContentFingerprintInput() { return !this.fileRecords.some((file) => file.fileData) } @@ -931,11 +939,19 @@ export default class IscnRegisterForm extends Vue { if (this.isUseArweaveLink) { const list = [...this.uploadArweaveLinkList] if (this.arweaveId) { - list.push(this.formatArweave(this.arweaveId) as string) + list.push(formatArweave(this.arweaveId) as string) } return list; } - return this.combinedArweaveIdList.map((link) => this.formatArweave(link)) + + let arweaveLinkList: string[] = [] + if (this.uploadArweaveInfoList && this.uploadArweaveInfoList.length) { + arweaveLinkList = this.uploadArweaveInfoList.map((info) => formatArweave(info.id, info.key)) + } + if (this.arweaveId) { + arweaveLinkList.push(formatArweave(this.arweaveId)) + } + return arweaveLinkList } get contentFingerprintLinks() { @@ -944,7 +960,7 @@ export default class IscnRegisterForm extends Vue { array.push(...this.combinedArweaveLinks) } if (!this.isUseArweaveLink && this.ipfsHashList.length) { - array.push(...this.ipfsHashList.map((ipfs) => this.formatIpfs(ipfs))) + array.push(...this.ipfsHashList.map((ipfs) => formatIpfs(ipfs))) } if (this.customContentFingerprints.length) { array.push(...this.customContentFingerprints) @@ -957,7 +973,19 @@ export default class IscnRegisterForm extends Vue { ?.filter((items: any) => items.filename && items.url) ?.map((sameAs: { filename: any; filetype: any; url: any }) => { if (sameAs.filename && sameAs.filetype) { - return `${sameAs.url}?name=${sameAs.filename}.${sameAs.filetype}` + try { + const parsed = new URL(sameAs.url) + parsed.searchParams.set('name', `${sameAs.filename}.${sameAs.filetype}`) + return parsed.toString() + } catch (e) { + // eslint-disable-next-line no-console + console.error(e) + const parts = sameAs.url.split('?') + if (parts.length === 1) { + return `${sameAs.url}?name=${sameAs.filename}.${sameAs.filetype}` + } + return `${sameAs.url}&name=${sameAs.filename}.${sameAs.filetype}` + } } return '' }) @@ -1071,11 +1099,11 @@ export default class IscnRegisterForm extends Vue { if (this.arweaveFee.lte(0)) { return 1 } - return this.combinedArweaveIdList.length ? 2 : 1 + return this.combinedArweaveLinks.length ? 2 : 1 } get totalSignStep() { - if (this.combinedArweaveIdList.length && this.arweaveFee.lte(0)) return 1 + if (this.combinedArweaveLinks.length && this.arweaveFee.lte(0)) return 1 return 2 } @@ -1089,7 +1117,7 @@ export default class IscnRegisterForm extends Vue { if (this.isUploadingArweave) { return this.$t('IscnRegisterForm.signDialog.closeWarning') } - if (this.combinedArweaveIdList.length) { + if (this.combinedArweaveLinks.length) { return this.$t('IscnRegisterForm.signDialog.sign.iscn.register') } return this.$t('IscnRegisterForm.signDialog.sign.arweave.upload') @@ -1126,17 +1154,6 @@ export default class IscnRegisterForm extends Vue { ) } - get combinedArweaveIdList() { - let arweaveIdList: string[] = [] - if (this.uploadArweaveIdList && this.uploadArweaveIdList.length) { - arweaveIdList = [...this.uploadArweaveIdList] - } - if (this.arweaveId) { - arweaveIdList.push(this.arweaveId) - } - return arweaveIdList - } - get isBookType() { return this.type === 'Book' } @@ -1165,7 +1182,7 @@ export default class IscnRegisterForm extends Vue { this.author.name = this.epubMetadata.author || '' this.author.authorDescription = '' this.tags = this.epubMetadata.tags || [] - this.thumbnailUrl = this.formatArweave( + this.thumbnailUrl = formatArweave( this.epubMetadata.thumbnailArweaveId, ) as string if (this.author.name) { @@ -1346,14 +1363,6 @@ export default class IscnRegisterForm extends Vue { this.license = value } - formatIpfs(ipfsHash: string) { - return this.$t('IscnRegisterForm.ipfs.link', { hash: ipfsHash }) as string - } - - formatArweave(arweaveId: string) { - return this.$t('IscnRegisterForm.arweave.link', { arweaveId }) as string - } - async getLikerIdsAddresses() { let likerIdsAddresses: any[] = [] try { @@ -1488,7 +1497,7 @@ estimation, } if ( !this.fileRecords.some((file) => file.fileBlob) || - this.combinedArweaveIdList.length + this.combinedArweaveLinks.length ) await this.submitToISCN() } diff --git a/components/IscnUploadForm.vue b/components/IscnUploadForm.vue index f53c77e1..4194d653 100644 --- a/components/IscnUploadForm.vue +++ b/components/IscnUploadForm.vue @@ -323,7 +323,7 @@ export default class IscnUploadForm extends Vue { arweaveFee = new BigNumber(0) arweaveFeeMap: Record = {} sentArweaveTransactionInfo = new Map< - string, { transactionHash?: string, arweaveId?: string, arweaveLink?: string } + string, { transactionHash?: string, arweaveId?: string, arweaveLink?: string, arweaveKey?: string } >() likerId: string = '' @@ -879,14 +879,14 @@ export default class IscnUploadForm extends Vue { }); if (arweaveId) { const uploadedData = this.sentArweaveTransactionInfo.get(record.ipfsHash) || {}; - this.sentArweaveTransactionInfo.set(record.ipfsHash, { ...uploadedData, arweaveId, arweaveLink }); + this.sentArweaveTransactionInfo.set(record.ipfsHash, { ...uploadedData, arweaveId, arweaveLink, arweaveKey: key }); if (tempRecord.fileName.includes('cover.jpeg')) { const metadata = this.epubMetadataList.find((file: any) => file.thumbnailIpfsHash === record.ipfsHash) if (metadata) { metadata.thumbnailArweaveId = arweaveId } } - this.$emit('arweaveUploaded', { arweaveId, arweaveLink }) + this.$emit('arweaveUploaded', { arweaveId, arweaveLink, arweaveKey: key }) this.isOpenSignDialog = false } else { this.isOpenWarningSnackbar = true @@ -1010,8 +1010,11 @@ export default class IscnUploadForm extends Vue { this.uploadStatus = ''; } - const uploadArweaveIdList = Array.from(this.sentArweaveTransactionInfo.values()).map(entry => entry.arweaveId); - const uploadArweaveLinkList = Array.from(this.sentArweaveTransactionInfo.values()).map(entry => entry.arweaveLink); + const uploadArweaveInfoList = Array.from(this.sentArweaveTransactionInfo.values()) + .map(entry => { + const { arweaveId, arweaveLink, arweaveKey } = entry; + return { id: arweaveId, link: arweaveLink, key: arweaveKey }; + }); this.modifiedFileRecords.forEach((record: any, index:number) => { if (this.sentArweaveTransactionInfo.has(record.ipfsHash)) { const info = this.sentArweaveTransactionInfo.get( @@ -1021,17 +1024,18 @@ export default class IscnUploadForm extends Vue { const { arweaveId, arweaveLink, + arweaveKey, } = info; if (arweaveId) this.modifiedFileRecords[index].arweaveId = arweaveId if (arweaveLink) this.modifiedFileRecords[index].arweaveLink = arweaveLink + if (arweaveKey) this.modifiedFileRecords[index].arweaveKey = arweaveKey } } }) this.$emit('submit', { fileRecords: this.modifiedFileRecords, - arweaveIds: uploadArweaveIdList, + arweaveInfos: uploadArweaveInfoList, epubMetadata: this.epubMetadataList[0], - arweaveLinks: uploadArweaveLinkList, }) } diff --git a/locales/en.json b/locales/en.json index 28ba47d9..0bb8d783 100644 --- a/locales/en.json +++ b/locales/en.json @@ -187,7 +187,6 @@ "IscnEditInfo.updating": "Updating ISCN...", "IscnEditInfo.button.confirm": "Update ISCN", "IscnEditInfo.button.edit": "Edit ISCN", - "IscnRegisterForm.arweave.link": "ar://{arweaveId}", "IscnRegisterForm.button.back": "Back", "IscnRegisterForm.button.confirm": "Confirm", "IscnRegisterForm.button.loading": "Loading files...", @@ -218,8 +217,6 @@ "IscnRegisterForm.error.walletConnect": "Wallet Connect is temporarily unavailable for minting. Please try the other signing methods", "IscnRegisterForm.guide.uploadOnly": "Upload only mode without ISCN", "IscnRegisterForm.guide.review": "Review and edit metadata", - "IscnRegisterForm.ipfs.link": "ipfs://{hash}", - "IscnRegisterForm.fileSHA256.link": "hash://sha256/{hash}", "IscnRegisterForm.label.author": "Author", "IscnRegisterForm.label.stakeholder": "Stakeholders", "IscnRegisterForm.label.datePublished": "Original Publication Date", diff --git a/pages/edit/_iscnId.vue b/pages/edit/_iscnId.vue index 64c040c9..d570aee2 100644 --- a/pages/edit/_iscnId.vue +++ b/pages/edit/_iscnId.vue @@ -250,7 +250,7 @@ import { BigNumber } from 'bignumber.js'; import { ISCN_PREFIX, ISCN_GAS_FEE, UPDATE_ISCN_GAS_MULTIPLIER } from '~/constant' import { logTrackerEvent } from '~/utils/logger' import { signISCN } from '~/utils/cosmos/iscn/sign' -import { extractIscnIdPrefix } from '~/utils/ui' +import { extractIscnIdPrefix, formatArweave, formatIpfs } from '~/utils/ui' import { LIKE_CO_API_ROOT } from '~/constant/api'; const walletModule = namespace('wallet') @@ -306,8 +306,7 @@ export default class EditIscnPage extends Vue { shouldShowMoreSettings: boolean = false uploadFileRecords: any = null uploadIpfsHashList: string[] = [] - uploadArweaveIdList: string[] = [] - uploadArweaveLinkList: string[] = [] + uploadArweaveInfoList: any[] = [] sameAsList: any = [] step: number = 1 @@ -323,15 +322,15 @@ export default class EditIscnPage extends Vue { return this.shouldShowDRMOption && this.isUseArweaveLinkChecked } - get combinedArweaveIdList() { - return this.uploadArweaveIdList || [] + get uploadArweaveLinkList() { + return this.uploadArweaveInfoList.map((info) => info.link) } get combinedArweaveLinks(): string[] { if (this.isUseArweaveLink) { return this.uploadArweaveLinkList } - return this.combinedArweaveIdList.map((link) => this.formatArweave(link) as string) + return this.uploadArweaveInfoList.map((info) => formatArweave(info.link, info.key) as string) } get formattedSameAsList() { @@ -361,7 +360,7 @@ export default class EditIscnPage extends Vue { array.push(...this.combinedArweaveLinks) } if (!this.isUseArweaveLinkChecked && this.uploadIpfsHashList.length) { - array.push(...this.uploadIpfsHashList.map((ipfs) => this.formatIpfs(ipfs) as string)) + array.push(...this.uploadIpfsHashList.map((ipfs) => formatIpfs(ipfs) as string)) } if (this.customContentFingerprints.length) { array.push(...this.customContentFingerprints) @@ -420,18 +419,6 @@ export default class EditIscnPage extends Vue { logTrackerEvent(this, 'ISCNEdit', 'ISCNFileUploadToARSuccess', arweaveId, 1) } - formatIpfs(ipfsHash: string) { - return this.$t('IscnRegisterForm.ipfs.link', { hash: ipfsHash }) - } - - formatArweave(arweaveId: string) { - return this.$t('IscnRegisterForm.arweave.link', { arweaveId }) - } - - formatFileSHA256(hash: string) { - return this.$t('IscnRegisterForm.fileSHA256.link', { hash }) - } - addContentFingerprint() { this.customContentFingerprints.push(this.contentFingerprintInput) this.contentFingerprintInput = '' @@ -439,22 +426,17 @@ export default class EditIscnPage extends Vue { onSubmitUpload({ fileRecords, - arweaveIds, - arweaveLinks, + arweaveRecords, }: { fileRecords: any[] - arweaveIds: string[] - arweaveLinks: string[] + arweaveRecords: any[] }) { this.contentFingerprints = [] if (fileRecords && fileRecords.length) { this.uploadFileRecords = [...fileRecords] } - if (arweaveIds && arweaveIds.length) { - this.uploadArweaveIdList = [...arweaveIds] - } - if (arweaveLinks && arweaveLinks.length) { - this.uploadArweaveLinkList = [...arweaveLinks] + if (arweaveRecords && arweaveRecords.length) { + this.uploadArweaveInfoList = [...arweaveRecords] } logTrackerEvent(this, 'ISCNEdit', 'ISCNConfirmFile', '', 1) this.step = 2 diff --git a/pages/new/index.vue b/pages/new/index.vue index 2d53ec7d..4847d3cc 100644 --- a/pages/new/index.vue +++ b/pages/new/index.vue @@ -40,8 +40,7 @@ :ipfs-hash="urlIpfsHash" :arweave-id="urlArweaveId" - :upload-arweave-id-list="uploadArweaveList" - :upload-arweave-link-list="uploadArweaveLinkList" + :upload-arweave-info-list="uploadArweaveInfoList" :epub-metadata="epubMetadata" :step="step" @@ -121,8 +120,7 @@ export default class NewIndexPage extends Vue { state = 'init' urlIpfsHash = this.$route.query.ipfs_hash || '' urlArweaveId = this.$route.query.arweave_id || '' - uploadArweaveList: string[] = [] - uploadArweaveLinkList: string[] = [] + uploadArweaveInfoList: any[] = [] fileSHA256 = '' fileData = '' fileType = '' @@ -193,23 +191,18 @@ export default class NewIndexPage extends Vue { onSubmitUpload({ fileRecords, - arweaveIds, - arweaveLinks, + arweaveInfos, epubMetadata, }: { fileRecords: any[] - arweaveIds: string[] - arweaveLinks: string[] + arweaveInfos: any[] epubMetadata: any }) { if (fileRecords && fileRecords.length) { this.uploadFileRecords = [...fileRecords] } - if (arweaveIds && arweaveIds.length) { - this.uploadArweaveList = [...arweaveIds] - } - if (arweaveLinks && arweaveLinks.length) { - this.uploadArweaveLinkList = [...arweaveLinks] + if (arweaveInfos && arweaveInfos.length) { + this.uploadArweaveInfoList = [...arweaveInfos] } if (epubMetadata) { this.epubMetadata = {...epubMetadata} diff --git a/utils/arweave/v2.ts b/utils/arweave/v2.ts index 2bd45ba2..562db803 100644 --- a/utils/arweave/v2.ts +++ b/utils/arweave/v2.ts @@ -195,5 +195,6 @@ export async function uploadSingleFileToBundlr( return { arweaveId, arweaveLink, + arweaveKey: key, }; } diff --git a/utils/ui.js b/utils/ui.js index e4900eaf..58d9d0d7 100644 --- a/utils/ui.js +++ b/utils/ui.js @@ -45,3 +45,14 @@ export function extractIscnIdPrefix(iscnId) { } return null; } + +export function formatIpfs(ipfsHash) { + return `ipfs://${ipfsHash}` +} + +export function formatArweave(arweaveId, key) { + if (key) { + return `ar://${arweaveId}?key=${key}` + } + return `ar://${arweaveId}` +}