github/plane
0
0
Fork 1
mirror of https://github.com/makeplane/plane synced 2024-06-14 14:31:34 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix: breadcrumb loading state for the issue details page (#3892)

Browse Source 
Co-authored-by: sriram veeraghanta <veeraghanta.sriram@gmail.com>
This commit is contained in:
Aaryan Khandelwal 2024-03-06 20:38:21 +05:30 committed by GitHub
parent b4adb82d40
commit cb5198c883
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 15 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
web/components/headers/project-archived-issue-details.tsx
View File

@ -13,7 +13,6 @@ import { ProjectLogo } from "components/project";
// ui // ui
// types // types
import { IssueArchiveService } from "services/issue"; import { IssueArchiveService } from "services/issue";
import { TIssue } from "@plane/types";
// constants // constants
// services // services
// helpers // helpers
@ -26,9 +25,9 @@ export const ProjectArchivedIssueDetailsHeader: FC = observer(() => {
const router = useRouter(); const router = useRouter();
const { workspaceSlug, projectId, archivedIssueId } = router.query; const { workspaceSlug, projectId, archivedIssueId } = router.query;
// store hooks // store hooks
const { currentProjectDetails, getProjectById } = useProject(); const { currentProjectDetails } = useProject();
const { data: issueDetails } = useSWR<TIssue | undefined>( const { data: issueDetails } = useSWR(
workspaceSlug && projectId && archivedIssueId ? ISSUE_DETAILS(archivedIssueId as string) : null, workspaceSlug && projectId && archivedIssueId ? ISSUE_DETAILS(archivedIssueId as string) : null,
workspaceSlug && projectId && archivedIssueId workspaceSlug && projectId && archivedIssueId
? () => ? () =>
@ -79,8 +78,9 @@ export const ProjectArchivedIssueDetailsHeader: FC = observer(() => {
link={ link={
<BreadcrumbLink <BreadcrumbLink
label={ label={
`${getProjectById(issueDetails?.project_id || "")?.identifier}-${issueDetails?.sequence_id}` ?? currentProjectDetails && issueDetails
"..." ? `${currentProjectDetails.identifier}-${issueDetails.sequence_id}`
: ""
} }
/> />
} }

28
web/components/headers/project-issue-details.tsx
View File

@ -1,41 +1,32 @@
import { FC } from "react"; import { FC } from "react";
import { observer } from "mobx-react-lite"; import { observer } from "mobx-react-lite";
import { useRouter } from "next/router"; import { useRouter } from "next/router";
import useSWR from "swr";
// hooks // hooks
import { PanelRight } from "lucide-react"; import { PanelRight } from "lucide-react";
import { Breadcrumbs, LayersIcon } from "@plane/ui"; import { Breadcrumbs, LayersIcon } from "@plane/ui";
import { BreadcrumbLink } from "components/common"; import { BreadcrumbLink } from "components/common";
import { SidebarHamburgerToggle } from "components/core/sidebar/sidebar-menu-hamburger-toggle"; import { SidebarHamburgerToggle } from "components/core/sidebar/sidebar-menu-hamburger-toggle";
import { ISSUE_DETAILS } from "constants/fetch-keys";
import { cn } from "helpers/common.helper"; import { cn } from "helpers/common.helper";
import { useApplication, useProject } from "hooks/store"; import { useApplication, useIssueDetail, useProject } from "hooks/store";
// ui // ui
// helpers // helpers
// services // services
import { IssueService } from "services/issue";
import { ProjectLogo } from "components/project"; import { ProjectLogo } from "components/project";
// constants // constants
// components // components
// services
const issueService = new IssueService();
export const ProjectIssueDetailsHeader: FC = observer(() => { export const ProjectIssueDetailsHeader: FC = observer(() => {
// router // router
const router = useRouter(); const router = useRouter();
const { workspaceSlug, projectId, issueId } = router.query; const { workspaceSlug, projectId, issueId } = router.query;
// store hooks // store hooks
const { currentProjectDetails, getProjectById } = useProject(); const { currentProjectDetails } = useProject();
const { theme: themeStore } = useApplication(); const { theme: themeStore } = useApplication();
const {
const { data: issueDetails } = useSWR( issue: { getIssueById },
workspaceSlug && projectId && issueId ? ISSUE_DETAILS(issueId as string) : null, } = useIssueDetail();
workspaceSlug && projectId && issueId // derived values
? () => issueService.retrieve(workspaceSlug as string, projectId as string, issueId as string) const issueDetails = issueId ? getIssueById(issueId.toString()) : undefined;
: null
);
const isSidebarCollapsed = themeStore.issueDetailSidebarCollapsed; const isSidebarCollapsed = themeStore.issueDetailSidebarCollapsed;
return ( return (
@ -77,8 +68,9 @@ export const ProjectIssueDetailsHeader: FC = observer(() => {
link={ link={
<BreadcrumbLink <BreadcrumbLink
label={ label={
`${getProjectById(issueDetails?.project_id || "")?.identifier}-${issueDetails?.sequence_id}` ?? currentProjectDetails && issueDetails
"..." ? `${currentProjectDetails.identifier}-${issueDetails.sequence_id}`
: ""
} }
/> />
} }

1
web/components/project/integration-card.tsx
View File

@ -13,7 +13,6 @@ import GithubLogo from "public/logos/github-square.png";
import SlackLogo from "public/services/slack.png"; import SlackLogo from "public/services/slack.png";
// types // types
import { IWorkspaceIntegration } from "@plane/types"; import { IWorkspaceIntegration } from "@plane/types";
// services
import { ProjectService } from "services/project"; import { ProjectService } from "services/project";
type Props = { type Props = {