Feat/claim battlepass (#521)

* feat: rm menu items

* feat: add temp gfx assets

* feat: update layout, add pages for v1

* feat: add loader, enums, hooks

* feat: init battlepass

* chore: update linter setup

* feat: update build

* feat: graph, nav

* feat: update layout, theme

* feat: update page wrappers, add v1 router

* feat: add battlepass

* feat: update layout, resolve battlepass

* feat: move battlepass

* fix: file case

* fix: normalize file imports

* fix: normalize file imports

* fix: normalize file imports

* feat: add battlepass tx

* feat: update sidebar query

* feat: add push

pkg/app/src/dapps/battlepass/components/battlepass/BPBuyBtn.tsx

@@ -5,6 +5,7 @@ import { useConfig } from 'hooks/useConfig'
 import { useCurrentAccountAddress } from 'hooks/useCurrentAccountAddress'
 import { useTmpOrganisationState } from 'hooks/useTmpOrganisationState'
 import { useJoinBattlePassTX } from 'hooks/tx/useJoinBattlePassTX'
+import { useActiveBattlepassByIdQuery } from 'src/queries'
 
 // import { createWarningNotification } from 'src/utils/notificationUtils'
 import { useTheme } from '@mui/material/styles'
@@ -22,8 +23,20 @@ type TProps = {
 export const BPBuyBtn = ({ args }: TProps) => {
 	const { id } = args
 	const theme = useTheme()
+	const { push } = useRouter()
 
-	const joinBattlePassTX = useJoinBattlePassTX(id)
+	const [battlepassId, setBattlepassId] = useState(null)
+
+	const { loading, data, error } = useActiveBattlepassByIdQuery({ variables: { id: id } })
+
+	useEffect(() => {
+		if (loading === true) return
+		if (data.battlepass.length === 0) push('/battlepass')
+		console.log(data.battlepass[0].id)
+		setBattlepassId(data.battlepass[0].id)
+	}, [loading, data?.battlepass])
+
+	const joinBattlePassTX = useJoinBattlePassTX(battlepassId)
 	const address = useCurrentAccountAddress()
 
 	const [isBattlePass, setIsBattlePass] = useState<boolean>(false)
@@ -38,7 +51,7 @@ export const BPBuyBtn = ({ args }: TProps) => {
 		setShowTxModalType(false)
 	}, [setShowTxModalType])
 
-	// if (!isBattlePass) return null
+	if (!battlepassId) return null
 
 	return (
 		<Fragment>

pkg/app/src/hooks/tx/useJoinBattlePassTX.ts

@@ -8,44 +8,44 @@ import { TransactionData } from 'src/@types/transactionData'
 import * as Yup from 'yup'
 
 const validation = Yup.object().shape({
-	organizationId: Yup.string().required(),
+	battlepassId: Yup.string().required(),
 	accountId: Yup.string().required(),
 })
 
-export function useJoinBattlePassTX(organizationId: string): TransactionData {
+export function useJoinBattlePassTX(battlepassId: string): TransactionData {
 	const { t } = useTranslation()
 	const { selectedApiProvider } = useNetworkContext()
 	const [txState, setTxState] = useState<TransactionData>(null)
 
 	const address = useCurrentAccountAddress()
-	const logger = useLogger('useAddMemberTransaction')
+	const logger = useLogger('useJoinBattlePassTX')
 
 	useEffect(() => {
-		if (selectedApiProvider?.apiProvider && address && organizationId) {
+		if (selectedApiProvider?.apiProvider && address && battlepassId) {
 			try {
 				// Data mapping
 				const mappedData = {
-					organizationId: organizationId,
+					battlepassId: battlepassId,
 					accountId: address,
 				}
 
 				// Data validation
 				validation.validateSync(mappedData)
 
-				const tx = selectedApiProvider.apiProvider.tx.control.addMember(
-					mappedData.organizationId,
+				const tx = selectedApiProvider.apiProvider.tx.battlepass.claimBattlepass(
+					mappedData.battlepassId,
 					mappedData.accountId,
 				)
 
 				setTxState({
 					tx,
-					title: 'Join BattlePass',
+					title: 'Join Battlepass',
 					description: t('transactions:addMember:description'),
 					actionSubTitle: t('transactions:addMember:action_subtitle'),
 					txMsg: {
-						pending: t('notification:transactions:addMember:pending'),
-						success: t('notification:transactions:addMember:success'),
-						error: t('notification:transactions:addMember:error'),
+						pending: 'joining battlepass...',
+						success: 'joined battlepass!',
+						error: 'tx failed!',
 					},
 				})
 			} catch (e) {
@@ -55,7 +55,7 @@ export function useJoinBattlePassTX(organizationId: string): TransactionData {
 				}
 			}
 		}
-	}, [selectedApiProvider, address, organizationId, logger, t, setTxState])
+	}, [selectedApiProvider, address, battlepassId, logger, t, setTxState])
 
 	return txState
 }

pkg/app/src/layouts/v2/components/OrganizationButton.tsx

@@ -18,7 +18,8 @@ interface ComponentProps {
 export function OrganizationButton({ id, logo, name, active, notification }: ComponentProps) {
 	const { push } = useRouter()
 	const config = useConfig()
-	const url = `/v1/${id}`
+	// const url = `/v1/${id}`
+	const url = `/organizations/${id}/dashboard`
 
 	return (
 		<Tooltip title={name}>

pkg/app/src/layouts/v2/components/Sidebar.tsx

@@ -99,8 +99,8 @@ export function Sidebar({ showHeader, onClose, open }: ComponentProps) {
 										<Fragment key={organization?.id}>
 											<OrganizationButtonMemoized
 												id={organization?.id}
-												logo={organization?.metadata?.logo}
-												name={organization?.metadata?.name}
+												logo={organization?.logo}
+												name={organization?.name}
 												active={location?.pathname?.indexOf(organization?.id) >= 0}
 												notification={false}
 											/>