chore: updated containers, unified styles and refactored prompt-config wizard

.pre-commit-config.yaml

@@ -11,7 +11,6 @@ repos:
       hooks:
           - id: trailing-whitespace
           - id: end-of-file-fixer
-            exclude: '.idea/modules'
           - id: check-yaml
           - id: check-added-large-files
     - repo: https://github.com/koalaman/shellcheck-precommit
@@ -26,14 +25,14 @@ repos:
       rev: 'v3.1.0'
       hooks:
           - id: prettier
-            exclude: 'go.mod|gen/ts|.idea/modules'
+            exclude: 'go.mod|gen/ts'
     - repo: https://github.com/pre-commit/mirrors-eslint
       rev: 'v8.54.0'
       hooks:
           - id: eslint
             files: \.tsx?$
             types: [file]
-            args: [--fix]
+            args: [--fix, --no-ignore]
             exclude: 'gen/ts'
     - repo: https://github.com/golangci/golangci-lint
       rev: 'v1.55.2'

frontend/public/messages/en.json

@@ -77,6 +77,7 @@
 		"cohere": "Cohere",
 		"configName": "Config Name",
 		"continueButtonText": "Continue",
+		"createConfig": "Create Configuration",
 		"createPromptConfigTitle": "New Model Configuration",
 		"deleteMessage": "Remove Message",
 		"duration": "Duration",
@@ -92,7 +93,7 @@
 		"modelSelection": "Model",
 		"modelType": "Model",
 		"modelVendor": "Provider",
-		"newMessage": "New Message",
+		"newMessage": "+ New Message",
 		"noVariablesHeadline": "The template has no variables - add as necessary or click on run test",
 		"openai": "OpenAI",
 		"openaiParametersFrequencyPenaltyLabel": "Frequency Penalty",
@@ -320,6 +321,7 @@
 		"createProviderKey": "Create Provider Key",
 		"createdAt": "Created at",
 		"deleteProviderKeyWarning": "Are you sure you want to delete this provider key?",
+		"headline": "Bring Your Own Key",
 		"keyIsEncryptedMessage": "The API key is encrypted before being stored in our database.",
 		"keyValue": "API Key",
 		"modelVendor": "AI Provider",

frontend/src/app/[locale]/projects/[projectId]/applications/[applicationId]/config-create-wizard/page.spec.tsx

@@ -187,11 +187,8 @@ describe('PromptConfigCreateWizard Page tests', () => {
 			).toBeInTheDocument();
 		});
 
-		const saveButton = screen.getByTestId(
-			'config-create-wizard-save-button',
-		);
-		expect(saveButton).toBeInTheDocument();
-		expect(saveButton).toBeDisabled();
+		expect(continueButton).toBeInTheDocument();
+		expect(continueButton).toBeDisabled();
 	});
 
 	it('allows the user to continue to the third stage if messages are not empty', async () => {
@@ -231,52 +228,6 @@ describe('PromptConfigCreateWizard Page tests', () => {
 		});
 	});
 
