Skip to content

Commit

Permalink
Feat/add new user menu (#1266)
Browse files Browse the repository at this point in the history
* feat: added new user menu (#1256)

* feat: added new user menu

* replaced colors with chalk

* use chalk for colors

* feat: updated gatsby

* feat: install chalk and isomorphic fetch

* feat: added user menu

* feat: removed FF

* feat: remove unused code

* fix: projects page navigation bar width

---------

Co-authored-by: Andy Espagnolo <[email protected]>
  • Loading branch information
flobarreto and andyesp authored Sep 19, 2023
1 parent c4cb57c commit ce2cbaa
Show file tree
Hide file tree
Showing 9 changed files with 5,638 additions and 16,980 deletions.
22,556 changes: 5,614 additions & 16,942 deletions package-lock.json

Large diffs are not rendered by default.

4 changes: 3 additions & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -59,14 +59,15 @@
"@snapshot-labs/snapshot.js": "0.5.5",
"@tanstack/react-query": "^4.29.7",
"autoprefixer": "^10.4.4",
"chalk": "^4.1.2",
"chart.js": "^3.8.2",
"classnames": "^2.3.2",
"clipboard-copy": "^4.0.1",
"core-js": "^3.21.1",
"cssnano": "^6.0.1",
"dayjs-precise-range": "^1.0.1",
"dcl-catalyst-client": "^21.5.0",
"decentraland-gatsby": "^5.75.1",
"decentraland-gatsby": "^5.86.3",
"decentraland-ui": "^4.1.0",
"discord.js": "^14.7.1",
"dompurify": "^2.3.3",
Expand All @@ -84,6 +85,7 @@
"gatsby-plugin-typescript": "^4.10.0",
"gatsby-source-filesystem": "^4.10.0",
"gatsby-transformer-sharp": "^4.10.0",
"isomorphic-fetch": "^3.0.0",
"keccak": "^3.0.1",
"lodash": "^4.17.21",
"nft.storage": "^7.1.1",
Expand Down
11 changes: 5 additions & 6 deletions src/components/Layout/Layout.css
Original file line number Diff line number Diff line change
Expand Up @@ -10,19 +10,18 @@
}
}

.WiderNavbar.dcl.navbar .ui.container {
width: unset !important;
max-width: 1391px !important;
}

.ui.container.WiderFooter {
width: unset !important;
max-width: 1440px !important;
}

@media (min-width: 768px) {
.WiderNavbar.dcl.navbar .ui.container,
.ui.container.WiderFooter {
padding: 0 24px !important;
}
}

.dcl.navbar .ui.container,
.Navigation .dcl.tabs .ui.container {
width: calc(100% - 48px);
}
8 changes: 1 addition & 7 deletions src/components/Layout/Layout.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,6 @@ import { Navbar, NavbarProps } from 'decentraland-ui/dist/components/Navbar/Navb
import type { PageProps } from 'gatsby'

import { isProjectPath } from '../../utils/locations'
import SnapshotStatus from '../Debug/SnapshotStatus'
import WalletSelectorModal from '../Modal/WalletSelectorModal'
import WrongNetworkModal from '../Modal/WrongNetworkModal'

