From 8f8775e21ce22c7fef2ddab41ff546c22d630e33 Mon Sep 17 00:00:00 2001 From: Nikolay Edigaryev Date: Thu, 27 Apr 2023 11:18:50 +0400 Subject: [PATCH] Ability to navigate to the user's accounts from the main page --- src/AllRoutes.tsx | 6 ++++ src/components/common/AccountSwitch.tsx | 33 +++++++++---------- src/components/common/AppBreadcrumbs.tsx | 12 ------- src/scenes/Build/BuildById.tsx | 5 +-- src/scenes/Build/BuildBySHA.tsx | 5 +-- src/scenes/Owner/Owner.tsx | 5 +-- src/scenes/Owner/OwnerSettingsRenderer.tsx | 4 --- src/scenes/Repository/OwnerRepository.tsx | 5 +-- .../RepositoryMetrics/RepositoryMetrics.tsx | 4 --- .../RepositorySettings/RepositorySettings.tsx | 4 --- src/scenes/Task/Task.tsx | 5 +-- 11 files changed, 27 insertions(+), 61 deletions(-) diff --git a/src/AllRoutes.tsx b/src/AllRoutes.tsx index ef9420369..807fe37da 100644 --- a/src/AllRoutes.tsx +++ b/src/AllRoutes.tsx @@ -21,6 +21,7 @@ import GitHubIcon from '@mui/icons-material/GitHub'; import GCPStatus from './components/status/GCPStatus'; import GitHubStatus from './components/status/GitHubStatus'; import * as Sentry from '@sentry/react'; +import AccountsSwitch from './components/common/AccountSwitch'; const AsyncViewerProfile = React.lazy(() => import('./scenes/Profile/ViewerProfile')); @@ -228,6 +229,11 @@ function AllRoutes() { Cirrus CI + }> +
+ +
+
}> diff --git a/src/components/common/AccountSwitch.tsx b/src/components/common/AccountSwitch.tsx index 5ffb85379..5c174f87d 100644 --- a/src/components/common/AccountSwitch.tsx +++ b/src/components/common/AccountSwitch.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; import { useNavigate } from 'react-router-dom'; -import { useFragment } from 'react-relay'; +import { useLazyLoadQuery } from 'react-relay'; import { graphql } from 'babel-plugin-relay/macro'; import Menu from '@mui/material/Menu'; @@ -10,25 +10,11 @@ import ArrowDropDownIcon from '@mui/icons-material/ArrowDropDown'; import { navigateHelper } from '../../utils/navigateHelper'; -import { AccountSwitch_viewer$key } from './__generated__/AccountSwitch_viewer.graphql'; +import { AccountSwitchQuery } from './__generated__/AccountSwitchQuery.graphql'; -interface AccountSwitchProps { - viewer?: AccountSwitch_viewer$key; -} +interface AccountSwitchProps {} export default function AccountsSwitch(props: AccountSwitchProps) { - let viewer = useFragment( - graphql` - fragment AccountSwitch_viewer on User { - relatedOwners { - platform - name - } - } - `, - props.viewer, - ); - const navigate = useNavigate(); const [menuAnchorEl, setMenuAnchorEl] = React.useState(null); @@ -46,6 +32,19 @@ export default function AccountsSwitch(props: AccountSwitchProps) { navigateHelper(navigate, e, '/github/' + name); }; + const viewer = useLazyLoadQuery( + graphql` + query AccountSwitchQuery { + viewer { + relatedOwners { + platform + name + } + } + } + `, + {}, + ).viewer; if (!viewer) return null; if (viewer.relatedOwners && viewer.relatedOwners.length <= 1) return null; diff --git a/src/components/common/AppBreadcrumbs.tsx b/src/components/common/AppBreadcrumbs.tsx index a312b62fd..4d8f9361c 100644 --- a/src/components/common/AppBreadcrumbs.tsx +++ b/src/components/common/AppBreadcrumbs.tsx @@ -16,13 +16,11 @@ import BookmarkBorderIcon from '@mui/icons-material/BookmarkBorder'; import { absoluteLink } from '../../utils/link'; import RepositoryIcon from './RepositoryIcon'; -import AccountSwitch from './AccountSwitch'; import { AppBreadcrumbs_build$key } from './__generated__/AppBreadcrumbs_build.graphql'; import { AppBreadcrumbs_repository$key } from './__generated__/AppBreadcrumbs_repository.graphql'; import { AppBreadcrumbs_task$key } from './__generated__/AppBreadcrumbs_task.graphql'; import { AppBreadcrumbs_info$key } from './__generated__/AppBreadcrumbs_info.graphql'; -import { AppBreadcrumbs_viewer$key } from './__generated__/AppBreadcrumbs_viewer.graphql'; const useStyles = makeStyles(theme => { return { @@ -61,7 +59,6 @@ interface Props { href?: string; Icon: typeof SvgIcon | React.ElementType; }>; - viewer?: AppBreadcrumbs_viewer$key; } export default function AppBreadcrumbs(props: Props) { @@ -121,14 +118,6 @@ export default function AppBreadcrumbs(props: Props) { `, props.task, ); - let viewer = useFragment( - graphql` - fragment AppBreadcrumbs_viewer on User { - ...AccountSwitch_viewer - } - `, - props.viewer, - ); let { branch, extraCrumbs } = props; let classes = useStyles(); @@ -177,7 +166,6 @@ export default function AppBreadcrumbs(props: Props) { return ( - } diff --git a/src/scenes/Build/BuildById.tsx b/src/scenes/Build/BuildById.tsx index a0c5a46ff..2f93a2c29 100644 --- a/src/scenes/Build/BuildById.tsx +++ b/src/scenes/Build/BuildById.tsx @@ -19,9 +19,6 @@ export default function BuildById(): JSX.Element { ...BuildDetails_build ...AppBreadcrumbs_build } - viewer { - ...AppBreadcrumbs_viewer - } } `, { buildId }, @@ -32,7 +29,7 @@ export default function BuildById(): JSX.Element { } return ( <> - + ); diff --git a/src/scenes/Build/BuildBySHA.tsx b/src/scenes/Build/BuildBySHA.tsx index 2b3d0f580..1e9b1fcae 100644 --- a/src/scenes/Build/BuildBySHA.tsx +++ b/src/scenes/Build/BuildBySHA.tsx @@ -21,9 +21,6 @@ export default function BuildBySHA() { ...BuildDetails_build ...AppBreadcrumbs_build } - viewer { - ...AppBreadcrumbs_viewer - } } `, { owner, name, SHA }, @@ -40,7 +37,7 @@ export default function BuildBySHA() { } return ( <> - + ); diff --git a/src/scenes/Owner/Owner.tsx b/src/scenes/Owner/Owner.tsx index b25f9a9dd..249ea4360 100644 --- a/src/scenes/Owner/Owner.tsx +++ b/src/scenes/Owner/Owner.tsx @@ -19,9 +19,6 @@ export default function Owner(): JSX.Element { ...OwnerRepositoryList_info ...AppBreadcrumbs_info } - viewer { - ...AppBreadcrumbs_viewer - } } `, { platform, owner }, @@ -32,7 +29,7 @@ export default function Owner(): JSX.Element { } return ( <> - + ); diff --git a/src/scenes/Owner/OwnerSettingsRenderer.tsx b/src/scenes/Owner/OwnerSettingsRenderer.tsx index ff604e1cb..1f5dc5764 100644 --- a/src/scenes/Owner/OwnerSettingsRenderer.tsx +++ b/src/scenes/Owner/OwnerSettingsRenderer.tsx @@ -19,9 +19,6 @@ export default function OwnerSettingsRenderer(): JSX.Element { ...OwnerSettings_info ...AppBreadcrumbs_info } - viewer { - ...AppBreadcrumbs_viewer - } } `, { platform, name }, @@ -31,7 +28,6 @@ export default function OwnerSettingsRenderer(): JSX.Element { <> - + ); diff --git a/src/scenes/RepositoryMetrics/RepositoryMetrics.tsx b/src/scenes/RepositoryMetrics/RepositoryMetrics.tsx index acdd9e84c..6ecb66c8b 100644 --- a/src/scenes/RepositoryMetrics/RepositoryMetrics.tsx +++ b/src/scenes/RepositoryMetrics/RepositoryMetrics.tsx @@ -20,9 +20,6 @@ export default function RepositoryMetrics(parentProps): JSX.Element { ...AppBreadcrumbs_repository ...RepositoryMetricsPage_repository } - viewer { - ...AppBreadcrumbs_viewer - } } `, { platform, owner, name }, @@ -35,7 +32,6 @@ export default function RepositoryMetrics(parentProps): JSX.Element { <> - + );