Revert "debugging"

This reverts commit 8ee24fd762.
This commit is contained in:
Harivansh Rathi 2024-12-04 23:00:33 -05:00
parent 8ee24fd762
commit 4670866249
8 changed files with 35 additions and 78 deletions

View file

@ -1,19 +0,0 @@
import { FC } from 'react';
import { Box, Typography } from '@mui/material';
import type { CharacterAnalysis as CharacterAnalysisType } from '../types/character-analysis';
interface Props {
analysis: CharacterAnalysisType;
}
const CharacterAnalysis: FC<Props> = ({ analysis }) => {
return (
<Box>
<Typography variant="h5">{analysis.name}</Typography>
<Typography>{analysis.description}</Typography>
{/* Add more UI elements as needed */}
</Box>
);
};
export default CharacterAnalysis;

View file

@ -1,4 +1,4 @@
import { useState } from 'react'; import React, { useState } from 'react';
import { Box, Typography, Paper, Grid, Tooltip, Card, CardContent, Chip, Dialog, DialogTitle, DialogContent, Divider } from '@mui/material'; import { Box, Typography, Paper, Grid, Tooltip, Card, CardContent, Chip, Dialog, DialogTitle, DialogContent, Divider } from '@mui/material';
import { SocialClass, Character } from '../types/timeline'; import { SocialClass, Character } from '../types/timeline';

View file

@ -407,16 +407,3 @@ export const VENDOR_LISTINGS: VendorListing[] = [
] ]
} }
]; ];
export type VendorCategory =
| 'food'
| 'clothing'
| 'transport'
| 'stationery'
| 'other'
| 'venue'
| 'catering'
| 'flowers'
| 'matchmaking'
| 'modiste'
| 'music';

View file

