From 664237d628f8760196ca9c1cab93e8841b8f9f01 Mon Sep 17 00:00:00 2001
From: Serkan Reis <serkanreis@gmail.com>
Date: Thu, 12 Jan 2023 13:01:11 +0300
Subject: [PATCH] Names support for Create Collection > Royalty Payment Address

---
 .../collections/creation/RoyaltyDetails.tsx   | 21 +++++++++++++------
 pages/collections/create.tsx                  |  7 +++++++
 2 files changed, 22 insertions(+), 6 deletions(-)

diff --git a/components/collections/creation/RoyaltyDetails.tsx b/components/collections/creation/RoyaltyDetails.tsx
index ef97329..5ed298e 100644
--- a/components/collections/creation/RoyaltyDetails.tsx
+++ b/components/collections/creation/RoyaltyDetails.tsx
@@ -1,8 +1,10 @@
 import { Conditional } from 'components/Conditional'
 import { FormGroup } from 'components/FormGroup'
 import { useInputState } from 'components/forms/FormInput.hooks'
+import { useWallet } from 'contexts/wallet'
 import React, { useEffect, useState } from 'react'
 
+import { resolveAddress } from '../../../utils/resolveAddress'
 import { NumberInput, TextInput } from '../../forms/FormInput'
 
 interface RoyaltyDetailsProps {
@@ -18,6 +20,7 @@ export interface RoyaltyDetailsDataProps {
 type RoyaltyState = 'none' | 'new'
 
 export const RoyaltyDetails = ({ onChange }: RoyaltyDetailsProps) => {
+  const wallet = useWallet()
   const [royaltyState, setRoyaltyState] = useState<RoyaltyState>('none')
 
   const royaltyPaymentAddressState = useInputState({
@@ -37,17 +40,23 @@ export const RoyaltyDetails = ({ onChange }: RoyaltyDetailsProps) => {
   })
 
   useEffect(() => {
-    const data: RoyaltyDetailsDataProps = {
-      royaltyType: royaltyState,
-      paymentAddress: royaltyPaymentAddressState.value
+    void resolveAddress(
+      royaltyPaymentAddressState.value
         .toLowerCase()
         .replace(/,/g, '')
         .replace(/"/g, '')
         .replace(/'/g, '')
         .replace(/ /g, ''),
-      share: Number(royaltyShareState.value),
-    }
-    onChange(data)
+      wallet,
+    ).then((royaltyPaymentAddress) => {
+      royaltyPaymentAddressState.onChange(royaltyPaymentAddress)
+      const data: RoyaltyDetailsDataProps = {
+        royaltyType: royaltyState,
+        paymentAddress: royaltyPaymentAddressState.value,
+        share: Number(royaltyShareState.value),
+      }
+      onChange(data)
+    })
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [royaltyState, royaltyPaymentAddressState.value, royaltyShareState.value])
 
diff --git a/pages/collections/create.tsx b/pages/collections/create.tsx
index ffec279..0be7ee8 100644
--- a/pages/collections/create.tsx
+++ b/pages/collections/create.tsx
@@ -52,6 +52,7 @@ import type { MinterType } from '../../components/collections/actions/Combobox'
 import type { UploadMethod } from '../../components/collections/creation/UploadDetails'
 import { ConfirmationModal } from '../../components/ConfirmationModal'
 import { getAssetType } from '../../utils/getAssetType'
+import { isValidAddress } from '../../utils/isValidAddress'
 
 const CollectionCreationPage: NextPage = () => {
   const wallet = useWallet()
@@ -767,6 +768,12 @@ const CollectionCreationPage: NextPage = () => {
       if (royaltyDetails.share === 0) throw new Error('Royalty share percentage is required')
       if (royaltyDetails.share > 100 || royaltyDetails.share < 0) throw new Error('Invalid royalty share percentage')
       if (royaltyDetails.paymentAddress === '') throw new Error('Royalty payment address is required')
+      if (!isValidAddress(royaltyDetails.paymentAddress)) {
+        if (royaltyDetails.paymentAddress.trim().endsWith('.stars')) {
+          throw new Error('Royalty payment address could not be resolved')
+        }
+        throw new Error('Invalid royalty payment address')
+      }
     }
   }