Expand Down Expand Up @@ -49,12 +48,7 @@ export default function Layout({ children, ...props }: LayoutProps) {

return (
<>
<Navbar
activePage="dao"
onClickMenuOption={handleClickMenuOption}
rightMenu={props.rightMenu}
className={isWiderLayout ? 'WiderNavbar' : undefined}
/>
<Navbar activePage="dao" onClickMenuOption={handleClickMenuOption} rightMenu={props.rightMenu} />
<main>{children}</main>
<WrongNetworkModal
currentNetwork={state.chainId}
Expand Down
6 changes: 3 additions & 3 deletions src/components/Layout/Navbar.tsx
Original file line number Diff line number Diff line change
@@ -1,14 +1,14 @@
import React from 'react'

import { useLocation } from '@reach/router'
import UserMenu, { UserMenuProps } from 'decentraland-gatsby/dist/components/User/UserMenu'
import UserInformation, { UserInformationProps } from 'decentraland-gatsby/dist/components/User/UserInformation'
import { Mobile, NotMobile } from 'decentraland-ui/dist/components/Media/Media'

import BurgerMenu from './BurgerMenu/BurgerMenu'

const BURGER_MENU_LOCATIONS = ['/', '/proposals/', '/transparency/', '/projects/', '/profile/']

function Navbar(props: UserMenuProps) {
function Navbar(props: UserInformationProps) {
const location = useLocation()
const showBurgerMenu = BURGER_MENU_LOCATIONS.some((burgerLocation) => burgerLocation === location.pathname)

Expand All @@ -20,7 +20,7 @@ function Navbar(props: UserMenuProps) {
</Mobile>
)}
<NotMobile>
<UserMenu {...props} />
<UserInformation {...props} />
</NotMobile>
</>
)
Expand Down
17 changes: 6 additions & 11 deletions src/components/Layout/Navigation.css
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,12 @@
vertical-align: middle;
}

.dcl.navbar-account .ui.button.inverted {
color: black;
border: 1px solid black;
border-radius: 6px;
}

@media (min-width: 768px) {
.Navigation .dcl.tabs {
display: flex;
Expand Down Expand Up @@ -41,14 +47,3 @@
margin-bottom: 0;
padding-left: 0;
}

.WiderNavigation .dcl.tabs .ui.container {
width: 100%;
max-width: 1440px !important;
}

@media (min-width: 768px) {
.WiderNavigation .dcl.tabs .ui.container {
padding: 0 24px;
}
}
8 changes: 2 additions & 6 deletions src/components/Layout/Navigation.tsx
Original file line number Diff line number Diff line change
@@ -1,7 +1,5 @@
import React, { useEffect, useState } from 'react'

import { useLocation } from '@reach/router'
import classNames from 'classnames'
import useAuthContext from 'decentraland-gatsby/dist/context/Auth/useAuthContext'
import { Button } from 'decentraland-ui/dist/components/Button/Button'
import { useMobileMediaQuery } from 'decentraland-ui/dist/components/Media/Media'
Expand All @@ -11,7 +9,7 @@ import { Tabs } from 'decentraland-ui/dist/components/Tabs/Tabs'
import useFormatMessage from '../../hooks/useFormatMessage'
import useIsDebugAddress from '../../hooks/useIsDebugAddress'
import useIsProfileValidated from '../../hooks/useIsProfileValidated'
import locations, { isProjectPath } from '../../utils/locations'
import locations from '../../utils/locations'
import Link from '../Common/Typography/Link'
import Dot from '../Icon/Dot'
import SearchInput from '../Search/SearchInput'
Expand Down Expand Up @@ -42,8 +40,6 @@ type DismissState = {
const Navigation = ({ activeTab }: NavigationProps) => {
const t = useFormatMessage()
const [user] = useAuthContext()
const location = useLocation()

const { isDebugAddress } = useIsDebugAddress(user)
const { isProfileValidated, validationChecked } = useIsProfileValidated(user)
const [dismissState, setDismissState] = useState<DismissState>({
Expand All @@ -68,7 +64,7 @@ const Navigation = ({ activeTab }: NavigationProps) => {
const showDot = validationChecked && !isProfileValidated

return (
<div className={classNames('Navigation', isProjectPath(location.pathname) && 'WiderNavigation')}>
<div className="Navigation">
<Tabs>
<Tabs.Left>
<Link href={locations.home()}>
Expand Down
4 changes: 2 additions & 2 deletions src/entities/Committee/isDAOCommittee.ts
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { yellow } from 'colors/safe'
import chalk from 'chalk'
import env from 'decentraland-gatsby/dist/utils/env'
import isEthereumAddress from 'validator/lib/isEthereumAddress'

Expand All @@ -9,7 +9,7 @@ export const COMMITTEE_ADDRESSES = (env('COMMITTEE_ADDRESSES', '') || '')

const committeeAddresses = new Set(COMMITTEE_ADDRESSES)

committeeAddresses.forEach((address) => console.log('committee address:', yellow(address)))
committeeAddresses.forEach((address) => console.log('committee address:', chalk.yellow(address)))

export default function isDAOCommittee(user?: string | null | undefined) {
if (!user) {
Expand Down
4 changes: 2 additions & 2 deletions src/entities/Debug/isDebugAddress.ts
Original file line number Diff line number Diff line change
@@ -1,10 +1,10 @@
import { magenta } from 'colors/safe'
import chalk from 'chalk'

import { DEBUG_ADDRESSES } from '../../constants'

const debugAddresses = new Set(DEBUG_ADDRESSES)

debugAddresses.forEach((address) => console.log('debug address:', magenta(address)))
debugAddresses.forEach((address) => console.log('debug address:', chalk.magenta(address)))

export default function isDebugAddress(address: string | undefined) {
return address && address.length > 0 && debugAddresses.has(address.toLowerCase())
Expand Down

0 comments on commit ce2cbaa

Please sign in to comment.