diff --git a/packages/insomnia/src/routes/organization.$organizationId.project.$projectId._index.tsx b/packages/insomnia/src/routes/organization.$organizationId.project.$projectId._index.tsx index 78c887dd8c..f918fce497 100644 --- a/packages/insomnia/src/routes/organization.$organizationId.project.$projectId._index.tsx +++ b/packages/insomnia/src/routes/organization.$organizationId.project.$projectId._index.tsx @@ -1,5 +1,5 @@ import type { IconName, IconProp } from '@fortawesome/fontawesome-svg-core'; -import type { GitRepository, Project, WorkspaceScope } from 'insomnia-data'; +import type { WorkspaceScope } from 'insomnia-data'; import { models } from 'insomnia-data'; import { Fragment, useCallback, useEffect, useMemo, useState } from 'react'; import { @@ -29,7 +29,7 @@ import { } from '~/common/constants'; import { scopeToBgColorMap, scopeToIconMap, scopeToTextColorMap } from '~/common/get-workspace-label'; import { fuzzyMatchAll } from '~/common/misc'; -import type { InsomniaFile } from '~/common/project'; +import { getAllLocalFiles, getAllRemoteFiles, type InsomniaFile } from '~/common/project'; import { sortMethodMap } from '~/common/sorting'; import { useRootLoaderData } from '~/root'; import { useOrganizationLoaderData } from '~/routes/organization'; @@ -59,26 +59,27 @@ import { useLoaderDeferData } from '~/ui/hooks/use-loader-defer-data'; import { useOrganizationPermissions } from '~/ui/hooks/use-organization-features'; import { DEFAULT_STORAGE_RULES } from '~/ui/organization-utils'; import { isPrimaryClickModifier } from '~/ui/utils'; +import { invariant } from '~/utils/invariant'; -export interface ProjectLoaderData { - localFiles: InsomniaFile[]; - allFilesCount: number; - documentsCount: number; - environmentsCount: number; - collectionsCount: number; - mockServersCount: number; - mcpClientsCount: number; - projectsCount: number; - activeProject?: Project; - activeProjectGitRepository?: GitRepository; - projects: (Project & { gitRepository?: GitRepository })[]; - remoteFilesPromise?: Promise; - projectsSyncStatusPromise?: Promise>; +import type { Route } from './+types/organization.$organizationId.project.$projectId._index'; + +export async function clientLoader({ params }: Route.ClientLoaderArgs) { + const { organizationId, projectId } = params; + invariant(projectId, 'Project ID is required'); + invariant(organizationId, 'Organization ID is required'); + + const remoteFilesPromise = getAllRemoteFiles({ projectId, organizationId }); + const localFiles = await getAllLocalFiles({ projectId }); + + return { + localFiles, + remoteFilesPromise, + }; } -const Component = () => { - const { localFiles, activeProject, activeProjectGitRepository, projects, remoteFilesPromise } = - useProjectLoaderData()!; +const Component = ({ loaderData }: Route.ComponentProps) => { + const { localFiles, remoteFilesPromise } = loaderData; + const { activeProject, activeProjectGitRepository, projects } = useProjectLoaderData()!; const { activeSidebarTab } = useProjectRouteContext(); const { organizationId, projectId } = useParams() as { organizationId: string; diff --git a/packages/insomnia/src/routes/organization.$organizationId.project.$projectId.tsx b/packages/insomnia/src/routes/organization.$organizationId.project.$projectId.tsx index ce4e9e1dc2..2c8a84f5b3 100644 --- a/packages/insomnia/src/routes/organization.$organizationId.project.$projectId.tsx +++ b/packages/insomnia/src/routes/organization.$organizationId.project.$projectId.tsx @@ -9,12 +9,7 @@ import * as reactUse from 'react-use'; import { logout } from '~/account/session'; import { Icon } from '~/basic-components/icon'; import { DEFAULT_SIDEBAR_SIZE } from '~/common/constants'; -import { - checkAllProjectSyncStatus, - getAllLocalFiles, - getAllRemoteFiles, - getProjectsWithGitRepositories, -} from '~/common/project'; +import { checkAllProjectSyncStatus, getProjectsWithGitRepositories } from '~/common/project'; import { useStorageRulesLoaderFetcher } from '~/routes/organization.$organizationId.storage-rules'; import { ProjectModal } from '~/ui/components/modals/project-modal'; import { ScratchPadTutorialPanel } from '~/ui/components/panes/scratchpad-tutorial-pane'; @@ -123,13 +118,10 @@ export async function clientLoader({ params }: Route.ClientLoaderArgs) { url: '', }; - const [localFiles, organizationProjects = []] = await Promise.all([ - getAllLocalFiles({ projectId }), - getProjectsWithGitRepositories({ organizationId }), - ]); + const organizationProjects = await getProjectsWithGitRepositories({ organizationId }); + const projects = models.project.sortProjects(organizationProjects); - const remoteFilesPromise = getAllRemoteFiles({ projectId, organizationId }); const learningFeaturePromise = getInsomniaLearningFeature(fallbackLearningFeature); const projectsSyncStatusPromise = checkAllProjectSyncStatus(projects); @@ -140,18 +132,9 @@ export async function clientLoader({ params }: Route.ClientLoaderArgs) { : undefined; return { - localFiles, - remoteFilesPromise, projects, - projectsCount: organizationProjects.length, activeProject: project, activeProjectGitRepository, - allFilesCount: localFiles.length, - environmentsCount: localFiles.filter(file => file.scope === 'environment').length, - documentsCount: localFiles.filter(file => file.scope === 'design').length, - collectionsCount: localFiles.filter(file => file.scope === 'collection').length, - mockServersCount: localFiles.filter(file => file.scope === 'mock-server').length, - mcpClientsCount: localFiles.filter(file => file.scope === 'mcp').length, projectsSyncStatusPromise, learningFeaturePromise, };