fix(gtm): Fix white screen and implement URL persistence v2.6.1
- Fixed TypeError in SessionBrowser by adding defensive checks for the sessions array. - Implemented mandatory URL persistence: The research URL is now saved in DB, shown in UI, and included in reports. - Added 'Start New Analysis' button to the session browser for better UX flow. - Updated documentation to reflect v2.6.1 changes.
This commit is contained in:
@@ -1,56 +1,79 @@
|
||||
import React from 'react';
|
||||
import { ProjectHistoryItem } from './types';
|
||||
import './SessionBrowser.css';
|
||||
import { Plus, FileText } from 'lucide-react';
|
||||
|
||||
interface SessionBrowserProps {
|
||||
sessions: ProjectHistoryItem[];
|
||||
onLoadSession: (projectId: string) => void;
|
||||
onDeleteSession: (projectId: string) => void;
|
||||
onStartNew: () => void;
|
||||
}
|
||||
|
||||
const SessionBrowser: React.FC<SessionBrowserProps> = ({ sessions, onLoadSession, onDeleteSession }) => {
|
||||
const SessionBrowser: React.FC<SessionBrowserProps> = ({ sessions, onLoadSession, onDeleteSession, onStartNew }) => {
|
||||
|
||||
const getCategoryIcon = (category: string) => {
|
||||
// Return an icon based on the category, default to a generic robot
|
||||
if (!category) return '🤖';
|
||||
switch (category.toLowerCase()) {
|
||||
case 'reinigungsroboter':
|
||||
return '🧹'; // Sweeping broom emoji
|
||||
return '🧹';
|
||||
case 'serviceroboter':
|
||||
return '🛎️'; // Bellhop bell emoji
|
||||
return '🛎️';
|
||||
case 'transportroboter':
|
||||
return '📦'; // Package emoji
|
||||
return '📦';
|
||||
case 'security roboter':
|
||||
return '🛡️'; // Shield emoji
|
||||
return '🛡️';
|
||||
default:
|
||||
return '🤖'; // Default robot emoji
|
||||
return '🤖';
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="session-browser">
|
||||
<h2>Gespeicherte Sitzungen</h2>
|
||||
<div className="session-grid">
|
||||
{sessions.map((session) => (
|
||||
<div key={session.id} className="session-card">
|
||||
<div className="card-header">
|
||||
<span className="category-icon">{getCategoryIcon(session.productCategory)}</span>
|
||||
<h3 title={session.productName}>{session.productName}</h3>
|
||||
</div>
|
||||
{/* Thumbnail placeholder */}
|
||||
<div className="thumbnail-placeholder">
|
||||
<span>🖼️</span>
|
||||
<p>Thumbnail</p>
|
||||
</div>
|
||||
<div className="card-content">
|
||||
<p className="product-description">{session.productDescription}</p>
|
||||
<p className="last-updated">Zuletzt bearbeitet: {new Date(session.updated_at).toLocaleString()}</p>
|
||||
</div>
|
||||
<div className="card-actions">
|
||||
<button onClick={() => onLoadSession(session.id)} className="load-btn">Laden</button>
|
||||
<button onClick={() => onDeleteSession(session.id)} className="delete-btn">Löschen</button>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
<div className="browser-header">
|
||||
<h2 className="flex items-center gap-2"><FileText size={28}/> Gespeicherte Sitzungen</h2>
|
||||
<button onClick={onStartNew} className="start-new-btn">
|
||||
<Plus size={16}/> Neue Analyse starten
|
||||
</button>
|
||||
</div>
|
||||
|
||||
{(!sessions || sessions.length === 0) ? (
|
||||
<div className="empty-state">
|
||||
<p>Keine gespeicherten Sitzungen gefunden.</p>
|
||||
<button onClick={onStartNew} className="start-new-btn-secondary">
|
||||
Jetzt eine neue Analyse starten
|
||||
</button>
|
||||
</div>
|
||||
) : (
|
||||
<div className="session-grid">
|
||||
{sessions.map((session) => (
|
||||
<div key={session.id} className="session-card">
|
||||
<div className="card-header">
|
||||
<span className="category-icon">{getCategoryIcon(session.productCategory)}</span>
|
||||
<h3 title={session.productName}>{session.productName || 'Unbenannt'}</h3>
|
||||
</div>
|
||||
<div className="thumbnail-placeholder">
|
||||
<span>🖼️</span>
|
||||
<p>Thumbnail</p>
|
||||
</div>
|
||||
<div className="card-content">
|
||||
<p className="product-description">{session.productDescription || 'Keine Beschreibung verfügbar.'}</p>
|
||||
<p className="source-url">
|
||||
<a href={session.sourceUrl} target="_blank" rel="noopener noreferrer">
|
||||
Quelle anzeigen
|
||||
</a>
|
||||
</p>
|
||||
<p className="last-updated">Zuletzt bearbeitet: {new Date(session.updated_at).toLocaleString()}</p>
|
||||
</div>
|
||||
<div className="card-actions">
|
||||
<button onClick={() => onLoadSession(session.id)} className="load-btn">Laden</button>
|
||||
<button onClick={() => onDeleteSession(session.id)} className="delete-btn">Löschen</button>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user