@ -62,7 +62,7 @@ interface LiteraryDevice {
effect: string; effect: string;
} }
export interface NovelAnalysis { interface NovelAnalysis {
title: string; title: string;
publicationYear: number; publicationYear: number;
mainThemes: ThematicElement[]; mainThemes: ThematicElement[];

View file

@ -1,8 +1,8 @@
import { useRef, useEffect, useState, useCallback } from 'react'; import React, { useState, useCallback, useRef, useEffect } from 'react';
import { characterNetwork } from '../data/character-network'; import { characterNetwork } from '../data/character-network';
import { CharacterNode, Relationship, BookNode } from '../types/character-network'; import { CharacterNode, Relationship, BookNode } from '../types/character-network';
import { Box, Typography, Paper, Grid, IconButton, Tooltip, Chip, Divider, Container, CircularProgress, Fade } from '@mui/material'; import { Box, Typography, Paper, Grid, IconButton, Tooltip, Chip, Divider, Container, CircularProgress, Fade } from '@mui/material';
import { ForceGraph2D, ForceGraphMethods } from 'react-force-graph'; import { ForceGraph2D } from 'react-force-graph';
import { ArrowBack, Help, ZoomIn, ZoomOut, CenterFocusStrong } from '@mui/icons-material'; import { ArrowBack, Help, ZoomIn, ZoomOut, CenterFocusStrong } from '@mui/icons-material';
import * as d3 from 'd3'; import * as d3 from 'd3';
@ -79,7 +79,7 @@ export default function NetworkVisualization() {
const [selectedRelationships, setSelectedRelationships] = useState<Relationship[]>([]); const [selectedRelationships, setSelectedRelationships] = useState<Relationship[]>([]);
const [selectedBook, setSelectedBook] = useState<string | null>(null); const [selectedBook, setSelectedBook] = useState<string | null>(null);
const containerRef = useRef<HTMLDivElement>(null); const containerRef = useRef<HTMLDivElement>(null);
const fgRef = useRef<ForceGraphMethods>(null); const graphRef = useRef<ForceGraphInstance>(null);
const [isLoading, setIsLoading] = useState(true); const [isLoading, setIsLoading] = useState(true);
const [isGraphReady, setIsGraphReady] = useState(false); const [isGraphReady, setIsGraphReady] = useState(false);
const [dimensions, setDimensions] = useState({ width: 800, height: 700 }); const [dimensions, setDimensions] = useState({ width: 800, height: 700 });
@ -95,10 +95,10 @@ export default function NetworkVisualization() {
// Track when graph is ready // Track when graph is ready
useEffect(() => { useEffect(() => {
if (fgRef.current) { if (graphRef.current) {
setIsGraphReady(true); setIsGraphReady(true);
} }
}, [fgRef.current]); }, [graphRef.current]);
// Add a useEffect to handle container resizing // Add a useEffect to handle container resizing
useEffect(() => { useEffect(() => {
@ -118,7 +118,7 @@ export default function NetworkVisualization() {
}, []); }, []);
// Update the node interaction handlers // Update the node interaction handlers
const handleNodeClick = (node: NetworkNode) => { const handleNodeClick = useCallback((node: NetworkNode) => {
// Book node click // Book node click
if (node.type === 'book') { if (node.type === 'book') {
const bookNode = characterNetwork.books.find(b => b.id === node.id); const bookNode = characterNetwork.books.find(b => b.id === node.id);
@ -130,8 +130,8 @@ export default function NetworkVisualization() {
// Trigger force simulation update after state changes // Trigger force simulation update after state changes
requestAnimationFrame(() => { requestAnimationFrame(() => {
if (fgRef.current) { if (graphRef.current) {
fgRef.current.d3ReheatSimulation(); graphRef.current.d3ReheatSimulation();
} }
}); });
} }
@ -152,7 +152,7 @@ export default function NetworkVisualization() {
setSelectedRelationships(relations); setSelectedRelationships(relations);
} }
} }
}; }, [selectedBook]);
const handleBackClick = () => { const handleBackClick = () => {
setSelectedBook(null); setSelectedBook(null);
@ -377,49 +377,49 @@ export default function NetworkVisualization() {
); );
const handleZoomIn = () => { const handleZoomIn = () => {
if (fgRef.current) { if (graphRef.current) {
const currentZoom = fgRef.current.zoom(); const currentZoom = graphRef.current.zoom();
fgRef.current.zoom(currentZoom * 1.2); graphRef.current.zoom(currentZoom * 1.2);
} }
}; };
const handleZoomOut = () => { const handleZoomOut = () => {
if (fgRef.current) { if (graphRef.current) {
const currentZoom = fgRef.current.zoom(); const currentZoom = graphRef.current.zoom();
fgRef.current.zoom(currentZoom / 1.2); graphRef.current.zoom(currentZoom / 1.2);
} }
}; };
const handleCenterGraph = () => { const handleCenterGraph = () => {
if (fgRef.current) { if (graphRef.current) {
fgRef.current.zoomToFit(400); graphRef.current.zoomToFit(400);
} }
}; };
useEffect(() => { useEffect(() => {
if (fgRef.current) { if (graphRef.current) {
// Clear existing forces // Clear existing forces
fgRef.current.d3Force('charge', undefined); graphRef.current.d3Force('charge', undefined);
fgRef.current.d3Force('center', undefined); graphRef.current.d3Force('center', undefined);
fgRef.current.d3Force('link', undefined); graphRef.current.d3Force('link', undefined);
// Add stable forces with minimal movement // Add stable forces with minimal movement
fgRef.current.d3Force('charge', d3.forceManyBody().strength(-100)); graphRef.current.d3Force('charge', d3.forceManyBody().strength(-100));
fgRef.current.d3Force('center', d3.forceCenter(dimensions.width / 2, dimensions.height / 2).strength(0.05)); graphRef.current.d3Force('center', d3.forceCenter(dimensions.width / 2, dimensions.height / 2).strength(0.05));
fgRef.current.d3Force('link', d3.forceLink().distance(80).strength(0.2)); graphRef.current.d3Force('link', d3.forceLink().distance(80).strength(0.2));
// Reduce simulation intensity // Reduce simulation intensity
fgRef.current.d3Force('x', d3.forceX(dimensions.width / 2).strength(0.05)); graphRef.current.d3Force('x', d3.forceX(dimensions.width / 2).strength(0.05));
fgRef.current.d3Force('y', d3.forceY(dimensions.height / 2).strength(0.05)); graphRef.current.d3Force('y', d3.forceY(dimensions.height / 2).strength(0.05));
} }
}, [dimensions, selectedBook]); }, [dimensions, selectedBook]);
// Add useEffect to center the graph on mount and dimension changes // Add useEffect to center the graph on mount and dimension changes
useEffect(() => { useEffect(() => {
if (fgRef.current) { if (graphRef.current) {
// Center the graph with animation // Center the graph with animation
requestAnimationFrame(() => { requestAnimationFrame(() => {
fgRef.current?.zoomToFit(400, 100); // Increased padding for better centering graphRef.current?.zoomToFit(400, 100); // Increased padding for better centering
}); });
} }
}, [dimensions, selectedBook]); }, [dimensions, selectedBook]);
@ -534,7 +534,7 @@ export default function NetworkVisualization() {
<Fade in={!isLoading && isGraphReady} timeout={500}> <Fade in={!isLoading && isGraphReady} timeout={500}>
<Box sx={{ width: '100%', height: '100%' }}> <Box sx={{ width: '100%', height: '100%' }}>
<ForceGraph2D <ForceGraph2D
ref={fgRef} ref={graphRef}
graphData={getGraphData()} graphData={getGraphData()}
onNodeClick={handleNodeClick} onNodeClick={handleNodeClick}
nodeCanvasObject={renderNodeCanvas} nodeCanvasObject={renderNodeCanvas}
@ -557,12 +557,12 @@ export default function NetworkVisualization() {
} }
}} }}
warmupTicks={0} warmupTicks={0}
nodeLabel={() => ''} nodeLabel={(node: NetworkNode) => ''}
linkCurvature={0.3} linkCurvature={0.3}
linkDirectionalParticles={0} linkDirectionalParticles={0}
onEngineStop={() => { onEngineStop={() => {
// Ensure graph is centered after layout stabilizes // Ensure graph is centered after layout stabilizes
fgRef.current?.zoomToFit(400, 100); graphRef.current?.zoomToFit(400, 100);
}} }}
/> />
</Box> </Box>

