edsl 0.1.50__py3-none-any.whl → 0.1.52__py3-none-any.whl

edsl/templates/error_reporting/interview_details.html

@@ -1,130 +1,134 @@
-<style>
-    td {
-        padding: 0 10px; /* This applies the padding uniformly to all td elements */
-    }
-    .toggle-btn {
-        background-color: #4CAF50;
-        color: white;
-        border: none;
-        padding: 10px 20px;
-        text-align: center;
-        text-decoration: none;
-        display: inline-block;
-        font-size: 16px;
-        margin: 4px 2px;
-        cursor: pointer;
-        border-radius: 8px;
-        white-space: nowrap;
-    }
-    .toggle-btn span.collapse {
-        display: none;
-    }
-    .exception-content {
-        max-width: 100%; /* Adjust this value based on your layout */
-        overflow-x: auto; /* Enables horizontal scrolling */
-    }
-</style>
+<div class="summary-section">
+    <div class="section-header">
+        <h2>Exception Details</h2>
+    </div>
+    <div class="p-4">
+        <div class="question">Question name: {{ question }}</div>
 
-<div class="question">Question name: {{ question }}</div>
+        {% set seen_exceptions = [] %}
 
-{% for exception_message in exceptions %}
-<div class="exception-detail">
-    <div class="exception-header">
-        <span class="exception-exception">Exception: {{ exception_message.name }}</span>
-        <button id="toggleBtn" class="toggle-btn" onclick="toggleButton(this)" aria-expanded="false">
-            <span class="expand"> ▼ </span>
-        </button>             
-    </div>
-    <div class="exception-content">
-        <table border="1">
-            <tr>
-                <td>Interview ID (index in results)</td>
-                <td>{{ index }}</td>
-            </tr>
-            <tr>
-                <td>Question name</td>
-                <td>{{ question }}</td>
-            </tr>
-            <tr>
-                <td>Question type</td>
-                <td>{{ exception_message.question_type }}</td>
-            </tr>
-            <tr>
-                <td>Human-readable question</td>
-                <td>{{ interview.survey._get_question_by_name(question).html(
-                    scenario = interview.scenario, 
-                    agent = interview.agent,
-                    answers = exception_message.answers
-                    ) 
-                }}</td>
-            </tr>
-            <tr>
-                <td>User Prompt</td>
-                <td><pre>{{ exception_message.rendered_prompts['user_prompt'] }}</pre></td>
-            </tr>
-            <tr>
-                <td>Scenario</td>
-                <td>{{ interview.scenario.__repr__() }}</td>
-            </tr>
-            <tr>
-                <td>Agent</td>
-                <td>{{ interview.agent.__repr__() }}</td>
-            </tr>
-            <tr>
-                <td>System Prompt</td>
-                <td><pre>{{ exception_message.rendered_prompts['system_prompt'] }}</pre></td>
-            </tr>
-            <tr>
-                <td>Inference service</td>
-                <td>{{ interview.model._inference_service_ }}</td>
-            </tr>
-            <tr>
-                <td>Model name</td>
-                <td>{{ interview.model.model }}</td>
-            </tr>
-            <tr>
-                <td>Model parameters</td>
-                <td>{{ interview.model.__repr__() }}</td>
-            </tr>
-            <tr>
-                <td>Raw model response</td>
-                <td><pre>{{ exception_message.raw_model_response }}</pre>
-                </td>
-            </tr>
-            <tr>
-                <td>Generated token string (at {{ exception_message.key_sequence }}) in raw response</td>
-                <td><pre>{{ exception_message.generated_token_string }}</pre>
-                </td>
-            </tr>
-            <tr>
-            <td>Code likely to reproduce the error</td>
-            <td>
-                <textarea id="codeToCopy" rows="10" cols="90">{{ exception_message.code_to_reproduce }}</textarea>
-                <button onclick="copyCode()">Copy</button>
-            </td>
-            </tr>
+        {% for exception_message in exceptions %}
+            {% set exception_key = exception_message.name ~ '|' ~ 
+                                exception_message.question_type|default('') ~ '|' ~ 
+                                (exception_message.traceback|default(''))[0:100] %}
+            
+            {% if exception_key not in seen_exceptions %}
+                {% set _ = seen_exceptions.append(exception_key) %}
+                
+                <div class="exception-detail">
+                    <div class="exception-header">
+                        <span class="exception-exception">
+                            {{ exception_message.exception.__class__.__name__ }}
+                        </span>
+                        <span class="chevron"></span>
+                    </div>
+                    <div class="exception-content">
+                        <!-- Error Summary Section -->
+                        <div>
+                            <div class="section-header error-header">
+                                <h3>Error Summary</h3>
+                            </div>
+                            
+                            <table class="details-table">
+                                <tbody>
+                                    <tr>
+                                        <th>Exception</th>
+                                        <td>{{ exception_message.name }}</td>
+                                    </tr>
+                                    <tr>
+                                        <th>Model</th>
+                                        <td>{{ interview.model.model }}</td>
+                                    </tr>
+                                    <tr>
+                                        <th>Question</th>
+                                        <td>{{ question }} ({{ exception_message.question_type|default('Unknown type') }})</td>
+                                    </tr>
+                                    <tr>
+                                        <th>Time</th>
+                                        <td>{{ exception_message.time }}</td>
+                                    </tr>
+                                </tbody>
+                            </table>
+                        </div>
 
