Merge pull request #36 from sector-3/refactor-before-protocol-upgrade

Prepare for protocol v1 (#35)

Author: aahna-ashina

src/pages/v0/daos/[address].tsx

@@ -59,7 +59,7 @@ export default function DaoPage() {
         </div>
 
         <div id='content' className='mt-8'>
-          <PriorityCount daoAddress={address} />
+          <Priorities daoAddress={address} />
         </div>
       </main>
     </WagmiConfig>
@@ -96,90 +96,21 @@ function EthereumAccount() {
   )
 }
 
-function PriorityCount({ daoAddress }: any) {
-  console.log('PriorityCount')
-
-  const { isConnected } = useAccount()
-  console.log('isConnected:', isConnected)
-
-  const [isPriorityButtonClicked, setPriorityButtonClicked] = useState(false)
-  console.log('isPriorityButtonClicked:', isPriorityButtonClicked)
-
-  const { data: priorityCount, isError, isLoading } = useContractRead({
-    address: daoAddress,
-    abi: Sector3DAO.abi,
-    functionName: 'getPriorityCount'
-  })
-  console.log('priorityCount:', priorityCount)
-
-  if (!useIsMounted() || (priorityCount == undefined)) {
-    return (
-      <div className="flex items-center text-gray-400">
-        <div className="inline-block h-8 w-8 animate-spin rounded-full border-4 border-solid border-current border-r-transparent border-gray-400 align-[-0.125em] motion-reduce:animate-[spin_1.5s_linear_infinite]"></div>
-        &nbsp;Loading...
-      </div>
-    )
-  } else if (priorityCount == 0) {
-    return (
-      <>
-        <div className='container'>
-          {/* <Link href={`${config.etherscanDomain}/address/${daoAddress}#writeContract#F1`} target='_blank'> */}
-            <button disabled={!isConnected} 
-              className='disabled:text-gray-600 disabled:bg-gray-400 float-right px-4 py-2 font-semibold text-indigo-200 bg-indigo-800 hover:bg-indigo-700 rounded-xl'
-              onClick={() => setPriorityButtonClicked(true)}
-            >
-              + Add Priority
-            </button>
-          {/* </Link> */}
-
-
-          {isPriorityButtonClicked && (
-            <PriorityDialog />
-          )}
-
-          <h2 className="text-2xl text-gray-400">Priorities</h2>
-        </div>
-
-        <div className='container'>
-          <div className='text-gray-400 mt-4'>
-            No data
-          </div>
-        </div>
-      </>
-    )
-  }
-  return <Priorities daoAddress={daoAddress} priorityCount={priorityCount} />
-}
-
-function Priorities({ daoAddress, priorityCount }: any) {
+function Priorities({ daoAddress }: any) {
   console.log('Priorities')
 
   console.log('daoAddress:', daoAddress)
-  console.log('priorityCount:', priorityCount)
 
   const { isConnected } = useAccount()
   console.log('isConnected:', isConnected)
 
   const [isPriorityButtonClicked, setPriorityButtonClicked] = useState(false)
   console.log('isPriorityButtonClicked:', isPriorityButtonClicked)
 
-  let contracts: any = [priorityCount]
-  for (let i = 0; i < Number(priorityCount); i++) {
-    console.log('i:', i)
-    const daoContract = {
-      address: daoAddress,
-      abi: Sector3DAO.abi
-    }
-    contracts[i] = {
-      ...daoContract,
-      functionName: 'priorities',
-      args: [i]
-    }
-  }
-  console.log('contracts:', contracts)
-
-  const { data, isError, isLoading } = useContractReads({
-    contracts: contracts
+  const { data, isError, isLoading } = useContractRead({
+    address: daoAddress,
+    abi: Sector3DAO.abi,
+    functionName: 'getPriorities'
   })
   console.log('data:', data)
 

src/pages/v0/priorities/[address]/epochs/[epochIndex].tsx

@@ -72,7 +72,7 @@ export default function EpochPage() {
         </div>
 
         <div id='content' className='mt-8'>
-          <ContributionCount priorityAddress={address} epochIndex={epochIndex} />
+          <Contributions priorityAddress={address} epochIndex={epochIndex} />
         </div>
       </main>
     </WagmiConfig>
@@ -209,36 +209,11 @@ function Priority({ address }: any) {
   )
 }
 
-function ContributionCount({ priorityAddress, epochIndex }: any) {
-  console.log('ContributionCount')
-
-  console.log('priorityAddress:', priorityAddress)
-  console.log('epochIndex:', epochIndex)
-
-  const { data: contributionCount, isError, isLoading } = useContractRead({
-    address: priorityAddress,
-    abi: Sector3DAOPriority.abi,
-    functionName: 'getContributionCount'
-  })
-  console.log('contributionCount:', contributionCount)
-
-  if (!useIsMounted() || (contributionCount == undefined)) {
-    return (
-      <div className="flex items-center text-gray-400">
-        <div className="inline-block h-8 w-8 animate-spin rounded-full border-4 border-solid border-current border-r-transparent border-gray-400 align-[-0.125em] motion-reduce:animate-[spin_1.5s_linear_infinite]"></div>
-        &nbsp;Loading...
-      </div>
-    )
-  }
-  return <Contributions priorityAddress={priorityAddress} epochIndex={epochIndex} contributionCount={contributionCount} />
-}
-
-function Contributions({ priorityAddress, epochIndex, contributionCount }: any) {
+function Contributions({ priorityAddress, epochIndex }: any) {
   console.log('Contributions')
 
   console.log('priorityAddress:', priorityAddress)
   console.log('epochIndex:', epochIndex)
-  console.log('contributionCount:', contributionCount)
 
   const { isConnected } = useAccount()
   console.log('isConnected:', isConnected)
@@ -262,49 +237,15 @@ function Contributions({ priorityAddress, epochIndex, contributionCount }: any)
   }
   console.log('priorityTitle:', priorityTitle)
 
-  let contracts: any = [contributionCount]
-  let i = 0
-  for (i = 0; i < Number(contributionCount); i++) {
-    console.log('i:', i)
-    contracts[i] = {
-      ...priorityContract,
-      functionName: 'getContribution',
-      args: [i]
-    }
-  }
-  console.log('contracts:', contracts)
-
-  const { data: contributionsData, isError, isLoading } = useContractReads({
-    contracts: contracts
+  const { data: contributionsData, isError, isLoading } = useContractRead({
+    ...priorityContract,
+    functionName: 'getContributions'
   })
   console.log('contributionsData:', contributionsData)
 
   let contributions: any = null
-  if (contributionCount == 0) {
-    contributions = []
-  } else {
-    if (contributionsData != undefined) {
-      contributions = []
-      let contributionIndex = contributionCount - 1
-      while (contributionIndex >= 0) {
-        console.log('contributionIndex:', contributionIndex)
-
-        const contributionData: any = contributionsData[contributionIndex]
-        console.log('contributionData:', contributionData)
-        if (contributionData.epochIndex == epochIndex) {
-          const contribution = {
-            contributor: contributionData.contributor,
-            description: contributionData.description,
-            proofURL: contributionData.proofURL,
-            alignment: contributionData.alignment,
-            hoursSpent: contributionData.hoursSpent
-          }
-          contributions[contributions.length] = contribution
-        }
-
-        contributionIndex--
-      }
-    }
+  if (contributionsData != undefined) {
+    contributions = contributionsData
   }
   console.log('contributions:', contributions)
 
@@ -346,7 +287,7 @@ function Contributions({ priorityAddress, epochIndex, contributionCount }: any)
             No data
           </div>
         ) : (
-          contributions.map((contribution: any, index: number) => (
+          contributions.slice(0).reverse().map((contribution: any, index: number) => (
             <div key={index} className={`md:flex md:space-x-6 p-6 mt-4 bg-gray-800 rounded-xl border-4 border-gray-800 ${alignmentBorderColors[contribution.alignment]}`}>
               <div className='md:w-1/2'>
                 <div>