Files
Brancheneinstufung2/competitor-analysis-app/components/Step2_Keywords.tsx
Floke 249b06463b feat(competitor-analysis): Fix 404, SDK compatibility, and update docs
Resolved multiple issues preventing the 'competitor-analysis' app from running and serving its frontend:

1.  **Fixed Python SyntaxError in Prompts:** Corrected unterminated string literals and ensure proper multi-line string formatting (using .format() instead of f-strings for complex prompts) in .
2.  **Addressed Python SDK Compatibility (google-generativeai==0.3.0):**
    *   Removed  for  and  by adapting the orchestrator to pass JSON schemas as direct Python dictionaries, as required by the older SDK version.
    *   Updated  with detailed guidance on handling / imports and dictionary-based schema definitions for older SDKs.
3.  **Corrected Frontend Build Dependencies:** Moved critical build dependencies (like , , ) from  to  in .
    *   Updated  to include this  pitfall, ensuring frontend build tools are installed in Docker.
4.  **Updated Documentation:**
    *   : Added comprehensive lessons learned regarding  dependencies, Python SDK versioning (specifically  and  imports for ), and robust multi-line prompt handling.
    *   : Integrated specific details of the encountered errors and their solutions, making the migration report a more complete historical record and guide.

These changes collectively fix the 404 error by ensuring the Python backend starts correctly and serves the frontend assets after a successful build.
2026-01-10 09:10:00 +00:00

38 lines
1.3 KiB
TypeScript

import React from 'react';
import type { Keyword } from '../types';
import { EditableCard } from './EditableCard';
interface Step2KeywordsProps {
keywords: Keyword[];
onKeywordsChange: (keywords: Keyword[]) => void;
t: any;
}
const Step2Keywords: React.FC<Step2KeywordsProps> = ({ keywords, onKeywordsChange, t }) => {
return (
<div>
<h2 className="text-2xl font-bold mb-4">{t.title}</h2>
<p className="text-light-subtle dark:text-brand-light mb-6">{t.subtitle}</p>
<EditableCard<Keyword>
title={t.cardTitle}
items={keywords}
onItemsChange={onKeywordsChange}
fieldConfigs={[
{ key: 'term', label: t.termLabel, type: 'text' },
{ key: 'rationale', label: t.rationaleLabel, type: 'textarea' },
]}
newItemTemplate={{ term: '', rationale: '' }}
renderDisplay={(item) => (
<div>
<strong className="text-light-text dark:text-white">{item.term}</strong>
<p className="text-light-subtle dark:text-brand-light text-sm mt-1">{item.rationale}</p>
</div>
)}
t={t.editableCard}
/>
</div>
);
};
export default Step2Keywords;