-        </table>
-    
-        {% if exception_message.exception.__class__.__name__ == 'QuestionAnswerValidationError' %}        
-        <h3>Answer validation details</h3>
-        <table border="1">
-            {% for field, (open_tag, close_tag, value) in exception_message.exception.to_html_dict().items() %}
-            <tr>
-                <td>{{ field }}</td>
-                <td><{{ open_tag }}> {{ value | escape }} <{{ close_tag }}></td>
-            </tr>
-            {% endfor %}
-        </table>
-    {% endif %}
-        <br><br>
-        <div class="exception-time">Time: {{ exception_message.time }}</div>          
-        <div class="exception-traceback">Traceback: 
-            <text>
-            <pre>{{ exception_message.traceback }}</pre>
-            </text>
-        </div>
-    </div>
-</div>
+                        <!-- Details Section -->
+                        <div>
+                            <div class="section-header">
+                                <h3>Details</h3>
+                            </div>
+                            <table class="details-table">
+                                <tbody>
+                                    <tr>
+                                        <th>Interview ID</th>
+                                        <td>{{ index }}</td>
+                                    </tr>
+                                    <tr>
+                                        <th>Question name</th>
+                                        <td>{{ question }}</td>
+                                    </tr>
+                                    <tr>
+                                        <th>Question type</th>
+                                        <td>{{ exception_message.question_type|default('Unknown') }}</td>
+                                    </tr>
+                                    <tr>
+                                        <th>User Prompt</th>
+                                        <td><pre>{{ exception_message.rendered_prompts['user_prompt'] }}</pre></td>
+                                    </tr>
+                                    <tr>
+                                        <th>Scenario</th>
+                                        <td>{{ interview.scenario.__repr__() }}</td>
+                                    </tr>
+                                    <tr>
+                                        <th>Agent</th>
+                                        <td>{{ interview.agent.__repr__() }}</td>
+                                    </tr>
+                                    <tr>
+                                        <th>System Prompt</th>
+                                        <td><pre>{{ exception_message.rendered_prompts['system_prompt'] }}</pre></td>
+                                    </tr>
+                                    <tr>
+                                        <th>Inference service</th>
+                                        <td>{{ interview.model._inference_service_ }}</td>
+                                    </tr>
+                                    <tr>
+                                        <th>Model name</th>
+                                        <td>{{ interview.model.model }}</td>
+                                    </tr>
+                                    <tr>
+                                        <th>Model parameters</th>
+                                        <td>{{ interview.model.__repr__() }}</td>
+                                    </tr>
+                                    <tr>
+                                        <th>Raw model response</th>
+                                        <td><pre>{{ exception_message.raw_model_response }}</pre></td>
+                                    </tr>
+                                    <tr>
+                                        <th>Generated token string</th>
+                                        <td><pre>{{ exception_message.generated_token_string }}</pre></td>
+                                    </tr>
+                                </tbody>
+                            </table>
+                        </div>
 
