Skip to content
This repository has been archived by the owner on Nov 10, 2023. It is now read-only.

feat: Add Safe route for dashboard #3759

Merged
merged 5 commits into from
Apr 5, 2022
Merged
Show file tree
Hide file tree
Changes from 4 commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion src/components/SafeListSidebar/SafeList/SafeListItem.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -97,7 +97,7 @@ const SafeListItem = ({
const handleOpenSafe = (): void => {
onSafeClick()
onNetworkSwitch?.()
history.push(generateSafeRoute(SAFE_ROUTES.ASSETS_BALANCES, routesSlug))
history.push(generateSafeRoute(SAFE_ROUTES.DASHBOARD, routesSlug))
}

const handleLoadSafe = (): void => {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -274,7 +274,7 @@ function SafeCreationProcess(): ReactElement {

const { safeName, safeCreationTxHash, safeAddress } = modalData
history.push({
pathname: generateSafeRoute(SAFE_ROUTES.ASSETS_BALANCES, {
pathname: generateSafeRoute(SAFE_ROUTES.DASHBOARD, {
shortName: getShortName(),
safeAddress,
}),
Expand Down
2 changes: 1 addition & 1 deletion src/routes/LoadSafePage/LoadSafePage.test.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -614,7 +614,7 @@ describe('<LoadSafePage>', () => {

await waitFor(() => {
expect(historyPushSpy).toHaveBeenCalledWith(
generateSafeRoute(SAFE_ROUTES.ASSETS_BALANCES, {
generateSafeRoute(SAFE_ROUTES.DASHBOARD, {
shortName: getShortName(),
safeAddress: validSafeAddress,
}),
Expand Down
2 changes: 1 addition & 1 deletion src/routes/LoadSafePage/LoadSafePage.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -120,7 +120,7 @@ function Load(): ReactElement {

// Go to the newly added Safe
history.push(
generateSafeRoute(SAFE_ROUTES.ASSETS_BALANCES, {
generateSafeRoute(SAFE_ROUTES.DASHBOARD, {
shortName: getShortName(),
safeAddress: checksummedAddress,
}),
Expand Down
16 changes: 11 additions & 5 deletions src/routes/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -14,13 +14,14 @@ import {
LOAD_SAFE_ROUTE,
getNetworkRootRoutes,
extractSafeAddress,
HOME_ROUTE,
SAFE_ROUTES,
generateSafeRoute,
} from './routes'
import { setChainId } from 'src/logic/config/utils'
import { setChainIdFromUrl } from 'src/utils/history'
import { usePageTracking } from 'src/utils/googleTagManager'
import { getShortName } from 'src/config'

const Home = React.lazy(() => import('./Home'))
const Welcome = React.lazy(() => import('./welcome/Welcome'))
const CreateSafePage = React.lazy(() => import('./CreateSafePage/CreateSafePage'))
const LoadSafePage = React.lazy(() => import('./LoadSafePage/LoadSafePage'))
Expand Down Expand Up @@ -81,15 +82,20 @@ const Routes = (): React.ReactElement => {
}

if (defaultSafe) {
return <Redirect to={HOME_ROUTE} />
return (
<Redirect
to={generateSafeRoute(SAFE_ROUTES.DASHBOARD, {
shortName: getShortName(),
safeAddress: defaultSafe,
})}
/>
)
}

return <Redirect to={WELCOME_ROUTE} />
}}
/>

<Route component={Home} exact path={HOME_ROUTE} />

<Route component={Welcome} exact path={WELCOME_ROUTE} />

<Route component={CreateSafePage} exact path={OPEN_SAFE_ROUTE} />
Expand Down
2 changes: 1 addition & 1 deletion src/routes/routes.ts
Original file line number Diff line number Diff line change
Expand Up @@ -41,13 +41,13 @@ export const LOAD_SPECIFIC_SAFE_ROUTE = `/load/:${SAFE_ADDRESS_SLUG}?` // ? = op

// Routes independant of safe/network
export const ROOT_ROUTE = '/'
export const HOME_ROUTE = '/home'
export const WELCOME_ROUTE = '/welcome'
export const OPEN_SAFE_ROUTE = '/open'
export const LOAD_SAFE_ROUTE = generatePath(LOAD_SPECIFIC_SAFE_ROUTE) // By providing no slug, we get '/load'

// [SAFE_SECTION_SLUG], [SAFE_SUBSECTION_SLUG] populated safe routes
export const SAFE_ROUTES = {
DASHBOARD: `${ADDRESSED_ROUTE}/home`,
ASSETS_BALANCES: `${ADDRESSED_ROUTE}/balances`, // [SAFE_SECTION_SLUG] === 'balances'
ASSETS_BALANCES_COLLECTIBLES: `${ADDRESSED_ROUTE}/balances/collectibles`, // [SAFE_SUBSECTION_SLUG] === 'collectibles'
TRANSACTIONS: `${ADDRESSED_ROUTE}/transactions`,
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -43,7 +43,7 @@ function getDestinationRoute(nextAvailableSafe: SafeRecordProps | undefined) {
shortName,
safeAddress: nextAvailableSafe.address,
}
return generateSafeRoute(SAFE_ROUTES.ASSETS_BALANCES, routesSlug)
return generateSafeRoute(SAFE_ROUTES.DASHBOARD, routesSlug)
}

const RemoveSafeModal = ({ isOpen, onClose }: RemoveSafeModalProps): React.ReactElement => {
Expand Down
4 changes: 3 additions & 1 deletion src/routes/safe/container/index.tsx
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import { GenericModal, Loader } from '@gnosis.pm/safe-react-components'
import { useState, lazy, useEffect } from 'react'
import React, { useState, lazy, useEffect } from 'react'
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

You don't need to import React.

import { useSelector } from 'react-redux'
import { Redirect, Route, Switch } from 'react-router-dom'

Expand All @@ -21,6 +21,7 @@ export const ADDRESS_BOOK_TAB_BTN_TEST_ID = 'address-book-tab-btn'
export const SAFE_VIEW_NAME_HEADING_TEST_ID = 'safe-name-heading'
export const TRANSACTIONS_TAB_NEW_BTN_TEST_ID = 'transactions-tab-new-btn'

const Home = React.lazy(() => import('src/routes/Home'))
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Picky, but please remove React.. You've imported it purely for this lazy load.

const Apps = lazy(() => import('src/routes/safe/components/Apps'))
const Settings = lazy(() => import('src/routes/safe/components/Settings'))
const Balances = lazy(() => import('src/routes/safe/components/Balances'))
Expand Down Expand Up @@ -87,6 +88,7 @@ const Container = (): React.ReactElement => {
return (
<>
<Switch>
<Route exact path={SAFE_ROUTES.DASHBOARD} render={() => wrapInSuspense(<Home />, null)} />
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

wrapInSuspense has a default fallback of null already.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Good catch! Will remove it from the others as well.

<Route
exact
path={[SAFE_ROUTES.ASSETS_BALANCES, SAFE_ROUTES.ASSETS_BALANCES_COLLECTIBLES]}
Expand Down