Solution simplifiée pour copie du lien - zone de texte sélectionnable

- Zone de texte en lecture seule avec le lien
- Sélection automatique au clic
- Bouton 'Sélectionner' explicite
- Instructions claires pour l'utilisateur
- Plus simple et plus fiable que l'alerte
This commit is contained in:
2025-11-23 11:12:30 +01:00
parent 8b0ba77b63
commit dd41da5b0a
3 changed files with 52 additions and 30 deletions

View File

@ -204,29 +204,50 @@ export default function ClientForm({ client, onSuccess, onCancel }: ClientFormPr
<div>
<p className="text-sm font-medium text-gray-700 mb-2">Lien unique :</p>
<div className="bg-secondary rounded-xl p-4 space-y-3">
<code className="text-sm break-all block text-primary font-mono">
{getClientUrl()}
</code>
<Button
size="sm"
onClick={handleCopyLink}
className={`w-full ${copied ? "bg-green-600 hover:bg-green-700" : ""}`}
>
{copied ? (
<>
<Check className="h-4 w-4 mr-2" />
Copié !
</>
) : (
<>
<Copy className="h-4 w-4 mr-2" />
Copier le lien
</>
)}
</Button>
<textarea
readOnly
value={getClientUrl()}
onClick={(e) => e.currentTarget.select()}
onFocus={(e) => e.currentTarget.select()}
className="w-full p-3 text-sm font-mono text-primary bg-white border-2 border-primary rounded-lg resize-none"
rows={3}
style={{ cursor: 'text' }}
/>
<div className="flex gap-2">
<Button
size="sm"
onClick={handleCopyLink}
className={`flex-1 ${copied ? "bg-green-600 hover:bg-green-700" : ""}`}
>
{copied ? (
<>
<Check className="h-4 w-4 mr-2" />
Copié !
</>
) : (
<>
<Copy className="h-4 w-4 mr-2" />
Copier
</>
)}
</Button>
<Button
size="sm"
variant="outline"
onClick={() => {
const textarea = document.querySelector('textarea[readonly]') as HTMLTextAreaElement;
if (textarea) {
textarea.select();
}
}}
className="flex-1"
>
Sélectionner
</Button>
</div>
</div>
<p className="text-xs text-gray-500 mt-2">
Partagez ce lien avec le client pour qu&apos;il configure son app automatiquement
💡 Cliquez sur le lien pour le sélectionner, puis Ctrl+C pour copier
</p>
</div>
<div>

View File

@ -2,12 +2,18 @@
const nextConfig = {
reactStrictMode: true,
swcMinify: true,
output: "export",
// Mode serveur (pas d'export statique)
// Les API routes fonctionnent normalement
compress: true,
poweredByHeader: false,
images: {
unoptimized: true,
formats: ["image/avif", "image/webp"],
minimumCacheTTL: 60,
},
experimental: {
optimizePackageImports: ["lucide-react"],
},
};
module.exports = nextConfig;

View File

@ -2,17 +2,12 @@
const nextConfig = {
reactStrictMode: true,
swcMinify: true,
output: "standalone",
output: "export",
compress: true,
poweredByHeader: false,
images: {
formats: ["image/avif", "image/webp"],
minimumCacheTTL: 60,
},
experimental: {
optimizePackageImports: ["lucide-react"],
unoptimized: true,
},
};
module.exports = nextConfig;