auto-claude: subtask-5-2 - Add 'Add Known Competitors' section to CompetitorAnalysisDialog
Co-Authored-By: Claude Opus 4.6 <[email protected]>
This commit is contained in:
AndyMik90
co-authored by
Claude Opus 4.6
Claude Opus 4.6
parent
0e0886904d
commit
c28e7ef488
@@ -1,4 +1,6 @@
|
||||
import { Search, Globe, AlertTriangle, TrendingUp } from 'lucide-react';
|
||||
import { useState } from 'react';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { Search, Globe, AlertTriangle, TrendingUp, UserPlus } from 'lucide-react';
|
||||
import {
|
||||
AlertDialog,
|
||||
AlertDialogContent,
|
||||
@@ -9,12 +11,15 @@ import {
|
||||
AlertDialogAction,
|
||||
AlertDialogCancel,
|
||||
} from './ui/alert-dialog';
|
||||
import { Button } from './ui/button';
|
||||
import { AddCompetitorDialog } from './AddCompetitorDialog';
|
||||
|
||||
interface CompetitorAnalysisDialogProps {
|
||||
open: boolean;
|
||||
onOpenChange: (open: boolean) => void;
|
||||
onAccept: () => void;
|
||||
onDecline: () => void;
|
||||
projectId: string;
|
||||
}
|
||||
|
||||
export function CompetitorAnalysisDialog({
|
||||
@@ -22,7 +27,12 @@ export function CompetitorAnalysisDialog({
|
||||
onOpenChange,
|
||||
onAccept,
|
||||
onDecline,
|
||||
projectId,
|
||||
}: CompetitorAnalysisDialogProps) {
|
||||
const { t } = useTranslation(['dialogs']);
|
||||
const [showAddDialog, setShowAddDialog] = useState(false);
|
||||
const [addedCount, setAddedCount] = useState(0);
|
||||
|
||||
const handleAccept = () => {
|
||||
onAccept();
|
||||
onOpenChange(false);
|
||||
@@ -33,78 +43,116 @@ export function CompetitorAnalysisDialog({
|
||||
onOpenChange(false);
|
||||
};
|
||||
|
||||
return (
|
||||
<AlertDialog open={open} onOpenChange={onOpenChange}>
|
||||
<AlertDialogContent className="sm:max-w-[500px]">
|
||||
<AlertDialogHeader>
|
||||
<AlertDialogTitle className="flex items-center gap-2 text-foreground">
|
||||
<TrendingUp className="h-5 w-5 text-primary" />
|
||||
Enable Competitor Analysis?
|
||||
</AlertDialogTitle>
|
||||
<AlertDialogDescription className="text-muted-foreground">
|
||||
Enhance your roadmap with insights from competitor products
|
||||
</AlertDialogDescription>
|
||||
</AlertDialogHeader>
|
||||
const handleCompetitorAdded = (_competitorId: string) => {
|
||||
setAddedCount((prev) => prev + 1);
|
||||
};
|
||||
|
||||
<div className="py-4 space-y-4">
|
||||
{/* What it does */}
|
||||
<div className="rounded-lg bg-primary/5 border border-primary/20 p-4">
|
||||
<h4 className="text-sm font-medium text-foreground mb-2">
|
||||
What competitor analysis does:
|
||||
</h4>
|
||||
<ul className="text-sm text-muted-foreground space-y-2">
|
||||
<li className="flex items-start gap-2">
|
||||
<Search className="h-4 w-4 mt-0.5 text-primary flex-shrink-0" />
|
||||
<span>Identifies 3-5 main competitors based on your project type</span>
|
||||
</li>
|
||||
<li className="flex items-start gap-2">
|
||||
<Globe className="h-4 w-4 mt-0.5 text-primary flex-shrink-0" />
|
||||
<span>
|
||||
Searches app stores, forums, and social media for user feedback and pain points
|
||||
</span>
|
||||
</li>
|
||||
<li className="flex items-start gap-2">
|
||||
<TrendingUp className="h-4 w-4 mt-0.5 text-primary flex-shrink-0" />
|
||||
<span>
|
||||
Suggests features that address gaps in competitor products
|
||||
</span>
|
||||
</li>
|
||||
</ul>
|
||||
return (
|
||||
<>
|
||||
<AlertDialog open={open} onOpenChange={onOpenChange}>
|
||||
<AlertDialogContent className="sm:max-w-[500px]">
|
||||
<AlertDialogHeader>
|
||||
<AlertDialogTitle className="flex items-center gap-2 text-foreground">
|
||||
<TrendingUp className="h-5 w-5 text-primary" />
|
||||
{t('dialogs:competitorAnalysis.title', 'Enable Competitor Analysis?')}
|
||||
</AlertDialogTitle>
|
||||
<AlertDialogDescription className="text-muted-foreground">
|
||||
{t('dialogs:competitorAnalysis.description', 'Enhance your roadmap with insights from competitor products')}
|
||||
</AlertDialogDescription>
|
||||
</AlertDialogHeader>
|
||||
|
||||
<div className="py-4 space-y-4">
|
||||
{/* What it does */}
|
||||
<div className="rounded-lg bg-primary/5 border border-primary/20 p-4">
|
||||
<h4 className="text-sm font-medium text-foreground mb-2">
|
||||
{t('dialogs:competitorAnalysis.whatItDoes', 'What competitor analysis does:')}
|
||||
</h4>
|
||||
<ul className="text-sm text-muted-foreground space-y-2">
|
||||
<li className="flex items-start gap-2">
|
||||
<Search className="h-4 w-4 mt-0.5 text-primary flex-shrink-0" />
|
||||
<span>{t('dialogs:competitorAnalysis.identifiesCompetitors', 'Identifies 3-5 main competitors based on your project type')}</span>
|
||||
</li>
|
||||
<li className="flex items-start gap-2">
|
||||
<Globe className="h-4 w-4 mt-0.5 text-primary flex-shrink-0" />
|
||||
<span>
|
||||
{t('dialogs:competitorAnalysis.searchesAppStores', 'Searches app stores, forums, and social media for user feedback and pain points')}
|
||||
</span>
|
||||
</li>
|
||||
<li className="flex items-start gap-2">
|
||||
<TrendingUp className="h-4 w-4 mt-0.5 text-primary flex-shrink-0" />
|
||||
<span>
|
||||
{t('dialogs:competitorAnalysis.suggestsFeatures', 'Suggests features that address gaps in competitor products')}
|
||||
</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
{/* Privacy notice */}
|
||||
<div className="rounded-lg bg-warning/10 border border-warning/30 p-4">
|
||||
<div className="flex items-start gap-3">
|
||||
<AlertTriangle className="h-5 w-5 text-warning flex-shrink-0 mt-0.5" />
|
||||
<div className="flex-1">
|
||||
<h4 className="text-sm font-medium text-foreground">
|
||||
{t('dialogs:competitorAnalysis.webSearchesTitle', 'Web searches will be performed')}
|
||||
</h4>
|
||||
<p className="text-xs text-muted-foreground mt-1">
|
||||
{t('dialogs:competitorAnalysis.webSearchesDescription', 'This feature will perform web searches to gather competitor information. Your project name and type will be used in search queries. No code or sensitive data is shared.')}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Optional info */}
|
||||
<p className="text-xs text-muted-foreground">
|
||||
{t('dialogs:competitorAnalysis.optionalInfo', 'You can generate a roadmap without competitor analysis if you prefer. The roadmap will still be based on your project structure and best practices.')}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
{/* Privacy notice */}
|
||||
<div className="rounded-lg bg-warning/10 border border-warning/30 p-4">
|
||||
<div className="flex items-start gap-3">
|
||||
<AlertTriangle className="h-5 w-5 text-warning flex-shrink-0 mt-0.5" />
|
||||
{/* Add Known Competitors section */}
|
||||
<div className="border-t border-border pt-4">
|
||||
<div className="flex items-center justify-between">
|
||||
<div className="flex-1">
|
||||
<h4 className="text-sm font-medium text-foreground">
|
||||
Web searches will be performed
|
||||
</h4>
|
||||
<p className="text-xs text-muted-foreground mt-1">
|
||||
This feature will perform web searches to gather competitor information.
|
||||
Your project name and type will be used in search queries.
|
||||
No code or sensitive data is shared.
|
||||
<p className="text-sm text-muted-foreground">
|
||||
{t('dialogs:competitorAnalysis.knowYourCompetitors', 'Already know your competitors?')}
|
||||
</p>
|
||||
<p className="text-xs text-muted-foreground/70 mt-0.5">
|
||||
{t('dialogs:competitorAnalysis.addThemDirectly', 'Add them directly to improve analysis accuracy')}
|
||||
</p>
|
||||
</div>
|
||||
<Button
|
||||
variant="outline"
|
||||
size="sm"
|
||||
className="flex items-center gap-1.5"
|
||||
onClick={() => setShowAddDialog(true)}
|
||||
>
|
||||
<UserPlus className="h-3.5 w-3.5" />
|
||||
{t('dialogs:competitorAnalysis.addKnownCompetitors', 'Add Known Competitors')}
|
||||
{addedCount > 0 && (
|
||||
<span className="ml-1 rounded-full bg-primary px-1.5 py-0.5 text-[10px] font-medium text-primary-foreground">
|
||||
{t('dialogs:competitorAnalysis.competitorsAdded', '{{count}} added', { count: addedCount })}
|
||||
</span>
|
||||
)}
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Optional info */}
|
||||
<p className="text-xs text-muted-foreground">
|
||||
You can generate a roadmap without competitor analysis if you prefer.
|
||||
The roadmap will still be based on your project structure and best practices.
|
||||
</p>
|
||||
</div>
|
||||
<AlertDialogFooter>
|
||||
<AlertDialogCancel onClick={handleDecline}>
|
||||
{t('dialogs:competitorAnalysis.skipAnalysis', 'No, Skip Analysis')}
|
||||
</AlertDialogCancel>
|
||||
<AlertDialogAction onClick={handleAccept}>
|
||||
{t('dialogs:competitorAnalysis.enableAnalysis', 'Yes, Enable Analysis')}
|
||||
</AlertDialogAction>
|
||||
</AlertDialogFooter>
|
||||
</AlertDialogContent>
|
||||
</AlertDialog>
|
||||
|
||||
<AlertDialogFooter>
|
||||
<AlertDialogCancel onClick={handleDecline}>
|
||||
No, Skip Analysis
|
||||
</AlertDialogCancel>
|
||||
<AlertDialogAction onClick={handleAccept}>
|
||||
Yes, Enable Analysis
|
||||
</AlertDialogAction>
|
||||
</AlertDialogFooter>
|
||||
</AlertDialogContent>
|
||||
</AlertDialog>
|
||||
<AddCompetitorDialog
|
||||
open={showAddDialog}
|
||||
onOpenChange={setShowAddDialog}
|
||||
onCompetitorAdded={handleCompetitorAdded}
|
||||
projectId={projectId}
|
||||
/>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -78,6 +78,7 @@ export function Roadmap({ projectId, onGoToTask }: RoadmapProps) {
|
||||
onOpenChange={setShowCompetitorDialog}
|
||||
onAccept={handleCompetitorDialogAccept}
|
||||
onDecline={handleCompetitorDialogDecline}
|
||||
projectId={projectId}
|
||||
/>
|
||||
{/* Dialog for projects WITH existing competitor analysis */}
|
||||
<ExistingCompetitorAnalysisDialog
|
||||
@@ -135,6 +136,7 @@ export function Roadmap({ projectId, onGoToTask }: RoadmapProps) {
|
||||
onOpenChange={setShowCompetitorDialog}
|
||||
onAccept={handleCompetitorDialogAccept}
|
||||
onDecline={handleCompetitorDialogDecline}
|
||||
projectId={projectId}
|
||||
/>
|
||||
|
||||
{/* Competitor Analysis Options Dialog (existing analysis) */}
|
||||
|
||||
@@ -189,6 +189,23 @@
|
||||
"addCompetitor": "Add Competitor",
|
||||
"failedToAdd": "Failed to add competitor"
|
||||
},
|
||||
"competitorAnalysis": {
|
||||
"title": "Enable Competitor Analysis?",
|
||||
"description": "Enhance your roadmap with insights from competitor products",
|
||||
"whatItDoes": "What competitor analysis does:",
|
||||
"identifiesCompetitors": "Identifies 3-5 main competitors based on your project type",
|
||||
"searchesAppStores": "Searches app stores, forums, and social media for user feedback and pain points",
|
||||
"suggestsFeatures": "Suggests features that address gaps in competitor products",
|
||||
"webSearchesTitle": "Web searches will be performed",
|
||||
"webSearchesDescription": "This feature will perform web searches to gather competitor information. Your project name and type will be used in search queries. No code or sensitive data is shared.",
|
||||
"optionalInfo": "You can generate a roadmap without competitor analysis if you prefer. The roadmap will still be based on your project structure and best practices.",
|
||||
"skipAnalysis": "No, Skip Analysis",
|
||||
"enableAnalysis": "Yes, Enable Analysis",
|
||||
"knowYourCompetitors": "Already know your competitors?",
|
||||
"addThemDirectly": "Add them directly to improve analysis accuracy",
|
||||
"addKnownCompetitors": "Add Known Competitors",
|
||||
"competitorsAdded": "{{count}} added"
|
||||
},
|
||||
"versionWarning": {
|
||||
"title": "Action Required",
|
||||
"subtitle": "Version 2.7.5 Update",
|
||||
|
||||
@@ -189,6 +189,23 @@
|
||||
"addCompetitor": "Ajouter le concurrent",
|
||||
"failedToAdd": "Échec de l'ajout du concurrent"
|
||||
},
|
||||
"competitorAnalysis": {
|
||||
"title": "Activer l'analyse concurrentielle ?",
|
||||
"description": "Améliorez votre feuille de route avec des informations sur les produits concurrents",
|
||||
"whatItDoes": "Ce que fait l'analyse concurrentielle :",
|
||||
"identifiesCompetitors": "Identifie 3 à 5 concurrents principaux en fonction de votre type de projet",
|
||||
"searchesAppStores": "Recherche dans les magasins d'applications, forums et réseaux sociaux les retours et points de douleur des utilisateurs",
|
||||
"suggestsFeatures": "Suggère des fonctionnalités qui comblent les lacunes des produits concurrents",
|
||||
"webSearchesTitle": "Des recherches web seront effectuées",
|
||||
"webSearchesDescription": "Cette fonctionnalité effectuera des recherches web pour recueillir des informations sur les concurrents. Le nom et le type de votre projet seront utilisés dans les requêtes de recherche. Aucun code ni donnée sensible n'est partagé.",
|
||||
"optionalInfo": "Vous pouvez générer une feuille de route sans analyse concurrentielle si vous préférez. La feuille de route sera toujours basée sur la structure de votre projet et les meilleures pratiques.",
|
||||
"skipAnalysis": "Non, ignorer l'analyse",
|
||||
"enableAnalysis": "Oui, activer l'analyse",
|
||||
"knowYourCompetitors": "Vous connaissez déjà vos concurrents ?",
|
||||
"addThemDirectly": "Ajoutez-les directement pour améliorer la précision de l'analyse",
|
||||
"addKnownCompetitors": "Ajouter des concurrents connus",
|
||||
"competitorsAdded": "{{count}} ajouté(s)"
|
||||
},
|
||||
"versionWarning": {
|
||||
"title": "Action requise",
|
||||
"subtitle": "Mise à jour version 2.7.5",
|
||||
|
||||
Reference in New Issue
Block a user