Update to react 19 #272
Merged
Update to react 19 #272
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Codecov Report✅ All modified and coverable lines are covered by tests. Additional details and impacted files@@ Coverage Diff @@
## main #272 +/- ##
==========================================
+ Coverage 50.48% 50.56% +0.07%
==========================================
Files 111 111
Lines 9507 9507
==========================================
+ Hits 4800 4807 +7
+ Misses 4707 4700 -7 ☔ View full report in Codecov by Sentry. 🚀 New features to boost your workflow:
|
Replace Material-UI v4 'default' color with MUI v5 compatible values. In MUI v5, 'default' is not a valid color prop and causes runtime errors when components try to access theme.palette.default.main. Changes: - EfficiencyTable: Changed Button color 'default' → 'inherit' - MyAppBar: Removed color prop from Switch (uses default styling) - CustomLaserCreator: Removed color prop from Checkbox - WelcomeModal: Changed Button color 'default' → 'inherit' Fixes console error: "TypeError: undefined is not an object (evaluating '(theme.vars || theme).palette[ownerState.color].main')" 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <[email protected]>
The OverlapToggle buttons were stuck "on" after first click because the
handleClick function was reading elem.checked from the DOM, but MUI Button
components don't have a .checked DOM property. The checked={active} prop
is just a React prop, not a DOM attribute.
This meant elem.checked was always undefined, so !elem.checked was always
true, causing the button to always try to "add" the overlap and never
"remove" it.
Fix: Use the active state directly instead of reading from DOM element.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <[email protected]>
The TextField component in the BLAST InputForm was missing the id="queryInput" attribute that the end-to-end test expects. This caused the test to fail when trying to locate the input element. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <[email protected]>
tlambert03
added a commit
that referenced
this pull request
Oct 22, 2025
* Refactor code structure for improved readability and maintainability * fix spectra * Refactor code structure for improved readability and maintainability * fix more tests * Fix invalid MUI v5 color props Replace Material-UI v4 'default' color with MUI v5 compatible values. In MUI v5, 'default' is not a valid color prop and causes runtime errors when components try to access theme.palette.default.main. Changes: - EfficiencyTable: Changed Button color 'default' → 'inherit' - MyAppBar: Removed color prop from Switch (uses default styling) - CustomLaserCreator: Removed color prop from Checkbox - WelcomeModal: Changed Button color 'default' → 'inherit' Fixes console error: "TypeError: undefined is not an object (evaluating '(theme.vars || theme).palette[ownerState.color].main')" 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <[email protected]> * Fix toggle functionality in EfficiencyTable overlap buttons The OverlapToggle buttons were stuck "on" after first click because the handleClick function was reading elem.checked from the DOM, but MUI Button components don't have a .checked DOM property. The checked={active} prop is just a React prop, not a DOM attribute. This meant elem.checked was always undefined, so !elem.checked was always true, causing the button to always try to "add" the overlap and never "remove" it. Fix: Use the active state directly instead of reading from DOM element. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <[email protected]> * fix defaultProps * add playwright tests * Fix test_blast by adding id to query input field The TextField component in the BLAST InputForm was missing the id="queryInput" attribute that the end-to-end test expects. This caused the test to fail when trying to locate the input element. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <[email protected]> * fix styles * bump pnpm --------- Co-authored-by: Claude <[email protected]>
tlambert03
added a commit
that referenced
this pull request
Oct 22, 2025
* Add Scout APM monitoring integration - Install scout-apm package with dependencies (psutil, wrapt) - Add scout_apm.django to INSTALLED_APPS for performance monitoring - Configure SCOUT_NAME in production settings - SCOUT_KEY and SCOUT_MONITOR automatically set by Heroku addon This enables application performance monitoring including: - N+1 query detection - Database query analysis - Memory leak detection - Background job (Celery) monitoring - Request/response timing 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <[email protected]> * remove parasail, use biopython (#266) * remove parasail * remove extra test * final touches * unvendor old gdo code (#278) * remove dep * remove vendored code * Update whitenoise to v6.11.0 (#279) * Update whitenoise to v6.11.0 Upgrades whitenoise[brotli] from 6.6.0 to 6.11.0. Key improvements in this version: - Support for Django 5.2 and 6.0 - Support for Python 3.13 and 3.14 - Improved compression performance via thread pool - Bug fixes for range requests and FORCE_SCRIPT_NAME handling No code changes required - all existing configuration remains compatible. Tests: 137 tests pass (2 pre-existing flaky end-to-end tests excluded) 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <[email protected]> * min pin --------- Co-authored-by: Claude <[email protected]> * Update to react 19 (#272) * Refactor code structure for improved readability and maintainability * fix spectra * Refactor code structure for improved readability and maintainability * fix more tests * Fix invalid MUI v5 color props Replace Material-UI v4 'default' color with MUI v5 compatible values. In MUI v5, 'default' is not a valid color prop and causes runtime errors when components try to access theme.palette.default.main. Changes: - EfficiencyTable: Changed Button color 'default' → 'inherit' - MyAppBar: Removed color prop from Switch (uses default styling) - CustomLaserCreator: Removed color prop from Checkbox - WelcomeModal: Changed Button color 'default' → 'inherit' Fixes console error: "TypeError: undefined is not an object (evaluating '(theme.vars || theme).palette[ownerState.color].main')" 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <[email protected]> * Fix toggle functionality in EfficiencyTable overlap buttons The OverlapToggle buttons were stuck "on" after first click because the handleClick function was reading elem.checked from the DOM, but MUI Button components don't have a .checked DOM property. The checked={active} prop is just a React prop, not a DOM attribute. This meant elem.checked was always undefined, so !elem.checked was always true, causing the button to always try to "add" the overlap and never "remove" it. Fix: Use the active state directly instead of reading from DOM element. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <[email protected]> * fix defaultProps * add playwright tests * Fix test_blast by adding id to query input field The TextField component in the BLAST InputForm was missing the id="queryInput" attribute that the end-to-end test expects. This caused the test to fail when trying to locate the input element. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <[email protected]> * fix styles * bump pnpm --------- Co-authored-by: Claude <[email protected]> * update allauth (#280) * Update font awesome (#281) * update allauth * update fontawesome to CDN usage * better spectra styles * Refactor external API calls into centralized wrapper modules (#284) * remove dead code * wip * more removal * fix mocks * Improve some queries (#282) * fix n+1 proteins api * improve collection query * improve spectra_csv queries * Enhance protein search performance by optimizing queryset with prefetch_related for states and transitions * add celery app * fix mocks * Add database indexes for spectrum model to optimize queries by state and status (#285) * Improve Heroku logging: switch to Better Stack, add JSON logging, reduce verbosity - Add python-json-logger for structured logging - Implement JSON formatter with context fields for AI-agent compatibility - Add filter to skip static/media file logs in Django application logs - Reduce proteins.views.spectra verbosity (INFO -> DEBUG for routine operations) - Replace print statement with logger in production.py - Update log levels for better signal-to-noise ratio (proteins/fpbase apps: WARNING level) - Set root logger to INFO for better coverage - Change disable_existing_loggers to False to preserve app loggers Addresses Error L10 (log overflow) by: 1. Installing Better Stack (Logtail) addon for 300x capacity increase (3 GB/day vs 10 MB/day) 2. Reducing log volume through verbosity adjustments and static file filtering 3. Preparing structured logs for better AI agent debugging Better Stack provides: - 3 GB/day capacity (vs Papertrail's 10 MB/day) - 3-day retention - SQL-compatible query interface - JSON-structured logs See HEROKU_LOGGING_IMPROVEMENTS.md for full analysis and implementation details. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <[email protected]> * add claude note * Fix logging filter to handle non-string log arguments The skip_static_requests filter was failing when log record args contained non-string values (e.g., Algolia's logger.info('REGISTER %s', model)). Added isinstance(record.args[0], str) check before calling startswith() to prevent AttributeError during collectstatic. Fixes build failure: AttributeError: type object 'Protein' has no attribute 'startswith' * move to structlog * Enhance logging configuration: switch to structured logging with JSON format and add context processing * revert changes * Remove python-json-logger dependency from pyproject.toml and uv.lock * Remove opbeat integration and related comments from production settings * Integrate structlog for enhanced logging: add structlog configuration in base, local, and production settings; update dependencies in pyproject.toml and uv.lock. * Enhance logging configuration: add Sentry context for error correlation and update foreign_pre_chain processors in local and production settings * updates from review * Refactor logging statements for consistency: use % formatting and improve error handling across multiple files --------- Co-authored-by: Claude <[email protected]>
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
This pull request makes significant upgrades to the frontend and shared packages, focusing on modernizing the React stack, updating Material UI dependencies, and improving compatibility and developer experience. The most impactful changes include upgrading React and related libraries to the latest versions, migrating from Material-UI v4 to MUI v5, refactoring code to use new React and MUI APIs, and updating the Apollo client and related packages.
Frontend Modernization and Dependency Upgrades:
reactandreact-domdependencies from v16 to v19 across the main frontend and all packages, and updated related type packages infrontend/package.json,packages/blast/package.json, andpackages/spectra/package.json. [1] [2] [3] [4] [5]@fpbase/blastand@fpbase/spectrapackages, updating all relevant imports and dependencies to the new@mui/*packages. [1] [2] [3] [4] [5] [6] [7] [8] [9] [10]createRootAPI fromreact-dom/client, replacing deprecatedrendercalls in entry points for React 18+ compatibility. [1] [2] [3]Apollo Client and Table Library Updates:
@apollo/react-hooksand legacy Apollo packages to@apollo/clientv3, and updated GraphQL and related dependencies in@fpbase/spectra. Refactored code to use the new Apollo API. [1] [2] [3] [4] [5] [6]material-tablewithmaterial-react-tablein the EfficiencyTable component, updating icons and table configuration accordingly. [1] [2] [3]Developer Experience and Documentation:
.claude/CLAUDE.mdproject overview, including tech stack, common commands, project structure, testing notes, and development gotchas.runtime: "automatic") for React 17+ infrontend/webpack.config.js.justfilewith new frontend and backend start commands.Testing and Minor Fixes:
These changes collectively modernize the codebase, improve maintainability, and prepare the project for future enhancements and compatibility with the latest ecosystem tools.