Skip to content

Commit

Permalink
chore: moved constants out of pages to prevent next issues
Browse files Browse the repository at this point in the history
  • Loading branch information
@Goldziher
Goldziher committed Nov 26, 2023
1 parent 9fdedb2 commit 7225de3
Show file tree
Hide file tree
Showing 7 changed files with 80 additions and 60 deletions.
17 changes: 17 additions & 0 deletions .idea/dataSources.xml
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

31 changes: 13 additions & 18 deletions ...cale]/projects/[projectId]/applications/[applicationId]/configs/[promptConfigId]/page.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,7 @@ import { PromptConfigGeneralInfo } from '@/components/projects/[projectId]/appli
import { PromptConfigGeneralSettings } from '@/components/projects/[projectId]/applications/[applicationId]/configs/[configId]/prompt-config-general-settings';
import { PromptConfigTesting } from '@/components/projects/[projectId]/applications/[applicationId]/configs/[configId]/prompt-config-testing';
import { TabData, TabNavigation } from '@/components/tab-navigation';
import { PromptConfigPageTab } from '@/constants';
import { useAuthenticatedUser } from '@/hooks/use-authenticated-user';
import { useHandleError } from '@/hooks/use-handle-error';
import { useProjectBootstrap } from '@/hooks/use-project-bootstrap';
Expand All @@ -23,14 +24,6 @@ import {
useSetPromptConfigs,
} from '@/stores/api-store';

enum TAB_NAME {
OVERVIEW,
TESTING,
SETTINGS,
}

export { TAB_NAME as PromptConfigPageTab };