View file

@ -1,3 +1,4 @@
import React from 'react';
import { Typography, Paper, Grid, Chip, Accordion, AccordionSummary, AccordionDetails } from '@mui/material'; import { Typography, Paper, Grid, Chip, Accordion, AccordionSummary, AccordionDetails } from '@mui/material';
import ExpandMoreIcon from '@mui/icons-material/ExpandMore'; import ExpandMoreIcon from '@mui/icons-material/ExpandMore';
import SocialClassView from '../components/SocialClassView'; import SocialClassView from '../components/SocialClassView';

View file

@ -1,4 +1,4 @@
import { useState } from 'react'; import React, { useState } from 'react';
import { Box, Typography, Paper, Grid, Chip } from '@mui/material'; import { Box, Typography, Paper, Grid, Chip } from '@mui/material';
import { TimelineEvent } from '../types/timeline'; import { TimelineEvent } from '../types/timeline';
import InteractiveTimeline from '../components/timeline/InteractiveTimeline'; import InteractiveTimeline from '../components/timeline/InteractiveTimeline';

View file

@ -1,12 +0,0 @@
export interface CharacterAnalysis {
id: string;
name: string;
description: string;
traits: string[];
relationships: {
character: string;
relationship: string;
}[];
development: string;
significance: string;
}