-{% endfor %}
+                        <!-- Code to reproduce section -->
+                        <div>
+                            <div class="section-header code-header">
+                                <h3>Code to reproduce error</h3>
+                                <button class="copy-button">Copy</button>
+                            </div>
+                            <pre class="code-block"><code>{{ exception_message.code_to_reproduce }}</code></pre>
+                        </div>
+
+                        <!-- Traceback section -->
+                        <div>
+                            <div class="section-header">
+                                <h3>Traceback</h3>
+                            </div>
+                            <pre class="traceback">{{ exception_message.traceback }}</pre>
+                        </div>
+                    </div>
+                </div>
+            {% endif %}
+        {% endfor %}
+    </div>
+</div>

edsl/templates/error_reporting/overview.html

@@ -1,26 +1,22 @@
-<style>
-    td {
-        padding: 0 10px; /* This applies the padding uniformly to all td elements */
-    }
-</style>
+<div class="overview-section">
+    <h2>Exceptions Report</h2>
+    <p>
+        This report summarizes exceptions encountered in the job that was run.
+    </p>
 
-<h3>Exceptions Report</h3>
-<p>
-    This report summarizes exceptions encountered in the job that was run.
-</p>
-
-<table border="1">
-    <tbody>
-        <tr>
-            <td>Total interviews</td>
-            <td>{{ interviews|length }}</td>
-        </tr>
-        <tr>
-            <td>Interviews with exceptions</td>
-            <td>{{ num_exceptions }}</td>
-        </tr>
-    </tbody>
-</table>
-<p>
-    An interview is the result of one survey, taken by one agent, with one model and one scenario (if any).
-</p>
+    <table class="summary-table">
+        <tbody>
+            <tr>
+                <td><strong>Total interviews</strong></td>
+                <td>{{ interviews|length }}</td>
+            </tr>
+            <tr>
+                <td><strong>Interviews with exceptions</strong></td>
+                <td>{{ num_exceptions }}</td>
+            </tr>
+        </tbody>
+    </table>
+    <p>
+        An interview is the result of one survey, taken by one agent, with one model and one scenario (if any).
+    </p>
+</div>

edsl/templates/error_reporting/report.css

@@ -1,74 +1,243 @@
+/* Base styles */
+:root {
+  --primary-color: #3f51b5;
+  --secondary-color: #5c6bc0;
+  --success-color: #4caf50;
+  --error-color: #f44336;
+  --warning-color: #ff9800;
+  --text-color: #333;
+  --light-bg: #f5f7fa;
+  --border-color: #e0e0e0;
+  --header-bg: #f9f9f9;
+  --card-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
+  --font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
+}
+
 body {
-    font-family: Arial, sans-serif;
-    line-height: 1.6;
-    background-color: #f9f9f9;
-    color: #333;
-    margin: 20px;
+  font-family: var(--font-family);
+  line-height: 1.6;
+  color: var(--text-color);
+  background-color: var(--light-bg);
+  margin: 0;
+  padding: 20px;
 }
 
