Skip to content

Commit

Permalink
Merge pull request #134 from near-ndc/develop
Browse files Browse the repository at this point in the history 
v2.1.3
  • Loading branch information
@Megha-Dev-19
Megha-Dev-19 authored Jul 3, 2023
2 parents aca0f5a + 280f2df commit d6a2cfe
Show file tree
Hide file tree
Showing 8 changed files with 320 additions and 186 deletions.
4 changes: 4 additions & 0 deletions src/App.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,7 @@ import {
import { IndexPage } from './pages/index';
import { CommunityApplicationPage } from './pages/communtiyapplication';
import { ScoreboardPage } from './pages/scoreboard';
import { CommunitySBTPage } from './pages/communitySBT';

const RedirectComponent = () => {
return <Redirect to="/" />;
Expand All @@ -26,6 +27,9 @@ export function App({ isSignedIn }) {
<Route exact path="/community-scoreboard">
<ScoreboardPage isSignedIn={isSignedIn} />
</Route>
<Route exact path="/community-sbts">
<CommunitySBTPage />
</Route>
<Route exact path="/">
<IndexPage isSignedIn={isSignedIn} />
</Route>
Expand Down
12 changes: 12 additions & 0 deletions src/components/common/OutlineButton.js
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
import React from 'react';

export const OutlineButton = ({ onClick, children }) => {
return (
<button
onClick={onClick}
className="cursor-auto rounded-md border border-gray-500 border-1 px-5 text-center py-2 font-light text-black shadow-sm"
>
{children}
</button>
);
};
12 changes: 12 additions & 0 deletions src/components/common/PrimaryButton.js
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
import React from 'react';

export const PrimaryButton = ({ onClick, children }) => {
return (
<button
onClick={onClick}
className="rounded-md border border-transparent bg-gradient-to-r from-purple-600 to-indigo-600 bg-origin-border px-5 py-3 text-base font-medium text-white shadow-sm hover:from-purple-700 hover:to-indigo-700"
>
{children}
</button>
);
};
244 changes: 107 additions & 137 deletions src/components/common/header.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,10 @@ import Logo from '../../images/ndc.png';
import { useAdmin } from '../../utils/useAdmin';
import { Link } from 'react-router-dom/cjs/react-router-dom.min';

export const Header = ({ setShowAdmin, setActiveTabIndex }) => {
export const Header = ({
setShowAdmin = () => {},
setActiveTabIndex = () => {},
}) => {
const [mobileMenuOpen, setMobileMenuOpen] = React.useState(false);
const [isSignedIn, setIsSignedIn] = React.useState(false);
const [isAdmin] = useAdmin({ address: wallet.accountId });
Expand All @@ -34,162 +37,129 @@ export const Header = ({ setShowAdmin, setActiveTabIndex }) => {
}
};

const ApplyToOGSBT = ({ className }) => {
const HomeMenu = ({ isDialog = false }) => {
const activeHomePage =
window.location.href.indexOf('community-sbts') === -1;

return (
<div
onClick={() =>
window.open(
'https://docs.google.com/forms/d/e/1FAIpQLSfQ80mza1ssDRuEkjTl61ty0ORxm23whmwBDlaxWHjodTiz-w/viewform',
'_blank'
)
className={
'cursor-pointer ' +
(isDialog
? 'flex flex-col gap-7'
: 'hidden md:flex gap-12 font-semibold self-center')
}
className={className + ' cursor-pointer'}
>
Apply to OG SBT
<Link to={'/'} className={activeHomePage ? 'text-gradient' : ''}>
Home
</Link>
<Link
to={'community-sbts'}
className={activeHomePage ? '' : 'text-gradient'}
>
Community SBTs
</Link>
</div>
);
};

return (
<>
<div>
<div>
<nav
className="flex h-9 items-center justify-between"
aria-label="Global"
<nav
className="flex h-9 items-center justify-between"
aria-label="Global"
>
<button
type="button"
className="inline-flex md:hidden items-center justify-center rounded-md text-gray-700"
onClick={() => setMobileMenuOpen(true)}
>
<span className="sr-only">Open main menu</span>
<Bars3Icon className="h-6 w-6" aria-hidden="true" />
</button>
<div onClick={() => setActiveTabIndex(null)}>
<Link to="/" className="-m-1.5 p-1.5 font-bold tracking-tight">
<img
src={Logo}
onClick={() => {
setShowAdmin?.(false);
}}
alt="logo"
className="h-[80px] md:h-[120px] md:w-[100px] mt-6 object-cover"
/>
</Link>
</div>
{isSignedIn && isAdmin && (
<>
<button
onClick={() => setShowAdmin(true)}
className="inline-block rounded-lg px-3 py-1.5 text-sm font-semibold leading-6 text-gray-900 shadow-sm ring-1 ring-gray-900/10 hover:ring-gray-900/20 flex items-center space-x-2"
>
<p>Admin Console</p>
<CheckCircleIcon className="h-4 w-4 text-green-600" />
</button>
</>
)}
<div className="self-end flex gap-12">
<HomeMenu />
{wallet.accountId && (
<p className="hidden md:inline-block px-3 py-1.5 text-sm font-semibold leading-6 text-gray-900">
{wallet.accountId}
</p>
)}
<button
type="button"
onClick={() => signOut()}
className="inline-block bg-yellow-300 rounded-lg px-3 py-1.5 text-sm font-semibold leading-6 text-black shadow-sm"
>
<div className="flex lg:min-w-0 lg:flex-1" aria-label="Global">
<div onClick={() => setActiveTabIndex(null)}>
<Link to="/" className="-m-1.5 p-1.5 font-bold tracking-tight">
<img
src={Logo}
onClick={() => {
setShowAdmin?.(false);
}}
alt="logo"
className="h-[120px] w-[100px] mt-6"
/>
</Link>
</div>
</div>
<div className="flex lg:hidden">
{isSignedIn ? (
<>
<button
type="button"
className=" inline-flex items-center justify-center rounded-md text-gray-700"
onClick={() => setMobileMenuOpen(true)}
>
<span className="sr-only">Open main menu</span>
<Bars3Icon className="h-6 w-6" aria-hidden="true" />
</button>
</>
) : (
<div className="flex flex-wrap justify-end gap-6">
<button
type="button"
onClick={() => wallet.signIn()}
className="inline-block bg-yellow-300 rounded-lg px-3 py-1.5 text-sm font-semibold leading-6 text-black shadow-sm"
>
Connect Wallet
</button>
<ApplyToOGSBT className="text-gradient font-semibold self-center" />
</div>
)}
{isSignedIn ? 'Sign Out' : 'Connect Wallet'}
</button>
</div>
</nav>
<Dialog as="div" open={mobileMenuOpen} onClose={setMobileMenuOpen}>
<Dialog.Panel className="fixed inset-0 z-10 overflow-y-auto bg-white px-6 py-6 lg:hidden">
<div className="flex h-9 items-center justify-between">
<div className="flex">
<a href="#" className="-m-1.5 p-1.5 font-bold tracking-tight">
<img
src={Logo}
alt="logo"
className="h-[80px] w-[70px] mt-6 "
/>
</a>
</div>
<div className="hidden lg:flex lg:min-w-0 lg:flex-1 lg:justify-center lg:gap-x-12"></div>
<div className="hidden lg:flex lg:min-w-0 space-x-4 lg:justify-end">
{isSignedIn && isAdmin && (
<>
<button
onClick={() => setShowAdmin(true)}
className="inline-block rounded-lg px-3 py-1.5 text-sm font-semibold leading-6 text-gray-900 shadow-sm ring-1 ring-gray-900/10 hover:ring-gray-900/20 flex items-center space-x-2"
>
<p>Admin Console</p>
<CheckCircleIcon className="h-4 w-4 text-green-600" />
</button>
</>
)}
{wallet.accountId && (
<p className="inline-block px-3 py-1.5 text-sm font-semibold leading-6 text-gray-900">
{wallet.accountId}
</p>
)}
<ApplyToOGSBT className="text-gradient font-semibold self-center" />
<div className="flex">
<button
type="button"
onClick={() => signOut()}
className="inline-block bg-yellow-300 rounded-lg px-3 py-1.5 text-sm font-semibold leading-6 text-black shadow-sm"
className="-m-2.5 inline-flex items-center justify-center rounded-md p-2.5 text-gray-700"
onClick={() => setMobileMenuOpen(false)}
>
{isSignedIn ? 'Sign Out' : 'Connect Wallet'}
<span className="sr-only">Close menu</span>
<XMarkIcon className="h-6 w-6" aria-hidden="true" />
</button>
</div>
</nav>
<Dialog as="div" open={mobileMenuOpen} onClose={setMobileMenuOpen}>
<Dialog.Panel className="fixed inset-0 z-10 overflow-y-auto bg-white px-6 py-6 lg:hidden">
<div className="flex h-9 items-center justify-between">
<div className="flex">
<a href="#" className="-m-1.5 p-1.5 font-bold tracking-tight">
<img
src={Logo}
alt="logo"
className="h-[80px] w-[70px] mt-6 "
/>
</a>
</div>
<div className="flex">
<button
type="button"
className="-m-2.5 inline-flex items-center justify-center rounded-md p-2.5 text-gray-700"
onClick={() => setMobileMenuOpen(false)}
>
<span className="sr-only">Close menu</span>
<XMarkIcon className="h-6 w-6" aria-hidden="true" />
</div>
<div className="mt-6 flow-root">
<div className="-my-6 divide-y divide-gray-500/10">
<div className="space-y-2 py-6"></div>
<div className="flex flex-col gap-7 py-6 text-base font-semibold leading-6 text-gray-900">
<HomeMenu isDialog={true} />
{isSignedIn && isAdmin && (
<button onClick={() => setShowAdmin(true)}>
<p>Admin Console</p>
<CheckCircleIcon className="h-4 w-4 text-green-600" />
</button>
</div>
</div>
<div className="mt-6 flow-root">
<div className="-my-6 divide-y divide-gray-500/10">
<div className="space-y-2 py-6">
{/* {navigation.map((item) => (
<a
key={item.name}
href={item.href}
className="-mx-3 block rounded-lg py-2 px-3 text-base font-semibold leading-7 text-gray-900 hover:bg-gray-400/10"
>
{item.name}
</a>
))} */}
)}
{wallet.accountId && (
<div className="text-container truncate">
{wallet.accountId}
</div>
<div className="flex flex-col gap-7 py-6 text-base font-semibold leading-6 text-gray-900">
{isSignedIn && isAdmin && (
<button onClick={() => setShowAdmin(true)}>
<p>Admin Console</p>
<CheckCircleIcon className="h-4 w-4 text-green-600" />
</button>
)}
{wallet.accountId && (
<div className="text-container truncate">
{wallet.accountId}
</div>
)}
<ApplyToOGSBT />
<div
onClick={
isSignedIn
? () => wallet.signOut()
: () => wallet.signIn()
}
>
{isSignedIn ? 'Sign Out' : 'Connect Wallet'}
</div>
</div>
</div>
)}
</div>
</Dialog.Panel>
</Dialog>
</div>
</div>
</div>
</div>
</Dialog.Panel>
</Dialog>
</>
);
};
Binary file added src/images/HandLogo.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading

0 comments on commit d6a2cfe

Please sign in to comment.