diff --git a/packages/frontend/src/components/projects/project/OverviewTabPanel.tsx b/packages/frontend/src/components/projects/project/OverviewTabPanel.tsx index 497b6afc..2331a6fa 100644 --- a/packages/frontend/src/components/projects/project/OverviewTabPanel.tsx +++ b/packages/frontend/src/components/projects/project/OverviewTabPanel.tsx @@ -1,28 +1,20 @@ -import React, { useMemo } from 'react'; +import React from 'react'; import { Project } from 'gql-client'; import { Typography, Button, Chip } from '@material-tailwind/react'; import ActivityCard from './ActivityCard'; import activityDetails from '../../../assets/activities.json'; -import { ProjectDetails } from '../../../types/project'; import { relativeTimeMs } from '../../../utils/time'; interface OverviewProps { project: Project; - organizationProject: ProjectDetails; } -const OverviewTabPanel = ({ project, organizationProject }: OverviewProps) => { - // TODO: Fetch current deployment - const currentDeploymentTitle = useMemo(() => { - const deployment = organizationProject?.deployments.find((deployment) => { - return deployment.isCurrent === true; - }); - - return deployment?.title; - }, [organizationProject]); +// TODO: Check any live domain is set for production branch +const IS_DOMAIN_SETUP = true; +const OverviewTabPanel = ({ project }: OverviewProps) => { return (
@@ -39,17 +31,24 @@ const OverviewTabPanel = ({ project, organizationProject }: OverviewProps) => {
^ Domain - {!organizationProject.domain && ( + {!IS_DOMAIN_SETUP && ( )}
- {organizationProject.domain ? ( -

{organizationProject.domain}

+ {IS_DOMAIN_SETUP ? ( + ) : (

^ Source

-

{organizationProject.source}

+

{project.deployments[0]?.branch}

^ Deployment

-

{currentDeploymentTitle}

+

+ {project.deployments[0]?.domain?.name} +

^ Created

diff --git a/packages/frontend/src/components/projects/project/ProjectTabs.tsx b/packages/frontend/src/components/projects/project/ProjectTabs.tsx index 54327fd7..5bb384b6 100644 --- a/packages/frontend/src/components/projects/project/ProjectTabs.tsx +++ b/packages/frontend/src/components/projects/project/ProjectTabs.tsx @@ -4,12 +4,10 @@ import { Project } from 'gql-client'; import OverviewTabPanel from './OverviewTabPanel'; import DeploymentsTabPanel from './DeploymentsTabPanel'; -import { ProjectDetails } from '../../../types/project'; import SettingsTabPanel from './SettingsTabPanel'; interface ProjectTabsProps { project: Project; - organizationProject: ProjectDetails; onUpdate: () => Promise; } @@ -31,11 +29,7 @@ const Integrations = () => (
); -const ProjectTabs = ({ - project, - onUpdate, - organizationProject, -}: ProjectTabsProps) => { +const ProjectTabs = ({ project, onUpdate }: ProjectTabsProps) => { return ( Settings - + diff --git a/packages/frontend/src/components/projects/project/settings/MembersTabPanel.tsx b/packages/frontend/src/components/projects/project/settings/MembersTabPanel.tsx index 0ffecfad..c2811451 100644 --- a/packages/frontend/src/components/projects/project/settings/MembersTabPanel.tsx +++ b/packages/frontend/src/components/projects/project/settings/MembersTabPanel.tsx @@ -1,33 +1,21 @@ -import React, { useCallback, useEffect, useMemo, useState } from 'react'; -import { useOutletContext, useParams } from 'react-router-dom'; +import React, { useCallback, useEffect, useState } from 'react'; import toast, { Toaster } from 'react-hot-toast'; import { Project } from 'gql-client'; import { Chip, Button, Typography } from '@material-tailwind/react'; import MemberCard from './MemberCard'; - -import { - ProjectMember, - ProjectSearchOutletContext, -} from '../../../../types/project'; +import { ProjectMember } from '../../../../types/project'; import AddMemberDialog from './AddMemberDialog'; import { useGQLClient } from '../../../../context/GQLClientContext'; const FIRST_MEMBER_CARD = 0; const MembersTabPanel = ({ project }: { project: Project }) => { - const { id } = useParams(); const client = useGQLClient(); const [addmemberDialogOpen, setAddMemberDialogOpen] = useState(false); - const { projects } = useOutletContext(); - - const currentProject = useMemo(() => { - return projects.find((project) => project.id === id); - }, [id]); - const [projectMembers, setProjectMembers] = useState([]); const addMemberHandler = useCallback((projectMember: ProjectMember) => { @@ -36,14 +24,10 @@ const MembersTabPanel = ({ project }: { project: Project }) => { }, []); const fetchProjectMembers = useCallback(async () => { - if (currentProject) { - const { projectMembers } = await client.getProjectMembers( - currentProject.id, - ); + const { projectMembers } = await client.getProjectMembers(project.id); - setProjectMembers(projectMembers); - } - }, [currentProject]); + setProjectMembers(projectMembers); + }, [project.id]); const removeMemberHandler = async (projectMemberId: string) => { const { removeMember: isMemberRemoved } = @@ -59,7 +43,7 @@ const MembersTabPanel = ({ project }: { project: Project }) => { useEffect(() => { fetchProjectMembers(); - }, []); + }, [project.id]); return (
@@ -98,7 +82,7 @@ const MembersTabPanel = ({ project }: { project: Project }) => { member={projectMember.member} key={projectMember.id} isFirstCard={index === FIRST_MEMBER_CARD} - isOwner={projectMember.member.id === currentProject?.owner.id} + isOwner={projectMember.member.id === project.owner.id} isPending={projectMember.member.name === ''} permissions={projectMember.permissions} handleDeletePendingMember={(id: string) => { diff --git a/packages/frontend/src/pages/projects/Project.tsx b/packages/frontend/src/pages/projects/Project.tsx index 92cd4986..118b4085 100644 --- a/packages/frontend/src/pages/projects/Project.tsx +++ b/packages/frontend/src/pages/projects/Project.tsx @@ -1,5 +1,5 @@ -import React, { useCallback, useEffect, useMemo, useState } from 'react'; -import { useNavigate, useOutletContext, useParams } from 'react-router-dom'; +import React, { useCallback, useEffect, useState } from 'react'; +import { useNavigate, useParams } from 'react-router-dom'; import { Project as ProjectType } from 'gql-client'; import { Button, Typography } from '@material-tailwind/react'; @@ -7,7 +7,6 @@ import { Button, Typography } from '@material-tailwind/react'; import HorizontalLine from '../../components/HorizontalLine'; import ProjectTabs from '../../components/projects/project/ProjectTabs'; import { useGQLClient } from '../../context/GQLClientContext'; -import { ProjectSearchOutletContext } from '../../types/project'; const Project = () => { const { id } = useParams(); @@ -31,19 +30,9 @@ const Project = () => { await fetchProject(id); }; - // TODO: Remove organization projects - const { projects: organizationProjects } = - useOutletContext(); - - const organizationProject = useMemo(() => { - return organizationProjects.find((project) => { - return project.id === id; - }); - }, [id, organizationProjects]); - return (
- {project && organizationProject ? ( + {project ? ( <>
- +
) : ( diff --git a/packages/frontend/src/pages/projects/index.tsx b/packages/frontend/src/pages/projects/index.tsx deleted file mode 100644 index 31dc1c78..00000000 --- a/packages/frontend/src/pages/projects/index.tsx +++ /dev/null @@ -1,43 +0,0 @@ -import React from 'react'; -import { Link, useOutletContext } from 'react-router-dom'; - -import { Button, Typography, Chip } from '@material-tailwind/react'; - -import ProjectCard from '../../components/projects/ProjectCard'; -import { ProjectSearchOutletContext } from '../../types/project'; - -const Projects = () => { - const { projects } = useOutletContext(); - - return ( -
-
-
-
- Projects - -
-
-
- - - -
-
-
- {projects.length !== 0 && - projects.map((project: any, key: number) => { - return ; - })} -
-
- ); -}; - -export default Projects; diff --git a/packages/frontend/src/types/project.ts b/packages/frontend/src/types/project.ts index 5407d18f..25ac7f76 100644 --- a/packages/frontend/src/types/project.ts +++ b/packages/frontend/src/types/project.ts @@ -1,10 +1,6 @@ import { Project, Deployment } from 'gql-client'; export interface ProjectDetails extends Project { - // TODO: isDomain flag - domain?: string | null; - // TODO: Use deployment branch - source?: string; latestCommit: Commit; // TODO: Move out of project