refactor: remove pasta /pages/story

- Remove pasta /pages/story obsoleta
- Consolida componentes de história em /pages/student-dashboard
- Mantém consistência na organização de arquivos
- Simplifica estrutura de diretórios

.cursorrules

@@ -124,6 +124,48 @@
       "commit_rules": {
         "pattern": "^(fix|feat|perf|docs|style|refactor|test|chore): [a-z].*$",
         "message": "Use proper commit message format with prefix"
+      },
+      "changelog_rules": {
+        "required": true,
+        "message": "Atualize o CHANGELOG.md antes de fazer commit",
+        "format": {
+          "header": [
+            "# Changelog",
+            "",
+            "Todas as mudanças notáveis neste projeto serão documentadas neste arquivo.",
+            "",
+            "O formato é baseado em [Keep a Changelog](https://keepachangelog.com/pt-BR/1.0.0/),",
+            "e este projeto adere ao [Semantic Versioning](https://semver.org/lang/pt-BR/).",
+            ""
+          ],
+          "version_pattern": "^## \\[(\\d+\\.\\d+\\.\\d+)\\] - \\d{4}-\\d{2}-\\d{2}$",
+          "version_message": "Use o formato '## [X.Y.Z] - YYYY-MM-DD' para versões"
+        },
+        "patterns": [
+          {
+            "id": "added",
+            "pattern": "### Adicionado",
+            "message": "Use '### Adicionado' para novos recursos"
+          },
+          {
+            "id": "modified",
+            "pattern": "### Modificado",
+            "message": "Use '### Modificado' para mudanças em funcionalidades existentes"
+          },
+          {
+            "id": "technical",
+            "pattern": "### Técnico",
+            "message": "Use '### Técnico' para mudanças técnicas/internas"
+          },
+          {
+            "id": "semantic_version",
+            "pattern": "^(major|minor|patch):",
+            "message": "Indique o tipo de mudança: major (quebra compatibilidade), minor (novo recurso) ou patch (correção)"
+          }
+        ],
+        "verify_files": [
+          "CHANGELOG.md"
+        ]
       }
     }
   },

CHANGELOG.md

