Hugging Face's logo

Spaces:
wharton-t-ai
/
T.AI
Sleeping

App Files Community
T.AI
File size: 4,951 Bytes
c82f7c8
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
import React, { useState } from 'react';
import { useNavigate } from 'react-router-dom';
import RubricBuilder from './RubricBuilder';
import './GradingSystem.css';
import { getRubric } from './SubmissionsPage';

export function GradingSystem() {
  const [isBuilding, setIsBuilding] = useState(false);
  const [currentRubric, setCurrentRubric] = useState(null);
  const navigate = useNavigate();

  const parseRubricToString = (rubric) => {
    let rubricString = "RUBRIC:\n\n";

    rubric.questions.forEach((question, qIndex) => {
      rubricString += `QUESTION ${qIndex + 1} (${question.points} points):\n`;
      rubricString += `${question.text}\n\n`;
      rubricString += "Grading Criteria:\n";

      question.criteria.forEach((criterion, cIndex) => {
        const pointSign = criterion.points >= 0 ? '+' : '';
        rubricString += `${cIndex + 1}. [${pointSign}${criterion.points} points] ${criterion.description}\n`;
      });

      rubricString += "\n---\n\n";
      
    });
    



    getRubric(rubricString);
    return rubricString;
  };


  
  const handleRubricComplete = (rubric) => {
    const rubricString = parseRubricToString(rubric);
    console.log(rubricString); // For testing - you can see the output in console
    setCurrentRubric(rubric);
    setIsBuilding(false);
  };
  return (
    <div className="grading-system content-container">
      {!isBuilding && !currentRubric && (
        <div className="welcome-screen">
          <div className="welcome-content">
            <div className="welcome-icon">
              <i className="fas fa-clipboard-check"></i>
            </div>
            <h1>Welcome to TAI</h1>
            <p className="welcome-description">
An advanced AI-powered assessment engine that leverages cutting-edge large language models (LLMs) to decipher and evaluate handwritten tests and homework with human-like precision. Utilizing a custom-designed grading rubric and intelligent analysis, TAI ensures fair, consistent, and insightful feedback, transforming the academic evaluation process with unparalleled efficiency.             </p>
            <button 
              className="create-rubric-btn"
              onClick={() => setIsBuilding(true)}
            >
              <i className="fas fa-plus-circle"></i>
              <span>Create New Rubric</span>
            </button>
            <div className="feature-grid">
              <div className="feature-item">
                <i className="fas fa-pencil-ruler"></i>
                <h3>Custom Rubrics</h3>
                <p>Create detailed grading criteria</p>
              </div>
              <div className="feature-item">
                <i className="fas fa-bolt"></i>
                <h3>Fast Grading</h3>
                <p>Grade multiple submissions quickly</p>
              </div>
              <div className="feature-item">
                <i className="fas fa-chart-bar"></i>
                <h3>Detailed Analytics</h3>
                <p>Get comprehensive grading insights</p>
              </div>
              <div className="feature-item">
                <i className="fas fa-cloud-upload-alt"></i>
                <h3>Easy Upload</h3>
                <p>Support for PDF and images</p>
              </div>
            </div>
          </div>
        </div>
      )}

      {isBuilding && (
        <RubricBuilder
          onRubricComplete={handleRubricComplete}
          onCancel={() => setIsBuilding(false)}
        />
      )}

      {currentRubric && (
        <div className="completed-rubric-view">
          <h2>Completed Rubric</h2>
          <div className="rubric-content">
            {currentRubric.questions.map((question, index) => (
              <div key={index} className="rubric-question">
                <div className="question-header">
                  <h3>Question {index + 1}</h3>
                  <span className="points">{question.points} Points</span>
                </div>
                <p className="question-text">{question.text}</p>
                <div className="criteria-list">
                  {question.criteria.map((criterion, cIndex) => (
                    <div key={cIndex} className="criterion-item">
                      <span className={criterion.points >= 0 ? 'points-positive' : 'points-negative'}>
                        {criterion.points >= 0 ? '+' : ''}{criterion.points} pts
                      </span>
                      <span>{criterion.description}</span>
                    </div>
                  ))}
                </div>
                
              </div>
            ))}
          </div>
          <button 
            className="grade-submissions-btn"
            onClick={() => navigate('/submissions', { state: { rubric: currentRubric } })}
          >
            <i className="fas fa-upload"></i>
            Grade Submissions
          </button>
        </div>
      )}
    </div>
  );
}



export default GradingSystem;