Merge pull request #16 from meemproject/feature/ethdenver-updates

Show magic wallet; fix bundle actions not disabled for non-creators
meemproject · Mar 4, 2023 · c96c23f · c96c23f
2 parents aba1301 + abd7853
commit c96c23f
Show file tree

Hide file tree

Showing 4 changed files with 53 additions and 23 deletions.
diff --git a/src/components/Atoms/FacetList.tsx b/src/components/Atoms/FacetList.tsx
@@ -36,6 +36,7 @@ export interface IProps {
 	contracts?: Contracts[]
 	isLoading?: boolean
 	isEnabled?: boolean
+	isDisabled?: boolean
 }
 
 export const FacetList: React.FC<IProps> = ({
@@ -44,6 +45,7 @@ export const FacetList: React.FC<IProps> = ({
 	contractInstances,
 	contracts,
 	isEnabled,
+	isDisabled,
 	proxyContract
 }) => {
 	const { classes } = useStyles()
@@ -227,7 +229,8 @@ export const FacetList: React.FC<IProps> = ({
 																<Switch
 																	key={`${contract?.id}-${selector}`}
 																	disabled={
-																		!isEnabled
+																		!isEnabled ||
+																		isDisabled
 																	}
 																	checked={
 																		isInUse
@@ -255,7 +258,7 @@ export const FacetList: React.FC<IProps> = ({
 												)}
 											</div>
 										</ContractCard>
-										{isEnabled && (
+										{isEnabled && !isDisabled && (
 											<div>
 												<IconButton
 													tooltip="Remove Facet"

diff --git a/src/components/Bundles/BundleContainer.tsx b/src/components/Bundles/BundleContainer.tsx
@@ -41,7 +41,7 @@ export const BundleContainer: React.FC = () => {
 	const { anonClient } = useMeemApollo()
 	const { classes } = useStyles()
 	const bundleId = router.query.bundleId as string
-	const { chainId } = useWallet()
+	const { chainId, accounts } = useWallet()
 
 	const form = useForm({
 		initialValues: {
@@ -253,17 +253,23 @@ export const BundleContainer: React.FC = () => {
 							form={form}
 							isLoading={isLoading}
 							contracts={contracts}
+							isDisabled={
+								data?.Bundles[0].Creator?.address !==
+								accounts[0]
+							}
 						/>
 						<Space h={24} />
-						<Center>
-							<Button
-								type="submit"
-								loading={isSaving}
-								disabled={isLoading || isSaving}
-							>
-								Save
-							</Button>
-						</Center>
+						{data?.Bundles[0].Creator?.address === accounts[0] && (
+							<Center>
+								<Button
+									type="submit"
+									loading={isSaving}
+									disabled={isLoading || isSaving}
+								>
+									Save
+								</Button>
+							</Center>
+						)}
 					</>
 				)}
 			</form>

diff --git a/src/components/Bundles/BundleForm.tsx b/src/components/Bundles/BundleForm.tsx
@@ -38,11 +38,13 @@ export interface IProps {
 	form: UseFormReturnType<any>
 	contracts: Contracts[]
 	isLoading?: boolean
+	isDisabled?: boolean
 }
 
 export const BundleForm: React.FC<IProps> = ({
 	form,
-	isLoading: isParentLoading
+	isLoading: isParentLoading,
+	isDisabled
 }) => {
 	const { anonClient } = useMeemApollo()
 	const { classes } = useStyles()
@@ -125,20 +127,23 @@ export const BundleForm: React.FC<IProps> = ({
 			<div className={classes.section_wrapper}>
 				<Text size="xl">Facets</Text>
 				<Space w={12} />
-				<Button
-					disabled={isLoading}
-					onClick={() => setIsOpen(true)}
-					leftIcon={<CirclePlus />}
-				>
-					Add Facet
-				</Button>
+				{!isDisabled && (
+					<Button
+						disabled={isLoading}
+						onClick={() => setIsOpen(true)}
+						leftIcon={<CirclePlus />}
+					>
+						Add Facet
+					</Button>
+				)}
 			</div>
 			<Space h={12} />
 			<FacetList
 				form={form}
 				contracts={data?.Contracts as Contracts[]}
 				isLoading={isLoading}
 				isEnabled
+				isDisabled={isDisabled}
 			/>
 			<Modal
 				opened={isOpen}

diff --git a/src/components/Header/Header.tsx b/src/components/Header/Header.tsx
@@ -8,11 +8,11 @@ import {
 	Avatar,
 	Divider
 } from '@mantine/core'
-import { useWallet } from '@meemproject/react'
+import { useAuth } from '@meemproject/react'
 import Link from 'next/link'
 import { useRouter } from 'next/router'
 import React, { useState } from 'react'
-import { Logout, ChevronDown, Dots } from 'tabler-icons-react'
+import { Logout, ChevronDown, Dots, Wallet } from 'tabler-icons-react'
 import { quickTruncate } from '../../utils/truncated_wallet'
 import { ChainSelect } from '../Atoms/ChainSelect'
 import { Logo } from '../Atoms/Logo'
@@ -162,7 +162,7 @@ export const HeaderMenu: React.FC = () => {
 	const [isUserMenuOpened, setUserMenuOpened] = useState(false)
 	const { classes, cx } = useStyles()
 	const router = useRouter()
-	const wallet = useWallet()
+	const wallet = useAuth()
 
 	const navigateHome = () => {
 		router.push({ pathname: '/' })
@@ -222,6 +222,22 @@ export const HeaderMenu: React.FC = () => {
 								</UnstyledButton>
 							}
 						>
+							{wallet.walletType === 'magic' && (
+								<Menu.Item
+									className={classes.menuItem}
+									onClick={async () => {
+										try {
+											wallet.magic?.wallet.showUI()
+										} catch (e) {
+											// eslint-disable-next-line no-console
+											console.log(e)
+										}
+									}}
+									icon={<Wallet size={14} />}
+								>
+									Wallet
+								</Menu.Item>
+							)}
 							<Menu.Item
 								className={classes.menuItem}
 								onClick={async () => {