-.interview {
-    font-size: 1.5em;
-    margin-bottom: 10px;
-    padding: 10px;
-    background-color: #e3f2fd;
-    border-left: 5px solid #2196f3;
+/* Container */
+.container {
+  max-width: 1200px;
+  margin: 0 auto;
 }
 
+/* Headings */
+h1, h2, h3, h4, h5, h6 {
+  color: var(--primary-color);
+  margin-top: 1em;
+  margin-bottom: 0.5em;
+}
+
+/* Question heading */
 .question {
-    font-size: 1.0em;
-    margin-bottom: 10px;
-    padding: 10px;
-    background-color: #fff9c4;
-    border-left: 5px solid #ffeb3b;
+  font-size: 18px;
+  font-weight: 600;
+  margin-bottom: 15px;
+  color: #333;
+  background-color: #fef8e2;
+  border: 1px solid #fbebbb;
+  border-radius: 4px;
+  padding: 12px;
 }
 
+/* Exception detail card */
 .exception-detail {
-    margin-bottom: 10px;
-    background-color: #ffebee;
-    border-left: 5px solid #f44336;
+  background-color: white;
+  border-radius: 8px;
+  margin-bottom: 20px;
+  box-shadow: var(--card-shadow);
+  overflow: hidden;
+  border: 1px solid var(--border-color);
 }
 
 .exception-header {
-    padding: 10px;
-    cursor: pointer;
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 15px;
+  background-color: rgba(244, 67, 54, 0.08);
+  border-bottom: 1px solid rgba(244, 67, 54, 0.2);
+  cursor: pointer;
+  transition: background-color 0.2s;
+}
+
+.exception-header:hover {
+  background-color: rgba(244, 67, 54, 0.12);
+}
+
+.exception-exception {
+  font-weight: 600;
+  color: var(--error-color);
 }
 
 .exception-content {
-    padding: 10px;
-    display: none;
+  padding: 0;
+  max-height: 0;
+  overflow: hidden;
+  transition: max-height 0.3s ease-out;
 }
 
-.exception-content.show {
-    display: block;
+.exception-content.expanded {
+  max-height: 5000px;
+  padding: 20px;
+  transition: max-height 0.5s ease-in;
 }
 
-.question-detail {
-    border: 3px solid black;
-    padding: 10px;
+/* Simple chevron indicator */
+.chevron {
+  display: inline-block;
+  width: 20px;
+  height: 20px;
+  position: relative;
+  margin-left: 8px;
 }
 
-.exception-exception {
-    font-weight: bold;
-    color: #d32f2f;
+.chevron::before {
+  content: '';
+  position: absolute;
+  width: 8px;
+  height: 8px;
+  border-style: solid;
+  border-width: 0 2px 2px 0;
+  border-color: #666;
+  transform: rotate(45deg);
+  top: 4px;
+  transition: transform 0.2s;
+}
+
+.exception-header[aria-expanded="true"] .chevron::before {
+  transform: rotate(-135deg);
+  top: 8px;
+}
+
+/* Section headers */
+.section-header {
+  border-bottom: 2px solid var(--primary-color);
+  padding-bottom: 8px;
+  margin: 24px 0 16px 0;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+
+.section-header h3 {
+  color: var(--primary-color);
+  font-weight: 500;
+  font-size: 18px;
+  margin: 0;
+}
+
+.error-header {
+  border-bottom-color: var(--error-color);
 }
 
-.exception-time,
-.exception-traceback {
-    font-style: italic;
-    color: #555;
+.error-header h3 {
+  color: var(--error-color);
 }
 
-.toggle-btn {
-    background: none;
-    border: none;
-    font-size: 1.2em;
-    cursor: pointer;
-    transition: transform 0.3s;
+/* Details tables */
+.details-table {
+  width: 100%;
+  border-collapse: collapse;
+  margin-bottom: 16px;
+  table-layout: fixed;
 }
 
-.toggle-btn.rotated {
-    transform: rotate(180deg);
+.details-table th {
+  width: 200px;
+  text-align: left;
+  padding: 12px;
+  background-color: #f9f9f9;
+  font-weight: 500;
+  border-bottom: 1px solid var(--border-color);
+  vertical-align: top;
+}
+
+.details-table td {
+  padding: 12px;
+  border-bottom: 1px solid var(--border-color);
+  word-wrap: break-word;
+  overflow-wrap: break-word;
+}
+
+.details-table tr:last-child th,
+.details-table tr:last-child td {
+  border-bottom: none;
+}
+
+.details-table tr:nth-child(even) {
+  background-color: rgba(0, 0, 0, 0.02);
+}
+
+/* Code blocks */
+pre {
+  background-color: #f8f9fa;
+  border: 1px solid var(--border-color);
+  border-radius: 4px;
+  padding: 12px;
+  overflow: auto;
+  max-height: 300px;
+  font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, monospace;
+  font-size: 13px;
+  white-space: pre-wrap;
+  margin: 0;
+  width: 100%;
+}
+
+.code-block {
+  font-family: monospace;
+  padding: 16px;
+  background-color: #f8f9fa;
+  border: 1px solid #ddd;
+  border-radius: 4px;
+  overflow-x: auto;
+  max-height: 300px;
+  margin-top: 0;
+}
+
+.traceback {
+  font-style: italic;
+  font-size: 13px;
+}
+
+/* Copy button */
+.copy-button {
+  background-color: var(--primary-color);
+  color: white;
+  border: none;
+  padding: 6px 12px;
+  border-radius: 4px;
+  cursor: pointer;
+  font-size: 14px;
+}
+
+.copy-button:hover {
+  background-color: #303f9f;
+}
+
+/* Responsive design */
+@media (max-width: 768px) {
+  .details-table {
+    display: block;
+    overflow-x: auto;
+  }
+  
+  .details-table th {
+    width: 140px;
+  }
+  
+  .exception-header {
+    padding: 12px;
+  }
+  
+  .exception-content.expanded {
+    padding: 15px;
+  }
 }