feat: add notifications to marketplace

.github/workflows/audit.yml

@@ -10,7 +10,11 @@ jobs:
         working-directory: ./webapp
     steps:
       - uses: actions/checkout@master
+      - name: Use Node.js 16.x
+        uses: actions/setup-node@v1
+        with:
+          node-version: 16.x
       - name: Install
-        run: npm ci
+        run: npm ci --legacy-peer-deps
       - name: Audit signatures
         run: npm audit signatures

webapp/package.json

@@ -20,9 +20,9 @@
     "dcl-catalyst-commons": "^9.0.1",
     "decentraland-connect": "^5.1.0",
     "decentraland-crypto-fetch": "^1.0.3",
-    "decentraland-dapps": "^16.18.0",
+    "decentraland-dapps": "^16.19.3",
     "decentraland-transactions": "^1.50.0",
-    "decentraland-ui": "^4.29.0",
+    "decentraland-ui": "^4.30.4",
     "dotenv": "^10.0.0",
     "ethers": "^5.6.8",
     "graphql": "^14.7.0",

webapp/src/components/Navbar/Navbar.container.ts

@@ -8,14 +8,16 @@ import { isConnected } from '../../modules/wallet/selectors'
 import { getIsNewNavbarDropdownEnabled } from '../../modules/features/selectors'
 import { MapStateProps, MapDispatch, MapDispatchProps } from './Navbar.types'
 import Navbar from './Navbar'
+import { getCurrentIdentity } from '../../modules/identity/selectors'
 
 const mapState = (state: RootState): MapStateProps => ({
   isConnected: isConnected(state),
   location: getLocation(state),
   hasPendingTransactions: getTransactions(state).some(tx =>
     isPending(tx.status)
   ),
-  isNewNavbarDropdownEnabled: getIsNewNavbarDropdownEnabled(state)
+  isNewNavbarDropdownEnabled: getIsNewNavbarDropdownEnabled(state),
+  identity: getCurrentIdentity(state) || undefined
 })
 
 const mapDispatch = (dispatch: MapDispatch): MapDispatchProps => ({

webapp/src/components/Navbar/Navbar.tsx

@@ -25,7 +25,7 @@ const Navbar = (props: Props) => {
   if (isNewNavbarDropdownEnabled) {
     props = {
       ...props,
-      rightMenu: <UserInformation />
+      rightMenu: <UserInformation identity={props.identity} withNotifications />
     }
   }
 
@@ -45,6 +45,7 @@ const Navbar = (props: Props) => {
   return (
     <BaseNavbar
       {...props}
+      withNotifications
       activePage="marketplace"
       isFullscreen={props.isFullscreen}
       isSignIn={pathname === locations.signIn()}

webapp/src/components/Navbar/Navbar.types.ts

@@ -1,6 +1,7 @@
 import { Dispatch } from 'redux'
 import { CallHistoryMethodAction, RouterLocation } from 'connected-react-router'
 import { NavbarProps } from 'decentraland-ui'
+import { AuthIdentity } from '@dcl/crypto'
 
 export type Props = Partial<NavbarProps> & {
   location: RouterLocation<unknown>
@@ -9,6 +10,7 @@ export type Props = Partial<NavbarProps> & {
   enablePartialSupportAlert?: boolean
   onNavigate: (path: string) => void
   isNewNavbarDropdownEnabled: boolean
+  identity?: AuthIdentity
 }
 
 export type OwnProps = Pick<Props, 'enablePartialSupportAlert'>
@@ -19,6 +21,7 @@ export type MapStateProps = Pick<
   | 'hasPendingTransactions'
   | 'isConnected'
   | 'isNewNavbarDropdownEnabled'
+  | 'identity'
 >
 export type MapDispatchProps = Pick<Props, 'onNavigate'>
 export type MapDispatch = Dispatch<CallHistoryMethodAction>

webapp/src/components/UserInformation/UserInformation.types.ts

@@ -1,9 +1,9 @@
 import { Dispatch } from 'redux'
 import { CallHistoryMethodAction } from 'connected-react-router'
-import { UserInformationComponentProps } from 'decentraland-ui'
+import { UserInformationProps } from 'decentraland-dapps/dist/containers/UserInformation/UserInformation.types'
 import { OpenLoginAction } from '../../modules/login/actions'
 
-export type Props = Partial<UserInformationComponentProps> & {
+export type Props = Partial<UserInformationProps> & {
   onClickMyAssets: () => void
   onClickMyLists: () => void
 }

webapp/src/themes/index.ts

@@ -2,7 +2,7 @@
 import 'decentraland-ui/lib/styles.css'
 
 // Theme
-import 'decentraland-ui/lib/dark-theme.css'
+import 'decentraland-ui/dist/themes/alternative/dark-theme.css'
 
 // Overrides
 import './components/Button.css'