@@ -39,6 +39,11 @@ e este projeto adere ao [Semantic Versioning](https://semver.org/lang/pt-BR/).
   - Melhor performance em navegação
 
 ### Modificado
+- Reorganização da estrutura de arquivos
+  - Remoção da pasta /pages/story
+  - Consolidação dos componentes de história em /pages/student-dashboard
+  - Melhor organização hierárquica das rotas
+
 - Otimização global de imagens
   - Conversão automática para WebP
   - Redimensionamento otimizado por contexto
@@ -78,7 +83,7 @@ e este projeto adere ao [Semantic Versioning](https://semver.org/lang/pt-BR/).
 - Melhor tratamento de estados de loading e erro
 - Implementação de componente ImageWithLoading
 - Sistema de cache de imagens
-- Otimizaç<EFBFBD><EFBFBD>o de URLs de imagem
+- Otimização de URLs de imagem
 
 - Refatoração de componentes para melhor reuso
   - Separação de lógica de carregamento de imagens

src/pages/story/StoryPageDemo.tsx

@@ -1,260 +0,0 @@
-import React from 'react';
-import { ArrowLeft, ArrowRight, Mic, Volume2, Share2 } from 'lucide-react';
-import { AudioRecorder } from '../../components/story/AudioRecorder';
-import { StoryMetrics } from '../../components/story/StoryMetrics';
-import type { StoryRecording } from '../../types/database';
-
-const demoRecording: StoryRecording = {
-  id: 'demo-recording',
-  fluency_score: 85,
-  pronunciation_score: 90,
-  accuracy_score: 88,
-  comprehension_score: 92,
-  words_per_minute: 120,
-  pause_count: 3,
-  error_count: 2,
-  self_corrections: 1,
-  strengths: [
-    'Ótima pronúncia das palavras',
-    'Boa velocidade de leitura',
-    'Excelente compreensão do texto'
-  ],
-  improvements: [
-    'Reduzir pequenas pausas entre frases',
-    'Praticar palavras mais complexas'
-  ],
-  suggestions: 'Continue praticando a leitura em voz alta regularmente',
-  created_at: new Date().toISOString(),
-  processed_at: new Date().toISOString()
-};
-
-const demoStory = {
-  id: 'demo',
-  student_id: 'demo',
-  title: 'Uma Aventura Educacional',
-  content: {
-    pages: [
-      {
-        text: 'Bem-vindo à demonstração do Histórias Mágicas! Aqui você pode ver como funciona nossa plataforma de leitura interativa...',
-        image: 'https://images.unsplash.com/photo-1472162072942-cd5147eb3902?auto=format&fit=crop&q=80&w=800&h=600',
-      },
-      {
-        text: 'Com histórias interativas e educativas, seus alunos aprenderão de forma divertida e envolvente. Cada história é uma nova aventura!',
-        image: 'https://images.unsplash.com/photo-1519681393784-d120267933ba?auto=format&fit=crop&q=80&w=800&h=600',
-      }
-    ]
-  },
-  status: 'published',
-  created_at: new Date().toISOString(),
-  updated_at: new Date().toISOString()
-};
-
-function RecordingHistoryCard({ recording }: { recording: StoryRecording }) {
-  const [isExpanded, setIsExpanded] = React.useState(false);
-
-  return (
-    <div className="bg-white rounded-lg shadow-sm border border-gray-200 p-4">
-      <div className="flex justify-between items-center">
-        <div>
-          <span className="text-sm text-gray-500">
-            {new Date(recording.created_at).toLocaleDateString()}
-          </span>
-        </div>
-        <button
-          onClick={() => setIsExpanded(!isExpanded)}
-          className="text-gray-500 hover:text-gray-700"
-        >
-          {isExpanded ? 'Menos detalhes' : 'Mais detalhes'}
-        </button>
-      </div>
-
-      {isExpanded && (
-        <div>
-          <div className="grid grid-cols-2 gap-4 mt-4 text-sm">
-            <div>
-              <span className="text-gray-500">Palavras por minuto:</span>
-              <span className="ml-2 font-medium">{recording.words_per_minute}</span>
-            </div>
-            <div>
-              <span className="text-gray-500">Pausas:</span>
-              <span className="ml-2 font-medium">{recording.pause_count}</span>
-            </div>
-            <div>
-              <span className="text-gray-500">Erros:</span>
-              <span className="ml-2 font-medium">{recording.error_count}</span>
-            </div>
-            <div>
-              <span className="text-gray-500">Autocorreções:</span>
-              <span className="ml-2 font-medium">{recording.self_corrections}</span>
-            </div>
-          </div>
-
-          <div className="mt-4 space-y-3">
-            <div>
-              <h5 className="text-sm font-medium text-green-600 mb-1">Pontos Fortes</h5>
-              <ul className="list-disc list-inside text-sm text-gray-600">
-                {recording.strengths.map((strength, i) => (
-                  <li key={i}>{strength}</li>
-                ))}
-              </ul>
-            </div>
-
-            <div>
-              <h5 className="text-sm font-medium text-orange-600 mb-1">Pontos para Melhorar</h5>
-              <ul className="list-disc list-inside text-sm text-gray-600">
-                {recording.improvements.map((improvement, i) => (
-                  <li key={i}>{improvement}</li>
-                ))}
-              </ul>
-            </div>
-
-            <div>
-              <h5 className="text-sm font-medium text-blue-600 mb-1">Sugestões</h5>
-              <p className="text-sm text-gray-600">{recording.suggestions}</p>
-            </div>
-          </div>
-        </div>
-      )}
-    </div>
-  );
-}
-
-export function StoryPageDemo(): JSX.Element {
-  const [currentPage, setCurrentPage] = React.useState(0);
-  const [isPlaying, setIsPlaying] = React.useState(false);
-  const [recordings] = React.useState([demoRecording]);
-
-  const metricsData = {
-    metrics: {
-      fluency: demoRecording.fluency_score,
-      pronunciation: demoRecording.pronunciation_score,
-      accuracy: demoRecording.accuracy_score,
-      comprehension: demoRecording.comprehension_score
-    },
-    feedback: {
-      strengths: demoRecording.strengths,
-      improvements: demoRecording.improvements,
-      suggestions: demoRecording.suggestions
-    },
-    details: {
-      wordsPerMinute: demoRecording.words_per_minute,
-      pauseCount: demoRecording.pause_count,
-      errorCount: demoRecording.error_count,
-      selfCorrections: demoRecording.self_corrections
-    }
-  };
-
-  const handleShare = () => {
-    alert('Funcionalidade de compartilhamento disponível apenas na versão completa!');
-  };
-
-  return (
-    <div className="min-h-screen bg-gradient-to-b from-purple-50 to-white py-12">
-      <div className="max-w-4xl mx-auto px-4">
-        <div className="flex justify-between items-center mb-6">
-          <button
-            onClick={() => window.history.back()}
-            className="flex items-center gap-2 text-gray-600 hover:text-gray-900"
-          >
-            <ArrowLeft className="h-5 w-5" />
-            Voltar
-          </button>
-
-          <div className="flex items-center gap-4">
-            <button
-              onClick={handleShare}
-              className="flex items-center gap-2 px-4 py-2 text-gray-600 hover:text-gray-900"
-            >
-              <Share2 className="h-5 w-5" />
-              Compartilhar
-            </button>
-            <button
-              onClick={() => setIsPlaying(!isPlaying)}
-              className="flex items-center gap-2 px-4 py-2 text-gray-600 hover:text-gray-900"
-            >
-              <Volume2 className="h-5 w-5" />
-              {isPlaying ? 'Pausar' : 'Ouvir'}
-            </button>
-          </div>
-        </div>
-
-        {/* Dashboard de métricas */}
-        {recordings.length > 0 && (
-          <StoryMetrics 
-            data={metricsData}
-            isLoading={false}
-          />
-        )}
-
-        {/* Histórico de gravações */}
-        {recordings.length > 0 && (
-          <div className="mb-6">
-            <h3 className="text-lg font-medium mb-4">Histórico de Gravações</h3>
-            <div className="space-y-4">
-              {recordings.map((recording) => (
-                <RecordingHistoryCard 
-                  key={recording.id} 
-                  recording={recording}
-                />
-              ))}
-            </div>
-          </div>
-        )}
-
-        <div className="bg-white rounded-xl shadow-sm border border-gray-200 overflow-hidden">
-          {/* Imagem da página atual */}
-          <div className="relative aspect-video">
-            <img
-              src={demoStory.content.pages[currentPage].image}
-              alt={`Página ${currentPage + 1}`}
-              className="w-full h-full object-cover"
-            />
-          </div>
-
-          <div className="p-6">
-            <h1 className="text-2xl font-bold text-gray-900 mb-4">{demoStory.title}</h1>
-            
-            {/* Texto da página atual */}
-            <p className="text-lg text-gray-700 mb-8">
-              {demoStory.content.pages[currentPage].text}
-            </p>
-
-            {/* Gravador de áudio */}
-            <AudioRecorder
-              storyId={demoStory.id}
-              studentId={demoStory.student_id}
-              onAudioUploaded={() => {
-                alert('Gravação disponível apenas na versão completa!');
-              }}
-            />
-
-            {/* Navegação entre páginas */}
-            <div className="flex justify-between items-center mt-8 pt-6 border-t border-gray-200">
-              <button
-                onClick={() => setCurrentPage(prev => Math.max(0, prev - 1))}
-                disabled={currentPage === 0}
-                className="flex items-center gap-2 px-4 py-2 text-gray-600 hover:text-gray-900 disabled:opacity-50"
-              >
-                <ArrowLeft className="h-5 w-5" />
-                Anterior
-              </button>
-
-              <span className="text-sm text-gray-500">
-                Página {currentPage + 1} de {demoStory.content.pages.length}
-              </span>
-
-              <button
-                onClick={() => setCurrentPage(prev => Math.min(demoStory.content.pages.length - 1, prev + 1))}
-                disabled={currentPage === demoStory.content.pages.length - 1}
-                className="flex items-center gap-2 px-4 py-2 text-gray-600 hover:text-gray-900 disabled:opacity-50"
-              >
-                Próxima
-                <ArrowRight className="h-5 w-5" />
-              </button>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-  );
-} 

src/routes.tsx

@@ -19,12 +19,13 @@ import { StudentDashboardLayout } from './pages/student-dashboard/StudentDashboa
 import { StudentStoriesPage } from './pages/student-dashboard/StudentStoriesPage';
 import { StudentSettingsPage } from './pages/student-dashboard/StudentSettingsPage';
 import { CreateStoryPage } from './pages/student-dashboard/CreateStoryPage';
-import { StoryPageDemo } from './pages/story/StoryPageDemo';
+import { StoryPageDemo } from './pages/demo/StoryPageDemo';
 import { StoryPage } from './pages/student-dashboard/StoryPage';
 import { ProtectedRoute } from './components/auth/ProtectedRoute';
 import { UserManagementPage } from './pages/admin/UserManagementPage';
 import { AchievementsPage } from './pages/student-dashboard/AchievementsPage';
 import { StudentClassPage } from './pages/student-dashboard/StudentClassPage';
+import { DemoPage } from './pages/demo/DemoPage';
 
 export const router = createBrowserRouter([
   {