-	it('allows the user to save the config if messages are not empty and replaces the route', async () => {
-		const promptConfig = OpenAIPromptConfigFactory.buildSync();
-		mockFetch.mockResolvedValue({
-			json: () => Promise.resolve(promptConfig),
-			ok: true,
-		});
-
-		const store = getStore();
-		act(() => {
-			store.setConfigName(promptConfig.name);
-			store.setMessages(promptConfig.providerPromptMessages);
-			store.setParameters(promptConfig.modelParameters);
-			store.setModelType(promptConfig.modelType);
-			store.setModelVendor(promptConfig.modelVendor);
-		});
-		render(
-			<PromptConfigCreateWizard params={{ applicationId, projectId }} />,
-		);
-
-		const continueButton = screen.getByTestId(
-			'config-create-wizard-continue-button',
-		);
-		expect(continueButton).toBeInTheDocument();
-		fireEvent.click(continueButton);
-
-		await waitFor(() => {
-			expect(
-				screen.getByTestId('parameters-and-prompt-form-container'),
-			).toBeInTheDocument();
-		});
-
-		const saveButton = screen.getByTestId(
-			'config-create-wizard-save-button',
-		);
-		expect(saveButton).toBeInTheDocument();
-		expect(saveButton).not.toBeDisabled();
-
-		fireEvent.click(saveButton);
-
-		await waitFor(() => {
-			expect(mockFetch).toHaveBeenCalledTimes(1);
-		});
-
-		expect(routerReplaceMock).toHaveBeenCalledOnce();
-	});
-
 	it('allows the user to save the config when on the third stage and replaces the route', async () => {
 		const promptConfig = OpenAIPromptConfigFactory.buildSync();
 		mockFetch.mockResolvedValue({
@@ -343,20 +294,16 @@ describe('PromptConfigCreateWizard Page tests', () => {
 			store.setParameters(promptConfig.modelParameters);
 			store.setModelType(promptConfig.modelType);
 			store.setModelVendor(promptConfig.modelVendor);
+			store.setNextWizardStage();
+			store.setNextWizardStage();
 		});
 		render(
 			<PromptConfigCreateWizard params={{ applicationId, projectId }} />,
 		);
 
-		const continueButton = screen.getByTestId(
-			'config-create-wizard-continue-button',
-		);
-		expect(continueButton).toBeInTheDocument();
-		fireEvent.click(continueButton);
-
 		await waitFor(() => {
 			expect(
-				screen.getByTestId('parameters-and-prompt-form-container'),
+				screen.getByTestId('prompt-config-testing-form'),
 			).toBeInTheDocument();
 		});
 
@@ -473,7 +420,7 @@ describe('PromptConfigCreateWizard Page tests', () => {
 		expect(continueButton.length).toBeFalsy();
 	});
 
-	it('allows the user to cancel at all stages', async () => {
+	it('allows the user to cancel only on the first stage', async () => {
 		const promptConfig = OpenAIPromptConfigFactory.buildSync();
 
 		const store = getStore();
@@ -495,15 +442,11 @@ describe('PromptConfigCreateWizard Page tests', () => {
 				screen.getByTestId('prompt-config-testing-form'),
 			).toBeInTheDocument();
 		});
-		const cancelButton = screen.getByTestId(
+
+		let cancelButton = screen.queryByTestId(
 			'config-create-wizard-cancel-button',
 		);
-		expect(cancelButton).toBeInTheDocument();
-		expect(cancelButton).not.toBeDisabled();
-
-		fireEvent.click(cancelButton);
-
-		expect(routerPushMock).toHaveBeenCalledOnce();
+		expect(cancelButton).toBeNull();
 
 		act(() => {
 			store.setPrevWizardStage();
@@ -515,11 +458,10 @@ describe('PromptConfigCreateWizard Page tests', () => {
 			).toBeInTheDocument();
 		});
 
-		expect(cancelButton).not.toBeDisabled();
-
-		fireEvent.click(cancelButton);
-
-		expect(routerPushMock).toHaveBeenCalledTimes(2);
+		cancelButton = screen.queryByTestId(
+			'config-create-wizard-cancel-button',
+		);
+		expect(cancelButton).toBeNull();
 
 		act(() => {
 			store.setPrevWizardStage();
@@ -530,12 +472,12 @@ describe('PromptConfigCreateWizard Page tests', () => {
 				screen.getByTestId('base-form-container'),
 			).toBeInTheDocument();
 		});
-
+		cancelButton = screen.getByTestId('config-create-wizard-cancel-button');
 		expect(cancelButton).not.toBeDisabled();
 
 		fireEvent.click(cancelButton);
 
-		expect(routerPushMock).toHaveBeenCalledTimes(3);
+		expect(routerPushMock).toHaveBeenCalledTimes(1);
 	});
 
 	it('shows the provider key create modal when no provider key exists for the given vendor', async () => {