export default function PromptConfiguration({
params: { projectId, applicationId, promptConfigId },
}: {
Expand All @@ -51,7 +44,9 @@ export default function PromptConfiguration({
const project = useProject(projectId);
const projects = useProjects();

const [selectedTab, setSelectedTab] = useState(TAB_NAME.OVERVIEW);
const [selectedTab, setSelectedTab] = useState(
PromptConfigPageTab.OVERVIEW,
);

const { isLoading } = useSWR(
promptConfig ? null : { applicationId, projectId },
Expand Down Expand Up @@ -79,26 +74,26 @@ export default function PromptConfiguration({
return null;
}

const tabs: TabData<TAB_NAME>[] = [
const tabs: TabData<PromptConfigPageTab>[] = [
{
icon: <Speedometer2 className="w-3.5 h-3.5" />,
id: TAB_NAME.OVERVIEW,
id: PromptConfigPageTab.OVERVIEW,
text: t('overview'),
},
{
icon: <RocketTakeoff className="w-3.5 h-3.5" />,
id: TAB_NAME.TESTING,
id: PromptConfigPageTab.TESTING,
text: t('test'),
},
{
icon: <Gear className="w-3.5 h-3.5" />,
id: TAB_NAME.SETTINGS,
id: PromptConfigPageTab.SETTINGS,
text: t('settings'),
},
];

const tabComponents: Record<TAB_NAME, React.FC> = {
[TAB_NAME.OVERVIEW]: memo(() => (
const tabComponents: Record<PromptConfigPageTab, React.FC> = {
[PromptConfigPageTab.OVERVIEW]: memo(() => (
<>
<PromptConfigAnalyticsPage
projectId={projectId}
Expand All @@ -109,14 +104,14 @@ export default function PromptConfiguration({
<PromptConfigGeneralInfo promptConfig={promptConfig} />
</>
)),
[TAB_NAME.TESTING]: memo(() => (
[PromptConfigPageTab.TESTING]: memo(() => (
<PromptConfigTesting
projectId={projectId}
applicationId={applicationId}
promptConfig={promptConfig}
/>
)),
[TAB_NAME.SETTINGS]: memo(() => (
[PromptConfigPageTab.SETTINGS]: memo(() => (
<>
<PromptConfigGeneralSettings
projectId={projectId}
Expand All @@ -143,7 +138,7 @@ export default function PromptConfiguration({
showSelect={projects.length > 1}
/>
<div className="mt-3.5 w-full mb-8">
<TabNavigation<TAB_NAME>
<TabNavigation<PromptConfigPageTab>
tabs={tabs}
selectedTab={selectedTab}
onTabChange={setSelectedTab}
Expand Down
31 changes: 13 additions & 18 deletions frontend/src/app/[locale]/projects/[projectId]/applications/[applicationId]/page.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,18 +11,11 @@ import { ApplicationDeletion } from '@/components/projects/[projectId]/applicati
import { ApplicationGeneralSettings } from '@/components/projects/[projectId]/applications/[applicationId]/application-general-settings';
import { ApplicationPromptConfigs } from '@/components/projects/[projectId]/applications/[applicationId]/application-prompt-configs';
import { TabData, TabNavigation } from '@/components/tab-navigation';
import { ApplicationPageTabNames } from '@/constants';
import { useAuthenticatedUser } from '@/hooks/use-authenticated-user';
import { useProjectBootstrap } from '@/hooks/use-project-bootstrap';
import { useApplication, useProject, useProjects } from '@/stores/api-store';

enum TAB_NAME {
OVERVIEW,
API_KEYS,
SETTINGS,
}

export { TAB_NAME as applicationPageTabNames };

export default function Application({
params: { projectId, applicationId },
}: {
Expand All @@ -36,22 +29,24 @@ export default function Application({
const project = useProject(projectId);
const projects = useProjects();

const [selectedTab, setSelectedTab] = useState(TAB_NAME.OVERVIEW);
const [selectedTab, setSelectedTab] = useState(
ApplicationPageTabNames.OVERVIEW,
);

const tabs: TabData<TAB_NAME>[] = [
const tabs: TabData<ApplicationPageTabNames>[] = [
{
icon: <Speedometer2 className="w-3.5 h-3.5" />,
id: TAB_NAME.OVERVIEW,
id: ApplicationPageTabNames.OVERVIEW,
text: t('overview'),
},
{
icon: <KeyFill className="w-3.5 h-3.5" />,
id: TAB_NAME.API_KEYS,
id: ApplicationPageTabNames.API_KEYS,
text: t('apiKeys'),
},
{
icon: <Gear className="w-3.5 h-3.5" />,
id: TAB_NAME.SETTINGS,
id: ApplicationPageTabNames.SETTINGS,
text: t('settings'),
},
];
Expand All @@ -60,8 +55,8 @@ export default function Application({
return null;
}

const tabComponents: Record<TAB_NAME, React.FC> = {
[TAB_NAME.OVERVIEW]: memo(() => (
const tabComponents: Record<ApplicationPageTabNames, React.FC> = {
[ApplicationPageTabNames.OVERVIEW]: memo(() => (
<>
<ApplicationAnalyticsPage
application={application}
Expand All @@ -73,13 +68,13 @@ export default function Application({
/>
</>
)),
[TAB_NAME.API_KEYS]: memo(() => (
[ApplicationPageTabNames.API_KEYS]: memo(() => (
<ApplicationApiKeys
application={application}
projectId={projectId}
/>
)),
[TAB_NAME.SETTINGS]: memo(() => (
[ApplicationPageTabNames.SETTINGS]: memo(() => (
<>
<ApplicationGeneralSettings
application={application}
Expand Down Expand Up @@ -110,7 +105,7 @@ export default function Application({
</div>
)}
<div className="mt-3.5 w-full mb-8">
<TabNavigation<TAB_NAME>
<TabNavigation<ApplicationPageTabNames>
tabs={tabs}
selectedTab={selectedTab}
onTabChange={setSelectedTab}
Expand Down
34 changes: 15 additions & 19 deletions frontend/src/app/[locale]/projects/[projectId]/page.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,17 +13,11 @@ import { ProjectGeneralSettings } from '@/components/projects/[projectId]/projec
import { ProjectMembers } from '@/components/projects/[projectId]/project-members';
import { ProjectProviderKeys } from '@/components/projects/[projectId]/project-provider-keys';
import { TabData, TabNavigation } from '@/components/tab-navigation';
import { ProjectPageTabNames } from '@/constants';
import { useAuthenticatedUser } from '@/hooks/use-authenticated-user';
import { useProjectBootstrap } from '@/hooks/use-project-bootstrap';
import { useProject, useProjects } from '@/stores/api-store';

enum TAB_NAME {
OVERVIEW,
MEMBERS,
PROVIDER_KEYS,
SETTINGS,
}

export default function ProjectOverview({
params: { projectId },
}: {
Expand All @@ -34,30 +28,32 @@ export default function ProjectOverview({

const t = useTranslations('projectOverview');

const [selectedTab, setSelectedTab] = useState(TAB_NAME.OVERVIEW);
const [selectedTab, setSelectedTab] = useState(
ProjectPageTabNames.OVERVIEW,
);

const project = useProject(projectId);
const projects = useProjects();

const tabs: TabData<TAB_NAME>[] = [
const tabs: TabData<ProjectPageTabNames>[] = [
{
icon: <Speedometer2 className="w-3.5 h-3.5" />,
id: TAB_NAME.OVERVIEW,
id: ProjectPageTabNames.OVERVIEW,
text: t('overview'),
},
{
icon: <Gear className="w-3.5 h-3.5" />,
id: TAB_NAME.MEMBERS,
id: ProjectPageTabNames.MEMBERS,
text: t('members'),
},
{
icon: <Gear className="w-3.5 h-3.5" />,
id: TAB_NAME.PROVIDER_KEYS,
id: ProjectPageTabNames.PROVIDER_KEYS,
text: t('providerKeys'),
},
{
icon: <Gear className="w-3.5 h-3.5" />,
id: TAB_NAME.SETTINGS,
id: ProjectPageTabNames.SETTINGS,
text: t('settings'),
},
];
Expand All @@ -66,27 +62,27 @@ export default function ProjectOverview({
return null;
}

const tabComponents: Record<TAB_NAME, React.FC> = {
[TAB_NAME.OVERVIEW]: memo(() => (
const tabComponents: Record<ProjectPageTabNames, React.FC> = {
[ProjectPageTabNames.OVERVIEW]: memo(() => (
<div data-testid="project-overview-tab">
<ProjectAnalytics project={project} />
<ProjectApplicationsList project={project} />
</div>
)),
[TAB_NAME.MEMBERS]: memo(() => (
[ProjectPageTabNames.MEMBERS]: memo(() => (
<div data-testid="project-members-tab">
<InviteProjectMembers project={project} />
<div className="mt-10">
<ProjectMembers project={project} />
</div>
</div>
)),
[TAB_NAME.PROVIDER_KEYS]: memo(() => (
[ProjectPageTabNames.PROVIDER_KEYS]: memo(() => (
<div data-testid="project-provider-keys-tab">
<ProjectProviderKeys project={project} />
</div>
)),
[TAB_NAME.SETTINGS]: memo(() => (
[ProjectPageTabNames.SETTINGS]: memo(() => (
<div data-testid="project-settings-tab">
<ProjectGeneralSettings project={project} />
<div className="mt-10">
Expand All @@ -113,7 +109,7 @@ export default function ProjectOverview({
</div>
)}
<div className="mt-3.5 w-full mb-9">
<TabNavigation<TAB_NAME>
<TabNavigation<ProjectPageTabNames>
tabs={tabs}
selectedTab={selectedTab}
onTabChange={setSelectedTab}
Expand Down
3 changes: 1 addition & 2 deletions ...ts/projects/[projectId]/applications/[applicationId]/application-prompt-configs-table.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,8 +2,7 @@ import { useRouter } from 'next/navigation';
import { useTranslations } from 'next-intl';
import { CheckCircle, Front, PencilFill, Search } from 'react-bootstrap-icons';

import { PromptConfigPageTab } from '@/app/[locale]/projects/[projectId]/applications/[applicationId]/configs/[promptConfigId]/page';
import { Navigation } from '@/constants';
import { Navigation, PromptConfigPageTab } from '@/constants';
import {
modelTypeToLocaleMap,
modelVendorToLocaleMap,
Expand Down
5 changes: 2 additions & 3 deletions frontend/src/components/projects/[projectId]/project-applications-list-table.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,8 +2,7 @@ import { useRouter } from 'next/navigation';
import { useTranslations } from 'next-intl';
import { PencilFill } from 'react-bootstrap-icons';

import { applicationPageTabNames } from '@/app/[locale]/projects/[projectId]/applications/[applicationId]/page';
import { Navigation } from '@/constants';
import { ApplicationPageTabNames, Navigation } from '@/constants';
import { Application, PromptConfig } from '@/types';
import { setRouteParams } from '@/utils/navigation';

Expand Down Expand Up @@ -80,7 +79,7 @@ export function ProjectApplicationsListTable({
applicationId,
projectId,
},
applicationPageTabNames.SETTINGS,
ApplicationPageTabNames.SETTINGS,
),
);
}}
Expand Down
19 changes: 19 additions & 0 deletions frontend/src/constants/navigation.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,3 +16,22 @@ export enum Navigation {
}
export const DISCORD_INVITE_LINK = 'https://discord.gg/Urxchkcq';
export const SUPPORT_EMAIL = 'support@basemind.ai';

export enum PromptConfigPageTab {
OVERVIEW,
TESTING,
SETTINGS,
}

export enum ApplicationPageTabNames {
OVERVIEW,
API_KEYS,
SETTINGS,
}

export enum ProjectPageTabNames {
OVERVIEW,
MEMBERS,
PROVIDER_KEYS,
SETTINGS,
}

0 comments on commit 7225de3

Please sign in to comment.