From 5d327d0ed0684ae3611a620d4e4e2d98342a4e2e Mon Sep 17 00:00:00 2001 From: Joshen Lim Date: Mon, 7 Aug 2023 11:06:50 +0800 Subject: [PATCH 1/4] Fix pull requests + preview branches section not using the parent project ref to pull data when on a preview branch --- .../interfaces/BranchManagement/BranchManagement.tsx | 10 +++++----- .../interfaces/BranchManagement/PreviewBranches.tsx | 11 ++++++++--- .../interfaces/BranchManagement/PullRequests.tsx | 11 ++++++++--- 3 files changed, 21 insertions(+), 11 deletions(-) diff --git a/studio/components/interfaces/BranchManagement/BranchManagement.tsx b/studio/components/interfaces/BranchManagement/BranchManagement.tsx index 5cd9623eb07..4590a688e83 100644 --- a/studio/components/interfaces/BranchManagement/BranchManagement.tsx +++ b/studio/components/interfaces/BranchManagement/BranchManagement.tsx @@ -36,16 +36,16 @@ const BranchManagement = () => { const { ui } = useStore() const router = useRouter() const { ref } = useParams() - const projectDetails = useSelectedProject() + const project = useSelectedProject() const selectedOrg = useSelectedOrganization() const hasAccessToBranching = selectedOrg?.opt_in_tags?.includes('PREVIEW_BRANCHES_OPT_IN') ?? false + const hasBranchEnabled = project?.is_branch_enabled - const isBranch = projectDetails?.parent_project_ref !== undefined - const hasBranchEnabled = projectDetails?.is_branch_enabled + const isBranch = project?.parent_project_ref !== undefined const projectRef = - projectDetails !== undefined ? (isBranch ? projectDetails.parent_project_ref : ref) : undefined + project !== undefined ? (isBranch ? project.parent_project_ref : ref) : undefined const snap = useAppUiStateSnapshot() const [showCreateBranch, setShowCreateBranch] = useState(false) @@ -64,7 +64,7 @@ const BranchManagement = () => { ?.filter((integration) => integration.integration.name === 'GitHub') .flatMap((integration) => integration.connections) const githubConnection = githubConnections?.find( - (connection) => connection.supabase_project_ref === ref + (connection) => connection.supabase_project_ref === projectRef ) const { data: branches } = useBranchesQuery({ projectRef }) diff --git a/studio/components/interfaces/BranchManagement/PreviewBranches.tsx b/studio/components/interfaces/BranchManagement/PreviewBranches.tsx index 6b11a67ae32..4580d704189 100644 --- a/studio/components/interfaces/BranchManagement/PreviewBranches.tsx +++ b/studio/components/interfaces/BranchManagement/PreviewBranches.tsx @@ -5,7 +5,7 @@ import { BranchContainer, BranchHeader, BranchPanel } from './BranchPanels' import { useParams } from 'common' import { useGithubPullRequestsQuery } from 'data/integrations/integrations-github-pull-requests-query' import { partition } from 'lodash' -import { useSelectedOrganization } from 'hooks' +import { useSelectedOrganization, useSelectedProject } from 'hooks' import { useOrgIntegrationsQuery } from 'data/integrations/integrations-query-org-only' import { GenericSkeletonLoader } from 'components/ui/ShimmeringLoader' import AlertError from 'components/ui/AlertError' @@ -22,8 +22,13 @@ const PreviewBranches = ({ onSelectDeleteBranch, }: PreviewBranchesProps) => { const { ref } = useParams() + const project = useSelectedProject() const selectedOrg = useSelectedOrganization() + const isBranch = project?.parent_project_ref !== undefined + const projectRef = + project !== undefined ? (isBranch ? project.parent_project_ref : ref) : undefined + const { data: integrations } = useOrgIntegrationsQuery({ orgSlug: selectedOrg?.slug, }) @@ -33,7 +38,7 @@ const PreviewBranches = ({ integration.organization.slug === selectedOrg?.slug ) const githubConnection = githubIntegration?.connections.find( - (connection) => connection.supabase_project_ref === ref + (connection) => connection.supabase_project_ref === projectRef ) const [repoOwner, repoName] = githubConnection?.metadata.name.split('/') || [] @@ -43,7 +48,7 @@ const PreviewBranches = ({ isLoading: isLoadingBranches, isError: isErrorBranches, isSuccess: isSuccessBranches, - } = useBranchesQuery({ projectRef: ref }) + } = useBranchesQuery({ projectRef }) const [[mainBranch], previewBranches] = partition(branches, (branch) => branch.is_default) const { data: allPullRequests } = useGithubPullRequestsQuery({ diff --git a/studio/components/interfaces/BranchManagement/PullRequests.tsx b/studio/components/interfaces/BranchManagement/PullRequests.tsx index 882840d6693..0a6f0154283 100644 --- a/studio/components/interfaces/BranchManagement/PullRequests.tsx +++ b/studio/components/interfaces/BranchManagement/PullRequests.tsx @@ -5,7 +5,7 @@ import { useParams } from 'common' import { Branch, useBranchesQuery } from 'data/branches/branches-query' import { useGithubPullRequestsQuery } from 'data/integrations/integrations-github-pull-requests-query' import { useOrgIntegrationsQuery } from 'data/integrations/integrations-query-org-only' -import { useSelectedOrganization } from 'hooks' +import { useSelectedOrganization, useSelectedProject } from 'hooks' import { BranchContainer, BranchHeader, PullRequestPanel } from './BranchPanels' import { GenericSkeletonLoader } from 'components/ui/ShimmeringLoader' import AlertError from 'components/ui/AlertError' @@ -22,9 +22,14 @@ const PullRequests = ({ onSelectDeleteBranch, }: PullRequestsProps) => { const { ref } = useParams() + const project = useSelectedProject() const selectedOrg = useSelectedOrganization() const pullRequestUrl = generateCreatePullRequestURL() + const isBranch = project?.parent_project_ref !== undefined + const projectRef = + project !== undefined ? (isBranch ? project.parent_project_ref : ref) : undefined + const { data: integrations, isLoading: isLoadingIntegrations } = useOrgIntegrationsQuery({ orgSlug: selectedOrg?.slug, }) @@ -35,11 +40,11 @@ const PullRequests = ({ ) const githubConnection = githubIntegration?.connections?.find( - (connection) => connection.supabase_project_ref === ref + (connection) => connection.supabase_project_ref === projectRef ) const [repoOwner, repoName] = githubConnection?.metadata.name.split('/') || [] - const { data: branches, isLoading: isLoadingBranches } = useBranchesQuery({ projectRef: ref }) + const { data: branches, isLoading: isLoadingBranches } = useBranchesQuery({ projectRef }) const mainBranch = branches?.find((branch) => branch.is_default) const { From ccab488a493b45d8f4abd5a34bee2b291cd5ae61 Mon Sep 17 00:00:00 2001 From: Joshen Lim Date: Mon, 7 Aug 2023 11:13:00 +0800 Subject: [PATCH 2/4] Small linting fix --- .../BranchManagement/BranchManagement.tsx | 4 ++-- .../BranchManagement/CreateBranchSidePanel.tsx | 4 ++-- .../BranchManagement/PreviewBranches.tsx | 16 ++++++++-------- .../interfaces/BranchManagement/PullRequests.tsx | 6 +++--- 4 files changed, 15 insertions(+), 15 deletions(-) diff --git a/studio/components/interfaces/BranchManagement/BranchManagement.tsx b/studio/components/interfaces/BranchManagement/BranchManagement.tsx index 4590a688e83..11036d5555d 100644 --- a/studio/components/interfaces/BranchManagement/BranchManagement.tsx +++ b/studio/components/interfaces/BranchManagement/BranchManagement.tsx @@ -1,4 +1,5 @@ -import { isError, partition } from 'lodash' +import { useParams } from 'common' +import { partition } from 'lodash' import Link from 'next/link' import { useRouter } from 'next/router' import { useState } from 'react' @@ -14,7 +15,6 @@ import { Modal, } from 'ui' -import { useParams } from 'common' import { ScaffoldContainer, ScaffoldSection } from 'components/layouts/Scaffold' import ProductEmptyState from 'components/to-be-cleaned/ProductEmptyState' import AlertError from 'components/ui/AlertError' diff --git a/studio/components/interfaces/BranchManagement/CreateBranchSidePanel.tsx b/studio/components/interfaces/BranchManagement/CreateBranchSidePanel.tsx index 7cc6ada19ac..fee868b8e05 100644 --- a/studio/components/interfaces/BranchManagement/CreateBranchSidePanel.tsx +++ b/studio/components/interfaces/BranchManagement/CreateBranchSidePanel.tsx @@ -1,3 +1,5 @@ +import { useParams } from 'common' +import Link from 'next/link' import { useEffect, useState } from 'react' import { AlertDescription_Shadcn_, @@ -11,7 +13,6 @@ import { SidePanel, } from 'ui' -import { useParams } from 'common' import AlertError from 'components/ui/AlertError' import NoSearchResults from 'components/ui/NoSearchResults' import { GenericSkeletonLoader } from 'components/ui/ShimmeringLoader' @@ -20,7 +21,6 @@ import { useBranchesQuery } from 'data/branches/branches-query' import { useGithubBranchesQuery } from 'data/integrations/integrations-github-branches-query' import { useOrgIntegrationsQuery } from 'data/integrations/integrations-query-org-only' import { useSelectedOrganization, useSelectedProject, useStore } from 'hooks' -import Link from 'next/link' interface CreateBranchSidePanelProps { visible: boolean diff --git a/studio/components/interfaces/BranchManagement/PreviewBranches.tsx b/studio/components/interfaces/BranchManagement/PreviewBranches.tsx index 4580d704189..3c8cb4465c7 100644 --- a/studio/components/interfaces/BranchManagement/PreviewBranches.tsx +++ b/studio/components/interfaces/BranchManagement/PreviewBranches.tsx @@ -1,14 +1,14 @@ +import { useParams } from 'common' +import { partition } from 'lodash' import { Button, IconExternalLink, IconGitBranch } from 'ui' -import { Branch, useBranchesQuery } from 'data/branches/branches-query' -import { BranchContainer, BranchHeader, BranchPanel } from './BranchPanels' -import { useParams } from 'common' -import { useGithubPullRequestsQuery } from 'data/integrations/integrations-github-pull-requests-query' -import { partition } from 'lodash' -import { useSelectedOrganization, useSelectedProject } from 'hooks' -import { useOrgIntegrationsQuery } from 'data/integrations/integrations-query-org-only' -import { GenericSkeletonLoader } from 'components/ui/ShimmeringLoader' import AlertError from 'components/ui/AlertError' +import { GenericSkeletonLoader } from 'components/ui/ShimmeringLoader' +import { Branch, useBranchesQuery } from 'data/branches/branches-query' +import { useGithubPullRequestsQuery } from 'data/integrations/integrations-github-pull-requests-query' +import { useOrgIntegrationsQuery } from 'data/integrations/integrations-query-org-only' +import { useSelectedOrganization, useSelectedProject } from 'hooks' +import { BranchContainer, BranchHeader, BranchPanel } from './BranchPanels' interface PreviewBranchesProps { generateCreatePullRequestURL: (branch?: string) => string diff --git a/studio/components/interfaces/BranchManagement/PullRequests.tsx b/studio/components/interfaces/BranchManagement/PullRequests.tsx index 0a6f0154283..1fafdde37d4 100644 --- a/studio/components/interfaces/BranchManagement/PullRequests.tsx +++ b/studio/components/interfaces/BranchManagement/PullRequests.tsx @@ -1,14 +1,14 @@ +import { useParams } from 'common' import Link from 'next/link' import { Button, IconExternalLink, IconGitBranch } from 'ui' -import { useParams } from 'common' +import AlertError from 'components/ui/AlertError' +import { GenericSkeletonLoader } from 'components/ui/ShimmeringLoader' import { Branch, useBranchesQuery } from 'data/branches/branches-query' import { useGithubPullRequestsQuery } from 'data/integrations/integrations-github-pull-requests-query' import { useOrgIntegrationsQuery } from 'data/integrations/integrations-query-org-only' import { useSelectedOrganization, useSelectedProject } from 'hooks' import { BranchContainer, BranchHeader, PullRequestPanel } from './BranchPanels' -import { GenericSkeletonLoader } from 'components/ui/ShimmeringLoader' -import AlertError from 'components/ui/AlertError' interface PullRequestsProps { previewBranches: Branch[] From ce90fdd7474c31db1d9203c5c025f2b8d8076156 Mon Sep 17 00:00:00 2001 From: Joshen Lim Date: Mon, 7 Aug 2023 11:17:58 +0800 Subject: [PATCH 3/4] Change buttons on branch management page to default --- .../interfaces/BranchManagement/BranchManagement.tsx | 4 +++- .../components/interfaces/BranchManagement/BranchPanels.tsx | 4 +++- 2 files changed, 6 insertions(+), 2 deletions(-) diff --git a/studio/components/interfaces/BranchManagement/BranchManagement.tsx b/studio/components/interfaces/BranchManagement/BranchManagement.tsx index 11036d5555d..44383ae66cc 100644 --- a/studio/components/interfaces/BranchManagement/BranchManagement.tsx +++ b/studio/components/interfaces/BranchManagement/BranchManagement.tsx @@ -162,7 +162,9 @@ const BranchManagement = () => {
} />
- +
{isLoadingIntegrations && } diff --git a/studio/components/interfaces/BranchManagement/BranchPanels.tsx b/studio/components/interfaces/BranchManagement/BranchPanels.tsx index 3e716f7164d..62e7eb41007 100644 --- a/studio/components/interfaces/BranchManagement/BranchPanels.tsx +++ b/studio/components/interfaces/BranchManagement/BranchPanels.tsx @@ -163,7 +163,9 @@ const BranchPanel = ({
- + setOpen(!open)} modal={false}> From 3bf2a53173c89a420d733e11690d902df4747f34 Mon Sep 17 00:00:00 2001 From: Joshen Lim Date: Mon, 7 Aug 2023 11:28:49 +0800 Subject: [PATCH 4/4] Update BranchDropdown --- .../layouts/AppLayout/BranchDropdown.tsx | 33 ++++++++----------- .../AppLayout/OrganizationDropdown.tsx | 1 + .../layouts/AppLayout/ProjectDropdown.tsx | 1 + 3 files changed, 16 insertions(+), 19 deletions(-) diff --git a/studio/components/layouts/AppLayout/BranchDropdown.tsx b/studio/components/layouts/AppLayout/BranchDropdown.tsx index 6eb09304f71..df881dc7801 100644 --- a/studio/components/layouts/AppLayout/BranchDropdown.tsx +++ b/studio/components/layouts/AppLayout/BranchDropdown.tsx @@ -91,29 +91,24 @@ const BranchDropdown = () => { {isSuccess && branches.length > 0 && (
- - - {selectedBranch?.name} - - - - - - {selectedBranch?.is_default ? ( - Production - ) : ( - Preview Branch - )} - - - {